/* @media(max-width:500px) {
    .home-slider .slider-item
    {
        pointer-events: none;
    }    
} */
.owl-carousel .owl-stage, .owl-carousel.owl-drag .owl-item{
    -ms-touch-action: auto;
        touch-action: auto;
}
.testimony-section
{
    /* background: url(../images/tesimonals.jpg); */
    background-size: 100%;
}

/* Heading */
.upper-header
{
    position: relative;
    background: var(--secondary);
    width: 100%;
}
.homeslider
{
    position: relative;
}
.homeslider .service-marquee
{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    padding: 3rem 0;
    bottom: 1rem;
    overflow: hidden;
    display: flex;
    gap: 1rem;
}

.homeslider .service-marquee a
{
    color: #fff;
    position: absolute;
    width: 200px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 2px solid #fff;
    font-size: 1.25rem;
    padding: 0.4rem 0;
    border-radius: 3rem;
    margin: 1rem;
    animation: marquee 30s linear infinite;
    animation-delay: calc(30s / 8 * (8 - var(--d)) * -1);
}

@keyframes marquee{
    from{
        left: 100%;
    }
    to{
        left:-200px;
    }
}

.about-us-imgBx
{
    position: relative;
    width: 100%;
    height: 100%;
}
.about-us-imgBx img
{
    object-fit: cover;
}

.about-us-imgBx::after
{
    position: absolute;
    content: '';
    width: 300px;
    height: 100px;
    background: var(--primary)90;
    backdrop-filter: blur(3px);
    bottom: -5%;
    right: -30%;
}

.newslatter-img
{
    position: relative;
    margin: auto;
    width: 80%;
    max-width: 250px;
}
.newslatter-img img
{
    filter: drop-shadow(0px 1px 5px #00000050);
    z-index: 2;
}
.newslatter-img .msg-ele
{
    position: absolute;
    filter: none;
    top: 100px;
    left: 170px;
    transform: rotate(16deg)translateX(35px);
}
.newslatter-img .msg-ele.two
{
    left: auto;
    top: 165px;
    right: 170px;
    transform: rotate(-22deg)translateX(-25px);
}
.formBx
{
    width: 100%;
    max-width: 900px;
}
.formBx h2
{
    font-weight: 700;
    font-size: 3rem;
}
.newslatter-form
{
    display: flex;
    gap: 1rem;
    padding: 0 !important;
    margin: 0 !important;
}
.newslatter-form input[type='email']
{
    border: 2px solid var(--primary);
    padding: 0.3rem 2rem;
    font-size: 1.5rem;
    background: #fff;
    outline: none;
    border-radius: 3rem;
}
.newslatter-form input[type='submit']
{
    padding: 0.3rem 2rem;
    font-size: 1.5rem;
    background: #f00;
    color: #fff;
    cursor: pointer;
    outline: none;
    border: none;
    border-radius: 3rem;
}
.no-padding
{
    padding: 0;
}
.statementBx
{
    position: relative;
}
.statementBx :is(p,h3)
{
    color: #fff;
}
.statementBx.alt :is(p,h3)
{
    color: #000;
}
.white-btn
{
    border-radius: 0;
    border: 3px solid #fff;
    color: #fff;
}
.statementBx.alt .white-btn
{
    border: 3px solid #000;
    color: #000;
}

.white-btn:hover,
.white-btn:focus
{
    color: #fff;
}
.services-2
{
    position: relative !important;
    background:#fff;
    backdrop-filter: blur(2px);
    /* aspect-ratio: 1/0.6 !important; */
    z-index: 1 !important;
    overflow: hidden;
}

.services-2 .media-body p
{
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp: 4;
}
.services-2 .back-shutter
{
    position: absolute;
    pointer-events: none;
    content: '';
    background: var(--primary);
    z-index: -1;
    inset: 0.50rem;
    transform: rotate(180deg)scale(4.6);
    /* transform-origin: left bottom !important; */
    /* transform-origin: left !important; */
    opacity: 0;
    transition: 0.5s;
}
.services-2:hover .back-shutter
{
    opacity: 1;
    transform: rotate(0);
}
.services-2:hover .flaticon-layers,
.services-2:hover .media-body :is(p,h3,a)
{
    color: #fff !important;
}

.testimony-wrap
{
    position: relative;
    background: #fff;
    aspect-ratio: 1/1.2;
    padding-top: 8rem !important;
}

.center .testimony-wrap
{
    transform: scale(1.03);
    border: 2px solid var(--primary);
}
.testimony-wrap .user-img
{
    position: absolute;
    max-width: 150px;
    left: 50%;
    top: 13px;
    transform: translateX(-50%)translateY(-40%);
    aspect-ratio: 1;
}
.testimony-wrap .user-img img
{
    position: relative;
    max-width: 100%;
    height: 100%;
    box-shadow: 0 15px 20px #0005;
    
    border-radius: 50%;
    object-fit: cover;
}

.testimony-wrap .name
{
    border-bottom: 3px double var(--primary);
    text-align: center;
    color: var(--primary);
    font-weight: 600;
    font-size: 1.7rem;
}
.testimony-wrap .text
{
    text-align: center;
}
.testimony-wrap .text::before
{
    position: absolute;
    top: 60%;
    left: 50%;
    transform: translate(-50%, -50%);
    content: '\f10e';
    font-family: 'fontAwesome';
    color:var(--primary);
    transform: scale(10);
    opacity: 0.5;
    z-index: 0;
}
.testimony-wrap .text p
{
    position: relative;
    font-weight: bold;
    color: #000;
    z-index: 2;
}
.logo
{
    width:260px;
}


.service-img
{
    position: relative;
    background: linear-gradient(to right, #1e82b6, var(--primary));
}
.service-img:before, .service-img:after
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  -webkit-box-shadow: 0 15px 10px #777;
  -moz-box-shadow: 0 15px 10px #777;
  box-shadow: 0 15px 10px #777;
  -webkit-transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  transform: rotate(-3deg);
}
.service-img:after
{
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}

#bottomtotop
{
    position: fixed;
    z-index: 999;
    right: -40px;
    bottom: 10rem;
    width: 40px;
    font-size: 1.5rem;
    aspect-ratio: 1;
    background: var(--primary);
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: 0.4s;
}
#bottomtotop.show
{
    right: 0;
}
.cards
{
    position: relative;
    box-shadow: 0 0 0px 0 rgba(0, 0, 0, 0.5);
    padding: 1rem;
    border-radius: 12px;
    vertical-align: unset;
    font-size: 14px;
    line-height: 22px;
    cursor: pointer;
    transition: 0.4s;
    border: 1px solid #666;
    overflow: hidden;
    z-index: 1;
}
.cards .cards-body .heading{
    font-weight: 600;
}
.cards .cards-body
{
    gap: 1rem;
}
.cards::after
{
    position: absolute;
    content: '';
    background: var(--primary);
    width: 10px;
    aspect-ratio: 1;
    left: 50%;
    top: 50%;
    opacity: 0;
    transform: translate(-50%,-50%);
    border-radius: 50%;
    z-index: -1;
    transition: 1s ease-out width;
}
.cards:hover::after
{
    width:300%;
    background: var(--primary);
    opacity: 1;
    transform: translate(-50%,-50%);
}
.cards .iconBX
{
    position: relative;
    min-width: 120px;
    width: 120px;
    height: 120px;
    /* aspect-ratio: 1; */
    font-size: 3rem;
    /* border: 12px solid var(--primary); */
    display: flex;
    justify-content: center;
    align-items: center;
}
.cards .iconBX::before{
    position: absolute;
    content: '';
    inset: 0;
    border-radius: 50%;
    border: 8px dashed var(--primary);
    animation: borderRotate 20s linear infinite;
}
@keyframes borderRotate{
    0%{
        transform: rotate(0deg);
    }100%{
        transform: rotate(360deg);
    }
}
.cards :is(.iconBX,h3)
{
    color: var(--primary);
}
.cards:hover :is(.iconBX,h3,p)
{
    color: #fff;
}
.cards:hover .iconBX::before{
    border-color: #fff;
}
.cards:hover
{
    box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.5);
}
/* Responcive */
@media (max-width: 992px) 
{
    .sidebar 
    {
        margin-top: 5em; 
    } 
}
@media (max-width: 768px) 
{
    .sidebar 
    {
        margin-top: 5em; 
    } 
}
@media (max-width: 576px) 
{
    .sidebar 
    {
        margin-top: 5em; 
    }
    .logo
    {
        width:200px;
    }
}


.team-section{
    background: linear-gradient(91deg, var(--primary)8f, var(--primary));
}

.team-section .col-md-3:hover .staff .text, 
.team-section .col-md-3:focus .staff .text {
    margin-top: -50px; 
}
.team-section .col-md-3:hover .staff .text .faded, 
.team-section .col-md-3:focus .staff .text .faded {
    opacity: 1; 
}

.new-latter{
    --bg-opacity:#c5c9cf8c;
    background: linear-gradient(var(--bg-opacity),var(--bg-opacity)) , url(../images/bg1.png);
    background-attachment: fixed;
}
.contact-section
{
    background: linear-gradient(#0007, #0007), url(../images/banner4.jpg);
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
}
.contact-section .homecontactform{
    background: #fff9;
    backdrop-filter: blur(3px);
}

.team-section{
    background: linear-gradient(45deg, #f6f6f8,#f6f6f8);
    background-size: cover;
}
.team-section .team-cards
{
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100%;
    --padding:0.7rem;
    transition: 0.4s;
}
.team-section .team-cards:hover{
    transform: translateY(-5px);
}
.team-section .team-cards .team-imgBx{
    background: #fff;
    padding: calc(var(--padding) + 10px);
    border-radius: 50% 50% 0 0;
}
.team-section .team-cards .team-imgBx img
{
    position: relative;
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 50%;
}
.team-section .team-cards .team-info{
    background: #fff;
    flex: 1;
    padding: var(--padding);
}
.team-section .team-name h2,
.team-section .team-position p
{
    position: relative;
    font-size: 20px;
}
.team-section p{
    color: #777;
}
.team-section .team-position p{
    color: #333;
    text-transform: uppercase;
    font-size: 25px;
    font-weight: 700;
}

.team-section .team-description
{
    max-height: 300px;
    overflow: auto;
}
.team-section .team-description::-webkit-scrollbar{
    /*width: 8px;*/
}
