/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v7.0.29,
* Autoprefixer: v9.7.6
* Browsers: last 4 version
*/

/*** media queries for tablet */

/** Breakpoint 1090px **/

@media only screen and (max-width: 68.12em) {
    
    html {
        font-size: 55%;
    }
}

/** Breakpoint 1020px **/

@media only screen and (max-width: 63.75em) {
    
    html {
        font-size: 50%;
    }

    #accomodations-cards--container #accomodations-cards--list,
    #accomodations-cards--container #accomodations-cards--popular
     {
        padding: 3rem;
    }
}

/** Breakpoint 960px **/
@media only screen and (max-width: 60em) {

    body {
        font-size: 1.5rem;
    }
    

    #accomodations-cards--container #accomodations-cards--list,
    #accomodations-cards--container #accomodations-cards--popular
     {
        padding: 3rem;
        gap: 3rem;
    }

    #accomodations-cards--container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 3rem;
    }

    #accomodations-cards--popular--title-container {
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        gap: 1.5rem;
        -ms-flex-preferred-size: 100%;
            flex-basis: 100%;
    }

    #accomodations-cards--popular {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
    }
    
}

/** Breakpoint 875px **/
@media only screen and (max-width: 54.7em) {
    body {
        font-weight: 500;
    }

    #activities-section--activities-responsive-double {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-flow: row nowrap;
                flex-flow: row nowrap;
    }
}

/** Breakpoint 780px **/
@media only screen and (max-width: 48.75em) {
    h1 {
        font-size: 2.5rem;
        line-height: 1;
    }

    #accomodations-cards--popular {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-flow: column wrap;
                flex-flow: column wrap;
    }   

    .accomodations-cards--card-tostretch {
        -ms-flex-item-align: stretch;
            -ms-grid-row-align: stretch;
            align-self: stretch;
    }
}

/** Breakpoint 700px **/
@media only screen and (max-width: 43.75em) {
    #romantic {
        -ms-flex-item-align: stretch;
            -ms-grid-row-align: stretch;
            align-self: stretch;
    }
}

/** Breakpoint 580px **/
@media only screen and (max-width: 36.25em) {
    header {
        margin-bottom: 3rem;
    }

    #search-bar--container {
        margin-top: 3rem;
    }
}