@font-face {
    font-family: 'gilroy-medium';
    src: url('../font/Gilroy-Medium.eot');
    src: url('../font/Gilroy-Medium.eot?#iefix') format('embedded-opentype'),
        url('../font/Gilroy-Medium.woff2') format('woff2'),
        url('../font/Gilroy-Medium.woff') format('woff'),
        url('../font/Gilroy-Medium.ttf') format('truetype'),
        url('../font/Gilroy-Medium.svg#Gilroy-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'gilroy-heavy';
    src: url('../font/Gilroy-Heavy.eot');
    src: url('../font/Gilroy-Heavy.eot?#iefix') format('embedded-opentype'),
        url('../font/Gilroy-Heavy.woff2') format('woff2'),
        url('../font/Gilroy-Heavy.woff') format('woff'),
        url('Gilroy-Heavy.ttf') format('truetype'),
        url('../font/Gilroy-Heavy.svg#Gilroy-Heavy') format('svg');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'gilroy-light';
    src: url('../font/Gilroy-Light.eot');
    src: url('../font/Gilroy-Light.eot?#iefix') format('embedded-opentype'),
        url('../font/Gilroy-Light.woff2') format('woff2'),
        url('../font/Gilroy-Light.woff') format('woff'),
        url('../font/Gilroy-Light.ttf') format('truetype'),
        url('../font/Gilroy-Light.svg#Gilroy-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'gilroy-bold';
    src: url('../font/Gilroy-Bold.eot');
    src: url('../font/Gilroy-Bold.eot?#iefix') format('embedded-opentype'),
        url('../font/Gilroy-Bold.woff2') format('woff2'),
        url('../font/Gilroy-Bold.woff') format('woff'),
        url('../font/Gilroy-Bold.ttf') format('truetype'),
        url('../font/Gilroy-Bold.svg#Gilroy-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'gilroy';
    src: url('../font/Gilroy-Regular.eot');
    src: url('../font/Gilroy-Regular.eot?#iefix') format('embedded-opentype'),
        url('../font/Gilroy-Regular.woff2') format('woff2'),
        url('../font/Gilroy-Regular.woff') format('woff'),
        url('../font/Gilroy-Regular.ttf') format('truetype'),
        url('../font/Gilroy-Regular.svg#Gilroy-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

body{
    font-family: 'gilroy';
    background: #F6F6F9;
    padding-top: 96px;
}

.ptb-60{
    padding-top: 60px;
    padding-bottom: 60px;
}

.pt-80{
    padding-top: 80px;
}

.pt-60{
    padding-bottom: 60px;
}

figure img{
    max-width: 100%;
    display: block;
    margin: auto;
}

header{
    background: #000000;
}

header .logo{
    position: absolute;
    top: 0px;
    width: 150px;
    z-index: 99;
}

header .navbar-nav{
    padding: 20px 0px;
}

header .navbar-nav .nav-link{
    color: #fff;
    font-family: 'gilroy-medium';
    font-size: 16px;
    padding: .5rem 1rem !important;
    transition: .5s !important;
}

header .navbar-nav .nav-link.active{
    color: #EA2F49;
    /*font-family: 'gilroy-heavy';*/
}

.header-button ul{
    margin: 0;
    padding-left: 0px;
}

.header-button ul li{
    padding: 6px 15px;
    list-style-type: none;
    display: inline-block;
}

.categories-section .categories .read-btn:hover{
background: #2b769f;
color: white;
}

.header-button ul li a{
    font-family: 'gilroy-medium';
    font-size: 16px;
    text-decoration: none;
    text-transform: uppercase;
    padding: 10px 20px;
    border-radius: 50px;
    display: inline-block;
    color: #000;
    transition: .5s;
}

.fixed-social-icon{
    background: #fff;
    display: inline-block;
    padding: 15px 15px 15px 20px;
    position: fixed;
    top: 30%;
    right: 0;
    border-top-left-radius: 35px;
    border-bottom-left-radius: 35px;
    z-index: 999;
}

.fixed-social-icon a {
    display: block;
    font-size: 28px;
    color: #000;
}

.fixed-social-icon a:nth-child(1){
    color: #56A871;
}

.fixed-social-icon a:nth-of-type(2){
    color: #4181E1;
}

.fixed-social-icon a:nth-of-type(3){
    color: #E22E6B;
}

.fixed-social-icon a:nth-of-type(4){
    color: #2E4D97;
}

.heaidng-menu{
    position: relative;
    text-align: center;
    margin-bottom: 40px;
}

.heaidng-menu h3{
    color: #00719D;
    font-size: 40px;
    font-family: 'gilroy-bold';
    margin-bottom: 30px;
    position: relative;
    display: inline-block;
}

.heaidng-menu h3:before{
    content: '';
    position: absolute;
    width: 50%;
    height: 3px;
    background: #A6BD37;
    left: 50%;
    bottom: -30%;
    transform: translate(-50%, -30%);
}

.heaidng-menu p{
    font-size: 20px;
}

.design-card{
    background: #ffff;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 16%);
    padding: 30px 25px;
    width: 70%;
    border-radius: 20px;
}

.design-card li, .design-card p{
    font-size: 20px;
}

.design-title h3{
    font-size: 20px;
    font-family: 'gilroy-bold';
    color: #515A66;
}

.mobile-view{
    display: none !important;
} 

.categories-section{
    position: relative;
}

.categories-section:before{
    content: '';
    position: absolute;
    top: 0px;
    width: 100%;
    height: 60%;
    background: #E82A44;
    border-bottom: 10px solid #A6BD37;

}

.categories-section .home-slider .categories{
    background: #FFFFFF;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 16%);
    padding: 30px;
    border-radius: 20px;
}

.categories-section .categories img{
    width: 120px !important;
    margin: inherit;
    background: #EDEEF2;
    padding: 26px;
    border-radius: 500px;
    box-shadow: 0px 0px 10px rgb(0 0 0 / 30%);
}

.categories-section .categories h3{
    font-size: 25px;
    font-family: 'gilroy-bold';
    margin-bottom: 15px;
    color: #515A66;
}

.categories-section .categories .read-btn{
    background: #EDEEF2;
    padding: 10px 35px;
    font-family: 'gilroy-bold';
    color: #515A66;
    border-radius: 50px;
}

.categories-section .categories .read-btn i{
    margin-left: 10px;
    color: #E82A44;
}

.categories-section .categories{
    position: relative;
}

.categories-section .categories:before{
    position: absolute;
    content: '';
    top: 50%;
    transform: translateY(-50%);
    width: 6px;
    height: 20%;
    background: #00769F;
    left: 0px;
    border-radius: 50px;
}

.clients-section{
    background: #00769F;
}

.client-slider .owl-nav button{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: #fff !important;
    width: 30px;
    height: 30px;
    border-radius: 50px !important;
}

.client-slider .owl-nav .owl-prev{
    left: -50px;
}

.client-slider .owl-nav .owl-next{
    right: -50px;
}

.client-slider .owl-nav [class*=owl-]:hover, .client-slider .owl-nav [class*=owl-]:focus{
    color: #000 !important;
    outline: none !important;
}

.client-bout-card{
    padding: 25px 45px;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0px 0px 6px rgba(0, 0, 0, 16%);
    position: relative;
  min-height:530px;
  margin-bottom:10px;
}

.client-bout-card:before{
    content: '';
    position: absolute;
    background: #A6BD37;
    border-radius: 45px;
    width: 8px;
    height: 200px;
    left: 0px;
}

.client-bout-card:after{
    content: '';
    position: absolute;
    background: #00769F;
    border-radius: 45px;
    width: 100px;
    height: 8px;
    right: 40px;
    bottom: 0;
}

.client-bout-card .client-name{
    font-family: 'gilroy-bold';
    font-size: 20px;
    margin-bottom: 0px;
}

.client-bout-card .client-discription{
    font-size: 20px;
}

.client-bout-card img{
    width: 150px !important;
}

.clientabout-slider .owl-nav button{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: #000 !important;
    color: #fff !important;
    width: 30px;
    height: 30px;
    border-radius: 50px !important;
}

.clientabout-slider .owl-nav .owl-prev{
    left: -50px;
}

.clientabout-slider .owl-nav .owl-next{
    right: -50px;
}

.clientabout-slider .owl-nav [class*=owl-]:hover, .clientabout-slider .owl-nav [class*=owl-]:focus{
    color: #fff  !important;
    outline: none !important;
}

/*******************************/

.uniform-slider .uniform-card{
    background: #fff;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 16%);
    width: 100%;
    height: 150px;
    border-radius: 20px;
    font-family: 'gilroy-medium';
}
.clients-slider img{
    margin-bottom: 20px;
    box-shadow: 0px 0px 8px rgba(0, 0, 0, 16%);
    border-radius: 20px;
}

.clients-slider .owl-nav button{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: #000 !important;
    color: #fff !important;
    width: 30px;
    height: 30px;
    border-radius: 50px !important;
}

.clients-slider .owl-nav .owl-prev{
    left: -50px;
}

.clients-slider .owl-nav .owl-next{
    right: -50px;
}

.clients-slider .owl-nav [class*=owl-]:hover, .clients-slider .owl-nav [class*=owl-]:focus{
    color: #fff  !important;
    outline: none !important;
}

.inq-btn{
    text-align: center;
}

.inq-btn p{
    margin: 0px;
    font-weight: 600;
}

.btn-green{
    padding: 10px 45px;
    background: #A6BD37;
    border: 1px solid #A6BD37;
    font-family: 'gilroy-medium';
    border-radius: 50px;
    color: #fff;
    transition: .5s;
}

.btn-green:hover{
    background: transparent;
    color: #A6BD37;
}

.btn-blue{
    padding: 10px 45px;
    background: #00769F;
    border: 1px solid #00769F;
    font-family: 'gilroy-medium';
    border-radius: 50px;
    color: #fff;
    transition: .5s;
}

.btn-blue:hover{
    background: transparent;
    color: #00769F;
}
/******************************/

/*****************************/
.accessories-card{
    background: #fff;
    padding: 15px;
    border-radius: 25px;
}

.accessories-card h2{
    font-family: 'gilroy-bold';
    color: #515A66;
    margin-bottom: 20px;
}

.accessories-card h4{
    font-family: 'gilroy-bold';
    color: #515A66;
    margin-bottom: 20px;
}

.accessories-card ul{
    padding: 0px;
    width: 100%;
    margin-bottom:30px;
}

.accessories-card ul li{
    display: inline-block;
    margin: 6px;
    background: #EAEBF0;
    border-radius: 7px!important;
    padding: 10px 25px;
    font-size:17px !important;
}

.accessories-card ul li a{
    font-family: 'gilroy-bold';
    color: #515A66;
    text-decoration: none;
}

.view-btn{
    font-family: 'gilroy-bold';
    color: #515A66;
    background: #EAEBF0;
    padding: 6px 15px;
    border-radius: 50px;
    transition: .5s;
}

.view-btn i{
    color: #E82A44;
    margin-left: 5px;
}

.view-btn:hover{
    background: #d1d1d1;
    color: #515A66;
}

.accessori-card{
    border-radius: 20px;
    height: 100%;
    padding: 20px 30px;
    color: #fff;
}

.accessori-card h4{
    font-size: 25px;
    font-family: 'gilroy-bold';
    margin-bottom: 30px;
}

.text-black{
    color: #000;
}

.bg-green{
    background: #13A68B;
}

.bg-pink{
    background: #E2707A;
}

.bg-blue{
    background: #6161D3;
}

.bg-orange{
    background: #FDCB20;
}

.bg-light-pink{
    background: #FDBDDC;
}

.bg-light-blue{
    background: #06AAC6;
}

.contact-us{
    margin-left: 30px;
    margin-bottom: 20px;
}

.contact-list{
    padding: 0px;
}

.contact-list li{
    list-style-type: none;
    position: relative;
    padding-left: 30px;
    margin-bottom: 20px;
}

.contact-list li:before{
    content: "\f3c5";
    position: absolute;
    font-weight: 900;
    left: 0;
    font-family: "Font Awesome 5 Free";
    color: #E82A44;
}

.contact-list li:last-child:before{
    content: '\f0e0';
}

.details-heading{
    background-image: linear-gradient(to bottom right, #E82A44, #FC566D);
    border-radius: 42px;
    margin-bottom: 20px;
}

.details-heading img{
    width: 170px;
}

.contact-form{
    margin-top: 30px;
}

.contact-form .form-group .form-control{
    background: #fff;
    border: 1px solid #C4C4C4;
    border-radius: 10px;
    padding: 15px;
    height: inherit !important;
    font-size: 14px;
    color: #515A66;
}

.contact-form .form-group select{
    font-size: 14px;
}

.contact-form .form-group .form-control::placeholder{
    font-family: 'gilroy-light';
    font-size: 14px;
}

.submit-btn{
    font-family: 'gilroy-bold';
    padding: 8px 25px !important;
    width: 20%;
    color: #fff;
    background-image: linear-gradient(to bottom right, #E82A44, #FC566D);
    border-radius: 50px;
}

.about-title{
    font-family: 'gilroy-bold';
    font-size: 40px;
    color: #00719D;
    margin-bottom: 30px;
}

.red-gradient{
    background-image: linear-gradient(to bottom, #E82A44,#E82A44);
}

/*****************************/

footer{
    padding-top: 30px;
    padding-bottom: 10px;
    border-top: 1px solid #707070;
}

footer .footer-menu{
    padding: 0px;
}

footer .footer-menu li{
    float: left;
    width: 100%;
    text-align: left;
    list-style-type: none;
}

footer .footer-menu li a{
    color: #000;
    font-family: 'gilroy-medium';
    margin-bottom: 10px;
    display: block;
    text-decoration: none;
    font-size: 18px;
}

footer .contact-menu{
    padding: 0px;
}

.foot-logos{
max-width: 150px;
}

footer .contact-menu li{
      list-style-type: none;
    float: left;
    width: 100%;
    text-align: left;
    border: 0px;
    padding: 0px;
    margin-bottom: 8px;
}

footer .contact-menu li a{
    letter-spacing: 3px;
    color: #000;
    font-family: 'gilroy-medium';
    text-decoration: none;
    text-align: center;
    font-size:16px;
}

.copyright{
    color: #fff;
    background: #000;
    padding: 15px;
    text-align: center;
}

@media (min-width: 991px){
    .about-menu{
        width: 80%; 
    }
}

@media (max-width:768px){
    body{
        padding-top: 50px;
    }

    .ptb-30{
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .icon-bar {
        display: block;
        width: 22px;
        height: 2px;
        border-radius: 1px;
        background: #fff;
        margin-top: 4px;
    }

    footer .navbar-brand{
        width: 100%;
        text-align: center;
        margin: 0;
    }

    .fixed-social-icon a{
        font-size: 20px;
        margin-bottom: 10px;
    }

    header .logo{
        top: 28px!important;
        margin-top: -33px;
    }
    .client-slider .owl-nav .owl-prev{
        left: -40px;
    }
    
    .client-slider .owl-nav .owl-next{
        right: -40px;
    }

    .clientabout-slider .owl-nav .owl-prev{
        left: -40px;
    }
    
    .clientabout-slider .owl-nav .owl-next{
        right: -40px;
    }

    .design-card{
        width: 100%;
        padding: 20px;
    }

    .design-card figure img{
        max-width: 70px !important;
    }

    .design-title h3{
        font-size: 16px;
    }

    .heaidng-menu h3{
        font-size: 25px;
    }

    .accessories-card ul{
        width: 100%;
    }

    .accessories-card ul li{
        margin: 10px 6px;
        padding: 10px 20px;
        width: 125px;
    }

    .accessories-card h2{
        font-size: 25px;
    }

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

    footer .logo{
        margin: auto;
        display: block;
        margin-bottom: 2rem;
        width: 120px;
    }

    footer .contact-menu li{
        margin: 10px;
        padding: 10px 0px;
    }

    footer .contact-menu li a, footer .contact-menu li span{
        font-size: 10px;
    }

    footer .footer-menu li a{
        margin: 0px;
    }
}

@media (max-width:468px){
    body{
        padding-top: 56px;
    }

    .ptb-30{
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .icon-bar {
        display: block;
        width: 22px;
        height: 2px;
        border-radius: 1px;
        background: #fff;
        margin-top: 4px;
    }

    footer .navbar-brand{
        width: 100%;
        text-align: center;
        margin: 0;
    }

    header .logo{
        top: 28px!important;
        margin-top: -33px;
    }

    .heaidng-menu h3{
        font-size: 25px;
    }

    .heaidng-menu p{
        font-size: 14px;
    }

    .design-card{
        width: 100%;
    }

    .design-card img{
        width: 50px;
    }

    .design-title h3{
        font-size: 12px;
    }

    .fixed-social-icon{
        padding: 10px 10px 10px 20px;
    }

    .mobile-view{
        display: block !important;
    }

    .desktop-view{
        display: none !important;
    }

    .fixed-social-icon a{
        font-size: 16px;
        margin-bottom: 10px;
    }

    .client-slider .owl-nav .owl-prev{
        left: 0px;
    }
    
    .client-slider .owl-nav .owl-next{
        right: 0px;
    }

    .client-bout-card{
        padding: 15px;  
    }

    .client-bout-card .client-name, .client-bout-card .client-discription, .client-bout-card p{
        font-size: 14px;
    }

    .client-bout-card img{
        width: 100px !important;
    }

    .clientabout-slider .owl-nav .owl-prev{
        left: 0px;
    }
    
    .clientabout-slider .owl-nav .owl-next{
        right: 0px;
    }

    .clients-slider .owl-nav .owl-prev{
        left: 0px;
    }
    
    .clients-slider .owl-nav .owl-next{
        right: 0px;
    }

    .client-bout-card:before{
        width: 6px;
    }

    .client-bout-card:after{
        height: 6px;
    }

    .uniform-slider .uniform-card{
        height: 100px;
    }

    .uniform-slider .uniform-card h5{
        font-size: 18px;
    }

    .inq-btn p{
        margin-bottom: 10px;
        font-size: 14px;
    }

    .btn-green{
        padding: 10px 30px;
        font-size: 14px;
    }

    .btn-blue{
        padding: 10px 30px;
        font-size: 14px;
    }

    .accessories-card ul li {
        margin: 6px 0px;
        font-size: 12px;
        padding: 6px 25px;
        width: 98px;
    }

    .view-btn{
        font-size: 12px;
    }

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

    .details-heading img {
        width: 100px;
    }

    .details-heading p{
        font-size: 14px;
        font-family: 'gilroy-medium';
    }

    .submit-btn{
        width: 50%;
    }

    .about-title{
        display: none;
    }

    footer{
        padding-top: 30px;
        padding-bottom: 30px;
    }

    footer .footer-menu li a{
        font-size: 12px;
        margin-bottom: 0px;
    }

    footer .contact-menu li a, footer .contact-menu li span{      
        font-size: 12px;
        letter-spacing: inherit;
    }

    footer .contact-menu li a i{
        padding: 6px 4px;
    }

    footer .contact-menu li{
        margin: 6px;
        padding: 6px;
        width: 100%;
    }
  .client-bout-card{
  min-height:450px;
    margin-bottom:10px;
}
}