/* Extra small devices - xs (portrait phones, less than 576px) */
@media (max-width: 575px) { 

/* Heading Styles Starts */

    .heading-style-1.text-xs-center::after {
        margin-left: auto;
        margin-right: auto;
    }	

/* Header Wrap Starts */

    .header-wrap {
        padding-top: 20px;
        padding-bottom: 10px;
        background-image: url(../images/slider/slider-img1.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        background-attachment: fixed;		
    }

/* Navigation Styles Starts */

    #nav, 
    #nav.sticky-nav {
        position: static;
    }
        #nav .nav-item > a {
            padding-top: 5px;
        }	
    #nav .navbar-collapse {
        margin-top: 20px;
        padding-top: 15px;
        border: solid #f8f8f8;
    }
    #nav.fixednav .navbar-collapse {
        padding-top: 5px;
        border: solid #ccc;
    }	
    #nav .navbar-collapse, 
    #nav.fixednav .navbar-collapse {
        border-width: 1px 0 0 0;
    }

/* Main Slider Styles Starts */	

    #main-slider .carousel-control {
        top: 58%;
        font-size: 30px;
    }	

/* Services Section Styles Starts */

    .services-section-box {
        margin-top: 40px;
    }
        .services-section-box .icon {
            margin: 0 auto 40px;
        }	

/* Portfolio Grid Styles Starts */	

    .portfolio-grid-item {
        min-height: 229px;
        height: auto !important;
        height: 229px;   
    }			
        .portfolio-grid-item .hover-content .tag {
            margin-top: 29%;
            margin-bottom: 10%;
        }
            .portfolio-grid-item .hover-content .tag span {
                padding: 10px 26px;
                font-size: 16px;
            }
        .portfolio-grid-item .hover-content h5 {
            font-size: 15px;
        }		

}

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

/* Heading Styles Starts */

    .heading-style-1.text-sm-center::after {
        margin-left: auto;
        margin-right: auto;
    }	

/* Header Wrap Starts */

    .header-wrap {
        padding-top: 20px;
        padding-bottom: 10px;
        background-image: url(../images/slider/slider-img1.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        background-attachment: fixed;		
    }

/* Navigation Styles Starts */

    #nav, 
    #nav.sticky-nav {
        position: static;
    }
        #nav .nav-item > a {
            padding-top: 5px;
        }	
    #nav .navbar-collapse {
        margin-top: 20px;
        padding-top: 15px;
        border: solid #f8f8f8;
    }
    #nav.fixednav .navbar-collapse {
        padding-top: 5px;
        border: solid #ccc;
    }	
    #nav .navbar-collapse, 
    #nav.fixednav .navbar-collapse {
        border-width: 1px 0 0 0;
    }

/* Main Slider Styles Starts */	

    #main-slider .carousel-caption {
        top: 5%;
        left: 15px;
        right: 15px;
        text-align: center;
    }
        #main-slider .carousel-caption h2 {
            font-size: 32px;
            line-height: 42px;
        }
        #main-slider .carousel-caption h5 {
            font-size: 16px;
            line-height: 28px;
        }
        #main-slider .carousel-caption .btn {
            margin-top: 10px;
            padding: 9px 27px;
            font-size: 16px;
        }
        #main-slider .carousel-caption .btn + .btn {
            margin-left: 20px;
        }
        #main-slider .carousel-caption .btn-outline {
            padding: 8px 23px;
        }

    #main-slider .carousel-control {
        top: 42%;
        font-size: 40px;
    }

/* Services Section Styles Starts */

    .services-section-box {
        margin-top: 40px;
    }
        .services-section-box .icon {
            margin: 0 auto 40px;
        }

/* Portfolio Grid Styles Starts */	

    .portfolio-grid-item {
        min-height: 330px;
        height: auto !important;
        height: 330px;   
    }		
        .portfolio-grid-item .hover-content .tag {
            margin-top: 25%;
            margin-bottom: 7%;
        }
            .portfolio-grid-item .hover-content .tag span {
                padding: 12px 32px;
                font-size: 17px;
            }
        .portfolio-grid-item .hover-content h5 {
            font-size: 16px;
        }		 

/* Blog Section Styles Starts */

    .blog-section > .container > .row > .col-sm-12 + .col-sm-12 {
        margin-top: 30px;
    }	    
    
}

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

/* Heading Styles Starts */

    .heading-style-1.text-md-center::after {
        margin-left: auto;
        margin-right: auto;
    }

/* Navigation Styles Starts */

    #nav .navbar-brand {
        margin-top: 0;
        padding: 0;
    }
        #nav .navbar-brand > img {
            width: 70%;
        }
    #nav .nav-item > a {
        padding-top: 16px;
        padding-left: 3px;
        padding-right: 3px;
        font-size: 14px;
    }

/* Main Slider Styles Starts */	

    #main-slider .carousel-caption {
        top: 17%;
    }	
        #main-slider .carousel-caption h2 {
            margin-bottom: 10px;
            font-size: 36px;
            line-height: 46px;
        }
        #main-slider .carousel-caption h5 {
            margin-bottom: 15px;
        }
            #main-slider .carousel-caption h5 > br {
                display: none;
            }

/* Intro Section Styles Starts */

    .intro-img {
        padding-top: 0;
        position: relative;
    }
        .intro-img img {
            position: absolute;
            top: 385px;
        }	

/* Portfolio Grid Styles Starts */	

    .portfolio-grid-item {
        min-height: 308px;
        height: auto !important;
        height: 308px;  
    }		
        .portfolio-grid-item .hover-content .tag {
            margin-top: 32%;
        }
            .portfolio-grid-item .hover-content .tag span {
                padding: 12px 32px;
                font-size: 17px;
            }
        .portfolio-grid-item .hover-content h5 {
            font-size: 16px;
        }	    
    
}

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

/* Heading Styles Starts */

    .heading-style-1.text-lg-center::after {
        margin-left: auto;
        margin-right: auto;
    }

/* Main Slider Styles Starts */	

    #main-slider .carousel-caption {
        top: 15%;
    }	

/* Navigation Styles Starts */

    #nav .navbar-brand {
        margin-top: 0;
    }
        #nav .navbar-brand > img {
            width: 80%;
        }
    #nav .nav-item > a {
        padding: 16px 13px 14px;
        font-size: 15px;
    }

/* Intro Section Styles Starts */

    .intro-img {
        padding-top: 0;
        position: relative;
    }
        .intro-img img {
            position: absolute;
            top: 177px;
        }

/* Portfolio Grid Styles Starts */	

    .portfolio-grid-item {
        min-height: 261px;
        height: auto !important;
        height: 261px; 
    }		
        .portfolio-grid-item .hover-content .tag {
            margin-top: 31%;
        }
            .portfolio-grid-item .hover-content .tag span {
                padding: 12px 32px;
                font-size: 17px;
            }
        .portfolio-grid-item .hover-content h5 {
            font-size: 16px;
        }	
    
}

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

/* Heading Styles Starts */

    .heading-style-1.text-xl-center::after {
        margin-left: auto;
        margin-right: auto;
    }

/* Navigation Styles Starts */

    #nav .navbar-brand {
        margin-top: -13px;
    }	

/* Portfolio Grid Styles Starts */	

    .portfolio-grid-item {
        min-height: 321px;
        height: auto !important;
        height: 321px;
    }	     
    
}

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

/* Heading Styles Starts */

    .heading-style-1.text-xl-center::after {
        margin-left: auto;
        margin-right: auto;
    }

/* Navigation Styles Starts */

    #nav .navbar-brand {
        margin-top: -13px;
    }	

/* Portfolio Grid Styles Starts */	

    .portfolio-grid-item {
        min-height: 321px;
        height: auto !important;
        height: 321px;
    }	    
    
}