/* Media queries */
@media (max-width: 575px) {

    .logo-width {
        width: 3rem;
    }

    .navbar-nav .nav-link {
        margin: 0;
        padding: 9px 15px 8px !important;
    }

    .navbar-nav li {
        border-bottom: 1px solid rgba(255, 255, 255, 0.06);
        border-top: 0;
    }

    .navbar-nav {
        background-color: rgba(23, 23, 23, 0.95);
        position: absolute;
        top: 4px;
        width: 100%;
    }

    .slider-text {
        width: 100%;
        margin-bottom: 15px;
        line-height: normal;
        font-size: 37px;
        margin-top: 25px;
    }

    .slider-subtext {
        width: 100%;
    }

    .slider-text-middle {
        text-align: center;
        padding-top: 87px;
    }

    .us-width {
        width: 100%;
    }

    .sm-no-background-img {
        background-image: none !important;
    }

    .md-no-background-img {
        background-image: none !important;
        background-color: initial;
    }

    .cells-padding {
        padding: 30px 0 !important;
    }

    .slider-height {
        max-height: 100vh;
    }

    .slider-text-middle-main .slider-text-middle.text-center img {
        width: 85%;
    }

    h1, h2, h3, h4, h5, h6 {
        margin: 0 0 17px;
        padding: 0;
        letter-spacing: 0;
        font-weight: 400;
    }

    h1 {
        font-size: 37px;
        line-height: 42px;
    }

    h2 {
        font-size: 30px;
        line-height: 36px
    }

    h3 {
        font-size: 28px;
        line-height: 34px
    }

    h4 {
        font-size: 24px;
        line-height: 30px
    }

    h5 {
        font-size: 20px;
        line-height: 28px
    }

    h6 {
        font-size: 18px;
        line-height: 23px
    }

    .svc-title-margin, .work-title-margin {
        margin-bottom: 30px;
        margin-left: auto;
        margin-right: auto;
    }

    .about-btn-margin {
        margin-top: 30px;
        margin-left: auto;
        margin-right: auto;
    }

    .title-width {
        width: 100%;
    }

    .hidden-xs {
        display: none;
    }

    .w-sm-100 {
        width: 100%;
    }

    .card-columns {
        column-count: 1;
    }

    .footer-padding {
        padding-top: 5%;
        padding-bottom: 1%;
    }

    .footer-border {
        border: none
    }

    .sidebar-wrapper .portfolio-grid.work-4col li, .blog-grid.blog-4col li,.blog-grid.blog-3col li {width: 100%}

    /* portfolio grid */
    .portfolio-grid.work-6col li, .blog-grid.blog-6col li {width: 100%;}
    .portfolio-grid.work-6col li.grid-item-double, .blog-grid.blog-6col li.grid-item-double {width: 100%;}

    .portfolio-grid.work-4col li,.blog-grid.work-4col li {width: 100%}
    .portfolio-grid.work-4col li.grid-item-double, .blog-grid.blog-4col li.grid-item-double {width: 100%}
    .portfolio-grid.work-4col li.grid-item-double:last-child, .blog-grid.blog-4col li.grid-item-double:last-child { width: 100%;}

    .portfolio-grid.work-3col li,.blog-grid.work-3col li {width: 100%}
    .portfolio-grid.work-3col li.grid-item-double, .blog-grid.work-3col li.grid-item-double {width: 100%}

    .portfolio-grid.gutter-small, .blog-grid.gutter-small { margin: 0 7px;}
    .portfolio-grid.gutter-small li, .blog-grid.gutter-small li { padding:7px 7px;}
    .portfolio-grid.gutter-extra-large li, .blog-grid.gutter-extra-large li {padding:15px;}
    .portfolio-grid.gutter-extra-large, .blog-grid.gutter-extra-large {margin:0 -15px;}

    .hover-option8 .grid-item .portfolio-icon {right: 39px; top: 34px;}
    .portfolio-grid.gutter-medium, .blog-grid.gutter-medium, .portfolio-grid.gutter-large, .blog-grid.gutter-large { margin: 0; }
    .portfolio-grid.gutter-medium li, .blog-grid.gutter-medium li, .portfolio-grid.gutter-large li, .blog-grid.gutter-large li { padding: 7px 0}

    .portfolio-grid.work-5col li, .blog-grid.blog-5col li {width: 100%}
    .portfolio-grid.work-5col li.grid-item-double, .blog-grid.blog-5col li.grid-item-double {width: 100%;}

    /* portfolio 2 column */
    .portfolio-grid.work-2col li, .blog-grid.work-2col li {width: 100%}
    .portfolio-grid.work-2col li.grid-item-double, .blog-grid.work-2col li.grid-item-double {width: 100%}

    /* portfolio grid */
    .portfolio-grid.portfolio-metro-grid.work-4col li {width: 100%}
    .portfolio-grid.portfolio-metro-grid.work-4col li.grid-item-double {width: 100%}
    .portfolio-grid.portfolio-metro-grid.work-4col li.grid-item-double:last-child { width: 100%;}
    .portfolio-grid.portfolio-metro-grid.work-6col li {width: 100%}
    .portfolio-grid.portfolio-metro-grid.work-6col li.grid-item-double {width: 100%}
    .portfolio-grid.portfolio-metro-grid.work-6col li.grid-item-double:last-child { width: 100%;}
    .portfolio-grid.portfolio-metro-grid.work-3col li {width: 100%}
    .portfolio-grid.portfolio-metro-grid.work-3col li.grid-item-double {width: 100%}
    .portfolio-grid.portfolio-metro-grid.work-3col li.grid-item-double:last-child { width: 100%;}

    /* hover option 6 */
    .hover-option6 .grid-item .portfolio-icon i.fa-search {  top: 12px; }

    .parallax {
        background-attachment: inherit;
        background-position: center;
    }

    #form-container {
        width: 80%;
    }

    #form-container.active {
        left: 20%;
    }

    .form-close.opened.mobile {
        left: calc(20vw - 82px);
    }

    .fixed-topbar .text-topbar{
        font-size: 12px;
    }
}


@media (min-width: 576px) and (max-width: 767px) {

    .sticky  .logo-width {
        width: 3rem;
    }

    .navbar-nav .nav-link {
        margin: 0;
        padding: 9px 15px 8px !important;
    }

    .navbar-nav li {
        border-bottom: 1px solid rgba(255, 255, 255, 0.06);
        border-top: 0;
    }

    .navbar-nav {
        background-color: rgba(23, 23, 23, 0.95);
        position: absolute;
        top: 4px;
        width: 100%;
    }

    .slider-text {
        width: 100%;
        margin-bottom: 15px;
        line-height: normal;
        font-size: 37px;
    }

    .slider-text-middle {
        text-align: center;
        padding-top: 90px;
    }

    .slider-subtext {
        width: 100%;
    }

    .us-width {
        width: 100%;
    }

    .sm-no-background-img {
        background-image: none !important;
    }

    .md-no-background-img {
        background-image: none !important;
        background-color: initial;
    }

    .cells-padding {
        padding: 30px 0 !important;
    }

    .slider-height {
        height: 480px !important;
    }

    .slider-text-middle-main .slider-text-middle.text-center img {
        width: 85%;
    }

    h1, h2, h3, h4, h5, h6 {
        margin: 0 0 17px;
        padding: 0;
        letter-spacing: 0;
        font-weight: 400;
    }

    h1 {
        font-size: 37px;
        line-height: 42px;
    }

    h2 {
        font-size: 30px;
        line-height: 36px
    }

    h3 {
        font-size: 28px;
        line-height: 34px
    }

    h4 {
        font-size: 24px;
        line-height: 30px
    }

    h5 {
        font-size: 20px;
        line-height: 28px
    }

    h6 {
        font-size: 18px;
        line-height: 23px
    }

    .svc-title-margin, .work-title-margin {
        margin-bottom: 30px;
        margin-left: auto;
        margin-right: auto;
    }

    .about-btn-margin {
        margin-top: 30px;
        margin-left: auto;
        margin-right: auto;
    }

    .title-width {
        width: 100%;
    }

    .hidden-xs {
        display: none;
    }

    .card-columns {
        column-count: 1;
    }

    .w-sm-100 {
        width: 100%;
    }

    .footer-padding {
        padding-top: 5%;
        padding-bottom: 1%;
    }

    .footer-border {
        border: none
    }

    .sidebar-wrapper .portfolio-grid.work-4col li, .blog-grid.blog-4col li,.blog-grid.blog-3col li {width: 100%}

    /* portfolio grid */
    .portfolio-grid.work-6col li, .blog-grid.blog-6col li {width: 100%;}
    .portfolio-grid.work-6col li.grid-item-double, .blog-grid.blog-6col li.grid-item-double {width: 100%;}

    .portfolio-grid.work-4col li,.blog-grid.work-4col li {width: 100%}
    .portfolio-grid.work-4col li.grid-item-double, .blog-grid.blog-4col li.grid-item-double {width: 100%}
    .portfolio-grid.work-4col li.grid-item-double:last-child, .blog-grid.blog-4col li.grid-item-double:last-child { width: 100%;}

    .portfolio-grid.work-3col li,.blog-grid.work-3col li {width: 100%}
    .portfolio-grid.work-3col li.grid-item-double, .blog-grid.work-3col li.grid-item-double {width: 100%}

    .portfolio-grid.gutter-small, .blog-grid.gutter-small { margin: 0 7px;}
    .portfolio-grid.gutter-small li, .blog-grid.gutter-small li { padding:7px 7px;}
    .portfolio-grid.gutter-extra-large li, .blog-grid.gutter-extra-large li {padding:15px;}
    .portfolio-grid.gutter-extra-large, .blog-grid.gutter-extra-large {margin:0 -15px;}

    .hover-option8 .grid-item .portfolio-icon {right: 39px; top: 34px;}
    .portfolio-grid.gutter-medium, .blog-grid.gutter-medium, .portfolio-grid.gutter-large, .blog-grid.gutter-large { margin: 0; }
    .portfolio-grid.gutter-medium li, .blog-grid.gutter-medium li, .portfolio-grid.gutter-large li, .blog-grid.gutter-large li { padding: 7px 0}

    .portfolio-grid.work-5col li, .blog-grid.blog-5col li {width: 100%}
    .portfolio-grid.work-5col li.grid-item-double, .blog-grid.blog-5col li.grid-item-double {width: 100%;}

    /* portfolio 2 column */
    .portfolio-grid.work-2col li, .blog-grid.work-2col li {width: 100%}
    .portfolio-grid.work-2col li.grid-item-double, .blog-grid.work-2col li.grid-item-double {width: 100%}

    /* portfolio grid */
    .portfolio-grid.portfolio-metro-grid.work-4col li {width: 100%}
    .portfolio-grid.portfolio-metro-grid.work-4col li.grid-item-double {width: 100%}
    .portfolio-grid.portfolio-metro-grid.work-4col li.grid-item-double:last-child { width: 100%;}
    .portfolio-grid.portfolio-metro-grid.work-6col li {width: 100%}
    .portfolio-grid.portfolio-metro-grid.work-6col li.grid-item-double {width: 100%}
    .portfolio-grid.portfolio-metro-grid.work-6col li.grid-item-double:last-child { width: 100%;}
    .portfolio-grid.portfolio-metro-grid.work-3col li {width: 100%}
    .portfolio-grid.portfolio-metro-grid.work-3col li.grid-item-double {width: 100%}
    .portfolio-grid.portfolio-metro-grid.work-3col li.grid-item-double:last-child { width: 100%;}

    /* hover option 6 */
    .hover-option6 .grid-item .portfolio-icon i.fa-search {  top: 12px; }

    .parallax {
        background-attachment: inherit;
        background-position: center;
    }

    #form-container {
        width: 80%;
    }

    #form-container.active {
        left: 20%;
    }

    .form-close.opened.mobile {
        left: calc(20vw - 82px);
    }
}


@media (min-width: 768px) and (max-width: 991px) {

    .sticky .logo-width {
        width: 3rem;
    }

    .navbar-nav .nav-link {
        margin: 0;
        padding: 9px 15px 8px !important;
    }

    .navbar-nav li {
        border-bottom: 1px solid rgba(255, 255, 255, 0.06);
        border-top: 0;
    }

    .navbar-nav {
        background-color: rgba(23, 23, 23, 0.95);
    }

    .slider-text {
        width: 70%;
        line-height: normal;
        font-size: 57px;
    }

    .sm-no-background-img {
        background-image: none !important;
    }

    /* typography */
    h1, h2, h3, h4, h5, h6 {
        margin: 0 0 18px;
        padding: 0;
        letter-spacing: 0;
        font-weight: 400;
    }

    h1 {
        font-size: 57px;
        line-height: 58px;
    }

    h2 {
        font-size: 43px;
        line-height: 48px
    }

    h3 {
        font-size: 36px;
        line-height: 41px
    }

    h4 {
        font-size: 30px;
        line-height: 35px
    }

    h5 {
        font-size: 24px;
        line-height: 30px
    }

    h6 {
        font-size: 22px;
        line-height: 26px
    }

    p {
        margin: 0 0 20px;
    }

    .svc-title-margin, .work-title-margin {
        margin-bottom: 40px;
        margin-left: auto;
        margin-right: auto;
    }

    .about-btn-margin {
        margin-top: 30px;
        margin-left: auto;
        margin-right: auto;
    }

    .title-width {
        width: 80%;
    }

    .card-columns {
        column-count: 2;
    }

    .footer-border {
        border: none
    }

    /* portfolio grid */
    .portfolio-grid.work-6col li.grid-item-double, .blog-grid.blog-6col li.grid-item-double {width: 50%;}

    /* portfolio grid */
    .portfolio-grid.portfolio-metro-grid.work-4col li {width: 50%}
    .portfolio-grid.portfolio-metro-grid.work-4col li.grid-item-double {width: 50%}
    .portfolio-grid.portfolio-metro-grid.work-4col li.grid-item-double:last-child { width: 50%;}
    .portfolio-grid.portfolio-metro-grid.work-6col li {width: 50%}
    .portfolio-grid.portfolio-metro-grid.work-6col li.grid-item-double {width: 50%}
    .portfolio-grid.portfolio-metro-grid.work-6col li.grid-item-double:last-child { width: 50%;}
    .portfolio-grid.portfolio-metro-grid.work-3col li {width: 50%}
    .portfolio-grid.portfolio-metro-grid.work-3col li.grid-item-double {width: 50%}
    .portfolio-grid.portfolio-metro-grid.work-3col li.grid-item-double:last-child { width: 50%;}

    .portfolio-grid.work-6col li, .blog-grid.blog-6col li {width: 50%;}
    .portfolio-grid.work-4col li, .blog-grid.blog-4col li {width: 50%}
    .sidebar-wrapper .portfolio-grid.work-4col li,.sidebar-wrapper .blog-grid.work-4col li {width: 50%}
    .portfolio-grid.work-4col li.grid-item-double, .blog-grid.blog-4col li.grid-item-double { width:50%; }
    .portfolio-grid.work-4col li.grid-item-double:last-child, .blog-grid.blog-4col li.grid-item-double:last-child { width: 50%;}

    .portfolio-grid.work-3col li, .blog-grid.blog-3col li {width: 50%;}
    .portfolio-grid.work-3col li.grid-item-double, .blog-grid.blog-3col li.grid-item-double { width: 50%;}

    /* blog post style 3 */
    .blog-post-style3 .grid-item .blog-post .blog-post-images .blog-hover-icon i {font-size: 36px;}

    /* portfolio 5 column */
    .portfolio-grid.work-5col li, .blog-grid.blog-5col li {width: 50%}
    .portfolio-grid.work-5col li.grid-item-double, .blog-grid.blog-5col li.grid-item-double {width: 50%;}

    .parallax {
        background-attachment: inherit;
        background-position: center;
    }
}

@media (max-width: 1199px) {

    .navbar-collapse {
        left: 0;
        padding: 0;
        position: absolute;
        top: 100%;
        width: 100%;
        backface-visibility: hidden;
    }

    .navbar-nav li {
        position: relative;
    }


    nav.navbar.bootsnav .navbar-nav li, nav.navbar.bootsnav li.dropdown ul.mega-menu-full li.dropdown-header {
        display: block !important;
        clear: both;
        border-bottom: 1px solid rgba(255, 255, 255, 0.06);
        border-top: 0;
    }

    nav.navbar.bootsnav .navbar-collapse.collapse.in, nav.navbar.bootsnav .navbar-collapse.collapse.show {
        min-height: 237px;
    }

    nav.navbar.bootsnav .navbar-nav {
        margin: 0;
        padding: 0;
        background-color: rgba(23, 23, 23, 0.95);
        padding-right: 1px;
    }

    nav .accordion-menu {padding: 26px 15px 26px 15px;}

    .navbar-nav li > a, nav.navbar.navbar-default ul.nav > li > a, header .navbar-nav li > a {
        color: #fff;
    }

    header nav.navbar .navbar-nav > li > a:hover, nav.navbar.bootsnav ul.nav > li > a:hover {
        color: rgba(255,255,255,0.6);
    }
}

@media (min-width: 992px) and (max-width: 1199px) {

    .slider-text {
        width: 60%;
        line-height: normal;
        font-size: 65px;
    }

    .navbar-nav .nav-link {
        margin: 0;
        padding: 9px 15px 8px !important;
    }

    .navbar-nav li {
        border-bottom: 1px solid rgba(255, 255, 255, 0.06);
        border-top: 0;
    }

    .navbar-nav {
        background-color: rgba(23, 23, 23, 0.95);
    }

    /* typography */
    h1, h2, h3, h4, h5, h6 {
        margin: 0 0 22px;
        padding: 0;
        letter-spacing: 0;
        font-weight: 400;
    }

    h1 {
        font-size: 65px;
        line-height: 65px;
    }

    h2 {
        font-size: 50px;
        line-height: 55px
    }

    h3 {
        font-size: 42px;
        line-height: 48px
    }

    h4 {
        font-size: 35px;
        line-height: 41px
    }

    h5 {
        font-size: 27px;
        line-height: 32px
    }

    h6 {
        font-size: 22px;
        line-height: 27px
    }

    .svc-title-margin {
        margin-bottom: 8%;
        margin-left: auto;
        margin-right: auto;
    }

    .work-title-margin {
        margin-bottom: 5%;
        margin-left: auto;
        margin-right: auto;
    }

    .about-btn-margin {
        margin-top: 4%;
        margin-left: auto;
        margin-right: auto;
    }

    .title-width {
        width: 80%;
    }

    .card-columns {
        column-count: 3;
    }

    /* portfolio grid */
    .portfolio-grid.work-6col li, .blog-grid.blog-6col li {width: 25%;}
    .portfolio-grid.work-6col li.grid-item-double, .blog-grid.blog-6col li.grid-item-double {width: 50%;}

    /* portfolio 5 column */
    .portfolio-grid.work-5col li, .blog-grid.blog-5col li {width: 33.333%}
    .portfolio-grid.work-5col li.grid-item-double, .blog-grid.blog-5col li.grid-item-double {width: 50%;}

    .portfolio-grid.work-4col li, .blog-grid.blog-4col li { width: 33.333%;}
    .portfolio-grid.work-4col li.grid-item-double, .blog-grid.blog-4col li.grid-item-double { width: 66.667%; }
    .portfolio-grid.work-4col li.grid-item-double:last-child, .blog-grid.blog-4col li.grid-item-double:last-child { width: 100%;}

    /* portfolio grid */
    .portfolio-grid.portfolio-metro-grid.work-4col li {width: 50%}
    .portfolio-grid.portfolio-metro-grid.work-4col li.grid-item-double {width: 50%}
    .portfolio-grid.portfolio-metro-grid.work-4col li.grid-item-double:last-child { width: 50%;}
    .portfolio-grid.portfolio-metro-grid.work-6col li {width: 50%}
    .portfolio-grid.portfolio-metro-grid.work-6col li.grid-item-double {width: 50%}
    .portfolio-grid.portfolio-metro-grid.work-6col li.grid-item-double:last-child { width: 50%;}
    .portfolio-grid.portfolio-metro-grid.work-3col li {width: 50%}
    .portfolio-grid.portfolio-metro-grid.work-3col li.grid-item-double {width: 50%}
    .portfolio-grid.portfolio-metro-grid.work-3col li.grid-item-double:last-child { width: 50%;}
}


@media (min-width: 992px) {
    .w-md-85 {
        width: 85%;
    }
}

@media (min-width: 1200px) {

    .section-padding {
        padding: 130px 0;
    }

    .svc-title-margin {
        margin-bottom: 8%;
        margin-left: auto;
        margin-right: auto;
    }

    .work-title-margin {
        margin-bottom: 5%;
        margin-left: auto;
        margin-right: auto;
    }

    .about-btn-margin {
        margin-top: 4%;
        margin-left: auto;
        margin-right: auto;
    }

    .card-columns {
        column-count: 3;
    }
}