/* Define CSS first, then show them after media query */
.responsive, .tablet, .mobile { display: none; }
.action-type-grid { display: block; }

.margin_20_pc {margin-left:20%; display:block;}
.radio_grid_parent {
	white-space: nowrap;
	width:30%;
	position:relative;
	display: inline-block;
	margin: 5px 0 5px 0;
}

@media only screen and (max-width: 1080px) {
    /* Form */
    section#content .inner .right form .row input[type=text],section#content .inner .right form .row.selects select, section#content .inner .rightform .row.select select, form .row select { height: 35px; }
    section#content .inner .right form button, .btn-why-win { height: 50px; line-height: 50px; }
    section#content .inner .right .form-wrapper { min-height: 450px; }
}

@media only screen and (max-width: 930px) {

}


@media only screen and (max-width: 900px) {
    /* Form */
    section#content .inner .right form .row.selects select,
    section#content .inner .rightform .row.select select, form .row select { padding-right: 0; }
    form .left, form .right, form .two-input-diff{ width: 100%!important; float: none; }
    form .row #street, form .row #zipcode { margin-bottom: 5%; }
    /*form .row:not(.checkbox):not(.input-doi):not(.captcha) label:not(.gender) { display: none; }*/
    form button { position: static; }
    .contact-winners { position: static; }

    /* fancy form */
    .fancy-form .row #last_name { background: white url('../images/form/name.png') no-repeat left center; background-size: auto 100%; text-indent: 33px; }

    /* error */
    form .row:not(.checkbox):not(.gender):not(.input-suburb) .error { right: 102%; top: 5px; }
    form .row.input-suburb .error { right: 102%; }
    form .row.input-doi:not(.checkbox):not(.gender):not(.input-suburb) .error { top: 23px; }
    form .row.input-zip:not(.checkbox):not(.gender):not(.input-suburb) .error { top: 48px; }

}

@media only screen and (max-width: 700px) {
    /* general */
    .middle-part{
        background: white;}
    body { padding: 0; }
    .responsive { display: block; }
    .desktop { display: none; }
    .hidden { display: none; }

    /* Mobile form */
    .mobile-form { clear: both; padding-top: 40px; }
    .mobile-form > strong { text-align: center; font-size: 18px; display: block; }
    form .row.selects select,form .row.select select, form .row select { padding-right: 0; }
    form .row.gender { text-align: center; }
    form .row.gender label { display: inline-block; }
    form .row.gender label span { float: left; font-weight: bold; font-size: 14px; position: relative; margin-left: 10px; margin-right: 5px; }
    input[type="checkbox"], input[type="radio"] { width: 15px; height: 15px; }

    /*GF*/
    /* ERROR */
    form .row .flamingo_error { padding: 5px 7px 2px; }
    form .row.input-firstname .flamingo_error { right: 116%; }
    form .row .flamingo_error:after {
        background: url('../images/error_icon.png') no-repeat center center / 20px;
        margin: 0;
        }
    form .row .flamingo_error {
        background: none;
        font-size: 0;
        height: 0;
        right: 0;
        text-indent: -99999px;
        top: 0;
        width: 0;
        }
    form .row.input-firstname .flamingo_error { right: 0; }
    form .row.gender .flamingo_error { right: 102%; top: -3px; }
    form .row.checkbox .flamingo_error { right: 102%; top: -1px; }
    form .row.input-doi .flamingo_error { right: 102%; top: -1px; }
    form .row.input-mobile .flamingo_error { right: 0; }



    /* OK */
    form .row .flamingo_ok { padding: 5px 7px 2px; }
    form .row.input-firstname .flamingo_ok { right: 116%; }
    form .row .flamingo_ok:after {
        background: url('../images/approve.png') no-repeat center center / 20px;
        margin: 0;
        }
    form .row .flamingo_ok {
        background: none;
        font-size: 0;
        height: 0;
        right: 0;
        text-indent: -99999px;
        top: 0;
        width: 0;
        }
    form .row.input-firstname .flamingo_ok { right: 0; }
    form .row.gender .flamingo_ok { right: 102%; top: -3px; }
    form .row.checkbox .flamingo_ok { right: 102%; top: -1px; }
    form .row.input-doi .flamingo_ok { right: 102%; top: -1px; }
    form .row.input-mobile .flamingo_ok { right: 0; }

    /**** ID FORM ****/
    .id form .row:not(.checkbox):not(.gender):not(.input-suburb) .error { right: 0;}
    .id form .row.input-doi:not(.checkbox):not(.gender):not(.input-suburb) .error { top: 0; }
    /*.id form .row .error { margin-bottom: 40px; top: 0; }*/


    /* Exit */
    .step5.step-survey > img { display: block; }
    body .step-8floors .step5 iframe { height: 800px !important; max-width: 100%; }

    .inquiry-visible .exit-web .step { display: none; }
    .inquiry-visible .exit-mobile .step-inquiry { display: block; }

    .step-survey .section { border: 1px solid black; border-radius: 10px !important; }
    .step-survey .section .action-type-grid { display: block; }
    .step-survey .section .question div > div { margin: 0 !important; padding: 5px 0; text-align: left; line-height: 20px; }
    .step-survey .section .question div > div input { display: inline; position: relative; margin-right: 5px; width: 20px; height: 20px; }

    .questions-hidden section#content { background: none; padding: 0; }
    .questions-hidden section#content .arrow { margin-top: 15%; width: 18%; }
    .questions-hidden section#content .arrow.left { float: left; }
    .questions-hidden section#content .voucher { float: left; }
    .questions-hidden section#content .arrow.right { float: right; }
    .questions-hidden .questions { display: none; }
    .questions-hidden section#content .inner .right .form-wrapper { display: block; }

    .inquiry-visible { font-family: 'Arial', sans-serif; }
}


@media only screen and (max-width: 500px) {
    /* loading page */
    #loading { font-size: 16px; }
    #loading h1 { font-size: 20px; margin-top: 100px; }
    #thanks { font-size: 20px; }
    #thanks h1 { margin-top: 100px; }

    /* fancy form */
    .fancy-form.flamingo-form .row #last_name,
    .fancy-form .row #first_name, .fancy-form .row #last_name, .fancy-form .row #zipcode,
    .fr .fancy-form .row #first_name, .fr .fancy-form .row #last_name, .fr .fancy-form .row #zipcode,
    .fancy-form .row #email,
    .fancy-form .row #mobile,/******* IT & FR****/
    .fancy-form .row #via, /******* IT & FR****/
   .it .fancy-form .row #city,  /******* IT & FR****/
    .fancy-form .row #street, /******* IT & FR****/
    .fancy-form.flamingo-form .row #landline
    { text-indent: 45px; }
    .fancy-form .row.selects input#dob_d,
    .fancy-form .row.selects select#dob_d { text-indent: 54px; width: 92px; }
    .fancy-form .row.selects input#dob_m,
    .fancy-form .row.selects select#dob_m { width: calc(96% - 162px); }
    @-moz-document url-prefix() { .fancy-form .row.selects select#dob_d { text-indent: 27px; } }
    .fancy-form .row.selects input#dob_y,
    .fancy-form .row.selects select#dob_y { width: 68px; }

    /* fancy-form2 */
    .fancy-form2 .row.selects input#dob_d, .fancy-form2 .row.selects select#dob_d {
        text-indent: 0px;
    }
    .fancy-form2 .row {
        margin-bottom: 8px;
    }


    /* form */
    .form-wrapper form { margin-left: auto; margin-right: auto; max-width: 95%; }
    form button { width: 92%; }
    form button, .btn-why-win { font-size: 20px; }
    body form .row.checkbox label { width: 83%; }
    form .row.checkbox .error, form .row.gender .error,
    form .row:not(.checkbox):not(.gender):not(.input-suburb) .error,
    form .row.input-suburb .error { right: 100%; }
    form .row .error:after { background-size: 17px; }
    form .row input[type=text] { font-size: 18px; }
    form .row input[type=text],
    form .row.selects select,form .row.select select, form .row select,
    form .row.checkbox select { height: 50px; margin-bottom: 5%; }
    form button { font-size: 20px; font-weight: 700; height: 60px; }
    form .row.gender label span { font-size: 18px; }
    #gender { margin-right: 10px; }
    form .row.gender label span { line-height:27px; }
    input[type=checkbox],
    input[type=radio] {
        outline: none;
        width: 30px;
        height: 30px;
        font-size: 11px;
        float: left;
        line-height: 2;
        display: block;
        font-weight: bold;
        border: 3px solid #2a2a2a;
        /*-webkit-appearance: none;*/
        /*-moz-appearance: none;*/
        /*-moz-box-border: none;*/
        /*-moz-box-sizing: none;*/
        color: #7F7F7F;
        background: #343434;
        margin-right: 5px;
    }

    input[type=radio] { border-radius: 35px; }
    .contact-winners { margin-top: 10px; }
    form .row.checkbox select:first-of-type { margin-top: 8px; }

    /* error */
    form .row .error { top: 11px; }
    form .row.input-zip:not(.checkbox):not(.gender):not(.input-suburb) .error { top: 9px; }



    /* exit */
    .step-iframe .btn-gonext { width: 75%; }
    body .step-whywin, body .step-8floors, body .step.step-thankyou .thankyou { width: 100%; }

	.radio_grid_parent {
		display:block !important;
		margin-top:25px;
		white-space: normal;
		width:100%;
        text-align: left;
	}
	.margin_20_pc { margin-left:0; }

	form .row.captcha .row {
		margin-left: 0px;
		width: 100%;
	}
}

@media only screen and (max-width: 400px) {
    /* form */
    form .row.gender label span { margin-left: 5px; }
    form button, .btn-why-win { font-size: 17px; }
    form .row .error:after { background-size: 12px; }
    form .row input[type=text],section#content .inner .right form .row.selects select, section#content .inner .rightform .row.select select, form .row select { padding-left: 8px; }
    form .row.checkbox .error,
    form .row.gender .error,
    form .row.input-suburb .error,
    form .row:not(.checkbox):not(.gender):not(.input-suburb) .error { right: 98%; }
}

@media only screen and (max-width: 359px) {
    /* loading page */
    #thanks { font-size: 18px; }
}
