﻿
@media screen and (max-width: 1199px) {
    #o .row.second-block.mbottom-20.overview-container p {
        font-size: 16px;
    }

    #o .row.second-block.mbottom-20.overview-container input.special-field {
        width: 50%;
    }

    #r .row.second-block.mbottom-20.overview-container input.special-field {
        width: 47%;
    }

    #s .sign-info input {
        width: 80%;
    }
}

@media screen and (max-width: 991px) {
   
    .headline-rental h1 {
        font-size: 29px;
    }

    #o .row.second-block.mbottom-20.overview-container input.special-field {
        width: 32%;
    }

    #o .fill-in.overview-ingress input, #r .fill-in.overview-ingress input {
        width: 100%;
        margin-bottom: 10px;
    }

    #o .fill-in.overview-ingress .col-xs-6 p, #r .fill-in.overview-ingress .col-xs-6 p, .fill-in .col-xs-8 p, .fill-in .col-xs-4 p {
        display: block;
        height: auto;
    }

    #o .headline-rental h2, #r .headline-rental h2 {
        font-size: 27px;
    }

    #r .row.second-block.mbottom-20.overview-container input.special-field {
        width: 44%;
    }

    #s .sign-info input {
        width: 68%;
    }

    #s input {
        width: 77%;
    }

    #o .row.second-page-second-row.mtop-40 .col-xs-12, #r .row.second-page-second-row.mtop-40 .col-xs-12 {
        position: unset;
    }

    #o .row.second-page .col-xs-12 .header-wrapper, #r .row.second-page .col-xs-12 .header-wrapper {
        height: 536px;
    }

    img.kaross-bild {
        width: 78%;
        left: 204px;
        top: -190px;
    }
}

@media screen and (max-width: 768px) {
   
    .headline-rental h1 {
        font-size: 24px;
        margin-bottom: 10px;
    }

    .headline-rental p {
        line-height: 1.2;
        font-size: 13px;
    }

     .second-block .col-xs-12 .row .col-xs-8 p:last-of-type {
        font-size: 12px;
    }

    .second-block .col-xs-12 .row .col-xs-4 span, .second-block .col-xs-12 .row .col-xs-4 input {
        font-size: 12px;
    }

    #o .row.second-block.mbottom-20.overview-container p, #r .row.second-block.mbottom-20.overview-container p {
        font-size: 14px;
        font-weight: 700;
    }

    img.kaross-bild {
        display: block;
        width: 68%;
        position: relative;
        top: -190px;
        z-index: -99;
    }

}

@media screen and (max-width: 600px) {
   
     .headline-rental h1 {
        font-size: 20px;
    }

     #o .row.second-block.mbottom-20.overview-container input.special-field,
     #r .row.second-block.mbottom-20.overview-container input.special-field {
        width: 100%;
    }

    #o .headline-rental h2, #r .headline-rental h2 {
        font-size: 23px;
    }

    #s .sign-info input, #s input {
        width: 100%;
        margin-bottom: 10px;
    }

    #s p {
        font-size: 22px;
    }

    img.kaross-bild {
        width: 100%;
        position: unset;
        z-index: 0;
    }

    #o .row.second-page .col-xs-12 .header-wrapper, #r .row.second-page .col-xs-12 .header-wrapper {
        height: 644px;
    }
}

@media screen and (max-width: 480px) {
   
    .headline-rental p {
        width: 100%;
    }

    .header-wrapper>.col-xs-6, .header-wrapper .col-xs-6.headline-rental {
        width: 100%;
    }

    .header-wrapper img {
        width: 128px;
        margin-bottom: 20px;
        float: left;
        margin-right: 20px;
    }

    .second-page-first-row h2 {
        font-size: 23px;
        margin-bottom: 30px;
    }

    .overview-ingress .col-xs-6.mbottom-20 {
        width: 70%;
    }

    .header-wrapper p.contact-info input {
        margin-left: 0;
        width: 43%;
        float: right;
    }

    p.contact-info {
        font-weight: 100;
        margin-bottom: 5px;
        font-size: 12px;
    }

    .second-block .col-xs-12 .row .col-xs-4 input {
        margin-left: 7px;
    }

    .row.fill-in .col-xs-6.mbottom-20, .row.fill-in .col-xs-8, .row.fill-in .col-xs-4 {
        width: 100%;
    }

    #s .col-xs-6 {
        width: 100%;
    }

    img.kaross-bild {
        width: 100% !important;
    }

    #o .row.second-page .col-xs-12 .header-wrapper, #r .row.second-page .col-xs-12 .header-wrapper {
        height: 476px;
    }

    #o .headline-rental h2, #r .headline-rental h2 {
        margin-top: 20px;
    }

}