/*Banner*/

.gallery-banner{

    background:#183b5b;

    padding:90px 0;

}

.gallery-banner h1{

    color:#fff;
    font-size:46px;
    font-weight:700;

}

.gallery-banner p{

    color:#ddd;
    font-size:18px;

}


/*Tabs*/

.gallery-tabs-wrapper{

    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;

}

.gallery-tabs-wrapper::-webkit-scrollbar{

    display:none;

}

.gallery-tabs{

    width:max-content;
    flex-wrap:nowrap;

}

.gallery-tabs .nav-item{

    flex:0 0 auto;
    margin-right:10px;

}

.gallery-tabs .nav-link{

    background:#fff;
    color:#183b5b;

    border:2px solid #183b5b;

    border-radius:10px;

    padding:6px 15px;

    font-weight:600;

    white-space:nowrap;

    transition:.4s;

}

.gallery-tabs .nav-link:hover{

    background:#183b5b;
    color:#fff;

}

.gallery-tabs .nav-link.active{

    background:#183b5b !important;
    color:#fff !important;

}


/*
Gallery Card
*/

.gallery-card{

    overflow:hidden;

    border-radius:15px;

    background:#fff;

    box-shadow:0 8px 25px rgba(0,0,0,.12);

    transition:.4s;

}

.gallery-card:hover{

    transform:translateY(-5px);

}

.gallery-card img{

    width:100%;

    height:270px;

    object-fit:cover;

    transition:.5s;

}

.gallery-card:hover img{

    transform:scale(1.08);

}


/*
Responsive
*/

@media(max-width:992px){

.gallery-banner{

padding:70px 0;

}

.gallery-banner h1{

font-size:38px;

}

.gallery-card img{

height:240px;

}

}


@media(max-width:768px){

.gallery-banner{

padding:60px 0;

}

.gallery-banner h1{

font-size:30px;

}

.gallery-banner p{

font-size:15px;

}

.gallery-tabs{

justify-content:flex-start !important;

}

.gallery-tabs .nav-item{

margin-right:8px;

}

.gallery-tabs .nav-link{

padding:10px 18px;

font-size:14px;

}

.gallery-card img{

height:220px;

}

}


@media(max-width:576px){

.gallery-banner{

padding:50px 0;

}

.gallery-banner h1{

font-size:26px;

}

.gallery-banner p{

font-size:14px;

}

.gallery-tabs .nav-link{

padding:8px 15px;

font-size:13px;

}

.gallery-card img{

height:200px;

}

}