/* This is the Global CSS for all projects, In it we have the classes and stylling ffrom header, body and footer */

 /* This controls the global fonts */
 /*
0. -  Body Styling
1. -  Fonts Styling
2. -  Button Styling
3. -  Image Sizing Styling 
4. -  Bullet Styling
5. - 
6. -  Background colors
*/



 /* Start Body Styling */

 body {
   overflow-x: hidden;
   /* font-family: 'Lato'; */
   font-family: "Open Sans", Helvetica, Arial, Verdana, sans-serif;
   color: #000 !important;
   /* background-color:#000; */
   font-size: 16px;

 }

 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
   /* font-family: 'Lato'; */
   font-family: "Open Sans", Helvetica, Arial, Verdana, sans-serif;
 }

 p,
 span,
 li {
   /* font-family: 'Lato'; */
   font-family: "Open Sans", Helvetica, Arial, Verdana, sans-serif;
 }

 a:link {
   color: #000;
   text-decoration: none;
 }

 a:visited {
   color: #000;
   text-decoration: none;
 }

 /* End Body Styling */






 /* Start Fonts Styling */


 /* End Fonts Styling */





 /* Start Button Styling */

 .button {
   width: 150px;
   padding-top: 10px;
   padding-bottom: 10px;
   border-radius: 30px;
   text-align: center;
   color: #fff;
   /* text-transform: uppercase; */
   font-weight: 600;
   font-size: 13px;
   cursor: pointer;
   display: inline-block;
 }

 .button-one {
   color: #fff;
   border: 2px solid #3a75a7;
   background-image: -webkit-linear-gradient(30deg, #15569f 50%, transparent 50%);
   background-image: linear-gradient(30deg, #15569f 50%, transparent 50%);
   background-size: 500px;
   background-repeat: no-repeat;
   background-position: 0%;
   -webkit-transition: background 300ms ease-in-out;
   transition: background 300ms ease-in-out;
 }

 .button-one:hover {
   background-position: 100%;
   color: #fff;
   background-color: #15569f;
 }



 .button-two {
   color: #fff;
   border: 2px solid #3a75a7;
   background-image: -webkit-linear-gradient(30deg, #15569f 50%, transparent 50%);
   background-image: linear-gradient(30deg, #15569f 50%, transparent 50%);
   background-size: 500px;
   background-repeat: no-repeat;
   background-position: 0%;
   -webkit-transition: background 300ms ease-in-out;
   transition: background 300ms ease-in-out;
 }

 .button-two:hover {
   background-position: 100%;
   color: #fff;
   background-color: #15569f;
 }

 /* End Button Styling */






 /* Start Image Sizing Styling  */


 .la_2col_aspect_img {
   background-size: cover;
   width: 100%;
   /*height: 200px; */
   aspect-ratio: 4 / 3;
   /*----- three column --- */
   display: flex;
   align-items: center;
   justify-content: center;
   object-fit: auto;
   overflow: hidden;
   /* background: #f00; */

 }

 .la_2col_aspect_img img {
   object-fit: contain;
   width: 740px;
   /* height: 270px; */
   max-height: 265px;
 }

 .lapopo_img_background {
   /* background-image:
      linear-gradient(to bottom, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05)),
      url('img/about-us_back.jpg') repeat; */
   /* background-image: url("img/wu_bg.jpg"); */
   background-size: cover;
   object-fit: contain;
   background-color: #ffffff;
   width: 100%;
   height: 320px;
   text-align: right !important;
   color: black;
 }

 .lapopo_img_background img {
   /* width: 100%; */
   height: 320px;
 }
 
 
  .coco_mtn_img_background {
   /* background-image:
      linear-gradient(to bottom, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05)),
      url('img/about-us_back.jpg') repeat; */
   /* background-image: url("img/short-code.jpg"); */
   background-size: cover;
   object-fit: contain;
   background-color: #1ba0cc;
   width: 100%;
   /*height: 330px;*/
   color: black;
   padding: 10px 0px;
   color: #fff;
 }

 .lanu_mtn_img_background {
   /* background-image:
      linear-gradient(to bottom, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05)),
      url('img/about-us_back.jpg') repeat; */
   /* background-image: url("img/short-code.jpg"); */
   background-size: cover;
   object-fit: contain;
   background-color: #1ba0cc;
   width: 100%;
   height: 330px;
   color: black;
   padding: 10px 0px;
   color: #fff;
 }


 .mtn_img_aspect {
   /* background-image:
      linear-gradient(to bottom, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05)),
      url('img/about-us_back.jpg') repeat; */
   /* background-image: url("img/wu_bg.jpg"); */
   background-size: cover;
   object-fit: contain;
   /* background-color:#ffffff; */
   width: 100%;
   height: 320px;
   text-align: right !important;
   color: black;
 }

 .mtn_img_aspect img {
   /* width: 100%; */
   height: 320px;
 }


 .la_3col_aspect_img {
   background-image: url("../../site/img/profile-back.jpg");
   background-size: cover;
   width: 100%;
   /*height: 200px; */
   aspect-ratio: 4 / 3;
   /*----- three column --- */
   display: flex;
   align-items: center;
   justify-content: center;
   object-fit: auto;
   overflow: hidden;
   /* background: #f00; */
 }

 .la_3col_aspect_img img {
   object-fit: contain;
   width: 720px;
   /* height: 270px; */
   max-height: 525px;
 }

 .space-top {
   padding-top: 10px;
   position: relative;
 }

 .la_2col_card:hover .box {
   background-color: #eaeef1;
   color: #000;
   height: 120px;
   padding: 10px;
 }

 /*for download element*/
 .la_pdf_aspect_img {
   width: 100%;
   /* height: 300px; */
   /*-aspect-ratio: 4 / 3; ---- three column --- */
   align-items: left;
   justify-content: left;
   object-fit: contain;
   overflow: hidden;
   /* background: #f00; */
 }

 .la_pdf_aspect_img img {
   object-fit: contain;
   width: 120px;
   /* height: 270px; */
   /* max-height: 225px; */
   display: flex;
   justify-content: center;
   align-items: center;
 }

 .la_download_box {
   height: 300px;
   padding: 0px 30px;

 }

 .download_it a {
   display: block;
   font-size: 16px;
   font-weight: bold;
   color: #086397;
 }

 .la_download_box:hover .download_it a {
   display: block;
   font-size: 16px;
   transition-duration: 0.2s;
   font-weight: bold;
   color: #086397;
   padding-top: 20px;
   transition-duration: 0.2s;
 }

 .file_name {
   height: 70px;
 }

 /* End Image Sizing Styling  */







 /* This controls the global Bullets */


 .break-bgcolor {
   background-color: #fff;
   color: #000;
 }


 .break-icon_back {
   background-color: #06a3da;
   padding: 2px;
   display: block;
   padding: 5px 8px;
   color: #fff;
   /* border-radius: 50%; */
   width: 50px;
   height: 50px;
   display: flex;
   align-items: center;
   justify-content: center;
   object-fit: contain;
   margin-bottom: 10px;
 }


 .break-icon_back .break-ficon {
   font-size: 20px;
 }



 .break-title-container {
   height: 35px;
   font-size: 21px !important;
   font-weight: 600;
   line-height: 25px;
   /* border-bottom:solid 3px #187a0e; */
 }

 .break-content-container {
   color: #000;
   height: 70px;
 }

 .three-col-clean-container a:hover {
   color: #18af0d;
 }

 .lanu_img_background {
   /* background-image:
      linear-gradient(to bottom, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05)),
      url('img/about-us_back.jpg') repeat; */
   background-image: url("../../site/img/short-code.jpg");
   background-size: cover;
   object-fit: contain;
   background-color: #1ba0cc;
   width: 100%;
   height: 320px;
   color: black;
   padding: 60px 0px;
   color: #fff;
 }


 .break-bgcolor {
   background-color: #fff;
   color: #fff;
 }


 .break-icon_back {
   background-color: #06a3da;
   padding: 2px;
   display: block;
   padding: 5px 8px;
   color: #fff;
   /* border-radius: 50%; */
   width: 50px;
   height: 50px;
   display: flex;
   align-items: center;
   justify-content: center;
   object-fit: contain;
   margin-bottom: 10px;
 }


 .break-icon_back .break-ficon {
   font-size: 20px;
 }



 .break-title-container {
   height: 35px;
   font-size: 21px !important;
   font-weight: 600;
   line-height: 25px;
   /* border-bottom:solid 3px #187a0e; */
 }

 .break-content-container {
   color: #000;
   height: 70px;
 }

 /*set the background colors for element*/

 .bg-sky-blue {
   background-color: #e2eefd;
 }

 .bg-color-1 {
   background-color: #12679d;
 }

 .bg-color-2 {
   background-color: #0887b2;
 }

 .bg-color-3 {
   background-color: #18afce;
 }

 .bg-pale-blue {
   background-color: #e2eefd;
 }

 .bg-pale-sky-blue {
   background-color: #b5d3fa;
 }

 .bg-white {
   background-color: #fff;
 }

 .bgcolor_gray {
   background-color: #f5f6f8;
   color: #000;
   padding: 40px 0px;
 }

 bg-

 /*set the background colors for element ends here*/


 /*underline styles goes here*/
 .undeline-style1 {
   width: 120px;
   z-index: 9;
   padding: 1px 0px;
   margin-top: -5px !important;
   background-color: #fff;
 }

 .undeline-style2 {
  width: 120px; z-index:9; padding:1px 0px; margin-top:-5px!important; background-color:#146394;
}

 /*underline styles ends here*/


 /* Start Bullet Styling  */

 .now ul {
   list-style: none;
   margin-left: 0px;
   margin-right: 20px;
   line-height: 30px;
 }

 .now ul li::before {
   content: "\276F";
   position: absolute;
   line-height: 30px;
   color: #fff;
   font-weight: bold;
   font-size: 20px;
   display: inline-block;
   width: 15px;
   margin-left: -30px;
   display: block;
 }

 /* End Bullet Styling  */







 /*icons styles*/
 .icon-sky-blue {
   font-size: 20px;
   color: #0e74c0;
 }

 .icon-sky-blue-1 {
   font-size: 20px;
   font-weight: bold;
   color: #0e74c0;
 }

 /*icons styles ends here*/

 /*card styling*/
 .la_2col_card .black_box {
   margin: 0px auto;
   background-color: #fff;
   color: #000;
   align-items: left;
   justify-content: left;
   text-align: left;
   height: 220px;
 }

 .la_2col_card:hover .black_box {
   /* background-color:#eaeef1; */
   background-color: #fff;
   color: #000;
   height: 220px;
 }

 .name {
   font-size: 23px;
   height: 100px;
 }

 .position {
   font-size: 16px;
   height: 50px;
 }


 .view_profile a {
   display: block;
   font-size: 19px;
   font-weight: bold;
   color: #086397;
 }

 .la_2col_card:hover .view_profile a {
   display: block;
   font-size: 19px;
   transition-duration: 0.2s;
   font-weight: bold;
   color: #086397;
   padding-left: 20px;
   transition-duration: 0.2s;
 }

 /*gallery*/
 /** Style 2 **/
 /* Team */

 .team-member {
   background: #fff;
   text-align: center;
   transition: all 0.3s ease-in-out;
   -moz-transition: all 0.3s ease-in-out;
   -webkit-transition: all 0.3s ease-in-out;
   -o-transition: all 0.3s ease-in-out;
   -ms-transition: all 0.3s ease-in-out;
 }

 .team-member .team-photo {
   background: #fff;
   /* min-height: 200px; */
   margin: 0 auto;
   padding: 24px 0px 0px 0px;
 }

 .team-member .team-attrs {
   /* padding: 2px 16px 16px 16px; */
   color: #303030;
 }

 .team-member .team-attrs .team-name {
   font-size: 21px;
 }

 .team-member .team-attrs .team-position {
   font-size: 12px;
   letter-spacing: 2px;
   color: #a7a7a7;
 }

 .team-member .team-content {
   color: #303030;
   opacity: .8;
   /* padding: 16px 24px 40px 24px; */
 }

 .team-member:hover {
   /* box-shadow: 2px 3px 9px rgba(0, 0, 0, 0.2); */
 }


 /*------------------------------------------------------------------
[10. Hover Effects]
*/

 .item-wrap {
   margin-bottom: 30px;
 }

 figure {
   position: relative;
   overflow: hidden;
   text-align: center;
 }

 figure img {
   position: relative;
   opacity: 1.0;
 }

 figure figcaption {
   padding: 1.0em;
   color: #303030;
   /* text-transform: uppercase; */
   -webkit-backface-visibility: hidden;
   backface-visibility: hidden;
 }

 figure figcaption>.fig-description a {
   z-index: 1000;
   text-indent: 200%;
   white-space: nowrap;
   font-size: 0;
 }

 figure figcaption:before,
 figure figcaption:after {
   pointer-events: none;
 }

 figure figcaption,
 figure figcaption>a {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
 }

 figure h3 {
   word-spacing: -0.15em;
   font-family: "Montserrat", sans-serif;
 }

 figure h3 span {
   font-family: "Montserrat", sans-serif;
 }

 figure h3,
 figure p {
   margin: 0;
 }

 figure p {
   letter-spacing: 1px;
   font-size: 68.5%;
 }


 /* Team Hover */

 figure.effect-zoe {
   margin: 0;
   width: 100%;
   height: auto;
   min-width: 200px;
   max-height: none;
   max-width: none;
   float: none;
 }

 figure.effect-zoe img {
   display: inline-block;
   opacity: 1;
 }

 figure.effect-zoe p.icon-links {
   margin: 0px;
 }

 figure.effect-zoe p.icon-links a {
   color: #fff;
   -webkit-transition: -webkit-transform 0.35s;
   transition: transform 0.35s;
   -webkit-transform: translate3d(0, 200%, 0);
   transform: translate3d(0, 200%, 0);
 }

 figure.effect-zoe p.icon-links a i::before {
   color: #fff;
   font-size: 24px;
   display: inline-block;
   padding: 15px 10px;
   margin-left: 0;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }

 figure.effect-zoe p.icon-links a:hover i::before {
   color: #f2f2f2;
 }

 figure.effect-zoe p.phone-number a {
   color: #fff;
   font-size: 18px;
 }

 figure.effect-zoe p.phone-number a:hover {
   color: #f2f2f2;
   text-decoration: none;
 }

 figure.effect-zoe figcaption {
   top: auto;
   bottom: 0;
   padding: 0;
   height: 5em;
   line-height: 5em;
   background: rgba(72, 199, 236, 0.85);
   /* border-top: 3px solid #fff; */
   color: #5d5d5d;
   -webkit-transition: -webkit-transform 0.5s;
   transition: transform 0.5s;
   -webkit-transform: translate3d(0, 100%, 0);
   transform: translate3d(0, 100%, 0);
 }

 figure.effect-zoe:hover figcaption,
 figure.effect-zoe:hover h2,
 figure.effect-zoe:hover p.icon-links a {
   -webkit-transform: translate3d(0, 0, 0);
   transform: translate3d(0, 0, 0);
 }

 figure.effect-zoe:hover p.icon-links a:nth-child(3) {
   -webkit-transition-delay: 0.1s;
   transition-delay: 0.1s;
 }

 figure.effect-zoe:hover p.icon-links a:nth-child(2) {
   -webkit-transition-delay: 0.15s;
   transition-delay: 0.15s;
 }

 figure.effect-zoe:hover p.icon-links a:first-child {
   -webkit-transition-delay: 0.2s;
   transition-delay: 0.2s;
 }

 .bgcolor_gray {
  background-color: #f5f6f8;
  color: #000;
  padding: 40px 0px;
}

.la_2col_gall_img{
  width: 100%;
  /* height: 300px; */
  aspect-ratio: 4 / 3;
  /*----- three column --- */
  display: flex;
  align-items: center;
  justify-content: center;
  object-fit: auto;
  overflow: hidden;
  /*background-image: url('img/awards-bg.png');*/
  /* background: #5ea0d7; */

}

.la_2col_aspect_img img {
  object-fit: contain;
  width: 360px;
  /* height: 270px; */
  max-height: 555px;
}


/*for branche element*/
.aspect-banner {
  width: 100%;
  height: 350px;
  aspect-ratio: 4 / 3;
  /*----- three column --- */
  display: flex;
  align-items: center;
  justify-content: center;
  object-fit: contain;
  overflow: hidden;
  background: #ccc;
}

.aspect-banner img {
  object-fit: contain;
  width: 760px;
  /* height: 270px; */
  max-height: 650px;
}

.aspect-banner-1 {
  /* width: 100%;
  height: 450px; */
  text-align: right;
  aspect-ratio: 4 / 3;
  /*----- three column --- */
  display: flex;
  background-size: cover;
  justify-content: right;
  object-fit: contain;
  overflow: hidden;
}

.aspect-banner-1 img {
  object-fit: contain;
  background-size: cover;
  justify-content: right;
  display: flex;
  text-align: right;
  /* width: 760px; */
  /* height: 270px; */
  max-height: 450px;
}
.text_gaps {
  padding-top: 80px;
  padding-left: 80px;
}


/*for contact us page*/
.la_two_img_background {
  /* background-image:
  linear-gradient(to bottom, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05)),
  url('img/about-us_back.jpg') repeat; */
  background-image: url("../../img/wu_bg.jpg");
  background-size: contain;
  object-fit: contain;
  background-color: #000;
  width: 100%;
  height: 630px;
  color: black;
}

.f-icon_back {
  margin-right: 20px !important;
}

.aspect-banner {
  width: 100%;
  height: 350px;
  aspect-ratio: 4 / 3;
  /*----- three column --- */
  display: flex;
  align-items: center;
  justify-content: center;
  object-fit: contain;
  overflow: hidden;
  background: #ccc;
}

.aspect-banner img {
  object-fit: contain;
  width: 760px;
  /* height: 270px; */
  max-height: 650px;
}

.aspect-banner-1 {
  width: 100%;
  height: 450px;
  text-align: right;
  aspect-ratio: 4 / 3;
  /*----- three column --- */
  display: flex;
  background-size: cover;
  justify-content: right;
  object-fit: contain;
  overflow: hidden;
}

.aspect-banner-1 img {
  object-fit: contain;
  background-size: cover;
  justify-content: right;
  display: flex;
  text-align: right;
  /* width: 760px; */
  /* height: 270px; */
  max-height: 450px;
}

.text_gaps {
  padding-top: 80px;
  padding-left: 80px;
}

.now ul {
  list-style: none;
  margin-left: 0px;
  margin-right: 20px;
  line-height: 30px;
}

.now ul li::before {
  content: "\276F";
  position: absolute;
  line-height: 30px;
  color: #0b6aa1;
  font-weight: bold;
  font-size: 20px;
  display: inline-block;
  width: 15px;
  margin-left: -30px;
  display: block;
}

.hts_bg {
  /* background: linear-gradient(266deg, #6f3d1e 39.15%, #a36848 62.81%, #6f3d1e 90.77%); */
  background: linear-gradient(266deg, #e5e5e5 39.15%, #ffffff 62.81%, #e5e5e5 90.77%);
  padding: 2.4rem;
  color: #000;
}

.hts_bg p {
  color: #000;
}

.icon {
  /*font-size: 40px;*/
  display: flex;
  align-items: center;
  justify-content: center;

}

.icon-bg {
  background-color: #b5d3fa;
  padding: 12px;
  border-radius: 50%;
  font-size: 35px;
  color: #6da9f5;
}


 /*************  Smaller Screen ***********/
 @media screen and (max-width: 640px) {}




 /*************  Very Smaller Screen ***********/
 @media screen and (max-width: 320px) {}




 /*************  Big Screen ***********/
 @media screen and (min-width: 640px) {}






 /************ Color Blue ***********/
 /* .bgcolor_org{
    background-color:#9abee1;
    color:#000;
    padding:40px 0px;
} */

 /************ Color Gray ***********/
 .bgcolor_gray {
   /* background-color: #dce1e8; */
   /* background-color: #e4e8ee; */
   /* background-color: #eeeeee; */
   background-color: #fff;
   color: #000;
   padding: 40px 0px;
 }

 /************ Color light green Blue ***********/
 /* .bgcolor_org{
    background-color:#b6d3c2;
    color:#000;
    padding:40px 0px;
} */


 .three-col-title-container {
   height: 125px;
   font-size: 26px !important;
   font-weight: 700;
   line-height: 25px;
   padding: 30px 0px 0px 0px !important;
   /* border-bottom:solid 3px #187a0e; */
 }

 .three-col-title-container a:link {
   color: #000;
 }

 .three-col-title-container a:hover {
   color: #035686;
 }

 .three-col-content-container {
   height: 90px;
 }



 .space-top {
   padding-top: 140px;
   position: relative;
 }

 .p-4 {
   padding: 0.4rem !important;
 }



 .b_card .box {
   text-align: left;
   padding: 15px;
   height: 200px;
   padding: 30px;
   display: block;
   transition-duration: 0.2s;
   z-index: 9;
   position: relative;
 }

 .b_card {
   align-items: left;
   justify-content: center;
   background-color: #f5f5f5;
   /* border-radius:20px;
    padding: 15px; */
   position: relative;
 }

 .b_card:hover {
   background-color: #f4f4f4;
   box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px;
   color: #000;
   /* border:solid 1px #188406; */
 }

 .b_card:hover img {
   background-color: #fff;
   transition: transform .7s;
   /* Animation */
   transform: scale(1.2);
   /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
 }

 .b_card .fas.fa-arrow-right {
   position: absolute;
   bottom: -100px;
   background-color: #4e9525;
   height: 50px;
   width: 50px;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 50%;
   color: gold;
   opacity: 0;
   transform: translateY(50%);
   transition: all 0.5s ease;
 }

 .zoom {
   transition: transform .7s;
   /* Animation */
 }

 .zoom:hover {
   transform: scale(1.5);
   /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
 }