/*Big tablet to 1200px - widths smaller that the 1140px row */
@media only screen and (max-width: 1200px){
    .row {
        padding:60px 2% 80px 2%;
        margin: 0 auto;
    }

    .iphone { text-align: center; }

    .number { padding-left: 0; }

    .sticky .logo_black { margin-left: 2%; }

    .form_box h2{ font-size: 130%; }
}

/*Small tablet to big tablet from 768 to 1023px */
@media only screen and (max-width: 1023px){

    .row { padding: 45px 2% 60px 2%; }

    body { font-size: 18px; }

    .property_btn {
        width: 140px;
        height: 40px;
    }

    /* Section Food delivery */
    .head p { width: 85%; }

    .ofood_detail { padding-right: 3%; }

    /*Section phone */
    .iphone {
        padding-left: 0;
    }

    .phone_flex { flex: 1.2; }

    .number_text p {
        font-size: 97%;
        padding: 45px 0 0 10px; }

    .number p {
        margin-top: 45px;
        width: 45px;
        height: 43px; }

    .number_text a img {
        height: 45px;
        padding: 60px 0 0 10px; }

    /* Section pay */
    .pay_table { width: 31%; }

    .price { font-size: 280%; }

    .offer_block ul li { font-size: 87%; }

    /*Section form */
    form { padding: 0; }

    .form_box h2{ font-size: 110%; }

    .form_box h2:after { margin: 20px auto 10px auto; }

    .contact_form { width: 90%; }

    .contact_form ul li {
        display: flex;
        flex-flow: column nowrap;
        padding-top: 3.2%;
    }

    .contact_form { width: 95%; }

    #label_name, #label_mail, #label_select, #label_msg, #newsletter {
        margin-bottom: 2%;
    }

    #name,#email, #find_us, #msg{
        margin-bottom: 4%;
    }

    /* Section footer */
    footer p { padding-bottom: 20px; }

    .nav { padding: 30px 0; }
}

/* Small phones to small tablet from 481 to 767px */
@media only screen and (max-width: 767px){

    body { font-size: 16px; }

    .row { padding: 35px 5%;
    }

    .logo {
        height: 90px;
    }

    h1 { font-size: 180%; }

    h2 { font-size: 140%; }

    h2:after { margin: 30px auto 30px auto; }

    /*Section Food delivery */
    .head p {
        width: 100%;
        text-align: justify;
    }

    .button_head {
        margin-top: 20px;
    }

    .ofood {
        flex-flow: row wrap;
    }
    .ofood_detail {
        flex: 70%;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .ofood_detail p { font-size: 100%;}

    .icon_big { font-size: 200%; }

    /* Section gallery */
    .gallery1,
    .gallery2 {
        display: flex;
        flex-flow: row wrap;
        justify-content: center;
    }

    .photo { width: 40%; }

    /*Section phone */
    .work_detail { flex-flow: column wrap; }

    .iphone {
        width: 70%;
        margin: 0 auto;
    }

    .phone_flex {
        width:80%;
        margin: 0 auto;
    }

    .number {
        padding-left: 2%;
        height: 280px;
    }

    .number p {
        font-size: 20px;
        margin-top: 40px;
        width:35px;
        height: 35px;
        padding-top: 2px;
    }

    .number_text p { padding: 40px 0 0 20px; }

    .number_text a img {
        height: 40px;
        padding: 50px 0 10px 10px;
    }

    .button_app { text-align: center; }


    /* Section city */
    .city_box {
        flex-flow: row wrap;
        justify-content:space-around;
    }

    .city:first-child { padding-left: 0; }

    .city {
        width: 48%;
        margin-bottom: 7%;
    }

    .city h3 { padding-bottom: 10px; }

    .city img { width: 100%; }

    /* Section opinion customer */
    .customer_box {
        flex-flow: row wrap;
        justify-content:space-around;
    }

    blockquote:before {
        font-size: 300%;
        height: 40px;
    }

    blockquote { margin-bottom: 5%; }

    .client_img {
        border-radius: 50%;
        width: 50px;
        margin-right: 10px;
    }

    .client {
        margin-bottom: 5%;
        width: 80%;
    }

    /* Section pay */

    .pay_box {
        display: flex;
        flex-flow: row wrap;
        justify-content:space-around;
    }

    .pay_table {
        width: 70%;
        margin-bottom: 4%;

    }
    .pay_table div { padding: 6% 10% 6% 10%; }

    .offer_block ul li i { padding-right: 15px; }

    .price {
        letter-spacing: 0.07em;
        font-weight: 300;
    }

    /* Section form */
    .form_box h2{ font-size: 150%; }

    .contact_form ul li { padding-top: 1%; }

    .form_box {
        position: relative;
        width: 100%;
    }

    .map_box {
        width: 100%;
        height: auto;
        position: relative;
    }

    #map {
        width: 100%;
        height: 400px;
    }
    /* Nav */
     nav ul {
         padding-left: 25%;
         float: left;
    }

     nav ul li { line-height: 2.2em; }

     nav ul li a {
         border: 0;
         font-size: 100%;
     }

    nav ul {display: none;}

     nav ul li a:hover { border: 0; }

    .mobile_nav_icon {
        display: flex;
        float: right;
        margin-top: 0;
        padding-right: 4%;
       }

    .sticky ul li { margin: 3px 0 0 0; }

    .sticky ul {
        margin-top: 10px;
        margin-bottom: 5px;
    }

    .sticky .mobile_nav_icon i {
        margin-top: 15px;
        color: #555}
}

/*Small phones 0 to 480px */
@media only screen and (max-width: 480px){

    h1 { font-size: 150%; }

    h2 { font-size: 110%; }

    h2:after { margin: 30px auto 30px auto; }

    h3 {
        font-size: 100%;
        margin-bottom: 15px;
    }
    .button_head {
        margin-top: 20px;
    }

    .phone_flex { width: 100%; }

    .number_text {
        margin-top: 10px;
    }
    .number_text p {
        padding: 20px 0 0 10px;
    }

    .number p {
        margin-top: 30px;
        width: 30px;
        height: 30px;
        padding-top: 2px;
    }

    .number_text a img {
        height: 30px;
        padding: 30px 0 10px 10px;
    }

    .button_app { text-align: left; }

    .city {
        width: 90%;
        margin-bottom: 7%;
    }

    .city h3 { padding-bottom: 0; }

    .city p { padding-bottom: 0; }

    .contact_form { width: 100%; }

    .contact_form ul li {
        margin-bottom: 4%;
    }

    .property_btn {
        padding: 0;
        width: 100px;
        height: 35px;
    }

    footer p { padding-bottom: 15px; }

    .nav {
        display: flex;
        padding: 20px 0;
    }

    .nav_page {
        flex: 4;
        padding-left:7px;
    }

    .pay_table { width: 90%;  }
}