/*------------------------------------------
  Responsive Grid Media Queries - 1280, 1024, 768, 480
   1280-1024   - desktop (default grid)
   1024-768    - tablet landscape
   768-480     - tablet 
   480-less    - phone landscape & smaller
--------------------------------------------*/
@media all and (min-width: 1024px) and (max-width: 1280px) { }

@media all and (min-width: 768px) and (max-width: 1024px) {
    h1 {
        padding-top: .5em;
        font-size: 2em;
        line-height: 1.2em;
        padding-bottom: 0;
        margin-bottom: 0;
    }

    .offer-description {
        font-size: 1.1em;
        line-height: 1.5em;
    }

}

@media all and (min-width: 480px) and (max-width: 768px) {
    .wrapper {
        padding: calc(var(--main-padding) / 1.5) calc(var(--main-padding) / 3.5);
    }

    h1 {
        padding-top: .5em;
        font-size: 1.7em;
        line-height: 1.2em;
        padding-bottom: 0;
        margin-bottom: 0;
    }

    h2 {
        font-size: 1.3em;
        line-height: 1.2em;
    }

    #about h2 {
        margin-top: calc(var(--main-padding) / 3.5);
    }

    h3, #services h3 {
        font-size: 1.3em;
        line-height: 1.2em;
    }

    .offer-description {
        font-size: 1.1em;
        line-height: 1.5em;
    }

    header .margined-right .header-ul {
        margin-top: 2em;
        margin-bottom: 0;
    }

    .header-ul > li {
        font-size: .9em;
        padding-bottom: 1.5em;
        padding-left: 3.5em;

    }

    .header-ul strong {
        font-size: 1.3em;
    }

    .number-1,
    .number-2,
    .number-3 {
        background-size: 2.5em;
    }


    .header-background {
        background: rgba(255, 255, 255, 0.78);
    }

    .main-background {
        background: #fff;
    }

    .margined-left {
        margin-left: 0;
    }

    .margined-right {
        margin-right: 0;
    }

    .flex-block {
        color: #fff;
    }

    .footer-background {
        background: var(--highlight-color);
    }

    .address {
        line-height: 1.3em;
    }

    .copyright {
        margin-top: 2em;
    }

    .made-by {
        margin-top: 0;
    }

    .logo-bottom {
        padding-bottom: 1em;
    }

    .logo-bottom img {
        max-width: 200px;
    }

    .slick-slide[aria-hidden=true] {
        opacity: 1;
    }


    #projects-carousel .item {
        min-height: 300px;
    }
}

@media all and (max-width: 480px) {

    .wrapper {
        padding: calc(var(--main-padding) / 1.5) calc(var(--main-padding) / 3.5);
    }

    h1 {
        padding-top: .5em;
        font-size: 1.7em;
        line-height: 1.2em;
        padding-bottom: 0;
        margin-bottom: 0;
    }

    h2 {
        font-size: 1.3em;
        line-height: 1.2em;
    }

    #about h2 {
        margin-top: calc(var(--main-padding) / 3.5);
    }

    h3, #services h3 {
        font-size: 1.3em;
        line-height: 1.2em;
    }

    .offer-description {
        font-size: 1.1em;
        line-height: 1.5em;
    }

    header .margined-right .header-ul {
        margin-top: 2em;
        margin-bottom: 0;
    }

    .header-ul > li {
        font-size: .9em;
        padding-bottom: 1.5em;
        padding-left: 3.5em;

    }

    .header-ul strong {
        font-size: 1.3em;
    }

    .number-1,
    .number-2,
    .number-3 {
        background-size: 2.5em;
    }


    .header-background {
        background: rgba(255, 255, 255, 0.78);
    }

    .main-background {
        background: #fff;
    }

    .margined-left {
        margin-left: 0;
    }

    .margined-right {
        margin-right: 0;
    }

    .flex-block {
        color: #fff;
    }

    .footer-background {
        background: var(--highlight-color);
    }

    .address {
        line-height: 1.3em;
    }

    .copyright {
        margin-top: 2em;
    }

    .made-by {
        margin-top: 0;
    }

    .logo-bottom {
        padding-bottom: 1em;
    }

    .logo-bottom img {
        max-width: 200px;
    }

    .slick-slide {
        filter: brightness(100%);
        -webkit-filter: brightness(100%);
        transition: none;
    }

    #projects-carousel .item {
        min-height: 300px;
    }
}


/* Portrait */
@media screen and (orientation:portrait) { /* Portrait styles here */ }
/* Landscape */
@media screen and (orientation:landscape) { /* Landscape styles here */ }


/* CSS for iPhone, iPad, and Retina Displays */

/* Non-Retina */
@media screen and (-webkit-max-device-pixel-ratio: 1) {
}

/* Retina */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (min-device-pixel-ratio: 1.5) {
}

/* iPhone Portrait */
@media screen and (max-device-width: 480px) and (orientation:portrait) {

}

/* iPhone Landscape */
@media screen and (max-device-width: 480px) and (orientation:landscape) {
}

/* iPad Portrait */
@media screen and (min-device-width: 481px) and (orientation:portrait) {
}

/* iPad Landscape */
@media screen and (min-device-width: 481px) and (orientation:landscape) {
}