@import url(../../../../code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css);



/*====================================================

  * Template:   Agroly

  * Version:    1.0

  * Author:     QuickDev

  * Create :    Sept. 5th 2020

====================================================*/



/*==================================================*/

/* [Table of contents] */

/*==================================================*/





/*	

    1. COMMON

    2. HEADER. 

    3. MAIN SLIDER. 

    4. FOOTER. 

    5. PAGES HERO.

    6. COMPONENTS. 

    7. ABOUT US.

    8. SERVICES.  

    9. PRODUCTS.

    10. PRODUCTS DETAILS. 

    11. TEAM. 

    12. TESTIMONIALS. 

    13. FAQ. 

    14. 404 ERROR PAGE.

    15. BLOG GRID. 

    16. BLOG SINGLE. 

    17. CONTACT. 

    18. LATES NEWS. 

    19. GALLERY FILTER.

    20. MAGNIFIC POPUP.

    21. MASONRY GALLERY. 

    22. CAROUSEL #1.

    23. CAROUSEL #3. 

    24. CAREERS. 

    25. PRICING TABLE. 

    26. HOME PAGE ONE. 

    27. HOME PAGE TWO. 

    28. HOME PAGE THREE. 



*/



/*====================================================

    1. COMMOM. 

  ====================================================*/

.layer-title{

  margin-bottom: 2rem;

}



.ag-bg-wrapper{

  background-color: #F5F5F5;

  padding: 5rem 0rem;

}

/*====================================================

    2. HEADER. 

  ====================================================*/



  /*====================================================

    3. MAIN SLIDER. 

  ====================================================*/

  .home-slider {

    width: 100%;

    height: 690px;

    position: relative;

    z-index: 1;

  }



  .overlay {

    position: absolute;

    width: 100%;

    height: 100%;

    top: 0;

    bottom: 0;

    left: 0;

    right: 0;

    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.64)), to(rgba(128, 93, 93, 0.4)));

    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4));

  }



  .hero-slider {

    width: 100%;

    height: 900px;

    overflow: hidden;

  }



  .hero-slider .carousel-cell {

    width: 100%;

    height: 80%;

    background-repeat: no-repeat;

    background-size: cover;

    background-position: center;

  }



  .slider-caption {

    position: relative;

    top: 50%;

    -webkit-transform: translateY(-50%);

    transform: translateY(-50%);

    color: #FFF;

    text-align: left;

  }



  .slider-caption .subtitle {

    font-size: 1rem;

    line-height: 1.2em;

    font-weight: 500;

    letter-spacing: 2px;

    color: rgba(255, 255, 255, 0.7);

    margin-bottom: 5px;

    text-transform: uppercase;

  }



  .slider-caption .title {

    font-size: 2rem;

    line-height: 1.2em;

    text-transform: uppercase;

    margin-bottom: 40px;

    color: #FFF;

    letter-spacing: 3px;

  }



  .slider-caption .btn {

    border: 1px solid #fff;

    padding: 10px 25px;

    text-transform: uppercase;

    font-size: 1rem;

    letter-spacing: 3px;

    color: #fff;

    text-decoration: none;

    -webkit-transition: all .2s ease;

    transition: all .2s ease;

    border-radius: 0;

  }



  .slider-caption .btn:hover {

    background: #fff;

    color: #000;

  }



  .hero-slider .flickity-prev-next-button {

    width: 80px;

    height: 80px;

    background: transparent;

  }



  .hero-slider .flickity-prev-next-button:hover {

    background: transparent;

  }



  .hero-slider .flickity-prev-next-button .arrow {

    fill: white;

  }



  .hero-slider .flickity-page-dots {

    bottom: 287px;

  }



  .hero-slider .flickity-page-dots .dot {

    width: 30px;

    height: 4px;

    opacity: 1;

    background: rgba(255, 255, 255, 0.5);

    border: 0 solid white;

    border-radius: 0;

  }



  .hero-slider .flickity-page-dots .dot.is-selected {

    background: var(--main-yellow-color);

    border: 0 solid var(--main-yellow-color);

  }



  .dot-hide .flickity-page-dots .dot {

    display: none;

  }



  .color-text {

    color: var(--main-yellow-color);

  }

  /*====================================================

    4. FOOTER. 

  ====================================================*/

 footer {

   

   background-image: 

        linear-gradient(rgb(0, 0, 0), rgba(0, 0, 0, 0.6)), 

        url("../images/common/footer-bg.jpg");

    background-repeat: no-repeat;

    background-size: cover;        /* Make the image cover the entire footer */

    background-position: center;   /* Center the image */

    padding: 4rem 0rem;

    color: #fff;        

          /* Optional: white text for contrast */

}



  footer h4 {

    color: #FFF;

    font-weight: 700;

    margin-bottom: 5px;

  }



  footer p {

    color: #cccccc;

    font-size: 15px;

    font-weight: 400;

  }



  .top-footer h4 {

    text-transform: uppercase;

    font-weight: 900;

  }



  .footer-btns {

    text-align: right;

  }



  .footer-logo {

    width: 160px;

  }



  .footer-logo img {

    /* width: 100%; */

     width: 367px;

    margin-left: -19px;

  }





  hr.footer-divider {

    border-top: 1px solid rgba(204, 204, 204, 0.2);

    margin: 25px 0px 40px;

  }



  .footer-col p.footer-desc {

    font-size: 14px;

    margin-top: 25px;

    padding-right: 4rem;

  }



  ul.bottom-social {

    margin-top: 1.7rem;

  }



  ul.bottom-social li {

    list-style: none;

    display: inline-block;

    margin-right: 1.5rem;

  }



  ul.bottom-social li .fab {

    font-size: 20px;

  }



  ul.bottom-social li a {

    color: #FFF;

    transition: 0.4s;

  }



  ul.bottom-social li a:hover {

    color: var(--main-yellow-color);

  }



  .footer-col h5 {

    color: #FFF;

    font-size: 18px;

    font-weight: 600;

    margin: 25px 0px;

  }



  ul.footer-bulletlist li {

    color: #cccccc;

    list-style: none;

    font-size: 14px;

    font-family: 'Open Sans', sans-serif;

    line-height: 30px;

    font-weight: 400;

  }



  ul.footer-bulletlist li a {

    color: #CCCCCC;

    transition: 0.4s;

  }



  ul.footer-bulletlist li a:hover {

    color: var(--main-yellow-color);

    text-decoration: none;

  }



  .copyright strong {

    color: #FFF;

    font-weight: 600;

  }



  .bf-right li {

    text-align: right !important;

    display: inline-block;

  }



  .bf-right li a {

    font-size: 14px;

    color: #CCCCCC;

    transition: 0.4s;

    margin-right: 15px;

  }



  .bf-right li a:hover {

    color: #CCCCCC;

    transition: 0.4s;

  }



  .bottom-footer .text-align {

    text-align: right;

  }



  footer hr {

    height: 1px;

    overflow: visible;

    color: rgba(51, 51, 51, 0.6);

    position: relative;

    margin: 2em auto;

  }



  footer hr::before {

    content: '';

    background: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(currentColor), to(transparent));

    background: linear-gradient(to right, transparent, currentColor, transparent);

    height: 1px;

    width: 100%;

    position: absolute;

    left: 0;

  }



  .hr-divider {

    height: 1px;

    border-style: none;

    /* Old browsers */

    background: -moz-linear-gradient(left, transparent 0%, white 50%, transparent 100%);

    /* FF3.6-15 */

    background: -webkit-linear-gradient(left, transparent 0%, white 50%, transparent 100%);

    /* Chrome10-25,Safari5.1-6 */

    background: linear-gradient(to right, transparent 0%, white 50%, transparent 100%);

    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

  }



  /*====================================================

    5. PAGES HERO. 

  ====================================================*/

  .pages-hero {

    background-image: url("../images/common/banner.jpg");

    height: 300px;

    /* background-position: center; */

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



  .pages-hero:before {

    content: '';

    position: absolute;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    background-image: linear-gradient(to bottom right, #002642, #002642);

    opacity: 0.6;

  }



  .pages-title {

    position: absolute;

    bottom: 50px;

    color: #FFF;

  }



  .pages-title span {

    font-weight: 700;

    font-size: 2rem;

  }



  .pages-title h1 {

    color: #FFF;

    font-weight: 800;

    margin-bottom: 5px;

    font-size: 34px;

  }



  .page-nav {

    width: 100%;

    z-index: 1;

  }



  .page-nav p {

    color: #FFF;

    margin-bottom: 0px;

  }



  .pages-title a {

    color: #fff;

    text-decoration: none;

    transition: 0.3s;

  }



  .pages-title a:hover {

    color: var(--main-yellow-color);

    text-decoration: none;

  }



  /*====================================================

    6. COMPONENTS. 

  ====================================================*/

  .section-parallax {

    background-image: url("../images/common/agroly-pic-1.jpg");

    height: 600px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



  .ws-section-content {

    background-color: #fff;

    height: 600px;

    position: relative;

  }



  .ws-inner-content {

    margin: 0;

    position: absolute;

    top: 50%;

    -ms-transform: translateY(-50%);

    transform: translateY(-50%);

    padding: 0rem 5rem;

    max-width: 600px;

  }



  .ws-inner-content h2 {

    margin-bottom: 1rem;

  }



  .ws-inner-content p {

    margin-bottom: 1rem;

  }



  .careers-parallax {

    background-image: url("../images/common/agroly-pic-2.jpg");

    height: 800px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



  .cp-bg-layer {

    background-color: rgb(0, 0, 0, 0.5);

    width: 400px;

    height: 800px;

    position: relative;

  }



  .cp-content {

    position: absolute;

    bottom: 1rem;

    padding: 3rem;

  }



  .cp-content h3 {

    font-weight: 900;

    color: #FFF;

    text-transform: uppercase;

  }



  .cp-content p {

    font-weight: 600;

    color: #FFF;

    margin-top: 1rem;

  }



  .mission-parallax {

    background-image: url("../images/common/agroly-pic-3.jpg");

    height: 800px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



  .mission-overlay {

    max-width: 600px;

    margin: 0;

    position: absolute;

    bottom: 30px;

    -ms-transform: translateY(-50%);

    transform: translateY(-50%);

    background-color: rgba(62, 117, 95, 0.8);

    padding: 3rem;

  }



  .mission-overlay h2 {

    color: #FFF;

  }



  .mission-overlay p {

    color: #FFF;

  }



  .wide-carousel {

    position: relative;

  }



  .wide-carousel .owl-theme .custom-nav {

    position: absolute;

    top: 45%;

    left: 4%;

    right: 4%;

    z-index: 1;

  }



  .wide-carousel .owl-theme .custom-nav .owl-prev,

  .wide-carousel .owl-theme .custom-nav .owl-next {

    position: absolute;

    width: 40px;

    height: 40px;

    color: inherit;

    background: none;

    border: none;

    z-index: 100;

    background-color: transparent;

    border-radius: 50%;

    padding: 6px 10px;

    border: solid 1px #FFF;

    transition: 0.4s;

  }



  .wide-carousel .owl-theme .custom-nav .owl-prev:hover,

  .wide-carousel .owl-theme .custom-nav .owl-next:hover {

    position: absolute;

    background-color: #FFFF;

  }



  .wide-carousel .owl-theme .custom-nav .owl-prev:focus,

  .wide-carousel .owl-theme .custom-nav .owl-next:focus {

    border: none;

    outline: 0;

    box-shadow: none;

    border: solid 1px #FFF;

  }



  .wide-carousel .owl-theme .custom-nav .owl-prev i,

  .wide-carousel .owl-theme .custom-nav .owl-next i {

    font-size: 20px;

    color: #FFF;

    line-height: 28px;

    transition: 0.4s;

  }



  .wide-carousel .owl-theme .custom-nav .owl-prev:hover i,

  .wide-carousel .owl-theme .custom-nav .owl-next:hover i {

    color: #333;

  }



  .wide-carousel .owl-theme .custom-nav .owl-prev {

    left: 0;

  }



  .wide-carousel .owl-theme .custom-nav .owl-next {

    right: 0;

  }



  .owl-dots {

    text-align: center;

    margin-top: 25px;

  }



  .owl-dots button.owl-dot {

    width: 12px;

    height: 12px;

    border-radius: 50%;

    display: inline-block;

    background: #ccc;

    margin: 0 3px;

    }



  .owl-dots button.owl-dot.active {

    background-color: #000;

    width: 20px;

    border-radius: 25px;

  }



  .owl-dots button.owl-dot:focus {

    outline: none;

  }



  .wide-carousel .item {

    height: 600px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



  .wide-carousel .item:before {

    content: '';

    position: absolute;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    background-image: linear-gradient(to bottom right, #E000, #000);

    opacity: 0.4;

  }



  .wc-content-layer {

    max-width: 600px;

    margin: 0;

    position: absolute;

    top: 50%;

    -ms-transform: translateY(-50%);

    transform: translateY(-50%);

  }



  .wc-content-layer h2 {

    color: #FFF;

    -webkit-transition: all .2s ease;

    transition: all .2s ease;

  }



  .wc-content-layer p {

    color: #FFF;

  }



  .bg-wrapper {

    background-color: var(--section-bg-color);

    padding-top: var(--section-padding);

    padding-bottom: var(--section-padding);

  }



  .circle-box {

    text-align: center;

  }



  .circle-layer {

    width: 80px;

    height: 80px;

    border-radius: 50%;

    background-color: #FCDB5A;

    position: relative;

    margin: auto;

  }



  .circle-icon {

    position: absolute;

    margin: auto;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    width: 50px;

    height: 50px;

  }



  .circle-icon img {

    width: 100%;

  }



  .circle-box h4 {

    margin: 15px 0px 10px;

    font-weight: 600;

  }



  .circle-box p {

    font-weight: 400;

    color: #333;

  }



  .title-layer {

    text-align: center;

    margin-bottom: 4rem;

  }



  .title-layer h5 {

    letter-spacing: 2px;

  }



  /*====================================================

    7. ABOUT US. 

  ====================================================*/

  .agroly-about-img img {

    width: 100%;

  }



  .about-agroly-info {

    padding-left: var(--col-left-padding);

  }



  .about-agroly-info h5 {

    color: #A3B0B4;

    font-size: 14px;

    text-transform: uppercase;

    font-weight: bold;

  }



  .light-text {

    font-weight: 300;

  }



  .signature {

    width: 200px;

  }



  .ws-services {

    overflow: hidden;

  }



  .ws-right-layer {

    background-image: url("../images/common/agroly-pic-4.jpg");

    height: 700px;

    margin-top: 60px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



  .ws-right-layer:before {

    content: '';

    position: absolute;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    background-color: rgba(51, 51, 51, 0.9);

  }



  .ws-left-layer {

    background-image: url("../images/common/agroly-pic-5.jpg");

    width: 100%;

    height: 700px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



  .inner-ws-right {

    width: 50%;

    margin: 0;

    position: absolute;

    top: 50%;

    left: 5%;

    -ms-transform: translateY(-50%);

    transform: translateY(-50%);

  }



  .inner-ws-right .side-title {

    width: 100%;

    margin-bottom: 1.5rem;

    border-left: solid 6px #FFA600;

  }



  .inner-ws-right .side-title h6 {

    color: #FFF;

    margin-left: 20px;

    margin-bottom: 5px;

    line-height: 1;

    text-transform: uppercase;

  }



  .inner-ws-right .side-title h2 {

    margin-left: 20px;

    line-height: 1.2;

    color: #FFF;

    font-size: 2.5rem;

  }



  .inner-ws-right p {

    color: #FFF;

  }



  .inner-ws-right p.strong {

    font-weight: 600;

    font-size: 18px;

  }



  .layer-box {

    padding: 1rem;

  }



  .layer-box .media-body h4 {

    color: #FFF;

    font-weight: 700;

    font-size: 1.3rem;

    margin-bottom: 5px;

  }



  .layer-box .media img{

    color: yellow;

  }



  .layer-box .media-body p {

    margin-bottom: 0px;

    line-height: 1.5;

    font-weight: 400;

  }



  .layer-box .media .mr-3 {

    width: 60px;

  }



  .layer-box .media .mr-3 img {

    width: 100%;

  }



  .cta-counter {

    color: #FFF !important;

    padding: 3rem;

    background-image: url("../images/common/agroly-counter-bg.jpg");

    height: 220px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



  .cta-counter:before {

    content: '';

    position: absolute;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    background-color: rgba(62, 117, 95, 0.9);

  }



  .cta-btn {

    text-align: right;

    padding: 1rem 0rem;

  }



  .btn-call {

    color: #0069d9;

    background-color: #FFF;

    border-color: #FFF;

    padding: 0.45rem 2rem;

    font-size: 1rem;

  }



  .btn-call:hover {

    color: #fff;

    background-color: #0069d9;

    border-color: #0062cc;

  }



  .btn-call:focus,

  .btn-call.focus {

    color: #fff;

    background-color: #0069d9;

    border-color: #0062cc;

    box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);

  }



  .cta-content {

    position: relative;

    z-index: 1;

  }



  .cta-content h3 {

    font-weight: 900;

    text-transform: uppercase;

    color: #FFF;

  }



  .counter-wrapper-alt {

    background-color: #FFF;

    margin-top: -140px;

    position: relative;

    z-index: 1;

    padding: 4rem 2.5rem;

    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);

    -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);

    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);

    -o-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);

  }



  .counter-wrapper-alt .media .mr-3 {

    width: 50px;

  }



  .counter-wrapper-alt .media .mr-3 img {

    width: 100%;

  }



  .counter-wrapper-alt .media .media-body .counter {

    font-size: 2rem;

    font-weight: 700;

    margin: -10px 0px;

    font-family: 'Open Sans', sans-serif;

  }



  .counter-wrapper-alt .media .media-body p {

    margin-bottom: 0px;

  }



  .counter-border-right-alt {

    border-right: solid 1px rgba(221, 221, 221, 0.5);

  }



  /*====================================================

    8. SERVICES. 

  ====================================================*/

  .service-box {

    padding: 2rem 1rem;

    border-radius: 5px;

    margin: 1rem 0rem;

    box-shadow: 0 0 74px rgba(10, 10, 10, 0.07);

  }



  .service-box .sb-icon {

    width: 60px;

    margin: auto;

  }



  .sb-caption {

    text-align: justify;

  }



  .sb-caption h4 {

    font-size: 22px;

    font-weight: 700;

    margin: 10px 0px;

  }



   .sb-caption1 h4 {

    font-size: 22px;

    font-weight: 700;

    margin: 10px 0px;

    text-align: center;

  }

  .sb-caption1 p{

        font-size: 14px;

    font-family: 'Open Sans', sans-serif;

    color: var(--main-text-color);

    font-weight: 400;

    line-height: 25px;

    text-align: center;

  }



  /*====================================================

    9. PRODUCTS. 

  ====================================================*/

  .product-desc-layer {

    margin: 0;

    position: absolute;

    /* top: 50%; */

    -ms-transform: translateY(-50%);

    /* transform: translateY(-50%); */

  }



  .product-desc-layer h3 {

    text-transform: uppercase;

    font-weight: 900;

    font-size: 27px;

  }



  hr.product-divider {

    border-top: 1px solid rgba(204, 204, 204, 0.4);

    margin: 3rem 0rem;

  }



  /*====================================================

    10. PRODUCTS DETAILS. 

  ====================================================*/

  .product-feauture {

    position: relative;

  }



  .info-feature-layer {

    position: absolute;

    background: rgba(0, 0, 0, 0.6);

    padding: 1rem 2rem;

    bottom: 0;

    right: 0%;

  }



  .product-feauture .media .mr-3 {

    width: 50px;

  }



  .product-feauture .media .media-body {

    padding-top: 12px;

  }



  .product-feauture .media .media-body h5 {

    color: #FFF;

    font-size: 20px;

    font-weight: 600;

  }



  .product-details {

    margin-top: 2rem;

  }



  .layer-title p strong {

    font-weight: 600;

  }



  .product-details h3 {

    font-weight: 700;

    margin: 2rem 0rem 1rem;

  }



 /*====================================================

    11. TEAM. 

  ====================================================*/

  .lt-rightside p {

    font-size: 16px;

    font-weight: 400;

  }



  .team-box {

    margin: 1rem 0rem;

  }



  figure.portrait-layer {

    position: relative;

    overflow: hidden;

    width: 100%;

    background: #000000;

    text-align: left;

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

  }



  figure.portrait-layer * {

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

    -webkit-transition: all 0.3s ease-in-out;

    transition: all 0.3s ease-in-out;

  }



  figure.portrait-layer img {

    max-width: 100%;

    position: relative;

    top: 0;

    opacity: 1.0;

    left: 0;

    -webkit-transition: 0.3s ease-in-out;

    transition: 0.3s ease-in-out;

    -webkit-transform-origin: 0 100%;

    transform-origin: 0 100%;

  }



  figure.portrait-layer .team-caption {

    position: absolute;

    color: #ffffff;

    bottom: 0;

    padding: 6px;

    margin: 0;

    left: 50px;

    -webkit-transform: translate(-10px, 0);

    transform: translate(-10px, 0);

    -webkit-transition-delay: 0;

    transition-delay: 0;

  }



  figure.portrait-layer .team-caption h4 {

    color: #ffffff;

    margin-bottom: 0px;

    font-weight: 700;

   }



  figure.portrait-layer .team-caption p {

    color: #ffffff;

    font-weight: 600;

  }



  figure.portrait-layer .icons {

    bottom: 35px;

    width: 35px;

    position: absolute;

    text-align: center;

  }



  figure.portrait-layer .icons i {

    display: inline-block;

    font-size: 22px;

    color: #ffffff;

    opacity: 1;

    position: relative;

    -webkit-transition: 0.3s ease-in-out;

    transition: 0.3s ease-in-out;

    -webkit-transform: translate(-35px, 35px);

    transform: translate(-35px, 35px);

  }



  figure.portrait-layer .corner {

    position: absolute;

    bottom: 0;

    text-align: center;

  }



  figure.portrait-layer .icons i,

  figure.portrait-layer .corner {

    height: 35px;

    width: 35px;

    line-height: 35px;

    color: #FFF;

  }



  figure.portrait-layer a {

    opacity: 0.8;

  }



  figure.portrait-layer a:hover {

    opacity: 1;

  }



  figure.portrait-layer a:hover i {

    width: 40px;

    -webkit-transition: all 0.1s;

    transition: all 0.1s;

  }



  figure.portrait-layer.blue {

    background: #091b27;

  }



  figure.portrait-layer.blue .icons i,

  figure.portrait-layer.blue .corner {

    background: #2980b9;

  }



  figure.portrait-layer.red {

    background: #2e0e0a;

  }



  figure.portrait-layer.red .icons i,

  figure.portrait-layer.red .corner {

    background: #c0392b;

  }



  figure.portrait-layer.yellow {

    background: #4d2909;

  }



  figure.portrait-layer.yellow .icons i,

  figure.portrait-layer.yellow .corner {

    background: #3E755F;

  }



  figure.portrait-layer.green {

    background: #061c10;

  }



  figure.portrait-layer.green .icons i,

  figure.portrait-layer.green .corner {

    background: #27ae60;

  }



  figure.portrait-layer:hover img,

  figure.portrait-layer.hover img {

    opacity: 0.5;

    -webkit-transform: scale(1.05);

    transform: scale(1.05);

  }



  figure.portrait-layer:hover p,

  figure.portrait-layer.hover p {

    -webkit-transform: translate(0, 0);

    transform: translate(0, 0);

    -webkit-transition-delay: 0.2s;

    transition-delay: 0.2s;

    opacity: 1;

  }



  figure.portrait-layer:hover .icons,

  figure.portrait-layer.hover .icons {

    opacity: 1;

  }



  figure.portrait-layer:hover .icons i,

  figure.portrait-layer.hover .icons i {

    -webkit-transform: translate(0, 0);

    transform: translate(0, 0);

    opacity: 1;

  }



  figure.portrait-layer:hover a:first-child i,

  figure.portrait-layer.hover a:first-child i {

    -webkit-transition-delay: 0.2s;

    transition-delay: 0.2s;

  }



  figure.portrait-layer:hover a:nth-child(2) i,

  figure.portrait-layer.hover a:nth-child(2) i {

    -webkit-transition-delay: 0.1s;

    transition-delay: 0.1s;

  }



  figure.portrait-layer:hover a:nth-child(3) i,

  figure.portrait-layer.hover a:nth-child(3) i {

    -webkit-transition-delay: 0s;

    transition-delay: 0s;

  }



  /*====================================================

    12. TESTIMONIALS. 

  ====================================================*/

  .testimonials-carousel {

    position: relative;

  }



  .testimonials-carousel .owl-theme .item {

    padding: 10px;

  }



  .testimonials-carousel .owl-theme .custom-nav {

    position: absolute;

    top: 37%;

    left: 0%;

    right: 0%;

    z-index: 1;

  }



  .testimonials-carousel .owl-theme .item img {

    width: 100%;

  }



  .testimonials-carousel .owl-theme .custom-nav .owl-prev,

  .testimonials-carousel .owl-theme .custom-nav .owl-next {

    position: absolute;

    width: 30px;

    height: 30px;

    color: inherit;

    background: none;

    border: none;

    z-index: 100;

    background-color: #333;

    border-radius: 0px;

    padding: 6px 10px;

    display: none;

  }



  .testimonials-carousel .owl-theme .custom-nav .owl-prev:hover,

  .testimonials-carousel .owl-theme .custom-nav .owl-next:hover {

    position: absolute;

    background-color: #000;

  }



  .testimonials-carousel .owl-theme .custom-nav .owl-prev:focus,

  .testimonials-carousel .owl-theme .custom-nav .owl-next:focus {

    border: none;

    outline: 0;

    box-shadow: none;

  }



  .testimonials-carousel .owl-theme .custom-nav .owl-prev i,

  .testimonials-carousel .owl-theme .custom-nav .owl-next i {

    font-size: 18px;

    color: #FFF;

  }



  .testimonials-carousel .owl-theme .custom-nav .owl-prev {

    left: 0;

  }



  .testimonials-carousel .owl-theme .custom-nav .owl-next {

    right: 0;

  }



  .testimonials-carousel .owl-dots {

    text-align: center;

    margin-top: 25px;

  }



  .testimonials-carousel .owl-dots button.owl-dot {

    width: 12px;

    height: 12px;

    border-radius: 50%;

    display: inline-block;

    background: #ccc;

    margin: 0px 3px;

    box-shadow: none;

    border: none;

  }



  .testimonials-carousel .owl-dots button.owl-dot.active {

    background-color: var(--main-yellow-color);

    width: 20px;

    border-radius: 25px;

  }



  .testimonials-carousel .owl-dots button.owl-dot:focus {

    outline: none;

  }



  .testimonials-box ul.rating li {

    list-style: none;

    display: inline-block;

    color: var(--main-yellow-color);

  }



  .testimonials-box {

    background-color: #FFF !important;

    box-shadow: 0 0 74px rgba(10, 10, 10, 0.07);

    padding: 1.5rem;

  }



  .testimonials-box .media .mr-3 {

    width: 50px !important;

    border-radius: 50%;

  }



  .testimonials-box .media .media-body h5 {

    color: var(--main-dark-color);

    font-size: 18px;

    font-weight: 600;

    margin-bottom: -8px;

  }



  .testimonials-box .media .media-body p {

    color: var(--main-dark-color);

    font-size: 13px;

  }



  .testimonial-grid .testimonials-box {

    margin: 1rem 0rem !important;

  }



  /*====================================================

    13. FAQ. 

  ====================================================*/

  .accordion {

    border-top: 1px solid #d9e5e8;

  }



  .accordion li {

    border-bottom: 1px solid #d9e5e8;

    position: relative;

    list-style-type: none;

  }



  .accordion li p {

    display: none;

    padding: 10px 20px 20px;



    font-size: 15px;

    font-size: 600 !important;

  }



  .accordion a {

    width: 100%;

    font-family: 'Open Sans', sans-serif;

    display: block;

    cursor: pointer;

    font-weight: 700;

    line-height: 3;

    font-size: 15px;

    user-select: none;

  }



  .accordion li a.active {

    color: #EEC344;

  }



  .accordion a.hover {

    color: #EEC344;

  }



  .accordion a:after {

    width: 8px;

    height: 8px;

    border-right: 2px solid var(--main-yellow-color);

    border-bottom: 2px solid var(--main-yellow-color);

    position: absolute;

    right: 5px;

    content: " ";

    top: 20px;

    transform: rotate(-45deg);

    -webkit-transition: all 0.2s ease-in-out;

    -moz-transition: all 0.2s ease-in-out;

    transition: all 0.2s ease-in-out;

  }



  a.active:after {

    transform: rotate(45deg);

    -webkit-transition: all 0.2s ease-in-out;

    -moz-transition: all 0.2s ease-in-out;

    transition: all 0.2s ease-in-out;

    border-right: 2px solid var(--main-green-color);

    border-bottom: 2px solid var(--main-green-color);

  }



  .faq-box {

    box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);

    background-color: #f2f2f2;

    padding: 2rem;

    margin: 2rem 0rem;

  }



  .fb-circle {

    position: relative;

    width: 70px;

    height: 70px;

    background-color: var(--main-yellow-color);

    border-radius: 50%;

    margin: auto;

  }



  .fb-icon {

    position: absolute;

    margin: auto;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    width: 40px;

    height: 40px;

  }



  .faq-box h5 {

    text-align: center;

    font-weight: 700;

    color: var(--main-dark-color);

    margin: 15px 0px;

  }



  .faq-box p {

    text-align: center;

    font-weight: 600;

    color: var(--main-dark-color);

    margin: 5px 0px;

    line-height: 1.5;

  }



  .faq-box p.link {

    text-align: center;

    font-weight: 900;

    color: var(--main-yellow-color);

    margin-top: 15px;

    text-transform: uppercase;

    font-size: 18px;

    text-decoration: underline;

  }



  .faq-box p.link a {

    color: var(--main-green-color);

  }



  .faq-box p.link a:hover {

    color: var(--main-yellow-color);

  }



  .layer-title p.strong {

    font-weight: 600;

    font-size: 15px;

  }



  /*====================================================

    14. 404 ERROR PAGE. 

  ====================================================*/

  .error-page {

    background-image: url("../images/common/error-page-bg.jpg");

    height: 900px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



  .error-page:before {

    content: '';

    position: absolute;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    background-image: linear-gradient(to bottom right, #002642, #002642);

    opacity: 0.6;

  }



  .error-page-content {

    position: absolute;

    top: 55%;

    left: 50%;

    transform: translate(-50%, -50%);

    text-align: center;

    color: #FFF;

  }



  .error-page-content h1 {

    font-size: 8rem;

    color: #FFF;

    font-weight: 600;

    font-family: 'Open Sans', sans-serif;

  }



  .error-page-content h2 {

    color: #FFF;

  }



  .error-page-content p {

    color: #fff;

    font-weight: 600;

  }



  .error-page-search {

    display: inline-block;

    position: relative;

    color: #FFF;

    margin-top: 2rem;

    width: 70%;

  }



  .error-page-search .form-control {

    background-color: rgba(0, 0, 0, 0.5);

    border: none;

    border-radius: 0px;

    padding-top: 2px;

    padding-bottom: 2px;

    font-size: 14px;

    height: 45px;

    font-family: 'Open Sans', sans-serif;

    color: #FFF;

    transition: 0.3s;

  }



  .error-page-search .form-control:focus {

    color: #FFF;

    background-color: rgba(0, 0, 0, 0.7);

    border-color: none;

    outline: 0;

    box-shadow: none;

  }



  .error-page-search .form-control-feedback {

    position: absolute;

    z-index: 2;

    display: block;

    width: 2rem;

    height: 45px;

    line-height: 45px;

    text-align: center;

    pointer-events: none;

    color: #FFF;

    right: 0;

    font-size: 16px;

  }



  .error-page-content .social-error-page ul li a {

    color: #FFF;

    transition: 0.3s;

  }



  .error-page-content .social-error-page ul li a:hover {

    color: var(--main-yellow-color);

  }



  .social-error-page ul li {

    list-style: none;

    display: inline-block;

    margin: 0px 5px;

    font-size: 18px;

  }



  /*====================================================

    15. BLOG GRID. 

  ====================================================*/

  .aside-block .list-group .list-group-item {

    font-family: 'Poppins', sans-serif;

    text-align: left !important;

    padding: 0px 0px 10px 0px;

  }



  .aside-block .list-group .list-group-item .badge-pill {

    background-color: #F5F5F5;

    color: var(--main-dark-color);

    font-weight: 400;

    font-size: 13px;

  }



  .aside-block .list-group .list-group-item a {

    border: none;

    font-size: 14px;

  }



  .aside-block {

    margin-bottom: 2rem;

  }



  .aside-block h4 {

    font-size: 18px;

    font-weight: 700;

    margin-bottom: 1.5rem;

  }



  .project-thumb {

    width: 70px;

  }



  .project-thumb img {

    width: 100%;

  }



  .aside-block ul li {

    list-style: none;

    display: inline-block;

    margin: 5px;

  }



  ul.circle-border li {

    width: 30px;

    height: 30px;

    border: solid 1px var(--main-green-color);

    background-color: var(--main-green-color);

    border-radius: 50%;

    text-align: center;

    line-height: 27px;

    transition: 0.3s;

  }



  ul.circle-border li .fab {

    font-size: 15px;

    color: #FFF;

  }



  /* .content-blogs{

      padding-left: 2rem;

  } */

  .blog-thumbnail {

    box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);

    margin: 1rem 0rem;

  }



  .blog-thumbnail .bt-img img {

    width: 100%;

  }



  .bt-caption {

    padding: 2rem 2rem 1rem;

  }



  .bt-details p {

    display: inline-block;

    margin-right: 15px;

    color: var(--main-green-color);

    ;

    font-size: 13px;

    font-weight: 600;

  }



  .bt-caption h4 {

    font-weight: 900;

    text-transform: uppercase;

    margin-bottom: 10px;

  }



  .author .media .mr-3 {

    width: 50px;

    height: 50px;

    border-radius: 50%;

  }



  .author .media .media-body {

    padding-top: 5px;

  }



  .author .media .media-body h5 {

    color: var(--main-dark-color);

    font-size: 14px;

    font-weight: 600;

    text-transform: uppercase;

    margin-bottom: 0px;

  }



  .author .media .media-body p {

    font-size: 13px;

  }



  hr.bt-separator {

    border-top: 1px solid rgba(204, 204, 204, 0.4);

    margin: 30px 0px 20px;

  }



  .image-hover figure {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

    overflow: hidden;

  }



  .image-hover figure:hover+span {

    bottom: -36px;

    opacity: 1;

  }



  .hover-effects figure img {

    -webkit-transform: scale(1);

    transform: scale(1);

    -webkit-transition: .3s ease-in-out;

    transition: .3s ease-in-out;

  }



  .hover-effects figure:hover img {

    -webkit-transform: scale(1.1);

    transform: scale(1.1);

  }



  ul.ag-tags li {

    margin: 0px;

  }



  .left-sidebar h4 {

    font-size: 20px;

  }



  .right-sidebar h4 {

    font-size: 20px;

  }



  .site-pagination .pagination {

    display: -ms-flexbox;

    display: flex;

    padding-left: 0;

    list-style: none;

    border-radius: 0rem;

    justify-content: center;

  }



  .site-pagination .page-link {

    position: relative;

    display: block;

    padding: 0.6rem 1rem;

    margin-right: 8px;

    line-height: 1.25;

    color: #333;

    background-color: #e6e6e6;

    border: none;

    font-family: 'Open Sans', sans-serif;

    font-size: 16px;

    font-weight: 500;

    border-radius: 50%;

  }



  .site-pagination .page-link .fas {

    font-size: 16px;

  }



  .site-pagination .page-link:hover {

    z-index: 2;

    color: #FFF;

    text-decoration: none;

    background-color: var(--main-green-color);

    border-color: var(--main-green-color);

  }



  .site-pagination .page-link:focus {

    z-index: 2;

    outline: 0;

    box-shadow: none;

  }



  .page-link .fas {

    font-size: 18px;

  }



  .site-pagination .page-item.active .page-link {

    z-index: 1;

    color: #fff;

    background-color: var(--main-green-color);

    border-color: var(--main-green-color);

  }



  .site-pagination .page-item:last-child .page-link {

    border-radius: 50%;

  }



  /*====================================================

    16. BLOG SINGLE. 

  ====================================================*/

  .blog-search {

    display: inline-block;

    position: relative;

    color: #FFF;

    margin-bottom: 2rem;

    width: 100%;

  }



  .blog-search .form-control {

    background-color: #eff5f5;

    border: none;

    border-radius: 0px;

    padding-top: 2px;

    padding-bottom: 2px;

    font-size: 14px;

    height: 45px;

    font-family: 'Open Sans', sans-serif;

    color: #CCC;

    transition: 0.3s;

  }



  .blog-search .form-control:focus {

    color: #CCC;

    background-color: #e0ebeb;

    border-color: none;

    outline: 0;

    box-shadow: none;

  }



  .blog-search .form-control-feedback {

    position: absolute;

    z-index: 1;

    display: block;

    width: 2rem;

    height: 45px;

    line-height: 45px;

    text-align: center;

    pointer-events: none;

    color: #CCC;

    right: 0;

    font-size: 16px;

  }



  .blog-feature-img {

    position: relative;

  }



  .blog-caption-box {

    position: absolute;

    background: rgba(0, 0, 0, 0.6);

    padding: 1rem 2rem;

    left: 0;

    bottom: 30px;

  }



  .blog-caption-content h2 {

    color: #FFF;

  }



  .blog-caption-content .media .mr-3 {

    width: 50px;

    border-radius: 50%;

  }



  .blog-caption-content .media .media-body {

    padding: 17px 0px;

  }



  .blog-caption-content .media .media-body h5 {

    color: #FFF;

    font-size: 14px;

    font-weight: 600;

  }



  .color-text a {

    color: var(--main-yellow-color);

    transition: 0.4s;

  }



  .color-text a:hover {

    color: #FFF;

  }



  .post-content {

    margin-top: 2rem;

  }



  .post-content p {

    font-size: 15px;

  }



  .ludwig {

    position: relative;

    padding-left: 1em;

    border-left: 0.2em solid var(--main-yellow-color);

    font-family: 'Open Sans', sans-serif;

    font-size: 1.3rem;

    line-height: 1.3;

    font-weight: 600;

    margin: 25px 0px;

    font-style: italic;

  }



  .ludwig:before,

  .ludwig:after {

    content: '\201C';

    font-family: 'Sanchez';

    color: var(--main-yellow-color);

  }



  .ludwig:after {

    content: '\201D';

  }



  .blog-comments {

    margin-top: 3.5rem;

  }



  .blog-comments h4 {

    margin-bottom: 2rem;

    font-family: 'Open Sans', sans-serif;

    font-weight: 600;

  }



  .blog-comments h5 {

    color: var(--main-dark-color);

    font-weight: 600;

    margin-bottom: 0px;

  }



  .comment-box {

    margin-top: 1.5rem;

  }



  .comment-box .media .mr-3 {

    width: 60px;

    border-radius: 50%;

  }



  .comment-box .media .media-body {

    padding: 5px;

  }



  .comment-box .media .media-body h5 {

    text-transform: uppercase;

    font-size: 16px;

    font-weight: 700;

  }



  .comment-box .media .media-body p strong {

    font-size: 13px;

    font-weight: 600;

    color: #A3B0B4;

  }



  .comment-box .media .media-body p {

    font-size: 13px;

    margin-bottom: 5px;

  }



  .replay-comment {

    padding-left: 3rem;

  }



  .replay {

    font-weight: 600;

    color: var(--main-yellow-color);

    font-size: 14px !important;

    margin-top: 10px;

  }



  .replay a,

  .replay-all a {

    color: var(--main-yellow-color);

    transition: 0.4s;

  }



  .replay a:hover,

  .replay-all a:hover {

    color: var(--main-green-color);

  }



  .warning-message {

    margin-top: 2rem;

  }



  .warning-message a {

    color: var(--main-yellow-color);

    transition: 0.4s;

    font-weight: 600;

  }



  .warning-message a:hover {

    color: var(--main-green-color);

  }





  p.replay::after {

    font-family: "Font Awesome 5 Free";

    font-weight: 900;

    content: "\f3e5";

    margin-left: 10px;

  }



  .replay-all {

    font-weight: 600;

    color: var(--main-yellow-color);

    font-size: 14px !important;

    margin-top: 10px;

  }



  p.replay-all::after {

    font-family: "Font Awesome 5 Free";

    font-weight: 900;

    content: "\f122";

    margin-left: 10px;

  }



  .aside-block .media .mr-3 {

    width: 80px;

  }



  .aside-block .media .media-body h5 {

    font-size: 16px;

    font-weight: 700;

    color: var(--main-dark-color);

  }



  .post-date {

    color: #A3B0B4;

    font-weight: 600;

    margin-bottom: 2px;

    font-size: 13px;

  }



  /*====================================================

    17. CONTACT. 

  ====================================================*/

  .wrapper-form {

    background-color: #76703c;

    padding: 5rem 0rem;

  }



  .wrapper-form .col-md-8 {

    margin: auto;

  }



  .wrapper-form .layer-title h2 {

    color: #FFF;

  }



  .wrapper-form .layer-title p {

    color: #FFF;

  }



  .customize {

    display: block;

    width: 100%;

    height: calc(3rem + 2px);

    padding: 0.375rem 2rem;

    font-size: 15px;

    font-family: 'Roboto', sans-serif;

    font-weight: 400;

    line-height: 1.5;

    color: #495057;

    background-color: #FFF;

    background-clip: padding-box;

    border-color: #FFF;

    border-radius: 0rem;

    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;

    margin: 5px 0px;

    transition: 0.6s;

  }



  .customize::-ms-expand {

    background-color: transparent;

    border: 0;

  }



  .customize:focus {

    color: #495057;

    background-color: #FFF;

    border-color: none;

    outline: 0;

    box-shadow: none;

  }



  .bottom-map {

    line-height: 0;

  }



  .map-iframe-alt {

    width: 100%;

    height: 500px;

  }



  .with-errors {

    font-size: 12px;

    font-family: 'Open Sans', sans-serif;

    text-align: left;

    color: red;

    margin-top: 10px;

  }



  .alert-success {

    color: var(--main-dark-color);

    background-color: var(--main-yellow-color);

    border-color: var(--main-yellow-color);

    font-family: 'Open Sans', sans-serif;

    font-size: 15px;

    line-height: 1.5;

  }



  .close {

    float: right;

    margin-left: 5px;

    font-size: 1rem;

    font-weight: 700;

    line-height: 1;

    color: var(--main-dark-color);

    text-shadow: none;

    opacity: 1;

  }



  .btn-send {

    text-align: center;

  }



  .contact-box-layer {

    padding: 2rem 1rem;

    border-radius: 5px;

    margin: 1rem 0rem;

    box-shadow: 0 0 74px rgba(10, 10, 10, 0.07);

    text-align: center;

    background-color: #76703c;
  }



  .contact-box-layer .fas {

    font-size: 15px;

    text-align: center;

    /* color: var(--main-green-color); */

    margin-bottom: 1rem;

    margin-right: 11px;

  }



  /*====================================================

    18. LATES NEWS. 

  ====================================================*/

  .news-carousel {

    position: relative;

  }



  .news-carousel .owl-theme .item {

    padding: 10px;

  }



  .news-carousel .owl-theme .custom-nav {

    position: absolute;

    top: 37%;

    left: 0%;

    right: 0%;

    z-index: 1;

  }



  .news-carousel .owl-theme .item img {

    width: 100%;

  }



  .news-carousel .owl-theme .custom-nav .owl-prev,

  .news-carousel .owl-theme .custom-nav .owl-next {

    position: absolute;

    width: 30px;

    height: 30px;

    color: inherit;

    background: none;

    border: none;

    z-index: 100;

    background-color: #333;

    border-radius: 0px;

    padding: 6px 10px;

    display: none;

  }



  .news-carousel .owl-theme .custom-nav .owl-prev:hover,

  .news-carousel .owl-theme .custom-nav .owl-next:hover {

    position: absolute;

    background-color: #000;

  }



  .news-carousel .owl-theme .custom-nav .owl-prev:focus,

  .news-carousel .owl-theme .custom-nav .owl-next:focus {

    border: none;

    outline: 0;

    box-shadow: none;

  }



  .news-carousel .owl-theme .custom-nav .owl-prev i,

  .news-carousel .owl-theme .custom-nav .owl-next i {

    font-size: 18px;

    color: #FFF;

  }



  .news-carousel .owl-theme .custom-nav .owl-prev {

    left: 0;

  }



  .news-carousel .owl-theme .custom-nav .owl-next {

    right: 0;

  }



  .news-carousel .owl-dots {

    text-align: center;

    margin-top: 25px;

  }



  .news-carousel .owl-dots button.owl-dot {

    width: 12px;

    height: 12px;

    border-radius: 50%;

    display: inline-block;

    background: #ccc;

    margin: 0px 3px;

    box-shadow: none;

    border: none;

  }



  .news-carousel .owl-dots button.owl-dot.active {

    background-color: var(--main-yellow-color);

    width: 20px;

    border-radius: 25px;

  }



  .news-carousel .owl-dots button.owl-dot:focus {

    outline: none;

  }



  .news-card {

    background-color: #FFF;

    box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);

  }



  .nc-caption {

    padding: 1.5rem 1rem;

  }



  .date-box {

    width: 60px;

    height: 60px;

    background-color: var(--main-yellow-color);

    margin-right: 20px;

    position: relative;

  }



  .db-inner {

    position: absolute;

    width: 40px;

    height: 40px;

    margin: auto;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    text-align: center;

    padding-top: 5px;

  }



  .db-inner h5 {

    color: var(--main-dark-color);

    font-weight: 900;

    margin-bottom: 0px;

    text-transform: uppercase;

    line-height: 15px;



  }



  .db-inner span {

    font-size: 11px;

    margin-top: -25px;

    line-height: 15px;

    font-weight: 600;

  }



  .nc-caption .media .media-body h4 {

    font-size: 16px;

    font-weight: 700;

    line-height: 1.5;

    text-transform: uppercase;

  }



  .nc-caption p {

    margin-top: 15px;

  }



/*====================================================

    19. GALLERY FILTER.

  ====================================================*/

  /* * {

    -webkit-transform-origin: center !important;

    transform-origin: center !important;

  } */



  .filter-container {

    width: 100%;

    margin: 0rem auto 2.5rem;

    text-align: center;

  }



  .filter {

    padding: 0;

    list-style: none;

  }



  .filter li {

    font-size: 14px;

    font-family: 'Open Sans', sans-serif;

    display: inline-block;

    text-transform: uppercase;

    cursor: pointer;

    line-height: 2;

    padding: 0 25px;

    position: relative;

    color: var(--main-text-color);

    font-weight: 600;

    border: solid 2px var(--main-yellow-color);

    border-radius: 10px;

    margin: 0px 5px;

  }



  .filter li.active {

    color: #FFF;

    background-color: var(--main-yellow-color);

  }



  #kehl-grid {

    position: relative;

    text-align: center;

    margin: 0 auto;

    padding: 0;

    width: 100%;

    /*  max-width:1920px; */

  }



  #kehl-grid:after {

    content: '';

    display: block;

    clear: both;

  }



  .grid-box {

    position: relative;

    display: inline-block;

    overflow: hidden;

    width: calc(100% / 3);

    margin: 0;

    padding: 5px;

    /*   box-sizing: border-box;

        -webkit-transform: translate3d(1px,0,0);

        transform: translate3d(1px,0,0); */

    clear: both;

  }



  #kehl-grid h3 {

    color: #262626;

    font-family: 'Open Sans', sans-serif;

    font-weight: 800;

    font-size: 15px;

    line-height: 25px;

    letter-spacing: 4px;

    text-transform: uppercase;

    z-index: 1;

  }



  #kehl-grid p {

    color: #333;

    z-index: 4;

    font-size: 12px;

    letter-spacing: 3px;

    font-family: 'Playfair Display', serif;

    font-weight: 400;

  }



  /* clear fix */

  .grid:after {

    content: '';

    display: block;

    clear: both;

  }



  /* ---- .grid-item ---- */

  .grid-sizer,

  .grid-box {

    width: 33.333%;

  }



  .grid-two-col .grid-sizer,

  .grid-two-col .grid-box {

    width: 49%;

  }



  .grid-four-col .grid-sizer,

  .grid-four-col .grid-box {

    width: 25%;

  }



  .grid-box {

    float: left;

  }



  .grid-box img {

    display: block;

    width: 100%;

  }



  .grid-box .image-mask {

    position: absolute;

    width: 100%;

    height: 100%;

    top: 0;

    left: 0;

    background: rgba(256, 256, 256, 0);

    z-index: 1;

    transition: all 300ms linear;

  }



  .grid-box:hover .image-mask {

    background: rgba(256, 256, 256, .8);

  }



  .grid-box h3 {

    position: absolute;

    width: 100%;

    bottom: 30%;

    left: 0;

    margin-bottom: -16px;

    line-height: 26px;

    text-align: center;

    z-index: 4;

    opacity: 0;

    transition: all 300ms linear;

  }



  .grid-box:hover h3 {

    bottom: 50%;

    opacity: 1;

  }



  .grid-box p {

    position: absolute;

    top: 15px;

    left: 25px;

    opacity: 0;

    font-style: italic;

    line-height: 18px;

    transition: all 300ms linear;

  }



  .grid-box:hover p {

    top: 60px;

    left: 25px;

    opacity: 0;

  }



  /*====================================================

    20. MAGNIFIC POPUP.

  ====================================================*/

  .magnific-img {

    width: 100%;

    height: 100%;

  }



  .magnific-img img {

    width: 100%;

    height: 100%;

    border-radius: 0px;

  }



  .mfp-with-zoom .mfp-container,

  .mfp-with-zoom.mfp-bg {

    opacity: 0;

    -webkit-transition: all 0.3s ease-out;

    -moz-transition: all 0.3s ease-out;

    -o-transition: all 0.3s ease-out;

    transition: all 0.3s ease-out;

  }



  .mfp-with-zoom.mfp-ready .mfp-container {

    opacity: 1;

  }



  .mfp-with-zoom.mfp-ready.mfp-bg {

    opacity: 0.8;

  }



  .mfp-with-zoom.mfp-removing .mfp-container,

  .mfp-with-zoom.mfp-removing.mfp-bg {

    opacity: 0;

  }



  .mfp-arrow-left:before {

    border-right: none !important;

  }



  .mfp-arrow-right:before {

    border-left: none !important;

  }



  button.mfp-arrow,

  .mfp-counter {

    opacity: 0 !important;

    transition: opacity 200ms ease-in, opacity 2000ms ease-out;

  }



  .mfp-container:hover button.mfp-arrow,

  .mfp-container:hover .mfp-counter {

    opacity: 1 !important;

  }



  /* Magnific Popup CSS */

  .mfp-bg {

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    z-index: 1042;

    overflow: hidden;

    position: fixed;

    background: #0b0b0b;

    opacity: 0.9;

  }



  .mfp-wrap {

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    z-index: 1043;

    position: fixed;

    outline: none !important;

  }



  .mfp-container {

    text-align: center;

    position: absolute;

    width: 100%;

    height: 100%;

    left: 0;

    top: 0;

    padding: 0 8px;

    box-sizing: border-box;

  }



  .mfp-container:before {

    content: '';

    display: inline-block;

    height: 100%;

    vertical-align: middle;

  }



  .mfp-align-top .mfp-container:before {

    display: none;

  }



  .mfp-content {

    position: relative;

    display: inline-block;

    vertical-align: middle;

    margin: 0 auto;

    text-align: left;

    z-index: 1045;

  }



  .mfp-inline-holder .mfp-content,

  .mfp-ajax-holder .mfp-content {

    width: 100%;

    cursor: auto;

  }



  .mfp-ajax-cur {

    cursor: progress;

  }



  /* .mfp-zoom-out-cur,

  .mfp-zoom-out-cur .mfp-image-holder .mfp-close {

    cursor: -moz-zoom-out;

    cursor: -webkit-zoom-out;

    cursor: zoom-out;

  }

  .mfp-zoom {

    cursor: pointer;

    cursor: -webkit-zoom-in;

    cursor: -moz-zoom-in;

    cursor: zoom-in;

  } */

  /* .mfp-auto-cursor .mfp-content {

    cursor: auto;

  } */

  .mfp-close,

  .mfp-arrow,

  .mfp-preloader,

  .mfp-counter {

    -webkit-user-select: none;

    -moz-user-select: none;

    user-select: none;

  }



  .mfp-loading.mfp-figure {

    display: none;

  }



  .mfp-hide {

    display: none !important;

  }



  .mfp-preloader {

    color: #CCC;

    position: absolute;

    top: 50%;

    width: auto;

    text-align: center;

    margin-top: -0.8em;

    left: 8px;

    right: 8px;

    z-index: 1044;

  }



  .mfp-preloader a {

    color: #CCC;

  }



  .mfp-preloader a:hover {

    color: #FFF;

  }



  .mfp-s-ready .mfp-preloader {

    display: none;

  }



  .mfp-s-error .mfp-content {

    display: none;

  }



  button.mfp-close,

  button.mfp-arrow {

    overflow: visible;

    cursor: pointer;

    background: transparent;

    border: 0;

    -webkit-appearance: none;

    display: block;

    outline: none;

    padding: 0;

    z-index: 1046;

    box-shadow: none;

    touch-action: manipulation;

  }



  button::-moz-focus-inner {

    padding: 0;

    border: 0;

  }



  .mfp-close {

    width: 44px;

    height: 44px;

    line-height: 44px;

    position: absolute;

    right: 0;

    top: -10px;

    text-decoration: none;

    text-align: center;

    opacity: 0.65;

    padding: 0 0 18px 10px;

    color: #FFF;

    font-style: normal;

    font-size: 28px;

    font-family: 'Poppins', sans-serif;

  }



  .mfp-close:hover,

  .mfp-close:focus {

    opacity: 1;

  }



  .mfp-close:active {

    top: -10px;

  }



  .mfp-close-btn-in .mfp-close {

    color: #333;

  }



  .mfp-image-holder .mfp-close,

  .mfp-iframe-holder .mfp-close {

    color: #FFF;

    right: -6px;

    text-align: right;

    padding-right: 6px;

    width: 100%;

  }



  .mfp-counter {

    position: absolute;

    top: 25px;

    right: 50%;

    left: 50%;

    color: #CCC;

    font-size: 20px;

    line-height: 18px;

    white-space: nowrap;

    font-family: 'Poppins', sans-serif;

    font-weight: 500;

  }



  .mfp-iframe-holder {

    padding-top: 40px;

    padding-bottom: 40px;

  }



  .mfp-iframe-holder .mfp-content {

    line-height: 0;

    width: 100%;

    max-width: 900px;

  }



  .mfp-iframe-holder .mfp-close {

    top: -40px;

  }



  .mfp-iframe-scaler {

    width: 100%;

    height: 0;

    overflow: hidden;

    padding-top: 56.25%;

  }



  .mfp-iframe-scaler iframe {

    position: absolute;

    display: block;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);

    background: #000;

  }



  /* Main image in popup */

  img.mfp-img {

    width: auto;

    max-width: 100%;

    height: auto;

    display: block;

    line-height: 0;

    box-sizing: border-box;

    padding: 40px 0 40px;

    margin: 0 auto;

  }



  /* The shadow behind the image */

  .mfp-figure {

    line-height: 0;

  }



  .mfp-figure:after {

    content: '';

    position: absolute;

    left: 0;

    top: 40px;

    bottom: 40px;

    display: block;

    right: 0;

    width: auto;

    height: auto;

    z-index: -1;

    box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);

    background: #444;

  }



  .mfp-figure small {

    color: #BDBDBD;

    display: block;

    font-size: 12px;

    line-height: 14px;

  }



  .mfp-figure figure {

    margin: 0;

  }



  .mfp-bottom-bar {

    margin-top: -36px;

    position: absolute;

    top: 100%;

    left: 0;

    width: 100%;

    cursor: auto;

  }



  .mfp-title {

    text-align: left;

    line-height: 18px;

    color: #F3F3F3;

    word-wrap: break-word;

    padding-right: 36px;

  }



  .mfp-image-holder .mfp-content {

    max-width: 100%;

  }



  .mfp-gallery .mfp-image-holder .mfp-figure {

    cursor: pointer;

  }



  @media screen and (max-width: 800px) and (orientation: landscape),

  screen and (max-height: 300px) {



    /**

           * Remove all paddings around the image on small screen

           */

    .mfp-img-mobile .mfp-image-holder {

      padding-left: 0;

      padding-right: 0;

    }



    .mfp-img-mobile img.mfp-img {

      padding: 0;

    }



    .mfp-img-mobile .mfp-figure:after {

      top: 0;

      bottom: 0;

    }



    .mfp-img-mobile .mfp-figure small {

      display: inline;

      margin-left: 5px;

    }



    .mfp-img-mobile .mfp-bottom-bar {

      background: rgba(0, 0, 0, 0.6);

      bottom: 0;

      margin: 0;

      top: auto;

      padding: 3px 5px;

      position: fixed;

      box-sizing: border-box;

    }



    .mfp-img-mobile .mfp-bottom-bar:empty {

      padding: 0;

    }



    .mfp-img-mobile .mfp-counter {

      right: 5px;

      top: 3px;

    }



    .mfp-img-mobile .mfp-close {

      top: 0;

      right: 0;

      width: 35px;

      height: 35px;

      line-height: 35px;

      background: rgba(0, 0, 0, 0.6);

      position: fixed;

      text-align: center;

      padding: 0;

    }

  }



  @media all and (max-width: 900px) {

    .mfp-arrow {

      -webkit-transform: scale(0.75);

      transform: scale(0.75);

    }



    .mfp-arrow-left {

      -webkit-transform-origin: 0;

      transform-origin: 0;

    }



    .mfp-arrow-right {

      -webkit-transform-origin: 100%;

      transform-origin: 100%;

    }



    .mfp-container {

      padding-left: 6px;

      padding-right: 6px;

    }

  }



  .magnific-img .image-popup-vertical-fit img a:link {

    text-decoration: none;

    border: solid 2px #000;

  }



  .magnific-img .image-popup-vertical-fit img a:visited {

    text-decoration: none;

    border: solid 2px #000;

  }



  .magnific-img .image-popup-vertical-fit img a:hover {

    text-decoration: none;

    border: solid 2px #000;

  }



  .magnific-img .image-popup-vertical-fit img a:active {

    text-decoration: none;

    color: #000;

    border: solid 2px #000;

  }



  .mfp-figure button.mfp-close {

    cursor: pointer;

  }



  /* .popup-gallery a {

    cursor: -webkit-zoom-in;

    cursor: -moz-zoom-in;

    cursor: zoom-in;

  }

  .mfp-figure figure {

    cursor: -webkit-zoom-out;

    cursor: -moz-zoom-out;

    cursor: zoom-out;

  } */

  .mfp-image-holder .mfp-close,

  .mfp-iframe-holder .mfp-close {

    z-index: 1;

    right: 0 !important;

    font-size: 50px;

    cursor: pointer !important;

  }



  .mfp-image-holder .mfp-close:hover,

  .mfp-iframe-holder .mfp-close:hover {

    color: white;

    border-color: white;

  }



  .mfp-arrow {

    position: absolute;

    opacity: 0.65;

    margin: 0;

    top: 50%;

    margin-top: -55px;

    padding: 0;

    width: 90px;

    height: 110px;

    -webkit-tap-highlight-color: transparent;

  }



  .mfp-arrow:active {

    margin-top: -54px;

  }



  .mfp-arrow:hover,

  .mfp-arrow:focus {

    opacity: 1;

  }



  .mfp-arrow:before,

  .mfp-arrow:after {

    content: '';

    display: block;

    width: 0;

    height: 0;

    position: absolute;

    left: 0;

    top: 0;

    margin-top: 35px;

    margin-left: 35px;

    border: medium inset transparent;

  }



  .mfp-arrow:after {

    border-top-width: 13px;

    border-bottom-width: 13px;

    top: 8px;

  }



  .mfp-arrow:before {

    border-top-width: 21px;

    border-bottom-width: 21px;

    opacity: 0.7;

  }



  .mfp-arrow-left {

    background: url(https://image.flaticon.com/icons/svg/860/860790.svg) no-Repeat top left !important;

    width: 60px;

    height: 60px;

    left: 30px;

  }



  .mfp-arrow-right {

    background: url(https://image.flaticon.com/icons/svg/709/709586.svg) no-Repeat top left !important;

    width: 60px;

    height: 60px;

    right: 30px;

  }



  /* .mfp-arrow-left:after {

      border-right: 17px solid #FFF;

      margin-left: 31px;

    } */

  /* .mfp-arrow-left:before {

      margin-left: 25px;

      border-right: 27px solid #3F3F3F;

    } */

  /* .mfp-arrow-right:after {

      border-left: 17px solid #FFF;

      margin-left: 39px;

    }

    .mfp-arrow-right:before {

      border-left: 27px solid #3F3F3F;

    } */



  /*====================================================

    21. MASONRY GALLERY. 

  ====================================================*/

    /* ---- isotope ---- */

    /* .grid {

      background: #DDD;

    } */

    /* clear fix */

    .grid:after {

      content: '';

      display: block;

      clear: both;

    }



    /* ---- .grid-item ---- */

    .grid-sizer,

    .grid-item {

      width: 33.333%;



    }



    .grid-item {

      float: left;

    }



    .grid-item img {

      display: block;

      max-width: 100%;

    }



    @media (max-width:992px) {



      .grid-sizer,

      .grid-item {

        width: 50%;

      }

    }

  /*====================================================

    22. CAROUSEL #1. 

  ====================================================*/

  .custom-carousel {

    position: relative;

  }



  .custom-carousel .owl-theme .custom-nav {

    position: absolute;

    top: 35%;

    left: -4%;

    right: -4%;

    z-index: 1;

  }



  .custom-carousel .owl-theme .custom-nav .owl-prev {

    left: 0;

  }



  .custom-carousel .owl-theme .custom-nav .owl-next {

    right: 0;

  }



  .custom-carousel .owl-theme .custom-nav .owl-prev,

  .custom-carousel .owl-theme .custom-nav .owl-next {

    position: absolute;

    width: 30px;

    height: 30px;

    color: inherit;

    background: none;

    border: none;

    z-index: 100;

    background-color: #db7d00;

    border-radius: 0px;

    padding: 6px 10px;

  }



  .custom-carousel .owl-theme .custom-nav .owl-prev:focus,

  .custom-carousel .owl-theme .custom-nav .owl-next:focus {

    border: none;

    outline: 0;

    box-shadow: none;

  }



  .custom-carousel .owl-theme .custom-nav .owl-prev i,

  .custom-carousel .owl-theme .custom-nav .owl-next i {

    font-size: 18px;

    color: #FFF;

  }



  .custom-carousel .owl-carousel .item .more-rooms {

    margin: 0rem 1rem;

  }



  .custom-carousel .owl-dots {

    text-align: center;

    margin-top: 25px;

  }



  .custom-carousel .owl-dots button.owl-dot {

    width: 12px;

    height: 12px;

    border-radius: 50%;

    display: inline-block;

    background: #ccc;

    margin: 0 3px;

    box-shadow: none;

    border: none;

  }



  .custom-carousel .owl-dots button.owl-dot.active {

    background-color: #000;

    width: 20px;

    border-radius: 25px;

  }



  .custom-carousel .owl-dots button.owl-dot:focus {

    outline: none;

  }



  /*====================================================

    21. CAROUSEL #2. 

  ====================================================*/

  .custom-carousel2 {

    position: relative;

  }



  .custom-carousel2 .owl-theme .custom-nav {

    position: absolute;

    bottom: -20px;

    right: 50%;

    left: 50%;

    z-index: 1;

  }



  .custom-carousel2 .owl-theme .custom-nav .owl-prev {

    right: 50%;

    margin: 2px

  }



  .custom-carousel2 .owl-theme .custom-nav .owl-next {

    left: 50%;

    margin: 2px

  }



  .custom-carousel2 .owl-theme .custom-nav .owl-prev,

  .custom-carousel2 .owl-theme .custom-nav .owl-next {

    position: absolute;

    width: 40px;

    height: 40px;

    color: inherit;

    background: none;

    border: solid 1px var(--main-green-color);

    z-index: 100;

    background-color: var(--main-green-color);

    border-radius: 50%;

    padding: 6px 10px;

    margin: 0px 5px;

    transition: 0.4s;

    line-height: 30px;

  }



  .custom-carousel2 .owl-theme .custom-nav .owl-prev:hover,

  .custom-carousel2 .owl-theme .custom-nav .owl-next:hover {

    border: solid 1px var(--main-yellow-color);

    background-color: var(--main-yellow-color);

    line-height: 30px;



  }



  .custom-carousel2 .owl-theme .custom-nav .owl-prev:focus,

  .custom-carousel2 .owl-theme .custom-nav .owl-next:focus {

    border: none;

    outline: 0;

    box-shadow: none;

    line-height: 27px;

  }



  .custom-carousel2 .owl-theme .custom-nav .owl-prev i,

  .custom-carousel2 .owl-theme .custom-nav .owl-next i {

    font-size: 20px;

    color: #FFF;

    line-height: 27px;

   

  }



  .custom-carousel2 .owl-carousel .item .more-rooms {

    margin: 0rem 1rem;

  }



  .custom-carousel2 .owl-dots {

    text-align: center;

    margin-top: 25px;

  }



  .custom-carousel2 .owl-dots button.owl-dot {

    width: 12px;

    height: 12px;

    border-radius: 50%;

    display: inline-block;

    background: #ccc;

    margin: 0 3px;

    box-shadow: none;

    border: none;

  }



  .custom-carousel2 .owl-dots button.owl-dot.active {

    background-color: #000;

    width: 20px;

    border-radius: 25px;

  }



  .custom-carousel2 .owl-dots button.owl-dot:focus {

    outline: none;

  }



  /*====================================================

    23. CAROUSEL #3. 

  ====================================================*/

  .carousel-parallax {

    background-image: url("../images/common/ag-pic-7.jpg");

    height: 600px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



  .custom-carousel3 {

    position: relative;

  }



  .custom-carousel3 .owl-theme .custom-nav {

    position: absolute;

    top: 45%;

    left: 2rem;

    right: 2rem;

    z-index: 1;

  }



  .custom-carousel3 .owl-theme .custom-nav .owl-prev {

    left: 0;

  }



  .custom-carousel3 .owl-theme .custom-nav .owl-next {

    right: 0;

  }



  .custom-carousel3 .owl-theme .custom-nav .owl-prev,

  .custom-carousel3 .owl-theme .custom-nav .owl-next {

    position: absolute;

    width: 40px;

    height: 40px;

    color: inherit;

    background: none;

    border: none;

    z-index: 100;

    background-color: transparent;

    border-radius: 50%;

    padding: 6px 10px;

    border: solid 1px var(--main-yellow-color);

    transition: 0.4s;

  }



  .custom-carousel3 .owl-theme .custom-nav .owl-prev:focus,

  .custom-carousel3 .owl-theme .custom-nav .owl-next:focus {

    border: solid 1px var(--main-yellow-color);

    outline: 0;

    box-shadow: none;

  }



  .custom-carousel3 .owl-theme .custom-nav .owl-prev:hover,

  .custom-carousel3 .owl-theme .custom-nav .owl-next:hover {

    position: absolute;

    background-color: var(--main-yellow-color);

  }



  .custom-carousel3 .owl-theme .custom-nav .owl-prev i,

  .custom-carousel3 .owl-theme .custom-nav .owl-next i {

    font-size: 18px;

    color: var(--main-yellow-color);

  }



  .custom-carousel3 .owl-theme .custom-nav .owl-prev:hover i,

  .custom-carousel3 .owl-theme .custom-nav .owl-next:hover i {

    color: var(--main-dark-color);

  }



  .custom-carousel3 .owl-carousel .item .more-rooms {

    margin: 0rem 1rem;

  }



  .custom-carousel3 .owl-dots {

    text-align: center;

    margin-top: 25px;

  }



  .custom-carousel3 .owl-dots button.owl-dot {

    width: 12px;

    height: 12px;

    border-radius: 50%;

    display: inline-block;

    background: #ccc;

    margin: 0 3px;

    box-shadow: none;

    border: none;

  }



  .custom-carousel .owl-dots button.owl-dot.active {

    background-color: #000;

    width: 20px;

    border-radius: 25px;

  }



  .custom-carousel3 .owl-dots button.owl-dot:focus {

    outline: none;

  }



  /* .thumbnail-img{

    height: 500px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

}

.thumbnail-img img{

    width: 100%;

} */

  .item-content-layer {

    height: 600px;

    background-color: #FAFAFA;

    position: relative;

  }



  .item-caption {

    margin: 0;

    position: absolute;

    top: 50%;

    -ms-transform: translateY(-50%);

    transform: translateY(-50%);

    padding: 0rem 15rem 0rem 8rem;

  }



  .item-caption p strong {

    font-weight: bold;

    text-transform: uppercase;

  }



  .item-caption h5 {

    font-size: 14px;

    font-weight: bold;

    text-transform: uppercase;

    margin-top: 2rem;

  }



  .item-caption h5 a {

    color: var(--main-green-color);

    transition: 0.4s;

  }



  .item-caption h5 a:hover {

    color: var(--main-yellow-color);

  }



  .item-caption h5::after {

    font-family: "Font Awesome 5 Free";

    font-weight: 900;

    content: "\f30b";

    margin-left: 10px;

  }



  /*====================================================

    24. CAREERS. 

  ====================================================*/

.careers-info h5 {

  color: #A3B0B4;

  font-size: 14px;

  text-transform: uppercase;

  font-weight: bold;

}



.careers-info h2 {

  font-weight: 900;

  margin-bottom: 1rem;

  line-height: 1.2;

}



.careers-info p strong {

  font-weight: 600;

  font-style: italic;

}



.careers-pic img {

  width: 100%;

  outline: 1px solid #FFF;

  outline-offset: -20px;

}



.careers-parallax-alt {

  background-image: url("../images/common/ag-pic-21.jpg");

  height: 100%;

  background-attachment: fixed;

  background-position: center;

  background-repeat: no-repeat;

  background-size: cover;

  position: relative;

  padding: 5rem 0rem;

}



.careers-parallax-alt:before {

  content: '';

  position: absolute;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  background-image: linear-gradient(to bottom right, #3E755F, #3E755F);

  opacity: 0.8;

}



.benefits-box {

  color: #FFF !important;

  text-align: center;

  padding: 2rem 1.5rem;

  transition: 0.3s;

  margin: 2rem 0rem;

}



.benefits-box:hover {

  background-color: rgba(0, 0, 0, 0.3);

  cursor: pointer;

}



.benefits-box h4 {

  color: #FFF;

  font-weight: 600;

  margin: 15px 0px;

}



.benefits-box p {

  color: #FFF;

  margin-bottom: 0px;

}



.benefit-icon {

  width: 60px;

  margin: auto;

}



.benefit-icon img {

  width: 100%;

}



.position-description {

  float: left;

  text-align: left;

}



.position-description h3 {

  margin-bottom: 5px;

  font-weight: 700;

  font-size: 1.3rem;

}



.position-description p {

  font-size: 14px;

  color: #8c8c8c;

  margin-bottom: 0px;

}



.position-description p .fas {

  color: #0E377B;

}



.job-list {

  border-radius: 5px;

  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;

  padding: 2.5rem;

}



.job-list .list {

  border-bottom: solid 1px rgba(204, 204, 204, 0.3);

  padding-bottom: 2.5rem;

  margin-bottom: 2.5rem;

}



.job-list .last-post {

  border-bottom: none;

  padding-bottom: 0rem;

  margin-bottom: 0rem;

}



.job-list ul {

  padding: 0px;

}



.job-list ul li {

  list-style: none;

}



.position-btn {

  text-align: right;

  float: right;

  padding-top: 10px;

}



/*====================================================

  25. PRICING TABLE. 

====================================================*/

.pricing-box .list-group-flush {

  border: none;

  margin: 1rem 0rem 1.5rem !important;

}



.pricing-box .list-group-flush .list-group-item {

  font-size: 14px;

  font-family: 'Open Sans', sans-serif;

  color: var(--main-text-color);

  font-weight: 400;

  line-height: 15px;

}



a {

  -webkit-transition: all 0.2s;

  -moz-transition: all 0.2s;

  transition: all 0.2s;

}



.card-block .btn {

  text-transform: uppercase;

  font-weight: 600;

}



.btn-outline-signin {

  border: 1px solid #e1e8ee;

}



.btn-start {

  background: #fd4d66;

  color: #fff;

  padding: 0.8rem;

  width: 100%;

  margin: 0 auto;

}



.btn-start:hover,

.btn-start:focus {

  color: #fff;

}



.btn-outline-start {

  background: #fff;

  border: 1px solid #fddbe4;

  color: #fd4d66;

  padding: 0.8rem;

  width: 100%;

  margin: 0 auto;

}



.btn-outline-start:hover,

.btn-outline-start:focus {

  color: #fd4d66;

}



section.pricing-plans {

  background: #fff;

  padding: 8rem 0;

}



.pricing-box {

  padding: 2rem 1rem;

  background: #fff;

  border: 1px solid #e1e8ee;

}



.pricing-box .card-title {

  font-size: 1rem;

  line-height: 2;

  font-weight: 700;

  color: var(--main-green-color);

}



.pricing-box .currency {

  top: -1.50rem;

  font-size: 1.50rem;

  letter-spacing: 0.75rem;

  margin-right: -1.5rem;

}



.pricing-box .amount {

  font-size: 3.8rem;

  font-family: 'Open Sans', sans-serif;

  font-weight: 600;

}



.pricing-box .month {

  color: #a1a2ac;

  margin-left: -0.8rem;

}



.pricing-box .list-group {

  margin-bottom: 1rem;

}



.pricing-box .list-group-item {

  padding: 0.45rem 1rem;

  border: none;

}



.pricing-premium {

  position: relative;

  z-index: 1;

  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .09);

  -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, .09);

  box-shadow: 0 5px 10px rgba(0, 0, 0, .09);

}



@media (max-width: 768px) {

  .pricing-box {

    margin-bottom: 1rem;

  }

  .sb-caption iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  border: 0;
  max-width: 100%;
}


}



@media (min-width: 768px) {

  .pricing-premium {

    -webkit-transform: scale(1.05);

    -moz-transform: scale(1.05);

    transform: scale(1.05);

  }

}



  /*====================================================

    26. HOME PAGE ONE. 

  ====================================================*/

  .ag-home-about {

    padding-top: 2rem;

  }



  .ag-home-about h5 {

    color: #A3B0B4;

    font-size: 14px;

    text-transform: uppercase;

    font-weight: bold;

  }



  .ag-home-about h2 {

    font-weight: 900;

    text-transform: none;

    margin-bottom: 1.5rem;

    text-transform: uppercase;

  }



  .ag-home-about p {

    font-size: 16px;

  }



  .ag-home-about p strong {

    font-weight: 600;

    font-style: italic;

  }



  .ag-home-about-img {

    position: relative;

  }



  .banner-layer {

    position: absolute;

    bottom: 0;

    right: 0;

    padding: 12px 25px;

    background-color: var(--main-yellow-color);

  }



  .banner-layer h3 {

    font-weight: 700;

    font-family: 'Open Sans', sans-serif;

    margin-bottom: 0px;

    font-size: 18px;

  }



  .banner-layer .light-text {

    font-weight: 400;

    text-transform: uppercase;

  }



  .bullets h4 {

    font-size: 18px;

    font-weight: 700;

    margin: 1.5rem 0rem 1rem;

    text-transform: uppercase;

  }



  .bullets ul {

    display: inline-block;

  }



  .bullets ul.left-list {

    margin-right: 60px;

  }



  .bullets ul li {

    list-style: none;

    font-family: 'Open Sans', sans-serif;

    color: var(--main-text-color);

    font-weight: 400;

    font-size: 15px;

    line-height: 2;

    font-style: italic;

  }



  .bullets ul li::before {

    font-family: "Font Awesome 5 Free";

    font-weight: 900;

    content: "\f14a";

    margin-right: 15px;

    color: var(--main-green-color);

  }



  .section-btn {

    margin-top: 1rem;

  }



  .counter-wrapper {

    height: auto;

    background-color: var(--main-yellow-color);

    margin-top: -80px;

    position: relative;

    z-index: -1;

    padding: 6.5rem 2rem 4rem;

  }



  .counter-inner-box {

    display: inline-block;

    padding: 10px;

    margin: 0px 30px;

  }



  .counter-inner-box .media .mr-3 {

    width: 55px;

  }



  .counter-inner-box .media .media-body {

    padding: 0px;

  }



  .counter-inner-box .media .media-body .counter {

    font-weight: bold;

    font-size: 2rem;

    margin-bottom: 0px;

    margin-top: -7px;

    color: var(--main-dark-color);

    font-family: 'Open Sans', sans-serif;

  }



  .counter-inner-box .media .media-body p {

    font-weight: 600;

    color: #FFF;

    font-size: 14px;

    margin-top: -8px;

  }



  .wide-slider-layer {

    position: relative;

  }



  .wide-slider-layer .owl-theme .custom-nav {

    position: absolute;

    bottom: 30px;

    right: 30px;

    z-index: 1;

  }



  .wide-slider-layer .owl-theme .custom-nav .owl-prev,

  .wide-slider-layer .owl-theme .custom-nav .owl-next {

    position: absolute;

    width: 30px;

    height: 30px;

    color: inherit;

    background: none;

    border: none;

    z-index: 100;

    background-color: #FFFF;

    border-radius: 0px;

    padding: 6px 10px;

    z-index: 1;

  }



  .wide-slider-layer .owl-theme .custom-nav .owl-prev:hover,

  .wide-slider-layer .owl-theme .custom-nav .owl-next:hover {

    position: absolute;

    background-color: #FFFF;

  }



  .wide-slider-layer .owl-theme .custom-nav .owl-prev:focus,

  .wide-slider-layer .owl-theme .custom-nav .owl-next:focus {

    border: none;

    outline: 0;

    box-shadow: none;

  }



  .wide-slider-layer .owl-theme .custom-nav .owl-prev i,

  .wide-slider-layer .owl-theme .custom-nav .owl-next i {

    font-size: 18px;

    color: #333;

  }



  .wide-slider-layer .owl-theme .custom-nav .owl-prev {

    right: 0;

  }



  .wide-slider-layer .owl-theme .custom-nav .owl-next {

    left: 0;

  }



  .owl-dots {

    text-align: center;

    margin-top: 25px;

  }



  .owl-dots button.owl-dot {

    width: 12px;

    height: 12px;

    border-radius: 50%;

    display: inline-block;

    background: #ccc;

    margin: 0 3px;

  }



  .owl-dots button.owl-dot.active {

    background-color: #000;

    width: 20px;

    border-radius: 25px;

  }



  .owl-dots button.owl-dot:focus {

    outline: none;

  }



  .wide-slider-layer-alt-2 {

    position: relative;

  }



  .wide-slider-layer-alt-2 .owl-theme .custom-nav {

    position: absolute;

    bottom: 30px;

    right: 30px;

    z-index: 1;

  }



  .wide-slider-layer-alt-2 .owl-theme .custom-nav .owl-prev,

  .wide-slider-layer-alt-2 .owl-theme .custom-nav .owl-next {

    position: absolute;

    width: 30px;

    height: 30px;

    color: inherit;

    background: none;

    border: none;

    z-index: 100;

    background-color: #FFFF;

    border-radius: 0px;

    padding: 6px 10px;

    z-index: 1;

  }



  .wide-slider-layer-alt-2 .owl-theme .custom-nav .owl-prev:hover,

  .wide-slider-layer-alt-2 .owl-theme .custom-nav .owl-next:hover {

    position: absolute;

    background-color: #FFFF;

  }



  .wide-slider-layer-alt-2 .owl-theme .custom-nav .owl-prev:focus,

  .wide-slider-layer-alt-2 .owl-theme .custom-nav .owl-next:focus {

    border: none;

    outline: 0;

    box-shadow: none;

  }



  .wide-slider-layer-alt-2 .owl-theme .custom-nav .owl-prev i,

  .wide-slider-layer-alt-2 .owl-theme .custom-nav .owl-next i {

    font-size: 18px;

    color: #333;

  }



  .wide-slider-layer-alt-2 .owl-theme .custom-nav .owl-prev {

    right: 0;

  }



  .wide-slider-layer-alt-2 .owl-theme .custom-nav .owl-next {

    left: 0;

  }



  .owl-dots {

    text-align: center;

    margin-top: 25px;

  }



  .owl-dots button.owl-dot {

    width: 12px;

    height: 12px;

    border-radius: 50%;

    display: inline-block;

    background: #ccc;

    margin: 0 3px;

  }



  .owl-dots button.owl-dot.active {

    background-color: #000;

    width: 20px;

    border-radius: 25px;

  }



  .owl-dots button.owl-dot:focus {

    outline: none;

  }



  .carousel-left-layer {

    background-color: #f5f5f5;

  }



  .carousel-content {

    margin: 0;

    position: absolute;

    top: 50%;

    -ms-transform: translateY(-50%);

    transform: translateY(-50%);

    padding: 0rem 5rem;

  }



  .carousel-content h2 {

    font-weight: 700;

  }



  .carousel-content h5 {

    font-size: 12px;

    text-transform: uppercase;

    letter-spacing: 1.5px;

  }



  .carousel-content p {

    line-height: 1.5;

    margin: 1rem 0rem;

  }



  .carousel-content h6 {

    font-size: 14px;

    font-weight: 600;

    margin-top: 2rem;

    color: var(--main-yellow-color);

  }



  .carousel-content h6 a {

    color: var(--main-dark-color);

    transition: 0.4s;

  }



  .carousel-content h6 a:hover {

    color: var(--main-green-color);

  }



  .carousel-bg {

    background-image: url("../images/common/ag-two-research.jpg");

    height: 600px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



  .carousel-bg-2 {

    background-image: url("../images/common/ag-pic-23.jpg");

    height: 600px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



  .carousel-bg-3 {

    background-image: url("../images/common/ag-pic-24.jpg");

    height: 600px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



  .carousel-bg-4 {

    background-image: url("../images/common/ag-pic-25.jpg");

    height: 600px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



  .grid-box-content {

    margin: 0;

    position: absolute;

    top: 50%;

    -ms-transform: translateY(-50%);

    transform: translateY(-50%);

  }



  .grid-box-layer {

    margin: 2rem 0rem;

    padding-right: 5rem

  }



  .grid-box-layer h4 {

    font-weight: 700;

  }



  .grid-box-layer .media .mr-3{

    width: 60px;

  }



  .grid-box-layer .media .media-body p{

    margin-top: -5px;

  }



  .masonry-left-layer {

    padding-right: 2rem;

  }



  .masonry-right-layer {

    padding-left: 2rem;

  }



  .masonry-left-layer .ml-caption {

    margin-bottom: 2rem;

    text-align: justify;

  }



  .masonry-right-layer .ml-caption {

    margin-top: 2rem;

  }



  .ml-caption h3 {

    font-weight: 900;

    text-transform: uppercase;

    margin-top: 27px;

  }



  .carousel-parallax2 {

    background-image: url("../images/common/ag-pic-18.jpg");

    height: 100%;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

    padding: 0rem 0rem 8rem;

    height: 731px;

  }



  .cp-title {

    text-align: center;

    margin-bottom: 3rem;

    position: relative;

    z-index: 1;

  }



  .cp-title h5 {

    font-size: 14px;

    text-transform: uppercase;

    color: #A3B0B4;

    font-weight: 600;

  }



  .cp-title h5::before {

    content: "---";

    margin-right: 10px;

  }



  .cp-title h5::after {

    content: "---";

    margin-left: 10px;

  }



  .thumbnail-box {

    box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);

    margin: 0px 10px 10px 10px;

  }



  .thumbnail-box-caption {

    background-color: #F5F5F5;

    padding: 2rem 1.5rem;

  }



  .thumbnail-box-caption h3 {

    color: #333;

    font-size: 20px;

    font-weight: 900;

  }



  .thumbnail-box-caption h5 {

    font-size: 13px;

    font-weight: 600;

    text-transform: uppercase;

  }



  .thumbnail-box-caption h5 a {

    color: #e7cc00;

    transition: 0.4s;

  }



  .thumbnail-box-caption h5 a:hover {

    color: var(--main-dark-color);

  }



  .thumbnail-box-caption h5::after {

    font-family: "Font Awesome 5 Free";

    font-weight: 900;

    content: "\f30b";

    margin-left: 10px;

  }



  .thumbnail-box-caption p {

    color: #333;

  }



  .feauture-wide-section {

    position: relative;

  }



  .feature-bg-img {

    background-image: url("http://via.placeholder.com/1920x600");

    height: 500px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



  .feauture-bottom-layer {

    height: 500px;

    background-color: #333;

  }



  .feature-content-layer {

    position: absolute;

    width: 800px;

    height: 400px;

    background-color: green;

    top: 20%;

    right: 10%;

    z-index: 1;

  }



  .ws-feature-left {

    background-image: url("../images/common/ag-pic-6.jpg");

    height: 600px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

    z-index: 1;

  }



  .ws-feature-right {

   background-image: url(../images/common/vector-bg-1.jpg);

    height: 100%;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

    margin-top: -77px;

    margin-left: -2px;

    margin-right: -113px;

  }



  .ws-feature-right:before {

    content: '';

    position: absolute;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    background-color: var(--main-dark-color);

    opacity: 0.95;

  }



  .feature-right-content {

    margin: 0;

    position: absolute;

    top: 50%;

    -ms-transform: translateY(-50%);

    transform: translateY(-50%);

    width: 80%;

    padding-left: 10rem;

  }



  .feature-right-content h1,

  .feature-right-content p {

    color: #FFF;

  }



  .feature-right-content .media .media-body h4{

    font-weight: 700;

  }



  .feature-right-content .media .media-body p{

    color: #d9d9d9;

  }



  .ag-top-parallax {

    background-image: url("../images/common/ag-pic-17.jpg");

    height: 400px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



 .ag-top-parallax:before {

    content: '';

    position: absolute;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    background-image: linear-gradient(to bottom right, #000, #000);

    opacity: 0.4;

  }



  .ag-bottom-parallax {

    background-image: url("../images/common/background-image.jpg");

    height: 600px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



  .ag-top-content {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    text-align: center;

  }



  .ag-top-content h3 {

    color: #FFF;

    font-weight: 900;

    text-transform: uppercase;

  }



  .ag-top-content p {

    color: #FFF;

    font-size: 17px;

  }



  .contact-box-alt {

    width: 450px;

    box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);

    background-color: #FFF;

    padding: 2rem;

    margin-top: 40px;

  }



  .contact-box-alt .form-group {

    margin: 15px 0px;

  }



  .contact-box-alt h4 {

    font-weight: 900;



  }



  .fc-custom {

    display: block;

    width: 100%;

    height: calc(1.5rem + 0.75rem + 2px);

    padding: 0.375rem 0.75rem;

    font-size: 12px;

    font-family: 'Open Sans', sans-serif;

    color: var(--main-text-color);

    font-weight: 400;

    line-height: 1.5;

    background-color: #fff;

    background-clip: padding-box;

    border: 1px solid #ced4da;

    border-radius: 0px;

    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;

  }



  .fc-custom:focus {

    color: #495057;

    background-color: #fff;

    border-color: #ced4da;

    outline: 0;

    box-shadow: none;

  }



  .contact-btn {

    width: 100%;

  }



  .contact-box-alt-info {

    position: relative;

    margin-left: 2rem;

    margin-top: 2rem;

  }



  .contact-box-alt-info .media {

    margin-right: 17px;

    width: 33%;

  }



  .contact-box-alt-info .media .fas {

    font-size: 1.5rem;

    margin-right: 7px;

    color: var(--main-green-color);

    margin-top: 14px;

  }



  .contact-box-alt-info .media .media-body h5 {

    color: rgb(255, 255, 255);

    font-size: 16px;

    font-weight: 800;

    margin-bottom: 22px;

    text-transform: uppercase;

    margin-top: 19px;

  }



  .contact-box-alt-info .media .media-body p {

    font-size: 15px;

    line-height: 1.4;

    color: white;

    font-weight: 800;

    margin-top: 0px;

  }





  /*====================================================

    27. HOME PAGE TWO. 

    ====================================================*/

  .ag-carousel {

    position: relative;

  }



  .ag-carousel .owl-carousel .item {

    height: 670px;

    position: relative;

  }



  .ag-carousel .owl-theme .custom-nav {

    position: absolute;

    bottom: 100px;

    right: 100px;

    z-index: 1;

  }



  .ag-carousel .owl-theme .custom-nav .owl-prev,

  .ag-carousel .owl-theme .custom-nav .owl-next {

    position: absolute;

    width: 40px;

    height: 40px;

    color: inherit;

    background: none;

    border: none;

    z-index: 100;

    background-color: transparent;

    padding: 6px 10px;

    border: solid 1px #FFF;

    transition: 0.4s;

    z-index: 1;

  }



  .ag-carousel .owl-theme .custom-nav .owl-prev:hover,

  .ag-carousel .owl-theme .custom-nav .owl-next:hover {

    position: absolute;

    background-color: #FFFF;

  }



  .ag-carousel .owl-theme .custom-nav .owl-prev:focus,

  .ag-carousel .owl-theme .custom-nav .owl-next:focus {

    border: none;

    outline: 0;

    box-shadow: none;

    border: solid 1px #FFF;

  }



  .ag-carousel .owl-theme .custom-nav .owl-prev i,

  .ag-carousel .owl-theme .custom-nav .owl-next i {

    font-size: 20px;

    color: #FFF;

    line-height: 28px;

    transition: 0.4s;

  }



  .ag-carousel .owl-theme .custom-nav .owl-prev:hover i,

  .ag-carousel .owl-theme .custom-nav .owl-next:hover i {

    color: #333;

  }



  .ag-carousel .owl-theme .custom-nav .owl-prev {

    right: 0;

  }



  .ag-carousel .owl-theme .custom-nav .owl-next {

    left: 0;

  }



  .ag-carousel .owl-dots {

    position: relative;

    text-align: center;

    margin-top: -70px;

    z-index: 5;

  }



  .ag-carousel .owl-dots button.owl-dot {

    width: 20px;

    height: 20px;

    border-radius: 50%;

    display: inline-block;

    background: transparent;

    margin: 0px 3px;

    box-shadow: none;

    border: solid 2px #FFF;

  }



  .ag-carousel .owl-dots button.owl-dot.active {

    background-color: var(--main-yellow-color);

    width: 20px;

    border-radius: 50%;

    border: solid 2px var(--main-yellow-color);

  }



  .ag-carousel .owl-dots button.owl-dot:focus {

    outline: none;

  }



  .ag-carousel .item {

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



  .ag-carousel .item:before {

    content: '';

    position: absolute;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    background: rgba(0, 0, 0, 0.4);

  }



  .wc-content-layer-alt {

    position: absolute;

    top: 60% !important;

  }



  .front-parallax {

    background-image: url("../images/common/ag-pic-10.jpg");

    /* min-height: 100%; */

    height: 400px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



  .front-parallax:before {

    content: '';

    position: absolute;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    background-image: linear-gradient(to bottom right, #000, #000);

    opacity: 0.7;

  }



  .fp-contact {

    background-color: #333;

    padding: 3rem 2rem 4rem;

    margin-top: -77px

  }

.fp-contact h3{

  color: white;

}



.fp-contact p{

  color: white;

}

  .front-parallax p {

    color: #FFF !important;

    font-size: 14px;

    margin-bottom: 5px

  }



  .front-parallax h3 {

    color: #FFF;

    font-weight: bold;

  }



  .contact-form {

    margin-top: 2.5rem;

  }



  .contact-form .form-group {

    margin: 1rem 0rem;

  }



  .custom-form {

    display: block;

    width: 100%;

    height: calc(1.5em + 0.75rem + 2px);

    padding: 0.375rem 0rem;

    font-size: 14px;

    font-weight: 400;

    line-height: 1.5;

    color: #595959;

    background-color: transparent;

    background-clip: padding-box;

    border: none;

    border-bottom: solid 1px #595959;

    border-radius: 0px;

    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;

    font-family: 'Open Sans', sans-serif;

  }



  .custom-form:-moz-focusring {

    color: transparent;

    text-shadow: 0 0 0 #495057;

  }



  .custom-form:focus {

    color: #595959;

    background-color: transparent !important;

    border-color: #FFF;

    outline: 0;

    box-shadow: none;

  }



  .custom-form::-webkit-input-placeholder {

    color: #6c757d;

    opacity: 1;

  }



  .btn-contact {

    margin-top: 1rem;

  }



  .btn-contact .button {

    float: right;

  }



  .fp-testiminial {

    padding: 4rem 2rem 4rem;

  }



  .testimonials-content {

    background: rgba(255, 196, 4, 0.575);

    padding: 2rem;

    border-radius: 5px;

    width: 553px;

  }



  .testimonials-content p {

    color: #FFF;

    font-size: 16px;

    margin-bottom: 0px;

    font-style: italic;

  }



  .testimonials-content p::before {

    font-family: "Font Awesome 5 Free";

    font-weight: 900;

    content: "\f10d";

    font-size: 30px;

    margin-right: 15px;

    color: var(--main-yellow-color);

  }



  .author-info {

    margin-top: 1.5rem;

  }



  .author-info .media .mr-3 {

    width: 50px;

    border-radius: 50%;

  }



  .author-info .media .media-body h5 {

    color: #FFF;

    font-size: 18px;

    margin-bottom: 0px;

  }



  .author-info .media .media-body p {

    color: var(--main-yellow-color);

    font-size: 13px;

    margin-bottom: 0px;

    text-transform: uppercase;

  }



  .testimonial-carousel-alt {

    position: relative;

  }



  .testimonial-carousel-alt .item {

    margin: 0px 10px;

  }



  .testimonial-carousel-alt .owl-theme .custom-nav {

    position: absolute;

    bottom: 30px;

    right: 30px;

    z-index: 1;

  }



  .testimonial-carousel-alt .owl-theme .custom-nav .owl-prev,

  .testimonial-carousel-alt .owl-theme .custom-nav .owl-next {

    position: absolute;

    width: 30px;

    height: 30px;

    color: inherit;

    background: none;

    border: none;

    z-index: 100;

    background-color: #FFFF;

    border-radius: 0px;

    padding: 6px 10px;

    z-index: 1;

  }



  .testimonial-carousel-alt .owl-theme .custom-nav .owl-prev:hover,

  .testimonial-carousel-alt .owl-theme .custom-nav .owl-next:hover {

    position: absolute;

    background-color: #FFFF;

  }



  .testimonial-carousel-alt .owl-theme .custom-nav .owl-prev:focus,

  .testimonial-carousel-alt .owl-theme .custom-nav .owl-next:focus {

    border: none;

    outline: 0;

    box-shadow: none;

  }



  .testimonial-carousel-alt .owl-theme .custom-nav .owl-prev i,

  .testimonial-carousel-alt .owl-theme .custom-nav .owl-next i {

    font-size: 18px;

    color: #333;

  }



  .testimonial-carousel-alt .owl-theme .custom-nav .owl-prev {

    right: 0;

  }



  .testimonial-carousel-alt .owl-theme .custom-nav .owl-next {

    left: 0;

  }



  .testimonial-carousel-alt .owl-dots {

    text-align: center;

    margin-top: 5px;

  }



  .testimonial-carousel-alt .owl-dots button.owl-dot {

    width: 15px;

    height: 15px;

    border-radius: 50%;

    display: inline-block;

    background: transparent;

    margin: 0px 3px;

    box-shadow: none;

    border: solid 2px #FFF;

  }



  .testimonial-carousel-alt .owl-dots button.owl-dot.active {

    background-color: var(--main-yellow-color);

    width: 15px;

    border-radius: 50%;

    border: solid 2px var(--main-yellow-color);

  }



  .testimonial-carousel-alt .owl-dots button.owl-dot:focus {

    outline: none;

  }



  .home-about-alt h5 {

    color: #A3B0B4;

    font-size: 14px;

    text-transform: uppercase;

    font-weight: bold;

  }



  .home-about-alt h2 {

    font-weight: 900;

    text-transform: none;

    margin-bottom: 1.5rem;

    text-transform: uppercase;

  }



  .home-about-alt p {

    font-size: 16px;

    text-align: justify;

  }



  .home-about-alt p strong {

    font-weight: 600;

    font-style: italic;

  }



  .home-about-alt .counter-inner-box {

    margin: 0px;

    margin-right: 15px;

  }



  .home-about-alt .media-body p {

    color: #333 !important;

  }



  .home-about-img-alt img {

    outline: 3px solid #FFF;

    outline-offset: -20px;

  }



  .popup-parallax {

    background-image: url("../images/common/ag-parallax.jpg");

    height: 600px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

  }



  .popup-parallax:before {

    content: '';

    position: absolute;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    background-image: linear-gradient(to bottom right, #000, #000);

    opacity: 0.7;

  }



  .parallax-content {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    text-align: center;

    padding-top: 2rem;

  }



  .parallax-content h2 {

    color: #FFF;

    text-transform: uppercase;

    margin: 5rem 0rem 1rem !important;

  }



  .parallax-content p {

    color: #FFF;

    font-size: 16px;

    margin: 1.5rem 0rem 2rem !important;

  }



  .map-container {

    padding: 1rem 0rem;

    position: relative;

    display: inline-block;

    margin: auto;

  }



  .map-container img {

    width: 100%;

  }



  .map-container .point {

    cursor: pointer;

    position: absolute;

    width: 15px;

    height: 15px;

    background-color: var(--main-yellow-color);

    ;

    border-radius: 50%;

    transition: all .3s ease;

    will-change: transform, box-shadow;

    transform: translate(-50%, -50%);

    box-shadow: 0 0 0 rgba(238, 195, 68, 0.4);

    animation: pulse 3s infinite;

    font-family: 'Open Sans', sans-serif;

    color: var(--main-text-color);

    font-size: 13px !important;

  }



  .map-container .point:hover {

    animation: none;

    transform: translate(-50%, -50%) scale3D(1.35, 1.35, 1);

    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);

  }



  .map-container .venezuela {

    top: 54%;

    left: 24%;

  }



  .map-container .brasil {

    top: 64%;

    left: 28%;

  }



  .map-container .argentina {

    top: 77%;

    left: 27%;

  }



  .map-container .colombia {

    top: 55%;

    left: 21%;

  }



  .map-container .panama {

    top: 51%;

    left: 18%;

  }



  .map-container .mexico {

    top: 38%;

    left: 12%;

  }



  .map-container .usa {

    top: 26%;

    left: 17%;

  }



  .map-container .arabia {

    top: 40%;

    left: 53%;

  }



  .map-container .turquia {

    top: 31%;

    left: 57%;

  }



  .map-container .rusia {

    top: 16%;

    left: 67%;

  }



  .map-container .china {

    top: 40%;

    left: 72%;

  }



  .map-container .japon {

    top: 34%;

    left: 86%;

  }



  .map-container .australia {

    top: 72%;

    left: 86%;

  }



  @keyframes pulse {

    0% {

      box-shadow: 0 0 0 0 rgba(238, 195, 68, 0.5);

    }



    70% {

      box-shadow: 0 0 0 25px rgba(238, 195, 68, 0);

    }



    100% {

      box-shadow: 0 0 0 0 rgba(238, 195, 68, 0);

    }

  }



  .client-box {

    margin: 1rem;

  }



  .client-icon {

    text-align: center;
    border: 1px solid var(--main-dark-color);
  }



  /*====================================================

    28. HOME PAGE THREE. 

  ====================================================*/

.ag-ws-parallax {

  background-image: url("../images/common/ag-pic-13.jpg");

  height: 100%;

  background-position: center;

  background-repeat: no-repeat;

  background-size: cover;

  position: relative;

  padding: 6rem 0rem 10rem;

}



.ag-ws-parallax:before {

  content: '';

  position: absolute;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  background-color: rgba(0, 0, 0, 0.5);

}



.counter-wrapper-layer {

  position: relative;

  z-index: 1;

  margin-top: 24px;

}



.counter-wrapper-layer .counter-inner-box .media .media-body .counter {

  color: var(--main-yellow-color);

}



.splip-layer {

  margin-top: -250px;

  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);

  background-color: #FFF;

}



.ag-ws-content {

  background-color: #FFF;

  height: 400px;

  position: relative;

}



.ag-ws-inner {

  margin: 0;

  position: absolute;

  top: 55%;

  -ms-transform: translateY(-50%);

  transform: translateY(-50%);

  padding: 0rem 2rem;

}



.ag-ws-inner h5 {

  font-size: 14px;

  color: #A3B0B4;

  text-transform: uppercase;

  font-weight: 600;

}



.ag-ws-inner h3 {

  font-weight: 900;

  text-transform: uppercase;

}



.ag-ws-inner .signature {

  width: 150px;

}



.ag-ws-img {

  background-image: url("../images/common/ag-pic-14.jpg");

  height: 400px;

  background-position: center;

  background-repeat: no-repeat;

  background-size: cover;

  position: relative;

}



.parallax-wide-layer {

  background-image: url("../images/common/background-image-2.jpg");

  height: 100%;

  background-position: center;

  background-repeat: no-repeat;

  background-size: cover;

  position: relative;

  padding: 5rem 0rem;

  height: 600px;

}



.parallax-wide-layer:before {

  content: '';

  position: absolute;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  background-image: linear-gradient(to bottom right, #000, #000);

  opacity: 0.6;

}



.pwl-content {

  position: relative;

  text-align: center;

}



.pwl-content h2 {

  color: #FFF;

  z-index: 2;

}



.pwl-content p {

  color: #FFF;

  z-index: 2;

  font-size: 16px;

  margin-bottom: 1rem;

}



.pwl-popup {

  margin-top: 4rem;

}



.parallax-carousel {

  position: relative;

  margin-top: 20%;

}



.parallax-carousel .owl-theme .item {

  padding: 10px;

}



.parallax-carousel .owl-theme .custom-nav {

  position: absolute;

  top: 37%;

  left: 0%;

  right: 0%;

  z-index: 1;

}



.parallax-carousel .owl-theme .item img {

  width: 100%;

}



.parallax-carousel .owl-theme .custom-nav .owl-prev,

.parallax-carousel .owl-theme .custom-nav .owl-next {

  position: absolute;

  width: 30px;

  height: 30px;

  color: inherit;

  background: none;

  border: none;

  z-index: 100;

  background-color: #333;

  border-radius: 0px;

  padding: 6px 10px;

  display: none;

}



.parallax-carousel .owl-theme .custom-nav .owl-prev:hover,

.parallax-carousel .owl-theme .custom-nav .owl-next:hover {

  position: absolute;

  background-color: #000;

}



.parallax-carousel .owl-theme .custom-nav .owl-prev:focus,

.parallax-carousel .owl-theme .custom-nav .owl-next:focus {

  border: none;

  outline: 0;

  box-shadow: none;

}



.parallax-carousel .owl-theme .custom-nav .owl-prev i,

.parallax-carousel .owl-theme .custom-nav .owl-next i {

  font-size: 18px;

  color: #FFF;

}



.parallax-carousel .owl-theme .custom-nav .owl-prev {

  left: 0;

}



.parallax-carousel .owl-theme .custom-nav .owl-next {

  right: 0;

}



.parallax-carousel .owl-dots {

  text-align: center;

  margin-top: 25px;

  position: relative;

}



.parallax-carousel .owl-dots button.owl-dot {

  width: 12px;

  height: 12px;

  border-radius: 50%;

  display: inline-block;

  background: #ccc;

  margin: 0px 3px;

  box-shadow: none;

  border: none;

}



.parallax-carousel .owl-dots button.owl-dot.active {

  background-color: var(--main-yellow-color);

  width: 20px;

  border-radius: 25px;

}



.parallax-carousel .owl-dots button.owl-dot:focus {

  outline: none;

}



.pwl-icon {

  width: 50px;

}



.pwl-caption {

  text-align: left;

}



.pwl-caption h5 {

  font-weight: 700;

  color: #FFF;

  font-size: 20px;

  margin: 15px 0px 10px;

}



.pwl-caption p {

  font-weight: 300;

  color: #e6e6e6;

}



.cd-h-timeline {

  background: transparent;

}



.text-component {

  z-index: 1 !important;

}



.js .cd-h-timeline__container {

  width: 100%;

}



.js .cd-h-timeline__event-content {

  width: 100%;

  z-index: 1 !important;

}



.js .cd-h-timeline__event-title {

  font-size: 1.5rem;

  font-family: 'Raleway', sans-serif;

  color: var(--main-dark-color);

}



.js .cd-h-timeline__date {

  font-family: 'Open Sans', sans-serif;

  font-size: 1.5rem;

  font-weight: 600;

}



.js .cd-h-timeline__event-date {

  font-family: 'Open Sans', sans-serif;

}



.farm-bg {

  background-image: url("../images/common/farm-bg.jpg");

  height: 600px;

  background-position: center;

  background-repeat: no-repeat;

  background-size: cover;

  position: relative;

}



.testimonials-parallax {

  background-image: url("../images/common/testimonials-parallax.jpg");

  height: 100%;

  background-position: center;

  background-repeat: no-repeat;

  background-size: cover;

  position: relative;

  padding: 5rem 0rem;

  margin-top: -63px;

}



.testimonials-parallax:before {

  content: '';

  position: absolute;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  background-image: linear-gradient(to bottom right, #000, #000);

  opacity: 0.4;

}



.testimonials-parallax .lt-leftside h2 {

  color: #FFF;

}



.testimonials-parallax .lt-leftside h2 .light-text {

  color: var(--main-yellow-color);

}



.testimonials-parallax .lt-rightside p {

  color: #FFF;

  font-style: italic;

}



.clients-carousel .owl-dots {

  display: none;

}



.product-grid {

  display: grid;

  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

  gap: 30px;

  margin-top: 30px;

}



.product-item {

  border: 1px solid #eee;

  border-radius: 6px;

  overflow: hidden;

  background: #f5f5f5;

  box-shadow: 0 2px 6px rgba(0,0,0,0.05);

}



.thumbnail-box-img img {

  width: 100%;

  height: auto;

  display: block;

}



.thumbnail-box-caption {

  padding: 15px;

}



.thumbnail-box-caption h3 {

  margin-top: 0;

  font-size: 18px;

}



.thumbnail-box-caption p {

  font-size: 14px;

  color: #555;

}



.thumbnail-box-caption h5 a {

 

  text-decoration: none;

}



.vae{

  margin-top: 80px;

    background-color: #8b8b26;

    margin-right: 4px;

    margin-left: -26px;

        border-radius: 10px;

}

.vae p{

  margin-left: 10px;

}



.vae h5{

  margin-left: 10px;

}



.background{

  background-color: rgba(255, 255, 0, 0.795);

}





@media (max-width: 768px) {

 .counter-wrapper-layer {

   display: none;

  }

  .parallax-wide-layer {

    height: 1168px;

}

/* .home-about-alt{

  margin-top: -187px;

} */

}



.footer1 i {

        margin-right: 8px; /* Adjust the value as needed */

        

    }



    .footer1 a {

       color: #cccccc;

        

    }





    .pagination-buttons {

    display: flex;

    justify-content: center;

    align-items: center;

    gap: 10px; /* Space between buttons */

    margin-top: 20px;

    flex-wrap: wrap;

}



.pagination-buttons .btn {

    padding: 8px 16px;

    border: 1px solid var(--main-yellow-color);

    background-color: transparent;

    color: var(--main-yellow-color);

    cursor: pointer;

    border-radius: 4px;

    transition: all 0.3s ease;

}



.pagination-buttons .btn:hover {

    background-color: var(--main-yellow-color);

    color: #fff;

}



.pagination-buttons .btn.active {

    background-color:var(--main-yellow-color);

    color: white;

    pointer-events: none;

    font-weight: bold;
}

.partners {
    color: var(--main-dark-color);
    font-size: 18px;
    font-weight: 600;
    margin: 13px 0px;
    text-transform: uppercase;
    text-align: center;
}

.contact{
    font-size: 15px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    line-height: 25px;
    margin-bottom: 0rem;
}

.office{
    font-size: 1rem;
    line-height: 2;
    font-weight: 700;
}

/* Space between the two columns */
.col {
   padding-left: 34px;
  padding-right: 34px;
}


.sb-caption iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  border: 0;
  max-width: 100%;
}


/* Responsive layout for the row */
@media (max-width: 768px) {
  .row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;

    /* Remove default negative margin issue with columns */
    row-gap: 30px; /* Better than gap: 30px */
  }
}

@media (max-width: 375px) {
  .row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;

    row-gap: 25px; /* Tighter spacing for smaller screens */
  }
}



/* Card container */
.card.pricing-box {
  margin-bottom: 30px;
  width: 100%;
}

/* Responsive iframe map */
.sb-caption iframe {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9;
  max-width: 100%;
  border: 0;
}

/* Text alignment on small screens */
@media (max-width: 768px) {
  .sb-caption h6,
  .sb-caption p {
    text-align: left;
  }
}

/* Responsive form layout */
@media (max-width: 768px) {
  .wrapper-form .col-md-6,
  .wrapper-form .col-md-8,
  .wrapper-form .col-md-12 {
    width: 100%;
    padding: 0 10px;
  }

  .alt-2{
      margin-top: -138px;
}

.careers-pic{
  display: none;
}


}

/* Full width for textareas and inputs */
.wrapper-form .form-control {
  width: 100%;
  box-sizing: border-box;
}

/* Button responsiveness */
.btn-contact.button {
  width: 100%;
  padding: 12px;
  font-size: 16px;
}

@media only screen and (max-width: 768px) {
  .list-group-item a {
    color: rgb(214, 214, 3)  !important; /* Change to your desired color */
    font-weight: 600;
  }
}



/* Optional: Adjust text sizes for small screens */
@media (max-width: 480px) {
  .layer-title h2,
  .layer-title p {
    font-size: 18px;
    text-align: center;
  }

  .card-block h4 {
    font-size: 20px;
  }

  .sb-caption h6 {
    font-size: 16px;
  }

  .sb-caption p {
    font-size: 14px;
  }
}

<style>
.blog-feature-img {
    max-width: 100%;
}

.thumb-img {
    cursor: pointer;
    transition: transform 0.2s ease-in-out;
}

.thumb-img:hover {
    transform: scale(1.05);
    box-shadow: 0 0 8px rgba(0,0,0,0.2);
}

@media (max-width: 576px) {
    .thumb-img {
        margin-bottom: 8px;
    }
}
</style>