/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Sep 29, 2020, 12:23:26 AM
    Author     : reetzzi
*/

.offer{
    display: flex !important; 
    align-items: center; 
    justify-content: center; 
    margin-top: 20px;
}

.infobanner-wrapper{
    background: url('images/background.jpg');  
    position: relative; 
    background-repeat: no-repeat; 
    background-position: center; 
    background-size: cover;
    height: 400px; 
    width: 100%;    
}

.infolayer{
    background-color: #3d6fb6d6;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
}

.infolayer > div {
    color: white !important;
}

.content > article > h2 {
    font-size: 60px;
}

.content > article > p {
    font-size: 25px;
}

.offerb{
    height: 170px; 
    width: 170px; 
    background-color: #f5f8ff;
}

.offera{
    height: 130px; 
    width: 130px; 
    background-color: #f5f8ff;
}

.offer-wrapper{
    display: flex !important; 
    align-items: center; 
    justify-content: center;
}

.services-wrapper{
    background: url('images/lks-slider-3.png');  
    position: relative; 
    background-repeat: no-repeat; 
    background-position: left center; 
    background-size: cover;
    color: white !important;
    background-color: transparent !important;
}

.services-layer{
    background-color: #323c4f30;    
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;   
}

.services-layer > .wrapper{
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.services-row{
    margin-left: 0px !important;
    margin-top: 0px !important;
}

.services-col{
    background-color: #2c70d5d6;
    padding-right: 40px;
    padding-bottom: 0px;
}

/*Nav*/

nav::after {    
    background-color: #e67910 !important;
}

#nav > ul > li.current::before {   
    background-color: #e67910 !important;
}

.infoicon{
    background-color: #fa9235 !important;
}

/* Mobile (Portrait) */
@media screen and (max-width: 480px) {
    /*Service*/
    .services-wrapper{
        background-position: 70%;
    }

    .row > .services-narrower{
        width: 100%;
    }

    .service-title{
        text-align: left !important;
    }
    
    /*Old service*/

    .row.gtr-200 > .services-narrower {
        padding: 0 0 0 40px !important;
    }

    .services-narrower ul {
        margin: 0 0 0 0 !important;
    }

    .row.gtr-200{
        padding-bottom: 2em;
    }

    li{
        font-size: 10px !important;
    }

    /*Logo*/
    .title img{
        width: 30%;
        padding: 5px;
    }  
    
    /*Home page*/
            .appointmentbanner{
                display: flex;
                flex-flow: column;
                justify-content: center;
                align-items: center;
            }
            
            .appointmentbanner > a {
                width: 60% !important;
            }
}

/* Mobile */

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

    /* Basic */
    h2 {
        font-size: 1.25em !important;
        letter-spacing: 0;
        line-height: 1.35em;
    }

    p {
        margin-top: -0.5em;
        font-size: 1em !important;
    } 

    /*About us*/
    .infolayer > .container {
        padding: 0px 20px;
    }

    .aboutus-image {
        padding: 0px 0 0 40px !important;
    }

    .infobanner-wrapper{    
        height: 300px; 
        width: 100%;    
    }
    
    .services-item {
        padding: 2em 0 2em 0 !important;
    }
    
    .offer{
        display: none !important;
    }

    /*Logo*/
    .title img{
        width: 40%;
        padding: 5px;
    } 
    
    .infowrapper{
        padding-bottom: 2em !important;
    }

}

@media screen and (max-width: 840px) {
  /*Logo*/
            #titleBar > .title > img{
                width: 38%;
                padding: 8px;
            }
            
            #titleBar > .title{
                line-height: 4;
            }

            #titleBar {
                background: #f7f7f7 url("images/bg01.png") !important;
            }

            #titleBar .toggle:before {       
                color: black !important;
            }

    /*Services*/

            .row > .services-narrower{
                width: 50%;
            }

            .service-img-narrower{
                display: none !important;
            }  

            .service-container{
                display: flex;
                justify-content: center;
            }

            .service-container > .service-small{
                width: 90%;
            }

            
    /*About us*/
            .offer{
                display: none !important;
            }
            
            
    /*Home page*/
            .appointmentbanner{
                display: flex;
                flex-flow: column;
                justify-content: center;
                align-items: center;
            }
            
            .appointmentbanner > a {
                width: 50%;
            }
}