.why-us{

    padding:90px 0;
  
    position:relative;

}

.section-title{

    margin-bottom:60px;

}

.small-title{

    display:inline-block;
    background:#ffe14d;
    color:#333;
    padding:8px 20px;
    border-radius:30px;
    font-weight:700;
    margin-bottom:15px;
    font-size:15px;

}

.section-title h2{

    font-size:42px;
    font-weight:800;
    color:#2e3192;
    margin-bottom:20px;

}

.section-title p{

    max-width:700px;
    margin:auto;
    color:#666;
    line-height:30px;
    font-size:17px;

}

.choose-box{

    background:#fff;
    border-radius:30px;
    padding:35px 25px;
    text-align:center;
    margin-bottom:35px;
    transition:.4s;
    position:relative;
    overflow:hidden;
    box-shadow:0 15px 40px rgba(0,0,0,.08);

}

.choose-box:hover{

    transform:translateY(-10px);

}

.icon{

    width:90px;
    height:90px;
    margin:auto;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:42px;
    color:#fff;
    margin-bottom:25px;

}

.choose-box h4{

    font-weight:700;
    margin-bottom:15px;
    color:#333;

}

.choose-box p{

    color:#666;
    line-height:28px;

}

/* Colors */

.blue .icon{

background:#29b6f6;

}

.yellow .icon{

background:#ffca28;

}

.green .icon{

background:#66bb6a;

}

.purple .icon{

background:#9c27b0;

}

.orange .icon{

background:#ff9800;

}

.pink .icon{

background:#ff4f9b;

}

.blue2 .icon{

background:#3f8cff;

}

.green2 .icon{

background:#00c853;

}

/* Top Border */

.blue{

border-top:8px solid #29b6f6;

}

.yellow{

border-top:8px solid #ffca28;

}

.green{

border-top:8px solid #66bb6a;

}

.purple{

border-top:8px solid #9c27b0;

}

.orange{

border-top:8px solid #ff9800;

}

.pink{

border-top:8px solid #ff4f9b;

}

.blue2{

border-top:8px solid #3f8cff;

}

.green2{

border-top:8px solid #00c853;

}

/* Hover */

.choose-box:hover .icon{

transform:rotate(10deg) scale(1.08);

transition:.4s;

}

/* Mobile */

@media(max-width:767px){

.section-title h2{

font-size:30px;

}

.choose-box{

margin-bottom:25px;

}

}
/*=========================
      OUR PROGRAMS
=========================*/

.program-section{
    padding:100px 0;
    /* background:linear-gradient(180deg,#f8fdff 0%,#fffdf6 100%); */
    position:relative;
    overflow:hidden;
}

/* Decorative Shapes */

.program-section:before{
    content:"";
    position:absolute;
    width:350px;
    height:350px;
    background:#dff5ff;
    border-radius:50%;
    top:-170px;
    left:-120px;
}

.program-section:after{
    content:"";
    position:absolute;
    width:280px;
    height:280px;
    background:#fff4c8;
    border-radius:50%;
    bottom:-140px;
    right:-80px;
}

/*=========================
      CARD
=========================*/

.program-box{

    background:#fff;
    border-radius:35px;
    margin-bottom:60px;
    overflow:hidden;
    box-shadow:0 20px 60px rgba(0,0,0,.08);
    transition:.45s;
    position:relative;

}

.program-box:hover{

    transform:translateY(-10px);
    box-shadow:0 35px 70px rgba(0,0,0,.12);

}

/* Colored Border */

.program-box:nth-child(2){

    border-left:10px solid #ffcb05;

}

.program-box:nth-child(3){

    border-left:10px solid #36c2ff;

}

.program-box:nth-child(4){

    border-left:10px solid #59c94d;

}

.program-box:nth-child(5){

    border-left:10px solid #9b59ff;

}

/*=========================
      IMAGE
=========================*/

.program-img{
    width:100%;
    aspect-ratio: 4 / 3;   /* Ya 16/10, 1/1 according to design */
    overflow:hidden;
    position:relative;
    border-radius:12px;    /* Optional */
}

.program-img img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    display:block;
    transition:transform .6s ease;
    margin-top: 36px;
}

.program-box:hover .program-img img{
    transform:scale(1.05);
}
/* Floating Age */

.age-tag{

    position:absolute;
    top:20px;
    left:20px;
    background:#fff;
    color:#ff9800;
    font-size:14px;
    font-weight:700;
    padding:10px 22px;
    border-radius:50px;
    box-shadow:0 10px 25px rgba(0,0,0,.12);

}

/*=========================
      CONTENT
=========================*/

.program-content{

    padding:45px;

}

.program-number{

    position:absolute;
    top:20px;
    right:30px;
    font-size:85px;
    font-weight:800;
    color:#f2f6ff;
    line-height:1;

}

.program-content h3{

    font-size:34px;
    font-weight:800;
    color:#2d2d2d;
    margin-bottom:18px;

}

.program-content p{

    color:#666;
    font-size:16px;
    line-height:30px;
    margin-bottom:25px;

}

/*=========================
       FEATURES
=========================*/

.program-content ul{

    list-style:none;
    padding:0;
    margin:0 0 30px;

}

.program-content ul li{

    display:inline-block;
    background:#f5f8ff;
    padding:12px 18px;
    margin:7px;
    border-radius:50px;
    font-size:14px;
    font-weight:600;
    color:#444;
    transition:.35s;

}

.program-content ul li:hover{

    background:#36c2ff;
    color:#fff;

}

.program-content ul li i{

    color:#ff9800;
    margin-right:8px;

}

.program-content ul li:hover i{

    color:#fff;

}

/*=========================
       BUTTON
=========================*/

.program-btn{

    display:inline-block;
    padding:15px 35px;
    background:linear-gradient(45deg,#36c2ff,#6b63ff);
    color:#fff;
    font-size:15px;
    font-weight:700;
    border-radius:60px;
    text-decoration:none;
    transition:.4s;
    box-shadow:0 15px 30px rgba(54,194,255,.30);

}

.program-btn i{

    margin-left:8px;
    transition:.4s;

}

.program-btn:hover{

    color:#fff;
    text-decoration:none;
    background:linear-gradient(45deg,#ff9800,#ff4f81);

}

.program-btn:hover i{

    transform:translateX(6px);

}

/*=========================
     RESPONSIVE
=========================*/

@media(max-width:991px){

.program-img{

height:320px;

}

.program-content{

padding:35px;

}

.program-number{

display:none;

}

}

@media(max-width:767px){

.program-section{

padding:70px 0;

}

.program-box{

border-left:none;
border-top:8px solid #36c2ff;

}

.program-content{

padding:30px 25px;

}

.program-content h3{

font-size:28px;

}

.program-content ul li{

display:block;
margin:10px 0;

}

.program-btn{

display:block;
text-align:center;

}

}
/*======================================
        OUR FACILITIES
======================================*/

.facilities-section{

    position:relative;
    padding:110px 0;
    overflow:hidden;
    background:linear-gradient(135deg,#e8f9ff 0%,#fff8e8 40%,#f9efff 100%);

}

/* Decorative Background Shapes */

.facilities-section:before{

    content:"";
    position:absolute;
    width:420px;
    height:420px;
    background:#c7f0ff;
    border-radius:50%;
    top:-180px;
    left:-120px;
    opacity:.5;

}

.facilities-section:after{

    content:"";
    position:absolute;
    width:350px;
    height:350px;
    background:#ffe8b6;
    border-radius:50%;
    bottom:-150px;
    right:-120px;
    opacity:.6;

}

/* Floating Dots */

.facilities-section .container{

    position:relative;
    z-index:2;

}

.facilities-section .container:before{

    content:"";
    position:absolute;
    width:18px;
    height:18px;
    background:#ff5fa2;
    border-radius:50%;
    top:60px;
    right:120px;
    box-shadow:
    -60px 80px #35c5ff,
    120px 180px #ffd33d,
    -150px 250px #7ed957,
    40px 320px #9b5cff;

}

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

.section-heading span{

    display:inline-block;
    background:#ffffff;
    color:#ff7b00;
    padding:10px 25px;
    border-radius:50px;
    font-weight:700;
    letter-spacing:.5px;
    margin-bottom:20px;
    box-shadow:0 8px 20px rgba(0,0,0,.08);

}

.section-heading h2{

    font-size:46px;
    font-weight:800;
    color:#273c75;
    margin-bottom:20px;

}

.section-heading p{

    max-width:700px;
    margin:0 auto 70px;
    color:#666;
    line-height:30px;
    font-size:17px;

}

/*=========================
      CARD
=========================*/

.facility-card{

    background:rgba(255,255,255,.82);
    backdrop-filter:blur(8px);
    border-radius:30px;
    padding:45px 30px;
    text-align:center;
    margin-bottom:35px;
    position:relative;
    overflow:hidden;
    transition:.45s;
    box-shadow:0 20px 40px rgba(0,0,0,.08);

}

/* Different Heights */

.facility-card:nth-child(odd){

    margin-top:25px;

}

/* Hover */

.facility-card:hover{

    transform:translateY(-12px) rotate(-1deg);
    box-shadow:0 25px 60px rgba(0,0,0,.15);

}

/* Top Shape */

.facility-card:before{

    content:"";
    position:absolute;
    width:140px;
    height:140px;
    border-radius:50%;
    top:-70px;
    right:-70px;
    opacity:.18;

}

/*=========================
      ICON
=========================*/

.facility-icon{

    width:95px;
    height:95px;
    border-radius:50%;
    margin:0 auto 25px;
    display:flex;
    justify-content:center;
    align-items:center;
    color:#fff;
    font-size:38px;
    transition:.4s;

}

.facility-card:hover .facility-icon{

    transform:rotate(10deg) scale(1.12);

}

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

.facility-card h3{

    font-size:24px;
    font-weight:700;
    color:#2d3436;
    margin-bottom:15px;

}

.facility-card p{

    color:#666;
    line-height:28px;
    font-size:15px;

}

/*=========================
      COLORS
=========================*/

.yellow .facility-icon{

    background:#ffc107;

}

.yellow:before{

    background:#ffc107;

}

.blue .facility-icon{

    background:#28b5ff;

}

.blue:before{

    background:#28b5ff;

}

.green .facility-icon{

    background:#4cc96b;

}

.green:before{

    background:#4cc96b;

}

.pink .facility-icon{

    background:#ff5fa2;

}

.pink:before{

    background:#ff5fa2;

}

.purple .facility-icon{

    background:#8f5cff;

}

.purple:before{

    background:#8f5cff;

}

.orange .facility-icon{

    background:#ff8c3a;

}

.orange:before{

    background:#ff8c3a;

}

/*=========================
      BUTTON (Optional)
=========================*/

.facility-btn{

    margin-top:20px;
    display:inline-block;
    color:#273c75;
    font-weight:700;
    transition:.35s;

}

.facility-btn i{

    margin-left:8px;
    transition:.35s;

}

.facility-btn:hover{

    text-decoration:none;

}

.facility-btn:hover i{

    margin-left:15px;

}

/*=========================
      RESPONSIVE
=========================*/

@media(max-width:991px){

.section-heading h2{

font-size:36px;

}

.facility-card{

margin-top:0 !important;

}

}

@media(max-width:767px){

.facilities-section{

padding:80px 0;

}

.section-heading h2{

font-size:30px;

}

.section-heading p{

font-size:15px;

}

.facility-card{

padding:35px 25px;

}

.facility-icon{

width:80px;
height:80px;
font-size:32px;

}

}
/*==============================
        ABOUT SECTION
===============================*/

.about-section{
    position:relative;
    padding:110px 0;
    background:linear-gradient(135deg,#fffdf8 0%,#eef9ff 50%,#fff4f8 100%);
    overflow:hidden;
}

/* Decorative Background */

.about-section:before{
    content:"";
    position:absolute;
    width:380px;
    height:380px;
    background:#d8f4ff;
    border-radius:50%;
    top:-180px;
    left:-120px;
    opacity:.6;
}

.about-section:after{
    content:"";
    position:absolute;
    width:300px;
    height:300px;
    background:#ffe7a7;
    border-radius:50%;
    right:-100px;
    bottom:-120px;
    opacity:.6;
}

.about-section .container{
    position:relative;
    z-index:2;
}

/*==============================
        IMAGE AREA
===============================*/

.about-images{
    position:relative;
    padding:30px 30px 80px;
}

.main-img{
    border-radius:35px;
    overflow:hidden;
    box-shadow:0 25px 60px rgba(0,0,0,.12);
}

.main-img img{
    width:100%;
    transition:.5s;
}

.main-img:hover img{
    transform:scale(1.08);
}

.small-img{
    position:absolute;
    width:220px;
    bottom:0;
    right:0;
    border-radius:25px;
    overflow:hidden;
    border:8px solid #fff;
    box-shadow:0 15px 40px rgba(0,0,0,.12);
}

.small-img img{
    width:100%;
}

/* Experience Badge */

.experience{
    position:absolute;
    left:0;
    top:40px;
    background:#ffcb05;
    color:#333;
    width:140px;
    height:140px;
    border-radius:50%;
    text-align:center;
    display:flex;
    flex-direction:column;
    justify-content:center;
    box-shadow:0 15px 35px rgba(255,203,5,.35);
    animation:float 3s ease-in-out infinite;
}

.experience h3{
    margin:0;
    font-size:40px;
    font-weight:800;
}

.experience span{
    font-size:14px;
    font-weight:600;
    line-height:20px;
    padding:0 10px;
}

@keyframes float{

0%,100%{
transform:translateY(0);
}

50%{
transform:translateY(-10px);
}

}

/*==============================
        CONTENT
===============================*/

.about-content{
    padding:20px 15px;
}

.about-tag{

    display:inline-block;
    background:#ffffff;
    color:#ff7b00;
    padding:10px 24px;
    border-radius:50px;
    font-weight:700;
    box-shadow:0 8px 20px rgba(0,0,0,.08);
    margin-bottom:20px;

}

.about-content h2{

    font-size:44px;
    font-weight:800;
    color:#2e3192;
    margin-bottom:25px;
    line-height:55px;

}

.about-content p{

    color:#666;
    line-height:31px;
    font-size:16px;
    margin-bottom:35px;

}

/*==============================
       CHECK LIST
===============================*/

.about-list{
    display:flex;
    flex-wrap:wrap;
    margin-bottom:35px;
}

.list-item{

    width:50%;
    margin-bottom:18px;
    font-size:16px;
    color:#444;
    font-weight:600;

}

.list-item i{

    color:#39c86d;
    margin-right:10px;
    font-size:18px;

}

/*==============================
        BUTTON
===============================*/

.about-btn{

    display:inline-block;
    padding:16px 36px;
    background:linear-gradient(45deg,#ff9a00,#ff4f81);
    color:#fff;
    border-radius:60px;
    font-weight:700;
    text-decoration:none;
    transition:.4s;
    box-shadow:0 18px 35px rgba(255,120,0,.25);

}

.about-btn i{

    margin-left:8px;
    transition:.4s;

}

.about-btn:hover{

    color:#fff;
    text-decoration:none;
    transform:translateY(-5px);
    background:linear-gradient(45deg,#2ec5ff,#5567ff);

}

.about-btn:hover i{

    margin-left:15px;

}

/*==============================
        COUNTER
===============================*/

.counter-row{

    margin-top:90px;

}

.counter-box{

    background:#fff;
    border-radius:25px;
    padding:35px 20px;
    text-align:center;
    transition:.4s;
    box-shadow:0 15px 35px rgba(0,0,0,.08);

}

.counter-box:hover{

    transform:translateY(-10px);

}

.counter-box i{

   line-height: 80px;
    border-radius: 50%;
    background: linear-gradient(45deg, #35c5ff, #6f63ff);
    color: #fff;
    font-size: 35px;
    margin-bottom: 20px;
    padding: 11px;

}

.counter-box h3{

    margin:0;
    font-size:34px;
    font-weight:800;
    color:#2e3192;

}

.counter-box p{

    margin-top:10px;
    color:#666;
    font-weight:600;

}

/* Different Icon Colors */

.counter-box:nth-child(2) i{

background:linear-gradient(45deg,#ffc107,#ff9800);

}

.counter-box:nth-child(3) i{

background:linear-gradient(45deg,#00d084,#39c86d);

}

.counter-box:nth-child(4) i{

background:linear-gradient(45deg,#ff5fa2,#a855f7);

}

/*==============================
        RESPONSIVE
===============================*/

@media(max-width:991px){

.about-content{

margin-top:40px;

}

.small-img{

width:180px;

}

.about-content h2{

font-size:34px;
line-height:44px;

}

.counter-box{

margin-bottom:30px;

}

}

@media(max-width:767px){

.about-section{

padding:70px 0;

}

.about-images{

padding:0 0 70px;

}

.experience{

width:110px;
height:110px;

}

.experience h3{

font-size:30px;

}

.small-img{

width:140px;
right:10px;

}

.about-content h2{

font-size:28px;
line-height:38px;

}

.list-item{

width:100%;

}

.counter-row{

margin-top:50px;

}

}

/*====================================
          FAQ SECTION
====================================*/

.faq-section{
    position:relative;
    padding:100px 0;
    /* background:linear-gradient(135deg,#f4fbff 0%,#fff8ea 50%,#fdf2ff 100%); */
    overflow:hidden;
}

/* Background Shapes */

.faq-section:before{
    content:'';
    position:absolute;
    width:350px;
    height:350px;
    background:#cfefff;
    border-radius:50%;
    top:-170px;
    left:-120px;
    opacity:.6;
}

.faq-section:after{
    content:'';
    position:absolute;
    width:300px;
    height:300px;
    background:#ffe8b8;
    border-radius:50%;
    bottom:-120px;
    right:-100px;
    opacity:.5;
}

.faq-section .container{
    position:relative;
    z-index:2;
}

/*====================================
        LEFT IMAGE
====================================*/

.faq-image{
    position:relative;
    padding:20px;
}

.faq-image img{
    width:100%;
    border-radius:35px;
    box-shadow:0 25px 60px rgba(0,0,0,.12);
}

/* Floating Card */

.faq-card{

    position:absolute;
    right:-10px;
    bottom:30px;
    width:240px;
    background:#fff;
    border-radius:25px;
    padding:25px;
    text-align:center;
    box-shadow:0 20px 45px rgba(0,0,0,.12);
    animation:floatCard 3s ease-in-out infinite;

}

.faq-card i{

    width:70px;
    height:70px;
    line-height:70px;
    border-radius:50%;
    display:inline-block;
    background:linear-gradient(45deg,#ff9800,#ff4f81);
    color:#fff;
    font-size:28px;
    margin-bottom:15px;

}

.faq-card h4{

    font-size:22px;
    font-weight:700;
    color:#2e3192;
    margin-bottom:10px;

}

.faq-card p{

    margin:0;
    color:#666;
    line-height:26px;

}

@keyframes floatCard{

0%,100%{
transform:translateY(0);
}

50%{
transform:translateY(-10px);
}

}

/*====================================
       CONTENT
====================================*/

.faq-tag{

    display:inline-block;
    padding:10px 22px;
    background:#fff;
    border-radius:50px;
    color:#ff7b00;
    font-weight:700;
    box-shadow:0 8px 18px rgba(0,0,0,.08);
    margin-bottom:18px;

}

.faq-content h2{

    font-size:42px;
    font-weight:800;
    color:#2e3192;
    margin-bottom:18px;

}

.faq-content>p{

    color:#666;
    line-height:30px;
    margin-bottom:40px;
    font-size:16px;

}

/*====================================
      ACCORDION
====================================*/

.panel{

    border:none;
    border-radius:18px !important;
    margin-bottom:18px !important;
    overflow:hidden;
    box-shadow:0 12px 35px rgba(0,0,0,.08);

}

.panel-default>.panel-heading{

    background:#fff;
    border:none;
    padding:0;

}

.panel-title>a{

    display:block;
    padding:22px 65px 22px 25px;
    font-size:17px;
    font-weight:700;
    color:#333;
    text-decoration:none;
    position:relative;
    transition:.3s;

}

.panel-title>a:hover{

    background:#f8fcff;

}

/* Plus Icon */

.panel-title>a:after{

    content:"+";
    position:absolute;
    right:25px;
    top:50%;
    transform:translateY(-50%);
    width:34px;
    height:34px;
    line-height:34px;
    border-radius:50%;
    text-align:center;
    background:#2ec5ff;
    color:#fff;
    font-size:22px;
    font-weight:bold;
    transition:.3s;

}

/* Minus */

.panel-title>a[aria-expanded="true"]:after{

    content:"−";
    background:#ff9800;

}

.panel-body{

    border:none !important;
    padding:0 25px 25px;
    color:#666;
    line-height:30px;
    font-size:15px;
    background:#fff;

}

/* Active */

.panel-collapse.in{

    border-top:1px dashed #eee;

}

/*====================================
      RESPONSIVE
====================================*/

@media(max-width:991px){

.faq-image{

margin-bottom:50px;

}

.faq-card{

right:20px;
bottom:-20px;

}

.faq-content h2{

font-size:34px;

}

}

@media(max-width:767px){

.faq-section{

padding:70px 0;

}

.faq-content h2{

font-size:28px;
line-height:40px;

}

.faq-card{

position:relative;
width:100%;
right:auto;
bottom:auto;
margin-top:20px;

}

.panel-title>a{

font-size:15px;
padding:18px 55px 18px 18px;

}

.panel-body{

padding:0 18px 20px;

}

}
/*==========================================
            PHOTO GALLERY
==========================================*/

.home-gallery{
    position:relative;
    padding:100px 0;
    overflow:hidden;
    background:linear-gradient(135deg,#c58d05 0%,#dca51a 30%,#f2c94c 70%,#fff6df 100%);
}

/* Background Shapes */

.home-gallery:before{
    content:"";
    position:absolute;
    width:450px;
    height:450px;
    border-radius:50%;
    background:rgba(255,255,255,.12);
    top:-180px;
    left:-150px;
}

.home-gallery:after{
    content:"";
    position:absolute;
    width:320px;
    height:320px;
    border-radius:50%;
    background:rgba(255,255,255,.10);
    right:-100px;
    bottom:-120px;
}

.home-gallery .container{
    position:relative;
    z-index:2;
}

/*==========================================
            HEADING
==========================================*/

.home-gallery h2{

    text-align:center;
    color:#fff;
    font-size:48px;
    font-weight:800;
    margin-bottom:20px;
    position:relative;

}

.home-gallery h2:after{

    content:"";
    width:90px;
    height:5px;
    background:#fff;
    display:block;
    margin:18px auto 0;
    border-radius:20px;

}

/*==========================================
            GALLERY GRID
==========================================*/

.gallery-wrap{

    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
    margin-top:60px;

}

/*==========================================
            CARD
==========================================*/

.gallery-card{

    background:#fff;
    padding:12px;
    border-radius:24px;
    overflow:hidden;
    position:relative;
    transition:.45s;
    box-shadow:0 20px 45px rgba(0,0,0,.15);

}

.gallery-card:hover{

    transform:translateY(-12px);
    box-shadow:0 30px 60px rgba(0,0,0,.22);

}

/* Colorful Top Border */

.gallery-card:nth-child(1){

border-top:8px solid #29b6f6;

}

.gallery-card:nth-child(2){

border-top:8px solid #ff9800;

}

.gallery-card:nth-child(3){

border-top:8px solid #66bb6a;

}

.gallery-card:nth-child(4){

border-top:8px solid #ec407a;

}

.gallery-card:nth-child(5){

border-top:8px solid #7e57c2;

}

.gallery-card:nth-child(6){

border-top:8px solid #26c6da;

}

/*==========================================
            IMAGE
==========================================*/

.gallery-card a{

    display:block;
    position:relative;
    overflow:hidden;
    border-radius:18px;

}

.gallery-card img{

    width:100%;
    height:320px;
    object-fit:cover;
    object-position:center;
    display:block;
    border-radius:18px;
    transition:.7s;

}

.gallery-card:hover img{

    transform:scale(1.08);

}

/*==========================================
            OVERLAY
==========================================*/

.gallery-card a:before{

    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(to top,rgba(0,0,0,.75),rgba(0,0,0,.10));
    opacity:0;
    transition:.4s;
    border-radius:18px;
    z-index:1;

}

.gallery-card:hover a:before{

    opacity:1;

}

/*==========================================
          CAMERA ICON
==========================================*/

.gallery-card a:after{

    content:"\F42A";
    font-family:"bootstrap-icons";
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%) scale(.5);
    width:65px;
    height:65px;
    line-height:65px;
    text-align:center;
    background:#fff;
    color:#ff9800;
    border-radius:50%;
    font-size:28px;
    opacity:0;
    transition:.4s;
    z-index:2;

}

.gallery-card:hover a:after{

    opacity:1;
    transform:translate(-50%,-50%) scale(1);

}

/*==========================================
            TITLE
==========================================*/

.hide-desc{

    position:absolute;
    left:25px;
    bottom:20px;
    color:#fff;
    font-size:22px;
    font-weight:700;
    z-index:3;
    opacity:0;
    transition:.4s;
    transform:translateY(20px);

}

.gallery-card:hover .hide-desc{

    opacity:1;
    transform:translateY(0);

}

/*==========================================
      BOTTOM IMAGE
==========================================*/

.bottom-img{

    position:absolute;
    bottom:0;
    left:0;
    width:180px;
    z-index:1;
    opacity:.9;

}

/*==========================================
        RESPONSIVE
==========================================*/

@media(max-width:991px){

.gallery-wrap{

grid-template-columns:repeat(2,1fr);

}

.home-gallery h2{

font-size:38px;

}

.gallery-card img{

height:280px;

}

}

@media(max-width:767px){

.home-gallery{

padding:70px 0;

}

.gallery-wrap{

grid-template-columns:1fr;
gap:20px;

}

.home-gallery h2{

font-size:30px;

}

.gallery-card img{

height:250px;

}

.bottom-img{

width:110px;

}

}
/*=========================================
            VIDEO SECTION
=========================================*/

.video-section{
    padding:100px 0;
    position:relative;
    overflow:hidden;
    background:linear-gradient(135deg,#fffaf0 0%,#f4d35e 35%,#e9b949 70%,#fff8e8 100%);
}

/* Background Shapes */

.video-section::before{
    content:"";
    position:absolute;
    width:380px;
    height:380px;
    background:rgba(255,255,255,.18);
    border-radius:50%;
    top:-180px;
    left:-120px;
}

.video-section::after{
    content:"";
    position:absolute;
    width:280px;
    height:280px;
    background:rgba(255,255,255,.15);
    border-radius:50%;
    bottom:-120px;
    right:-100px;
}

.video-section .container{
    position:relative;
    z-index:2;
}

/*=========================================
            TITLE
=========================================*/

.title-tag{

    display:inline-block;
    padding:10px 24px;
    background:#fff;
    color:#c88700;
    font-weight:700;
    border-radius:40px;
    margin-bottom:18px;
    box-shadow:0 8px 20px rgba(0,0,0,.08);

}

.video-section h2{

    font-size:46px;
    font-weight:800;
    color:#fff;
    margin-bottom:18px;

}

.video-section .section-title p{

    max-width:700px;
    margin:0 auto 60px;
    color:#fff;
    font-size:16px;
    line-height:30px;

}

/*=========================================
            VIDEO CARD
=========================================*/

.video-card{

    background:#fff;
    border-radius:22px;
    overflow:hidden;
    margin-bottom:30px;
    transition:.4s;
    box-shadow:0 18px 40px rgba(0,0,0,.12);

}

.video-card:hover{

    transform:translateY(-8px);
    box-shadow:0 25px 55px rgba(0,0,0,.18);

}

/* Different Top Colors */

.col-md-4:nth-child(1) .video-card{
    border-top:7px solid #29b6f6;
}

.col-md-4:nth-child(2) .video-card{
    border-top:7px solid #ff9800;
}

.col-md-4:nth-child(3) .video-card{
    border-top:7px solid #4caf50;
}

/*=========================================
            VIDEO
=========================================*/

.video-box{
    background:#000;
}

.video-box video{

    width:100%;
    
    display:block;
    border:none;
    outline:none;
    object-fit:cover;

}

/*=========================================
            CONTENT
=========================================*/

.video-content{

    padding:22px;

}

.video-content h4{

    font-size:22px;
    font-weight:700;
    color:#2e3192;
    margin-bottom:10px;

}

.video-content p{

    margin:0;
    color:#666;
    line-height:28px;
    font-size:15px;

}

/*=========================================
            RESPONSIVE
=========================================*/

@media(max-width:991px){

.video-section h2{

    font-size:36px;

}

.video-box video{

}

}

@media(max-width:767px){

.video-section{

    padding:70px 0;

}

.video-section h2{

    font-size:30px;

}

.video-section .section-title p{

    margin-bottom:40px;

}

.video-card{

    margin-bottom:25px;

}

.video-box video{

   

}

}