/*Theme Name: Aventus

  1. >>> Headr Style

  2. >>> Banner Style

  3. >>> Logo Section Style

  4. >>> Coloum Section Style

  5. >>> Two coloum Section Style

  6. >>> Testimonial Section Style

  7. >>> Team Section Style

  8. >>> News Section Style

  9. >>> Conact Section Style

  10. >>> Grow-page Section Style

  11. >>> Footer Section Style*/



  /* A. >>> Blog Entry Styles [Feb 2024] */



:root {

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

  --color-body:#000000;

  --color-black:#000000;

  --color-white:#FFF;

  --color-blue:#AEE8FF;

  --color-yellow:#FBDC6F;

  --bg-blue:#F0FBFF;

  --bg-yellow:#FFF5D0;

  --font-48:4.8rem;

  --font-45:4.5rem;

  --font-40:4rem;

  --font-30:3rem;

  --font-36:3.6rem;

  --font-35:3.5rem;

  --font-24:2.4rem;

  --font-20:2rem;

  --font-18:1.8rem;

  --font-17:1.7rem;

  --font-16:1.6rem;

  --font-15:1.5rem;

  --font-14:1.4rem;

  --transition-eff : transition-delay: 0s;transition-duration: 0.2s;transition-property: all;transition-timing-function: ease;







  }

/*--------------------------------------------------------------

>>> TABLE OF CONTENTS:

----------------------------------------------------------------*/

html {font-size: 62.5%;scroll-behavior: smooth; font-family:var(--font-primary); }

body {font-family:var(--font-primary); font-size:var(--font-16);color:var(--color-black);font-size:var(--font-14); overflow-x: hidden;margin: 0; padding: 0;background-color:var(--color-white);}

a,a:focus {color:var(--color-blue)}

a,a:hover,a:focus,i,input,button,input:focus,.transition1 {text-decoration: none;outline: none;transition-delay: 0s;transition-duration: 0.2s;transition-property: all;transition-timing-function: ease;box-shadow: none;}

iframe {border: 0;outline: none;}

::-moz-selection {background:var(--color-blue);text-shadow: none;color:var(--color-white);}

::selection {background:var(--color-blue);text-shadow: none;color: var(--color-white)}

img,svg,object{max-width: 100%;border: none;outline: none;height: auto;}

input,textarea {border-radius: 0;resize: none;}

ul {padding: 0;margin: 0;}

@font-face {

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

}



input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {background-color: transparent;background-image: none;color:#909698;}

/* 1.2 Typography */

h1,h2,h3,h4,h5,h6 {font-family:var(--font-primary); font-weight:700 }

figure{ margin: 0 }

.slick-slide:focus{ outline: none; border: none; }

.for_desk_mob{ display: none; }

.all-page{ background-color:var(--color-white) }

.com-hed36{ font-size:var(--font-36); line-height:4rem;font-weight: 700; }

.com-hed34{ font-size:3.4rem; line-height:4.8rem;font-weight: 700; }

.com-hed-36{ font-size:var(--font-30); line-height:3.8rem;font-weight: 700; }

.com-hed-30{ font-size:var(--font-24); line-height:2.8rem;font-weight: 700; }

.com-hed-24{ font-size:var(--font-18); line-height:2.4rem;font-weight: 700; }

.com-hed-20{ font-size:var(--font-20);font-weight: 700; }

.com-button,.com-button:focus{ text-transform: capitalize;font-size:var(--font-18); font-weight:600; background-color:var(--color-blue); color:var(--color-black); outline:none; border:0.1rem solid var(--color-black); line-height:4.8rem; padding-left:4.3rem; padding-right:4.3rem; display:inline-block;box-shadow: 0.6rem 0.6rem 0px #151515; transition: box-shadow 0.3s; border-radius: 6.5rem;}

.com-button:hover{ box-shadow:-0.6rem -0.6rem 0px #151515; color:var(--color-black); }

.com-button-pd30,.com-button-pd30:focus{ padding-left:3rem; padding-right:3rem }

.com-button-pd14,.com-button-pd14:focus{ padding-left:1.4rem; padding-right:1.4rem }

.com-button-hei-45{ line-height:4.5rem }

.bg-blue{ background-color:var(--bg-blue); }

.bg-yellow{ background-color:var(--bg-yellow); }

.bg-white{ background-color:var(--color-white); }

.com-shadow{box-shadow: 0.6rem 0.6rem 0px #151515;border:0.2rem solid var(--color-black);}

.mm-wrapper--position-left .mm-slideout, .mm-wrapper--position-right .mm-slideout {

    transform: none;

}

.mobile-menu-button{ display:none; }

.sm-hed{ font-weight:500; font-size:var(--font-14); text-transform:uppercase;letter-spacing: 0.2em; display:block; margin-bottom:1.5rem }

.header-magr{ margin-top:9.4rem }

/*-----------------------------------------------------------------

  1. >>> Headr Style

----------------------------------------------------------------*/


.site-header{ border-bottom:0.2rem solid var(--color-black); height:9.4rem; position:fixed; width:100%; top:0; background-color:var(--color-white); top: 0; z-index:5 }

body.admin-bar .site-header{ top: 3.2rem;}

.main-nav{ list-style:none; display:flex; align-items:center; }

.main-nav li{ margin-left:4rem; position: relative; }
.main-nav li button{ display: none;}

.main-nav a{font-weight: 600; font-size: var(--font-18); color: var(--color-black); display: inline-block;text-transform: capitalize; padding:33px 0;}







.main-nav a:after{ content: ''; position:absolute; bottom:0; width:0; height:0.4rem; background-color:var(--color-blue); display:block; left:0; transition-delay: 0s;transition-duration: 0.2s;transition-property: all;transition-timing-function: ease; }

.main-nav li.current-menu-item a:after,.main-nav li.current-menu-ancestor a:after{ width:100% }

.main-nav li:hover a:after{ width:100% }

.main-nav li .com-button:after{ content:none; }

.main-nav li .com-button:hover{ box-shadow:-0.6rem -0.6rem 0px #151515 }



.main-nav li ul{ position: absolute;box-shadow: 0px 11px 10px 0px rgba(43, 109, 136, 0.20); border-radius: 0.5rem; background-color: var(--color-white); list-style: none; padding: 0; width: 28.0rem; padding:2.5rem 3rem;top:100%; display: none;}

.main-nav li:hover ul{ display: block;}

.main-nav li ul li{ margin: 0; font-size: var(--font-14); margin-bottom: 1.2rem;}

.main-nav li ul li a::after{content: none;}

.main-nav li ul li:last-of-type{ margin-bottom: 0;}

.main-nav li ul li a{ font-size: var(--font-16); padding: 0;display: flex;flex-direction: row-reverse;justify-content: flex-end;}

.main-nav li ul li.nav__hed{ padding-bottom:1.5rem; margin-bottom: 0;}
.main-nav li ul li.nav__hed a{font-size: var(--font-14); font-weight: 400;}

.main-nav li ul li.nav__hed_two{ padding-top:2rem; margin-bottom: 0;}

.main-nav li ul li a img,.main-nav li ul li a svg{ margin-right: 0.6rem;}

.main-nav li ul li a:hover,.main-nav li ul li.current-menu-item a { color:#23ACE2;}

/*-----------------------------------------------------------------

  2. >>> Banner Style

----------------------------------------------------------------*/

.banner-section{ padding:8rem 0; border-bottom:0.2rem solid var(--color-black); }

.banner-title{ font-size:3.6rem; line-height: 4.8rem; margin-bottom:2.5rem }

.banner-content p{ margin-bottom:3rem;    line-height: 3.6rem; }



.banner-section-inner{ padding-top:4rem; padding-bottom:4rem; position:relative; overflow: hidden;}

.banner-section-inner:before,.banner-section-inner:after{ content:''; background-repeat:no-repeat; background-position:0 0; position:absolute; width:22.0rem; height:18.0rem }

.banner-section-inner:before{ background-image:url(../images/inner-banner-right.svg); top:3rem; right:-7rem }

.banner-section-inner:after{background-image:url(../images/inner-banner-left.svg); bottom: 8rem; left: 0}



.inner-banner-hed{ margin-bottom:3rem }

.shape_banner{ width:55.5rem; margin:0 auto;letter-spacing: 0.15em; font-weight:600; font-size:2.6rem; overflow:hidden; display:block; }



.banner__title{ font-size: 6rem; line-height: 7.2rem; font-weight: 600;letter-spacing: -1.2px; margin-bottom: 6rem;}

.banner__title strong{ font-weight: 700;}

.banner__sm__text{ display: block; text-align: right;font-weight: 600;text-transform: uppercase;letter-spacing: 3.6px; font-size:1rem; padding-top: 4rem;}



.banner___right__image{ text-align: right;}



.banner__inner_section{ background-color:#F0FBFF; height: 35.6rem; display: flex; align-items: center; position: relative; overflow: hidden;}

.banner__image_inner{ display: block; height: 100%; border-left: 0.2rem solid var(--color-black); position: relative;}

.banner__image_inner img.banner__main_image{ width: 100%; height: 100%; object-fit: cover;}

.banner__image_inner_right{ margin-left: auto;}

.banner__inner_content_sec{ position: absolute;  width: 100%; left: 0; top: 0; height: 100%; display: flex; align-items: center;}

.banner__title_inner{ font-size: 3.6rem; line-height: 4.8rem; font-weight: 600; color: var(--color-black); margin: 0;}

.banner__title_inner strong{ display: block; font-size: 6rem; font-weight: 700;}

.banner__inner_content_sec .container{ position: relative; height: 100%; display: flex; align-items: center;}

.banner__bot__icon{ position: absolute; bottom: 0; left: 0;}

.banner__top__icon{ position: absolute; top: 0; left:-128px; z-index: 1;}

/*-----------------------------------------------------------------

  3. >>> Logo Section Style

----------------------------------------------------------------*/

/*.section-logo{ padding-top:2rem; padding-bottom:3rem }*/
.section-logo{ padding:3rem 0 }

.slider-logo-sec{ height:6rem; margin-top:2rem; overflow:hidden; padding:0 1rem; border-radius: 8.5rem;}

.logos_slider{ list-style:none; padding:0; margin:0; display:flex; align-items:center; justify-content:space-around; width:100% }



.logos_slider li{ margin:0 0.2rem; text-align:center; }

.logos_slider li figure{ display:inline-block; }

/*.section-logo-hed{ font-size:1.4rem; font-weight:600 }*/
.section-logo-hed{ font-size:2rem; font-weight:600 }

.logoess_wrapper{width:100%;overflow:hidden; }
.logoess_wrapper .boxes {margin-top: 25px}
.logoess_wrapper button{ display:none !important; }
.logoess_wrapper .box{width:108px; margin-left: 20px; margin-bottom: 7px}
.logoess_wrapper .box img{/*box-shadow: 0px 3px  4px rgba(0,0,0,0.20);*/ border-radius: 6px;}


/*-----------------------------------------------------------------

  4. >>> Coloum Section Style

----------------------------------------------------------------*/

.coloum-list-section{ padding-top:6rem;overflow: hidden; }

.coloum-list-hed{ margin-bottom:3rem }

.coloum-list-section article p{ margin-bottom:3.3rem }

.coloum-list{ border-bottom:0.2rem solid var(--color-black);border-top:0.2rem solid var(--color-black); position:relative; }

/* .coloum-list:before,.coloum-list:after{ content:''; position:absolute; width:100%; height:329px;border-bottom:0.2rem solid var(--color-black);border-top:0.2rem solid var(--color-black); top:-0.2rem }

.coloum-list:before{ left:-100% }

.coloum-list:after{ right:-100% } */

.coloum-list-loop{ border-right:0.2rem solid var(--color-black); min-height:32.5rem; display:flex; align-items:center; }

.coloum-list-loop:first-child{border-left:0.2rem solid var(--color-black);}

.coloum-list-loop-hed{ margin-bottom:2rem }

.coloum-list-loop_sec figure{ margin-bottom:1rem }

.coloum-list-loop_sec{padding: 0 1rem; padding-bottom: 2rem; width: 100%;}

/*-----------------------------------------------------------------

  5. >>> Two coloum Section Style

----------------------------------------------------------------*/

.two-colloum-section{ padding-top:6rem; padding-bottom:6rem }

.two-colloum-section-right{ padding-right:10.0rem }

.two-colloum-hed{ margin-bottom:4rem }

.two-colloum-hed-sub{ background-repeat:no-repeat; background-position:0 0.6rem; background-image:url(../images/tick-icon.svg); padding-left:4.4rem; margin-bottom:1.2rem; line-height:3.4rem }

.two-colloum-loop{ margin-bottom:3rem; text-align: center; }







.we__ca__section{ padding-top: 6rem; padding-bottom: 9rem;}

.we__ca__section_header{ font-size: 1.6rem; line-height: 3rem; padding-bottom:3rem;}

.we__ca__section_header__tile{ font-size: 3rem; font-weight: 700; margin-bottom:1rem;}



.r-tabs .r-tabs-nav { margin: 0;padding: 0;}

.r-tabs .r-tabs-tab {display: inline-block;margin: 0;list-style: none;}

.r-tabs .r-tabs-panel {padding: 0;display: none;}

.r-tabs .r-tabs-accordion-title {display: none;}

.r-tabs .r-tabs-panel.r-tabs-state-active {display: block;}



/* Accordion responsive breakpoint */

@media only screen and (max-width: 768px) {

  .r-tabs .r-tabs-nav {

      display: none;

  }



  .r-tabs .r-tabs-accordion-title {

      display: block;

  }

}

.tab___section__nav{ display: flex; justify-content: space-between; margin-bottom: 3rem;}

.r-tabs .r-tabs-nav.tab___section__nav{ margin-bottom: 3rem;}

.tab___section__nav li{ width: 100%; text-align: center;}

.tab___section__nav a{ font-size: var(--font-18); font-weight: 600; display: flex; align-items: center; border: 0.2rem solid var(--color-black); height: 6rem; width: 100%; justify-content: center; border-left: none; color: var(--color-black);}

.tab___section__nav li:last-of-type a{border-top-right-radius: 30px;border-bottom-right-radius: 30px;}

.tab___section__nav li:nth-child(1) a{border-top-left-radius: 30px; border-left: 0.1rem solid var(--color-black);border-bottom-left-radius: 30px;}

.tab___section__nav a:hover,.tab___section__nav li.r-tabs-state-active a{ background-color: var(--color-black); color: var(--color-white);}



.tab___section__loop{ box-shadow:6px 6px 0px #000; border: 0.2rem solid var(--color-black); border-radius: 3rem; overflow: hidden; min-height:50.5rem;}

.tab___section__loop__inner{ display: flex; justify-content: space-between;}

.tab___section__content{ max-width: 75.8rem; padding-left: 4rem; padding-right:4rem; padding-top: 4rem; padding-bottom:4rem; font-size: var(--font-16); line-height: 3.2rem;}

.tab__title{ font-size: 3rem; font-weight: 600; margin-bottom: 1.5rem;}

.tab__list{ padding-top:1.5rem; padding-bottom:1.5rem;}

.tab__list span{ text-transform: uppercase;letter-spacing: 4.8px; display: block; padding-bottom: 1.5rem;}

.tab__list ul{ list-style: none; padding: 0; font-size: var(--font-16); line-height: 1.8rem;  font-weight: 600;}

.tab__list ul.colm-2{ column-count: 2; column-gap: 3rem;}

.tab__list ul li{ margin-bottom: 1rem;  padding-bottom:0.4rem; padding-left: 3rem; background-repeat: no-repeat; background-position: 0 3px; background-image: url(../images/list__arrow.svg);}

.tab___section__images{ border-left: 0.2rem solid var(--color-black); position: relative; width: 37.3rem;}

.tab___section__images::before{ content: ''; position: absolute; top:3rem; right:1rem; z-index: 1; background-image: url(../images/tab__icon__top.svg); width: 124px; height: 69px;}

.tab___section__images::after{ content: ''; position: absolute; bottom:0; left:-115px; z-index: 1; background-image: url(../images/tab__icon__bot.svg); width: 178px; height:131px;}

.tab___section__images figure{ height:34vw;}

.tab___section__images figure img{ width: 100%; height: 100%; object-fit: cover;}

/*-----------------------------------------------------------------

  6. >>> Testimonial Section Style

----------------------------------------------------------------*/

.testimonial-section{ border-top:0.2rem solid var(--color-black); padding-top:3rem; padding-bottom:3rem; overflow:hidden; position:relative; }

.testimonial-section:before,.testimonial-section:after{ content:''; position:absolute; background-repeat:no-repeat; background-position:0 0; width:25.0rem; height:25.0rem; display:flex; } /* display was previously set to inline-block */



.testimonial-slider-sec{ padding:4rem; margin-top:2rem;  background-color:#9AE2FF; font-size:1.6rem; line-height:3rem }

.testimonial-slider{ width:100% }

.testimonial-info{ font-weight:500; font-size:var(--font-16); line-height: normal; padding-top:0 }

.testimonial-info strong{ display:block; font-size:var(--font-18);line-height: normal; font-weight:700; padding-bottom:0.4rem }

.testimonial-button{ margin-top: 0}

.testimonial-button .slide-arrow{ background-color:transparent; border:none; outline:none; padding:0; cursor:pointer; margin-left:1.5rem }

.testimonial-button .slide-arrow.slick-disabled{ opacity:0.2; cursor:unset; }

.testimonial-info a{ color:var(--color-black); text-decoration:underline; }

.testimonial-info a:hover{ text-decoration:none; }

.testimonial-info figure{margin-top: 1rem}



/* NEW CSS 26-07-2023*/

.testimonial-loop{position: relative; overflow: hidden;margin-right:1.5rem; margin-bottom:4rem}

.testimonial-loop a{ display:block; width:100%; height:100%; background-image:url(../images/icon_youtube.svg); background-repeat:no-repeat; background-position:center center; position:absolute; top:0; left:0; right:0; background-color:rgba(0, 0, 0, 0.1); }



.testimonial__section{ border-bottom: 0.2rem solid var(--color-black); padding-top: 9rem; padding-bottom:6rem;}

.testimonial__slider__loop blockquote{ font-size: 3.2rem; font-weight:600; font-style: italic; margin-bottom: 2rem;}

.testimonial__name{ font-size: var(--font-16); font-weight: 400;}

.testimonial__name strong{ font-weight: 600;}

.testimonial__slider__loop_inner{ display: flex; align-items: center; justify-content: space-between; padding-right: 1rem;}

.article__left{ max-width: 62.2rem;}

.article__image{ background-color: #000; border: 0.1rem solid #000; border-radius: 2rem; width:39.8rem; height: 23.3rem; position: relative; }

.article__image__inn{ border: 0.1rem solid #000; border-radius: 2rem; width: 39.8rem; height: 22.6rem; overflow: hidden;transform:translate( -8px , -1px); }



.article__image img{ width: 100%; height: 100%; object-fit: cover;}

.article__image a{ display: block; width: 100%;height: 100%;background-image: url(../images/icon_youtube.svg); background-repeat: no-repeat;background-position: center center;position: absolute;top: 0;left: 0;right: 0;}

.testimonial__slider{ padding-bottom:3rem;}

.testimonial__section .slick-dots{ list-style: none; padding: 0; margin: 0 -0.4rem; display: flex; align-items: center; margin-top: 2rem;}

.testimonial__section .slick-dots li{ padding: 0 0.4rem;}

.testimonial__section .slick-dots button{ border-radius: 100%; padding: 0; margin: 0; width: 1.6rem; height: 1.6rem; font-size: 0; background-color:#9BA3A6; border: none; outline: none; cursor: pointer;}

.testimonial__section .slick-dots li.slick-active button{ background-color: var(--color-black);}

.more__button{ display: inline-block; font-size: var(--font-16); font-weight: 600; color: var(--color-black); text-decoration: underline;}

.more__button:hover{ text-decoration: none; color: var(--color-black);}

/*-----------------------------------------------------------------

  >>> Why Section Style

----------------------------------------------------------------*/



.why__section{ border-bottom: 0.2rem solid var(--color-black); position: relative; background-color: #FFF9E3;overflow: hidden;}

.why__section__left{ background-color: #FFF9E3; max-width:50.4rem; position: relative; z-index: 1; }

.why__section::after{content: ''; position: absolute;background-image: url(../images/bot__svg__left.svg); background-position:0 0; background-repeat: no-repeat; bottom: 0; left: 0; width: 13.7rem; height: 16.6rem; z-index: 1;}



.why__section__left::before,.why__header__top::before{ content: ''; position: absolute; width: 100%; left: -100%; height: 100%; top: 0; background-color: #FFF9E3;}

.why__section__left__pan{background-color: #FFF9E3; position: relative; display: flex;}

.why__section__left__pan::before{content: ''; position: absolute; width: 100%; left: -100%; height: 100%; top: 0; background-color: #FFF9E3}



.why__header__top::before{background-color: #FFEEB1; z-index: 1;}

.why__header__top{ background-color: #FFEEB1; padding-top: 10.0rem; padding-bottom: 7rem; position: relative;background-image: url(../images/top___svg_shape.svg); background-position: right 0; background-repeat: no-repeat;}

.why__header__top_title_sub{ text-transform: uppercase; font-weight: 600; font-size: var(--font-18); display: block; padding-bottom: 1rem;}

.why__header__top_title{ font-size:var(--font-48); font-weight: 700;}

.why__list__sec{ padding-top: 7.8rem; padding-bottom:17.8rem; padding-right: 3rem;}

.why__list__sec ul{ list-style: none; padding: 0; margin: 0;}

.why__list__sec li{ font-size: 2.2rem; font-weight: 600; border-bottom: 0.2rem solid var(--color-black); padding-bottom: 0.6rem; padding-top: 0.6rem;}

.why__list__sec li:last-of-type{ border-bottom: none;}

.why__list__sec li strong{ font-weight: 700; font-size: 3.2rem;}



.why__list__content__sec__right{ position: relative; padding-bottom:4rem; background-color: var(--color-white);}

.why__list__content__sec__right::before{ content: ''; position: absolute; left:-4rem; height: 100%; width: 0.2rem; background-color: var(--color-black); top: 0; z-index: 1;}

.why__list__content__sec__right::after{content: ''; position: absolute; width:100%; height: 100%; top: 0; right: -100%; background-color: var(--color-white);}

.why__list__content__sec__right__inn::before{content: ''; position: absolute; width:100%; height: 100%; top: 0; left: -100%; background-color: var(--color-white);}





.why__list__content__sec{ padding-top: 8rem;}

.why__list__content figure{ margin-bottom: 1.5rem;}

.why__list__content_heading{ font-size: 2rem; font-weight: 700; margin-bottom: 2.8rem;}

.why__list__content{ font-size: var(--font-14); line-height: 2.5rem;}

.why__list__content__loop{ padding-bottom: 5rem;}

/*-----------------------------------------------------------------

  >>> Blog Section Style

----------------------------------------------------------------*/

.blog__listing{ padding: 9.3rem 0;}

.blog__header{ padding-bottom: 5.7rem;}

.blog__hedaing{ font-size: 3rem; font-weight: 600; position: relative; display: inline-block;}

.blog__hedaing span{ position: relative; z-index: 1;}

.blog__hedaing::after{ content: ''; position: absolute; bottom: 0;width: 100%; height: 1.7rem; background-color: #FFD01F; left: 0;}

.blog__grid{ display: grid; grid-template-columns: auto auto auto;gap:30px;padding: 0;}

.blog__grid__loop:nth-child(1){grid-row-start: 1;grid-row-end: 3; background-color:#FFF9E3; height: max-content;}

.blog__grid__loop{ border: 0.1em solid var(--color-black); border-radius: 3rem;box-shadow: 6px 6px 0px 0px #000; background-color: var(--color-white); padding: 4rem 3rem; height: max-content;}

.post__date{ font-size:var(--font-14); font-weight: 500; display: block; padding-bottom: 1rem;}

.post__title{ font-weight: 600; font-size: 2.4rem; margin-bottom: 2rem;}

.red__more__link{ font-weight: 500; font-size: var(--font-16); text-decoration: underline; color: var(--color-black);}

.red__more__link:hover{ color: var(--color-black);}

.blog__grid__loop:nth-child(1) .post__title{ font-size: var(--font-36);}

.post__image{ border-radius: 2rem; overflow: hidden; width: 100%; height: 28.0rem; margin-bottom: 3rem;}

.post__image img{ width: 100%; height: 100%; object-fit: cover;}

/*-----------------------------------------------------------------

  7. >>> Team Section Style

----------------------------------------------------------------*/

.about-info-sec{ padding-top:6rem; padding-bottom:6rem }

.about-info-hed{ margin-bottom:3.3rem }

.about-info-sec p{ margin-bottom:3rem }

.about-info-sec p:last-child{ margin-bottom:0 }

.tem-section{ border-top:0.2rem solid var(--color-black); border-bottom:0.2rem solid var(--color-black); padding-top:6rem; }

.tem-hed,.tem-section-header p{ margin-bottom:4rem }

.tem-section-header{ padding-bottom:7rem }

.tem-list{border:0.2rem solid var(--color-black); border-bottom: none; background-color: var(--bg-yellow); margin: 0 1rem}

.tem-list figure{ border-bottom:0.2rem solid var(--color-black); height: 30.8rem; position: relative;}

/*.tem-list figure:before{ content:''; position:absolute; width:7.6rem; height:1.6rem; background-repeat:no-repeat; background-position:center center; background-image:url(../images/site-logo.svg); top:70%; left:50%; transform:translate(-50% , -50%); background-size:100% }*/

.tem-list section{ padding:2.5rem 0 }

.tem-list h3{ font-size:var(--font-18); font-weight:700 }

.tem-list span{ display:block; font-weight:500; font-size:var(--font-14); }

.services-section{border-top:0.2rem solid var(--color-black); padding-top:6rem; padding-bottom:6rem}

.services-hed{ padding-bottom:2.5rem }

.services-hed p{ font-weight: 500; font-size: 1.6rem;}

.services-list-loop{ display:flex; }

.services-list-inner{display: flex;flex-wrap: wrap;flex-direction: column;justify-content: space-between;height: 100%;width: 100%;}

.services-list{ border-radius: 10px;  background-color:var(--color-white); padding-top:4rem; padding-left:4rem; padding-right:4rem;  position:relative; padding-bottom:4rem; width:100% }

.services-list header{ width:100% }

.sm-info{ background-color:var(--color-yellow); font-weight:600; font-size:2.2rem; height:4.8rem; width:12.0rem; display:flex; justify-content:center; align-items:center; position:absolute; top:-0.2rem; right:-0.2rem; box-shadow:none; }

.services-name-hed{ margin-bottom:0 }

.services-list header{ padding-bottom:1rem }

.services-list .shape_banner{ width:100% }

.services-list-info{ font-weight:500; font-size:1.6rem; text-align:left; margin-left:1.8rem; padding-bottom:4rem;}

.services-list-info li{ margin-bottom:0.5rem; }

.tem-bot-listing .two-colloum-hed-sub{line-height: normal; background-position: 0 center;}

.tem-section-list .slick-dots{ position:absolute; list-style:none; bottom:-3rem; left:0; right:0; width:100%; display:flex; flex-wrap:wrap; justify-content:center; z-index:2 }

.tem-section-list .slick-dots li{ margin:0 0.3rem }

.tem-section-list .slick-dots button{ border:0.2rem solid var(--color-black); background-color:transparent; padding:0; margin:0; width:1rem; height:1rem; overflow:hidden; border-radius:100%; text-indent:-999px }

.tem-section-list .slick-dots li.slick-active button{ background-color:var(--color-black); }

/*-----------------------------------------------------------------

  8. >>> News Section Style

----------------------------------------------------------------*/

.news-section{ padding-top:8rem; padding-bottom:8rem }

.news-list{ position:relative; padding:3rem;}

.nes-list-image{ height:20.5rem; margin-bottom:2.7rem }

.nes-list-image img{ width:100%; height:100%; object-fit:cover; }

.news-list .sm-info{ left:-0.2rem; right:auto; font-size:var(--font-14); letter-spacing: 0.2em; border: 0.2rem solid var(--color-black);}

.news_title{ font-size:var(--font-18); font-weight:700; margin-bottom:3rem; min-height:6.4rem }

.news_title a{ color:var(--color-black); }

.news-date{ display:block;letter-spacing: 0.2em; font-weight:600; font-size:var(--font-14); padding-bottom:1rem }

.news-list-row{  margin-left:-1rem; margin-right:-1rem }

.news-list-loop{ margin-bottom:2rem; padding-left:1rem; padding-right:1rem }



.news-det-banner{ position: static;height:45.0rem; border-bottom:0.2rem solid var(--color-black);overflow: visible; }

.news-det-banner .container{ position:relative; }

.banner-section-inner.news-det-banner:before, .banner-section-inner.news-det-banner:after{ content:none; }

.banner-section-inner.news-det-banner .container:before, .banner-section-inner.news-det-banner .container:after{ content: '';background-repeat: no-repeat;background-position: 0 0;position: absolute;width: 22rem;height: 18rem; }



.banner-section-inner.news-det-banner .container:after{ left:0; top:-5rem; background-image:url(../images/news-left.svg); height:22.8rem }

.banner-section-inner.news-det-banner .container:before{ right:6rem; bottom:-33.0rem;background-image:url(../images/news-rigt.svg); width:12.5rem; height:14.4rem }



.news-banner-image{ position:absolute; bottom:-43.0rem; left:0; right:0;border:0.2rem solid var(--color-black); width:990px; display:flex; margin:0 auto;z-index: 2; }

.news-details-section{ padding-top:15.1rem; padding-bottom:8rem }

.news-det-date{ display:block;letter-spacing: 0.2em; font-weight:600; font-size:var(--font-14); margin-bottom:0.6rem }

.news-det-hed{  margin-bottom:1.4rem }

.news-content{ line-height:3.6rem }

.news-content p{ margin-bottom:3rem }



/*-----------------------------------------------------------------

  9. >>> Conact Section Style

----------------------------------------------------------------*/

.contact-section{ padding-top:6rem; padding-bottom:6rem }

.conatct-heading{ margin-bottom:1.5rem }

.contact-section-header p{ margin-bottom:2.5rem }

.conact-info-list{ min-height:15.5rem; display:flex; align-items:center; padding-left:2.5rem; padding-right:2.5rem; border-radius: 10px; }

.conact-info{ padding-left:1rem }

.conact-info span{ display:block; font-weight:500 }

.conact-info a{ color:var(--color-black); }

.conact-info a:hover{ text-decoration:underline; }

.conact-info-sec{ padding-top:6rem }

.conact-info-row{ margin-left:-1.5rem; margin-right:-1.5rem }

.conact-info-loop{ padding-left:1.5rem; padding-right:1.5rem }

/*-----------------------------------------------------------------

  10. >>> Grow-page Section Style

----------------------------------------------------------------*/

.grow-page .site-header{ height:6rem }

.grow-page .header-magr{margin-top:6rem}

.grow-page .banner-section{ padding:3.5rem 0 }

.grow-left{ padding-right:10.9rem; }

.grow-left .banner-title{ margin-bottom:4rem }

.landing-heading{ margin-bottom:3rem }

.discovery_only .landing-heading{ margin-bottom:3rem }

.grow-left p{ font-weight:500; line-height: 3.5rem;margin-bottom:4.5rem; }

.discovery_only p{ line-height:3.5rem }

.grow-right{ background-color:#67CDF5; border:0.2rem solid var(--color-black);box-shadow: 2rem 2rem 0px #F6DB6F; padding:3rem; padding-top:2rem; width:90%; margin-left:auto; }

.grow-header figure{ padding:2rem 0 }

.grow-header{ padding-bottom:1rem }

.from-input{ width:100%; border:0.2rem solid var(--color-black); font-size:1.4rem; font-weight:500; background-color:var(--color-white); padding-left:1.8rem; padding-right:1.8rem; height:4.5rem; color:var(--color-black); outline:none; }

.from-input-select{ background-repeat:no-repeat; background-position:95% center; appearance:none;-webkit-appearance:none; background-image:url(../images/arrow.png) }

.from-input::-webkit-input-placeholder { font-weight:500;color: rgba(0, 0, 0, 0.5);}

.from-input:-ms-input-placeholder { font-weight:500;color: rgba(0, 0, 0, 0.5);}

.from-input::placeholder {font-weight:500;color: rgba(0, 0, 0, 0.5);}

.from-group{ margin-bottom:1.2rem }

.from-group label{ display:none; }

select.from-input{color: rgba(0, 0, 0, 0.5);}

.input-button{ background-color:var(--bg-yellow); }

.input-button-sec{ padding-top:0 }

.logo-section-grow{ padding:3rem 0;}

.logo-section-grow span{ display:block; font-weight:500; padding-bottom:2.4rem }

.grow-page .site-footer{ border-top:none; padding:3rem 0; padding-bottom:2.5rem }

.grow-page .footer-bot{ padding-top:0 }

.grow-page .footer-nav{ columns:auto; display:flex; justify-content:flex-end }

.grow-page .footer-nav li{ margin-left:2rem }

.grow-page .footer-nav li:first-child{ margin-left:0 }

.logo-image{ padding-top:3rem }

input.com-button{ height:4.5rem; line-height:4.5rem; font-size:1.6rem }

/*-----------------------------------------------------------------

  11. >>> Footer Section Style

----------------------------------------------------------------*/
.sub-menu-toggle{ display:none; }
.site-footer{ border-top:0.2rem solid var(--color-black); padding-top:6rem; padding-bottom:4rem }

.phone-number{ font-weight:600; font-size:var(--font-24); color:var(--color-black); display:inline-block; padding-top:1.5rem; padding-bottom:0.5rem }

.phone-number:hover{ color:var(--color-black); text-decoration:underline; }

.footer-addres span{ display:block; }

.footer-nav{ list-style:none;  }

.footer-nav a{ color:var(--color-black); font-weight:500; margin-bottom:0.8rem; display:inline-block; }

.footer-nav a:hover,.footer-nav li.current-menu-item a{ color:var(--color-black); text-decoration:underline; }

.footer-nav li ul{ list-style: none; padding: 0; margin: 0; margin-left: 1rem; margin-top: 1rem;}

.copyright{ display:block; margin-right:9.6rem;line-height: 1.2rem;}

.footer_logo_list{ display:flex; flex-wrap:wrap; padding:3rem 0; align-items:center ;min-height: 109px; list-style:none; margin:0 }

.footer_logo_list figure{ margin-right:2rem; font-size:0 }


.footer-bot{ padding-top:2.8rem }

.footer_logo_list_two{ padding-top:0;align-items: center; }

.newsletter_sec_hed{ font-weight:500; }

.newsletter_sec_input{border: 0.2rem solid var(--color-black); width: 100%; height: 4.5rem; font-weight: 500; font-size: 1.4rem; color: rgba(0, 0, 0, 0.5); padding: 0 2rem; margin-right: 1rem}

.newsletter_sec_from{padding-top:1rem }

.newsletter_sec_from form{ display:flex; align-items:center; width:40.1rem }

.footer_hed{ font-weight:700; margin-bottom: 2rem}

.footer-nav-bot{ display:flex; justify-content:flex-end }

.footer-nav-bot li{ margin-right:1rem; padding-right:1rem; border-right:0.1rem solid var(--color-black); line-height:1.2rem }

.footer-nav-bot li a{ margin-bottom:0 }

.footer-nav-bot li:last-child{ border-right:0; padding-right:0; margin-right:0 }

.footer_logo_list_two_right{ justify-content:flex-end }

/*.footer_logo_list figure:last-child{ margin-right:0 }*/

.landing-footer-left .footer_logo_list{ margin-bottom:0; padding:0; margin-right:2rem }

.landing-footer-right .footer-nav a{ margin-bottom:0 }

.footer__logo__text{ display: block;letter-spacing: 4.32px;text-transform: uppercase; font-size: 1.2rem;font-weight: 600; padding-top:1.6rem;}

/*-----------------------------------------------------------------

  12. >>> Faq Section Style

----------------------------------------------------------------*/

.faq-banner-buuton{ margin-bottom:3rem }

.faq-section,.all-inner-section{ border-top:0.2rem solid var(--color-black); padding:6rem 0 }

.faq-cat-hed{ margin-bottom:4rem }

.faq-question{font-weight: 700; font-size: 1.8rem; margin: 0; border: 0.2rem solid var(--color-black); margin-bottom:1.6rem; padding: 0 3.2rem; min-height: 7rem; display: flex; align-items: center; width: 100%; cursor: pointer; position: relative;}

.ui-accordion-header-icon{ position:absolute; right:3rem; top:50%; transform:translateY(-50%); width:2.6rem; height:2.6rem; background-color:var(--color-black); display:flex; align-items:center; justify-content:center; border-radius:100% }

.ui-accordion-header-icon:before{ content:"+"; color:var(--color-white); font-weight:500 }

.faq-question.ui-accordion-header-active{border-bottom: none;margin-bottom: 0}

.faq-question.ui-accordion-header-active .ui-accordion-header-icon:before{content:"-";}

.faq-content{border: 0.2rem solid var(--color-black); border-top: none;padding: 0 3.2rem; padding-bottom:1.2rem; padding-right: 7rem; margin-bottom: 1.6rem}

.faq-cat-section-loop{ margin-bottom:7rem }

.faq-cat-section-loop:last-child{ margin-bottom:0 }

.inner-section-content{ line-height:3rem }

.inner-section-content h2,.inner-section-content p{ margin-bottom:1.5rem }

.inner-section-content ul, .inner-section-content ol{ margin-left:1.5rem;margin-bottom:1.5rem }

.inner-section-content p a{ color:var(--color-blue); }

.inner-section-content p a:hover{ text-decoration:underline; }

.footer_logo_list_two_right figure a{ cursor:none; pointer-events:none; }

.landing-footer .footer_logo_list{ min-height:inherit; }

.landing-footer .row{ align-items:center; }





/* .coloum-list:before, .coloum-list:after{ top: -2px;} */

.bookkeeping_col_5 .coloum-list-loop{ width: 20%; display: flex;}

.coloum-list-loop_sec ul{ text-align: left; margin-left: 15px; }

.coloum-list-loop_sec ul li{ margin-bottom: 0.8rem; }

.bookkeeping_col_5 .com-hed-30{ font-size: 2rem;}

.bookkeeping_col_5  .coloum-list-loop_sec figure{ min-height:10.0rem; display: flex; align-items: center; justify-content: center; width: 6rem; margin: auto;}

.price__sec{ padding-bottom: 1rem;}

.price__sec span{ display: block;}

.main_price { font-size: 1.8rem; font-weight: 500;}

.main_price strong{ color:#00A9E0; font-weight: 700; font-size: 3.2rem;}

.price_sm_dec{ color:#969696; font-weight:500; font-size: 1.6rem; }

.services-list-info-heading{ font-size: 1.8rem; font-weight: 700; color: #000000; list-style: none;}

.services-list-info-heading strong{ font-weight: 700;}

/*.bookkeeping__service_list .services-list-info{min-height: 26.6rem;}*/

.hed_icon{ margin-top: 1rem;}

.three-colloum-section{ margin-top:3rem;}



.sm__content__sec{ background-color:#FFF5D0; text-align: center; font-size: 1.8rem; line-height: 3.6rem; font-weight: 500; padding: 4rem 0; border-top: 0.2rem solid var(--color-black);}



.brand__section{ padding-top: 8rem; padding-bottom: 8rem;}

.brand__section_header{ text-align: center; padding-bottom: 5rem;}

.brand__section_header h2{ font-size: 3rem; font-weight: 700; margin-bottom: 1.5rem;}

.brand__section_header p{ font-size: 1.6rem; line-height: 3rem;}

.brand__slider__loop{ background-color: var(--color-black);border-radius: 4rem; margin: 0.6rem;}

.brand__slider__loop_inner{ background-color: var(--color-white); border: 0.2rem solid var(--color-black); border-radius: 4rem; min-height:50.9rem;transform: translate(-6px , -6px); overflow: hidden;}

.brand__slider__loop_inner .row{ min-height: 50.9rem; align-items: flex-end;}

.brand__slider__content{ padding: 6rem; padding-right: 1rem;}

.brand__slider__name{ font-size: 3.6rem; font-weight: 600;}

.brand__slider__exp{ display: block; font-weight: 500; font-size: 1.8rem;}

.brand__slider__info_list{ list-style: none; display: flex; flex-wrap: wrap; padding-top: 3.5rem; margin: 0 -1.5rem;}

.brand__slider__info_list li{ width: 50%; padding: 0 1.5rem; padding-bottom: 3.3rem;}

.brand__slider__info_list li span{ display: block; text-transform: uppercase;letter-spacing: 4.2px;text-transform: uppercase; font-size: 1.4rem; font-weight: 500; padding-bottom: 1rem;}

.brand__slider__info_list li strong{font-weight: 600; font-size: 1.8rem;}

.brand__slider__image_sec  figure{ width: 41.2rem; margin: auto; padding-top:2rem;}



.outsourcing___sec{ background-color: #FFF5D0; overflow: hidden;}

.outsourcing___sec .row{ align-items: center;}

.outsourcing___sec__image{ width: 44.8rem;transform: translateY(2px); margin: auto;}

.outsourcing___sec__heading{ font-size: 3.2rem; font-weight: 700; margin-bottom: 2rem;}

.outsourcing___sec__button{ font-weight: 500; font-size: 1.6rem; text-decoration: underline; color: var(--color-black);}

.outsourcing___sec__button:hover{ color: var(--color-black); text-decoration: none;}



.community__section{ overflow: hidden; border-top: 0.2rem solid var(--color-black); border-bottom: 0.2rem solid var(--color-black);border-bottom: none;}

.community__section__inner .row{ align-items: center;}

.community__section_image{ height: 63.0rem;}

.community__section_image figure{ height: 100%; border-right: 0.2rem solid var(--color-black);}

.community__section_image figure img{ width: 100%; height: 100%; object-fit: cover;}

.community__section__content{ padding-left: 10.0rem; width: 62.2rem;}

.community__section__content h2{ font-size: 3.5rem; font-weight: 700; margin-bottom: 2rem;}

.community__section__content article{ font-size: 1.6rem; line-height: 2.6rem; font-weight: 500; font-style: italic;}

.community__section__content article span{ font-weight: 600; display: block;}

.community__logos_sec{ list-style: none; padding: 0; margin: 0 -1.5rem; flex-wrap: wrap; display: flex; margin-top: 4rem; align-items: center;}

.community__logos_sec li{ width:auto; padding: 0 1.5rem; margin-bottom:2rem; width: 50%}



.bordered-table {

  border-collapse: collapse;

  width: 100%;

}

.bordered-table th, .bordered-table td {

  border: 1px solid rgb(45, 45, 46);

  padding: 6px;

}





  /*-----------------------------------------------------------------

    A. >>> Blog Entry Styles [Feb 2024]

  ----------------------------------------------------------------*/

  

  aside {

    display: flex;

    margin: 1.5rem auto 4rem;

    padding: 2rem;

    align-items: center;

    justify-content: center;

    text-align: center;

    font-size: 2rem;

    font-weight: 700;

    border-radius: 1rem;

    background-color: #ffdd80;

    border: 2px solid #000;

    box-shadow: 0.25rem 0.25rem 0 #000;

    max-width: 64rem;

  }



  h2.blog-h2 {

    margin-bottom: 4rem;

  }



  h3.blog-h3 {

    margin-bottom: 2rem;

  }

  h4.blog-h4 {

    margin-bottom: 1.5rem;

  }



  /* Links for blog text content only */

  a.blog-link {

    color: #00a9e0;

  }

  a.blog-link:hover, a.blog-link:focus {

    color: #86dcff;

  }

  a.blog-link:active {

    color: #3fc9ff;

  }

  a.blog-link:visited {

    color: #00a9e0;

  }



  /* Blog image */

  .outsourcing-guide-image {

    display: flex;

    flex-direction: column;

    align-items: center;

    max-width: 54rem;

    margin: 0 0 2rem;

    padding: 1rem;

    border-radius: 1rem;

    background-color: #e6f0ff;

    border: 2px solid #002c43;

    box-shadow: 0.25rem 0.25rem 0 #002c43;

  }

  .outsourcing-guide-image img {

    width: 100%;

  }



  figure .blog-img {

    display: block;

    margin: 0 auto;

    text-align: center;

  }

  @media all {

    .blog-img {

      display: block;

      margin: 0 auto;

      text-align: center;

    }

    figure iframe {

      display: block;

      margin: 0 auto;

      text-align: center;

    }

  }

  figcaption.blog-figure-caption {

    font-size: 1.2rem;

    font-weight: 600;

    margin: 1rem 0 3.5rem;

    text-align: center;

  }

  

  iframe.blog-embed {

    display: block;

    margin: 0 auto 1rem;

    width: 560px;

    height: 315px;

  }



  .info-box {

    display: flex;

    flex-direction: column;

    align-items: center;

    max-width: 54rem;

    margin: 0 auto 2rem;

    padding: 2rem;

    border-radius: 1rem;

    background-color: #FFF5D0;

    border: 2px solid #212529;

    box-shadow: 0.25rem 0.25rem 0 #212529;

  }

    .info-box ul {

      list-style-position: inside; /* align with text padding */

      padding-left: 2rem; 

      margin: 0; 

    }

    .info-box ul li {

      margin-left: 1rem; /* distance between the bullet point and the text */

    }

    .info-box h4 {

      margin: 1rem 0 2rem;

    }





/* Nuface Case Study Classes */



.case-study-info-cont {

  display: flex;

  gap: 1rem;

  margin: 2rem 0 2rem;

}

.responsive-cont {

  display: flex;

  gap: 1rem;

  width: 100%;

}



@media only screen and (max-width: 1200px) {

  .case-study-info-cont {

    flex-direction: column;

  }

  .case-study-info {

    width: max-content;

  }

}

.case-study-info {

  display: flex;

  justify-content: center;

  align-items: center;

  margin: 0 auto;

  width: 100%;

  padding: 2rem 2rem;

  border-radius: 2rem;

  border: 1px solid #AAC2E7;

}

.case-study-info .logo {

  width: 24rem;

}

img.link-icon {

  width: 2rem;

  margin-left: 1rem;

}



.width-75 {

  width: 75%;

  margin: 0 auto;

}



.success-factors-figure {

  margin: 0 0 6rem;

}

.figure-h3 {

  margin-bottom: 1.5rem;

  text-align: center;

}

.success-factors-cont {

  width: 85%;

  display: grid;

  margin: 0 auto;

  gap: 1rem;

  grid-template-columns: 1.5fr 1fr;

}

@media only screen and (max-width: 992px) {

  .success-factors-cont {

    grid-template-columns: 1fr;

  }

}

.left-column {

  display: flex;

  flex-direction: column;

  align-items: center;

  gap: 1rem;

}

.right-column {

  display: flex;

  flex-direction: column;

  align-items: center;

}

.success-factor {

  display: flex;

  flex-direction: column;

  align-items: center;

  text-align: center;

  padding: 2rem;

  border-radius: 1rem;

  border: 1px solid #AAC2E7;  

  justify-content: center;

  height: 100%;

}

.success-factor h4 {

  margin: 0 0 1.5rem;

}

.success-factor p {

  max-width: 85%;

  margin: 0;

  line-height: 2.25;

}



blockquote.blog-quote {

  width: 75%;

  font-size: 2.4rem;

  font-weight: 600;

  font-style: italic;

  margin: 0 auto 2rem;

  padding: 0 0 0 2rem;

  border-left: 0.5rem solid #00A9E0;

}

blockquote.blog-quote cite {

  display: block;

  font-size: 1.6rem;

  font-weight: 600;

  margin: 0.5rem 0 0;

  color: #00A9E0;

}





/* KK03 Case Study Classes */



.study-takeaways-container {

  width: 66%;

  display: grid;

  margin: 0 auto 6rem;

  gap: 1rem;

  grid-template-columns: 1fr;

}



.study-takeaway {

  display: flex;

  flex-direction: column;

  align-items: center;

  text-align: center;

  padding: 3rem;

  border-radius: 1rem;

  border: 1px solid #AAC2E7;  

  justify-content: center;

  height: 100%;

}

  .study-takeaway h4 {

    margin: 0 0 1.5rem;

  }

  .study-takeaway p {

    margin: 0 0 1rem;

  }



.takeaway-icon {

  width: 8rem;

  margin-bottom: 2rem;

}





/* Our Brand */



.brand-guide-banner {

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  height: 250px;

  margin: 0 auto 2rem;



  padding: 8rem 0 0;

  color: white;

  background-color: #00a9e0;

}

  .brand-guide-banner h1 {

    font-size: 3.6rem;

    font-weight: 500;

    text-align: center;

    margin: 0 0 1.5rem;

  }

  .brand-guide-banner h2 {

    font-size: 1.8rem;

    font-weight: 400;

    text-align: center;

  }



.brand-guide-container {

  display: flex;

  flex-direction: column;

  /* border: 1px solid #AAC2E7; */

  gap: 1.5rem;

  margin: 0 auto 2rem;

  width: 90%;

  max-width: 120rem;

}



.brand-guide-container section {

  border-radius: 2rem;

  background-color: #f7f9fc;

  padding: 4rem;



}



section.brand-guide-introduction {

  display: grid;

  grid-template-columns: 1fr 1fr;

  align-items: center;

  gap: 2rem;

  margin: 0 auto 0;

}

  .brand-guide-introduction h2 {

    font-size: 2.4rem;

    font-weight: 700;

    margin: 0 0 1.5rem;

    /* text-align: center; */

  }

  .brand-guide-introduction p {

    font-size: 1.6rem;

    font-weight: 400;

    text-align: left;

  } 

  .brand-guide-introduction .highlight {

    font-weight: 500;

    color: #00a9e0;

  }

  .success-pyramid {

    width: 200px;

  }

  .brand-guide-aside {

    padding: 3rem;

    border-radius: 1rem;

    background-color: #ffdd80;

    border: 2px solid #000;

    box-shadow: 0.25rem 0.25rem 0 #000;

  }

  .introduction-right {

    display: flex;

    width: 100%;

    padding: 3rem;

  }



  section.elements-logo {

    display: grid;

    grid-template-columns: 1fr 1fr;

    /* align-items: center; */

    gap: 2rem;

    margin: 0 auto 0;

  }



  .logo-safe {

    height: max-content;

  }



/* How to handle complaints - blog post */

.image-container {

  position: relative;

  display: inline-block;

}



.download-icon {

  position: absolute;

  bottom: 0;

  right: 0;

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

  padding: 3px 10px;

  border-radius: 5px;

  text-decoration: none;

  display: none; /* Initially hidden */

}



.image-container:hover .download-icon {

  display: block; /* Show on hover */

  cursor: pointer;

}



.download-icon img {

  width: 16px; /* Adjust icon size */

  height: 16px; /* Adjust icon size */

}



/* reputation management article */

.stat-box {

  display: flex;

  flex-direction: column;

  align-items: center;

  gap: 0.5rem;

  padding: 2rem;

  border-radius: 1rem;

  border: 1px solid #AAC2E7;

  box-shadow: 0.25rem 0.25rem 0 #AAC2E7;

  justify-content: center;

  margin: 0 auto 3rem;

}

.stat-box p {

  color: #AAC2E7;

  font-size: 2rem;

  font-weight: 600;

  margin: 0;

  /* line-height: 1.5; */

}

.stat-box .source {

  font-size: 1.2rem;

  font-weight: 500;

  color: #AAC2E7;

}



/* Blog Card */



.blog-card {

  display: flex;

  flex-direction: row;

  align-items: stretch;

  border: 0.1em solid var(--color-black);

  border-radius: 3rem;

  box-shadow: 6px 6px 0px 0px #000;

  background-color: var(--color-white);

  margin: 2rem 0 6rem;

  overflow: hidden;

}



.blog-card__image {

  /* border-radius: 2rem; */

  overflow: hidden;

  width: 50%; 

  height: 100%;

  margin-right: 1.5rem;

}



.blog-card__image img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  object-position: center; 

}



.blog-card__content {

  width: 50%;

  padding: 2rem;

  text-align: start;

  align-content: center;

}



.blog-card__title {

  font-weight: 600;

  font-size: 2.4rem;

  margin-bottom: 2rem;

}



.blog-card__description {

  font-size: var(--font-16);

  margin-bottom: 2rem;

}



.blog-card__link {

  font-weight: 500;

  font-size: var(--font-16);

  text-decoration: underline;

  color: var(--color-black);

}



.blog-card__link:hover {

  color: var(--color-black);

}



@media (max-width: 1000px) {

  .blog-card {

    flex-direction: column;

  }



  .blog-card__image,

  .blog-card__content {

    width: 100%;

    height: auto;

    margin-right: 0; 

  }



  .blog-card__image img {

    height: auto;

  }

}

