/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    /* 
    --
    GLOBAL
    -- 
    */

    /* -- typography -- */

    p{
        font-size: 1.2rem;
    }

    /* -- preloader -- */

    .loader img {
        width: 25vw;
    }    

    /* -- Headings -- */

    .h1-heading{
        font-size: 3.75rem;
    }

    /* Navigation bar */
    .bg-nav {
        background: transparent;
    }

    .navbar-brand img{
        width: 75%; 
    }

    .navbar-toggler{
        padding: .25rem .75rem;
    }

    .navbar-toggler span {
        font-size: 1rem;
        letter-spacing: .4rem;
    } 

    /* Title bar */

    .title-bar h2{
        margin-bottom: 0.5rem;
    }

    .title-bar .light-pink-btn,
    .title-bar .srm-btn {
    border-radius: 25px;
    font-size: .85rem;
    font-weight: 700;
    padding: 7px 18px 6px;
    text-decoration: none;
    text-transform: uppercase;
    transition: ease .5s;
}

    /* Footer */

    #footer{
        padding: 7%;
    }

    /* 
    -- 
    HOME - ABOUT
    --
    */

    .hm-about {
        padding: 6.5%;
    }

    .hm-about .srm-btn {
        font-size: 1.25rem;
    }

    .about-content {
        padding: 3% 5%;
    }

    .about-content h5{
        margin-bottom: 3rem;
    }


    /* 
    -- 
    HOME - SERVICES
    -- 
    */
    .featured-services .section-padding{
        padding-top: 3%;
    }

    .owl-carousel h3{
        font-size: 1.6rem;
        padding: 0 12%;
    }
    
    /* 
    -- 
    HOME - HUBS
    -- 
    */

    .map-text p{
        padding-right: 20%; 
    }

    /* 
    -- 
    HOME - OUR VALUES
    --
    */
    .about-values-title{

        padding: 1%;
    }

    .values .section-padding {
        padding: 10% 5%;
    }

    /* 
    -- 
    HOME - CALL TO ACTION
    --
    */

    .cta .big-heading{
        margin-bottom: 25px;
    }

    .cta .light-pink-btn {
        padding: 2.25% 7% 2.5%;
    }

    /*
    -- 
    ABOUT - VALUES  
    -- 
    */
    .about-values .section-padding{
        padding: 4%;
    }

    .about-values-block{
        padding: 5%;    
    }

     /*
    -- 
    CONTACT  
    -- 
    */

    .form-control {
        width: 140%;
    }

}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {

    /* 
    --
    GLOBAL
    -- 
    */

    /* buttons */
    .light-pink-btn,
    .srm-btn {
        font-size: 1rem;
    }

    /* navigation bar */
    .navbar {
        padding: 2% 1.5%;
    }

    .navbar-brand img{
        width: 60%;
    }

    /* title bar */
    .title-bar{
        padding: 5% 2% 0px 2%;
    }

    /* footer */

    .back-to-top {
        display: block;
    }

    .greeting-right {
        width: 100%;
    }

    /* 
    --
    SECTIONS 
    --
    */

    /* 
    -- 
    HOME - ABOUT SECTION
    -- 
    */
    
    .hm-about {
        padding: 5% 5% 0;
    }

    .h1-heading {
        font-size: 4rem;
        line-height: 1.1;
        margin: 2% 0 5%;
    }

    .hm-about .srm-btn {
        font-size: 1.2rem;
    }

    .about-content{
        padding: 5%;   
    }

    .about-content h5{
        margin: 7% auto; 
    }

    /*
    --
    HOME - FEATURED SERVICES
    -- 
    */

    .featured-services .section-padding{
        padding-top: 5%;
    }

    .owl-carousel h3 {
        font-size: 1.4rem;
        padding: 0 5%;
    }

    /*
    --
    HOME - VALUES 
    -- 
    */

    .values {
        background-color: var(--primary-srm);
        background-size: cover;
    }

    .values-block {
        padding: 10%;
    }
   
    .values-block h3 {
        font-size: 1.4rem;
    }

    .values .section-padding{
        padding: 5%;
    }

    /* 
    -- 
    HOME - FEATURED HUBS 
    --
    */
    .main-hubs .title-bar{
        padding: 5% 2% 3% 2%;
    }

    /*     
    -- 
    HOME - CALL TO ACTION
    --  
    */

    .cta .container-fluid {
        padding: 5% 20%;
    }

    /* 
    -- 
    ABOUT PAGE
    -- 
    */

    /* ABOUT - VALUES */

    .about-values-block{
        padding: 3.5% 5%;    
    }

    .about-values-block img{
        width: 75%;
        padding-bottom: 3%;    
    }

    .about-values-title{
        font-size: 1.5rem;
        padding: 5%;
    }
       /* -- OUR IMAGE -- */

       .our-image-icons img{
        width: 60%;
    }

      /* -- SERVICES -- */

    .service-item img {
        width: 200px;
    }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {

    /* 
    --
    GLOBAL
    -- 
    */

    p {
        font-size: 1rem;
    }

    /* -- navigation bar -- */

    .nav-item:first-child{
        border: 0;
        padding: 0;
    }

    .navbar-brand img{
        width: 250px;
    }

    .navbar-nav{
        margin-top: 0;
    }

    /* -- title bar --*/
    .title-bar {
        padding-top: 4%;
    }

    /* 
    --
    FOOTER
    -- 
    */

    #footer {
        padding: 3%;
    }

    /* HOME - TITLE SECTION */

    .title {
        height: 100vh;
    }

    .greeting-left,
    .logo-center {
        position: relative;
        display:inherit;
    }

    .greeting-left {
        background-color: var(--dark-srm);
        height: 100vh;
        width: 50%;
    }

    .greeting-right {
        height: 100vh;
        width: 50%;
    }

    /* -- centered logo with animation --  */

    .logo-center {
        background-color: var(--primary-srm);
        height: 160px;
        width: 160px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 2;
    }

    .logo-center-svg {
        position: relative;
    }

    .logo-center-svg img {
        height: 160px;
        padding: 15%;
        position: absolute;
        top: 0;
        right: 0;
        z-index: 3;
    }

    .logo-center-svg img:hover {
        -webkit-animation: title-logo-rotation 2s infinite linear;
    }

    @-webkit-keyframes title-logo-rotation {
        from {
            -webkit-transform: rotate(0deg);
        }

        to {
            -webkit-transform: rotate(359deg);
        }
    }

    /* -- Go down arrow -- */
    .go-down-arrow{
        display:block;
    }

    .go-down-arrow img {
        height: 25%;
        position: absolute;
        bottom: 5%;
        right: 2%;
    }

    .go-down-arrow img:hover {
        opacity: .8;
    }

    /*
    --
    HOME - ABOUT SECTION
    -- 
    */

    .hm-about{
        padding: 5%;
        text-align: left;
    }

    .about-content{
        padding: 0 5%;
    }

    .about-content h5{
        margin-bottom: 0; 
    }

    .about-content  a{
        color: var(--primary-srm);
    }

    .about-content  a:hover{
        color: var(--dark-srm);
    }

    .h1-heading {
        font-size: 2.3rem;
    }

    .hm-about h5 {
        margin-bottom: 1.5%;
    }

    .hm-about .srm-btn{
        font-size: 1rem;
    }

    /*
    --
    HOME - VALUES 
    -- 
    */

    .values-block img {
        border-radius: 100%;
        opacity: .6;
        position: absolute;
        padding: 1%;
        display: inherit;
        transform: translate(-50%, -50%);
        top: 50%;
        left: 50%;
        width: 90%;
        z-index: 0;
    }
    
    .values-block{
        padding: 10%;    
    }

    .values .section-padding{
        padding: 5%;
    }

    .values-block h3 {
        font-size: 1.2rem;
    }

    /* 
    --
    SERVICES
    --
    */

    .owl-carousel h3 {
        font-size: 1rem;
        padding: 2%;
    }

    .owl-carousel .owl-item img {
        width: 70%;
    }

    /* 
    --
    HOME - CALL TO ACTION
    -- 
    */
    
    .cta .container-fluid {
        padding: 7% 20%;
    }

    /* 
    -- 
    HOME - MAIN HUBS
    -- 
    */

    .main-hubs .title-bar{
        padding-top: 4%;
    }

    .map {
        background: url(../images/map.svg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position-x: 75%;
        height: 90vh;
        position: relative;
        display: inherit;
    }
    
    .map-overlay {
        display: table;
        position: absolute;
        bottom: 0;
        left: 0;
        height: 50%;
        width: 50%;
    }
    
    .map-memo,
    .map-md {
        display: none;
    }
    
    /* 
    --
    CALL TO ACTION 
    --
    */

    .cta .container-fluid{
        padding: 10% 20%;
    }

    .cta .light-pink-btn{
       padding: 1.5% 5% 1.5%;

    }

    /* 
    -- 
    ABOUT PAGE
    -- 
    */

    /* ABOUT - VALUES */

    .about-values-block{
        padding: 1.5%;    
    }

    .about-values-block img{
        width: 80%;
        padding-bottom: 3%;    
    }

    .about-values-title{
        font-size: 1rem;
        padding: 5%;
    }

    .about-values-block p{
        font-size: .9rem;
    }

     /* OUR IMAGE */

    .story-behind-logo .about-values-block {
        width: 50%;
    }
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    /* 
    --
    GLOBAL
    -- 
    */

    p{
        font-size: 1.1rem;
    }

    /* -- navigation -- */
    .navbar{
        padding: 1%;
    }

    /* -- preloader -- */
    .loader img {
        width: 15vw;
    }

    /* 
    -- 
    HOME - ABOUT SECTION
    --
    */
    .about-content h1{
        font-size: 3rem;
    }
    
    /*
    -- 
    HOME - SERVICES 
    -- 
    */

    .owl-carousel h3{
        font-size: 1.3rem;
    }

    .owl-carousel .owl-item img{
        width: 50%;
    }

    /* 
    -- 
    VALUES - ABOUT SECTION
    --
    */

    .values-block img{
        width: 70%;

    }

    .values-block h3{
        font-size: 1.3rem;
    }

    /* 
    -- 
    ABOUT PAGE
    -- 
    */

    /* ABOUT - VALUES */

    .about-values-block{
        padding: 1.5%;    
    }

    .about-values-block img{
        width: 90%;
        padding-bottom: 3%;    
    }

    .about-values-title{
        font-size: 1.2rem;
        padding: 6% 4%;
    }

    .about-values-block p{
        font-size: 1rem;
    }


    /* -- OUR IMAGE -- */

    .our-image-icons img{
        width: 75%;
    }
}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {
    /* 
    --
    GLOBAL
    -- 
    */

    p{
        font-size: 1.2rem;
    }

    /* -- preloader -- */
    .loader img {
        width: 10vw;
    }

    /*
    --
    HOME - ABOUT SECTION
    -- 
    */

    .about-content {
        padding: 0 5%;
    }

    .h1-heading {
        font-size: 3.5rem;
        font-weight: 800;
        line-height: 1.2;
    }

    /*
    --
    HOME - VALUES 
    -- 
    */

    .values .section-padding {
        padding: 5%;
    }

    .values-block h3{
        font-size: 1.6rem;
    }

    /*
    --
    HOME - SERVICES 
    -- 
    */

    
    .owl-carousel h3{
        font-size: 1.5rem;
        padding: 0 15%;
    }

    .owl-carousel .owl-item img{
        width: 60%;
    }

    /* 
    --
    HOME - MAIN HUBS
    -- 
    */

    .main-hubs .map-overlay {
        font-size: 1.4rem;
    }

    .map-overlay ul, 
    .map-memo ul{
        padding-bottom: 3%;  
    }

    .map-overlay li:before,
    .map-memo li:before {
        background-size: 1.3rem 1.3rem;
        height: 1.3rem;
        position: absolute;
        left: -1.8rem;
        top: .4rem;
        width: 1.3rem;
    }

    /*
    -- 
    CALL TO ACTION 
    -- 
    */

    .cta .big-heading{
        margin-bottom: 25px;
    }

    .cta .container-fluid{
        padding: 5% 20%;
    }

    .cta .light-pink-btn{
        padding: 1% 3% 1%;
    }

    /* 
    -- 
    ABOUT PAGE
    -- 
    */

    /* ABOUT - VALUES */

    .about-values-block{
        padding: 1.5%;    
    }

    .about-values-block img{
        width: 70%;
        padding-bottom: 3%;    
    }

    .about-values-title{
        font-size: 1.5rem;
        padding: 6% 20%;
    }

    .about-values-block p{
        font-size: 1.1rem;
    }
}