.brick--type--what-we-do.bg-style-blue {
  background-color: #003478;
}

.brick--type--what-we-do h1 {
  color: white;
  font-family: "Bitter";
  font-size: var(--size-64);
  line-height: var(--size-64);
}

.brick--type--what-we-do p {
  color: white;
  margin-bottom: 0;
}

.brick--type--what-we-do .static-style {
  text-align: center;
  margin-top: var(--size-40);
  font-size: var(--size-18);
  font-weight: 500;
  line-height: var(--size-24);
  color: #f5f5f5;
  font-family: HelveticaNeue;
  letter-spacing: 0.05em;
}

/** css for our work page */
.brick--type--what-we-do .wwd-img-seperator {
  width: var(--size-112);
}
.brick--type--what-we-do .col-content-heading {
  width: 80% !important;
  margin-top: var(--size-40);
  margin-bottom: var(--size-32);
}
.brick--type--what-we-do .small-size-description,
.brick--type--what-we-do .wwd-sec-desc {
  width: 58%;
  font-size: var(--size-20);
  line-height: var(--size-32);
  font-family: HelveticaNeue;
}

.brick--type--what-we-do .wwd-sec-desc {
  padding-bottom: var(--size-16);
}
/** css for our work page */

.brick--type--what-we-do .col-content {
  width: 80% !important;
  margin: var(--size-16) auto var(--size-32) auto;
}

.brick--type--what-we-do p {
  color: white;
  margin-bottom: 0;
}

.brick--type--what-we-do .views-element-container {
  margin-bottom: var(--size-32);
  margin-top: var(--size-64);
}

.brick--type--what-we-do .page-wrapper .row {
  margin: 0;
}

.brick--type--what-we-do .image-section-style img {
  width: 100%;
}

.brick--type--what-we-do .views-col {
  position: relative;
  margin-right: 2px;
}

.brick--type--what-we-do .views-row:first-child {
  margin-bottom: 2px;
}

.brick--type--what-we-do .views-col:last-child {
  margin: 0;
}

.brick--type--what-we-do .strip-style {
  position: absolute;
  display: flex;
  height: 100%;
  top: 0;
  width: 100%;
  background: linear-gradient(to bottom, rgba(255, 0, 0, 0) 50%, black);
  padding-bottom: 6%;
}

.brick--type--what-we-do .strip-style > :first-child {
  display: flex;
  align-items: flex-end;
  width: 100%;
}

.brick--type--what-we-do .strip-style .popup-openbtn {
  cursor: pointer;
}

.brick--type--what-we-do .strip-style .popup-openbtn img {
  width: 100%;
  height: 100%;
  padding-left: 4px;
}

.brick--type--what-we-do .field-term-image-name a {
  text-decoration: none;
  color: white;
  font-weight: 700;
  font-family: "HelveticaNeue";
  font-size: var(--size-24);
  line-height: var(--size-32);
}

.brick--type--what-we-do .field-term-image-name a:hover {
  text-decoration: underline;
}

.brick--type--what-we-do .field-term-image-name {
  text-align: left;
}

/**WHAT WE DO POPUP**/

.brick--type--what-we-do #popupContainer {
  opacity: 1;
}

.brick--type--what-we-do #popupContainer {
  text-align: center;
  padding: 0 !important;
}

.brick--type--what-we-do #popupContainer:before {
  content: "";
  height: 100%;
  vertical-align: middle;
}

.brick--type--what-we-do #popupContainer .pcont-dialog {
  text-align: left;
  vertical-align: middle;
}

.brick--type--what-we-do #popupContainer .modal-dialog .pcont-content {
  border: none;
  border-radius: unset;
}

.brick--type--what-we-do #popupContainer .pcont-desc-section {
  width: 55%;
  margin-right: auto;
  font-family: "HelveticaNeue";
}

.brick--type--what-we-do #popupContainer .pcont-image-section {
  width: 45%;
}

.brick--type--what-we-do #popupContainer .pcont-desc-section .pcont-header {
  font-size: var(--size-64);
  line-height: var(--size-64);
  font-family: "Bitter";
  font-weight: 400;
  margin: 0;
}

.brick--type--what-we-do #popupContainer .pcont-body .pcont-desc-text {
  margin-top: var(--size-32);
  margin-bottom: var(--size-32);
  font-size: var(--size-20);
  line-height: var(--size-32);
}

.brick--type--what-we-do #popupContainer .pcont-body .pcont-desc-text p {
  color: black;
}

.brick--type--what-we-do #popupContainer .pcont-body {
  scrollbar-width: thin;
}

.brick--type--what-we-do #popupContainer .pcont-body::-webkit-scrollbar {
  width: 5px;
  height: 8px;
  background-color: transparent;
}

.brick--type--what-we-do #popupContainer .pcont-body::-webkit-scrollbar-thumb {
  background: #777;
}

.brick--type--what-we-do #popupContainer .pcont-desc-section .pcont-desc-btn {
  font-size: var(--size-18);
  line-height: var(--size-24);
}

.brick--type--what-we-do #popupContainer .pcont-desc-section .pcont-desc-menu {
  border-top: 2px solid lightgray;
  clear: both;
  margin-top: var(--size-64);
  padding-top: var(--size-64);
}

.brick--type--what-we-do #popupContainer .pcont-desc-section .pcont-desc-menu h5 {
  color: #767676;
  font-weight: 500;
  font-size: var(--size-18);
  line-height: var(--size-24);
}

.brick--type--what-we-do #popupContainer .pcont-desc-section .pcont-desc-menu .pcont-desc-menu-list ul li {
  border: unset;
}

.brick--type--what-we-do #popupContainer .pcont-desc-section .pcont-desc-menu .pcont-desc-menu-list ul li a {
  color: #003478;
  text-decoration: none;
}

.brick--type--what-we-do #popupContainer .pcont-desc-section .pcont-desc-menu .pcont-desc-menu-list {
  list-style-type: none;
  font-size: var(--size-16);
  line-height: var(--size-24);
}

.brick--type--what-we-do #popupContainer .pcont-desc-section .pcont-desc-menu .pcont-desc-menu-list li:before {
  content: url("../assets/images/listbullet.png");
  padding-right: 8px;
  color: gray;
  vertical-align: super;
}

.brick--type--what-we-do #popupContainer .pcont-image-section,
.brick--type--what-we-do #popupContainer .pcont-image-section .pcont-image {
  position: relative;
}

.brick--type--what-we-do #popupContainer .pcont-image-section .pcont-image {
  height: 100%;
  width: 100%;
}

.brick--type--what-we-do #popupContainer .pcont-image-section .pcont-close span {
  font-size: 48px;
}

.brick--type--what-we-do #popupContainer .pcont-image-section .pcont-close {
  right: 4%;
  top: 2%;
  height: 30px;
  width: 30px;
  opacity: 10;
}

.brick--type--what-we-do #popupContainer .pcont-desc-section .pcont-close {
  display: none;
}

.brick--type--what-we-do #popupContainer .pcont-image-section .pcont-close:hover,
.brick--type--what-we-do #popupContainer .pcont-image-section .pcont-close:focus {
  background: none;
}

.brick--type--what-we-do .btn-style {
  border: none;
  border-radius: var(--size-50);
  padding: var(--size-16) var(--size-32);
  color: black;
  font-size: var(--size-18);
  background-color: #fdc82f;
  text-decoration: none;
  margin-left: var(--size-32);
  line-height: var(--size-24);
  display: inline-block;
  font-family: "HelveticaNeue";
  border: 1px solid transparent;
}

.brick--type--what-we-do .btn-style:hover {
  background-color: #f2a517;
}

.brick--type--what-we-do .btn-style:focus,
.brick--type--what-we-do .btn-style:active {
  border: 1px solid #fde396;
  background-color: #f2a517;
}
/**WHAT WE DO POPUP ENDS**/

/*Mobile screens*/

@media (max-width: 991px) {
  .brick--type--what-we-do .wwd-img-seperator {
    width: 100px;
  }
  .brick--type--what-we-do .btn-style {
    display: block;
    margin: 10px;
    padding: 12px 20px;
    font-size: 12px;
    border-radius: 50px;
    line-height: 24px;
  }

  .brick--type--what-we-do .bottom-btn-style {
    display: inline-block;
  }

  .brick--type--what-we-do .views-element-container {
    margin-bottom: 3em;
    margin-top: 3em;
  }

  .brick--type--what-we-do .strip-style > :first-child {
    display: inline-flex;
    align-items: flex-end;
    width: 100%;
    height: 100%;
    flex-wrap: nowrap;
  }

  .brick--type--what-we-do .content-section {
    width: 75% !important; /*col-sidebar is having fixed width*/
    display: inline-flex;
  }

  .brick--type--what-we-do .strip-style .popup-openbtn img {
    height: auto;
    width: auto;
  }

  .brick--type--what-we-do .field-term-image-name a {
    font-size: 24px;
    line-height: 32px;
  }

  .brick--type--what-we-do .col-sidebar {
    width: 24% !important; /*col-sidebar is having fixed width*/
    margin: 0 !important; /*fixed margin top  is applied*/
  }

  .brick--type--what-we-do .strip-style {
    background: linear-gradient(to bottom, rgba(255, 0, 0, 0) 40%, black);
  }

  .brick--type--what-we-do .views-col {
    margin-bottom: 2px;
  }

  .brick--type--what-we-do .small-size-description,
  .brick--type--what-we-do .wwd-sec-desc {
    font-size: 16px;
    line-height: 22px;
    width: 80%;
  }

  .brick--type--what-we-do .col-content-heading {
    width: 90%;
  }

  /**WHAT WE DO POPUP**/
  .node--type-bricky-pages {
    overflow: initial !important; /*overflow hidden is getting applied from bootstrap js file - screeen is scrolling to the top*/
  }

  .brick--type--what-we-do #popupContainer .pcont-desc-section .pcont-header {
    font-size: 28px;
    width: 80%;
    line-height: 30px;
  }
  .brick--type--what-we-do #popupContainer .pcont-body .pcont-desc-text {
    font-size: 18px;
    line-height: 22px;
    margin: 14px 0;
  }

  .brick--type--what-we-do #popupContainer .pcont-desc-section .pcont-desc-btn {
    font-size: 14px;
    line-height: 24px;
    padding: 12px 30px !important;
    border-radius: 50px;
  }

  .brick--type--what-we-do #popupContainer .pcont-desc-section .pcont-desc-menu {
    margin-top: 24px;
    padding-top: 24px;
  }

  .brick--type--what-we-do #popupContainer .pcont-dialog {
    margin: auto;
  }
  .brick--type--what-we-do #popupContainer .pcont-body {
    font-size: 12px;
  }
  .brick--type--what-we-do #popupContainer .pcont-desc-section .pcont-desc-menu h5 {
    font-size: 16px;
    line-height: 24px;
  }

  .brick--type--what-we-do #popupContainer .pcont-desc-section .pcont-desc-menu .pcont-desc-menu-list {
    font-size: 14px;
    line-height: 24px;
  }

  .brick--type--what-we-do #popupContainer .pcont-image-section {
    display: none;
  }
  .brick--type--what-we-do #popupContainer .pcont-desc-section {
    width: 100%;
  }

  .brick--type--what-we-do #popupContainer .pcont-desc-section .pcont-close img {
    width: 15px;
    height: 15px;
  }
  .brick--type--what-we-do #popupContainer .pcont-desc-section .pcont-close {
    width: 20%;
    display: block;
    text-align: right;
    right: 4%;
    top: 3%;
    height: 30px;
  }
  .brick--type--what-we-do #popupContainer .pcont-desc-section .pcont-close:hover,
  .brick--type--what-we-do #popupContainer .pcont-desc-section .pcont-close:focus {
    background-color: unset;
  }
  .brick--type--what-we-do h1 {
    font-size: 24pt;
    line-height: 36px;
  }

  .brick--type--what-we-do .col-content {
    margin: 16px 20px;
  }

  .brick--type--what-we-do .static-style {
    font-size: 14px;
    margin: 10px 0 20px;
    line-height: 24px;
  }

  .modal-open {
    padding-right: 0 !important;
  }
  /**WHAT WE DO POPUP ENDS**/
}

@media only screen and (min-width: 769px) and (max-width: 1000px) {
  .brick--type--what-we-do .field-term-image-name a {
    font-size: 13px;
    line-height: 20px;
  }
  .brick--type--what-we-do .btn-style {
    display: inline-block;
  }
}

@media only screen and (min-width: 1000px) and (max-width: 1200px) {
  .brick--type--what-we-do .field-term-image-name a {
    font-size: 15px;
  }
}

/*Mobile screens Ends*/
