﻿
/* Mobile */
@media only screen and (max-width : 768px) {
    .MoveInInfoPart label {
        font-size: 14px;
        font-weight: normal;
        padding-left: 10px;
        margin-top: 7px;
        width: 96%;
    }
    .MoveInInfoPart p.error {
        width: 96% !important;
        padding-left: 5px;
        color: firebrick;
        margin-left: 10px;
    }
    .MoveInInfoPart p.error:focus {
        box-shadow: 0px 0px 3px 3px rgba(178,34,34,1) !important;
    }
    
    .MoveInInfoPart input, .MoveInInfoPart select {
        font-size: 15px;
        width: 96%;
        height: 30px;
        padding-left: 5px !important;
        margin-left: 10px;
        margin-bottom: 5px;
    }

    /* Street/City fields */
    input#PremiseCity, input#PreviousCity {
        width: 71%;
    }

    #PreviousStreetName, #PremiseStreetName {
        width: 96%;
    }

    /* House/ZIP fields */
    input#PremiseZipCode, input#PreviousZipCode {
        width: 22%;
    }

    /** House Number/Supplement fields*/
    input#BillingAccountNumber, input#PremiseSupplement, input#PreviousSupplement {
        width: 71%;
    }

    input#PremiseHouseNumber, input#BillingRegistrationNumber, input#PremiseHouseNumber,
    input#PreviousHouseNumber {
        width: 22%;
    }

    /*2.0 Meters */
    .MoveInMeters {
        border-top-style: solid;
        border-color: #98A4AE;
        padding-bottom: 7px;
    }
    .SecondNewReading {
        margin-left: 2px;
    }
    .MoveInMeterText {
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .CheckBoxLabel{
        width: 242px !important;
    }

    /* 2.0 Comment */
    .MoveInNote textarea {
        width: 96%;
        height: 75px;
        padding-left: 5px;
        font-size: 15px;
        margin-left: 10px;
        resize: none;
    }
    .MoveInNote {
        border-bottom-style: solid;
        border-top-style: solid;
        border-color: #98A4AE;
        padding-top: 2px;
        padding-bottom: 7px;
    }

    /* 3.0 Customer type selection */
    input#private, input#company {
        vertical-align: top;
        margin-top: 8px;
        height: 20px;
        width: 20px;
    }
    #RadioLabel{
        width: 175px;
    }
    .RadioLabel{
        width: 40% !important;
    }
    #SecondRadio {
        margin-left: 178px;
    }
    input#private:focus, input#company:focus {
        outline: transparent solid 3px;
        outline-offset: 0px;
        box-shadow: 0px 0px 3px 3px #0F464B;
    }
    #CustSelect {
        border-bottom-style: solid;
        border-color: #98A4AE;
        padding-bottom: 5px;
    }
    
    /* 3.0 Private */
    #CPR1, #CPR2 {
        width: 45.8%
    }
    .IdText {
        margin-top: 5px;
        margin-bottom: 0px;
        margin-right: 5px;
    }

    /* 3.0 Contact information */
    #ContactInfo {
        margin-top: 15px;
        border-top-style: solid;
        border-color: #98A4AE;
        padding-top: 10px;
    }
    .InfoText {
        margin-bottom: 0px;
    }

    /* 6.0 Attachments*/
    #file1, #file2 {
        margin-left: 5px;
        padding-top: 3px;
    }
        #file1:focus, #file2:focus {
            outline: transparent solid 3px;
            outline-offset: 0px;
            box-shadow: 0px 0px 3px 3px #0F464B;
        }

    /* 7.0 Buttons*/
    #MoveInButton {
        height: 42px;
        width: 120px;
        border-radius: 0;
        outline: none;
        margin: 15px 5px 15px 0;
    }
}

/* Desktop */
@media only screen and (min-width : 769px) {

    .MoveInInfoPart label {
        font-size: 14px;
        font-weight: normal;
        padding-left: 10px;
        margin-top: 7px;
        width: 250px !important;
    }
    .MoveInInfoPart input, .MoveInInfoPart select {
        font-size: 14px;
        width: 65%;
        height: 30px;
        padding-left: 5px !important;
        margin-top: 10px;
    }
    .MoveInInfoPart p.error {
        margin-left: 255px !important;
        margin-top: 5px !important;
        width: 64.7% !important;
        color: firebrick;
    }
    .MoveInInfoPart p.error:focus {
        box-shadow: 0px 0px 3px 3px rgba(178,34,34,1) !important;
    }
    
    /* Street/City fields*/
    #PremiseCity, #PreviousCity 
    {
        width: 49.7%;
    }

    /* House/ZIP fields */
    #PremiseZipCode, #PreviousZipCode {
        width: 15%;
    }

    /** House Number/Supplement fields */
    input#PremiseHouseNumber, input#BillingRegistrationNumber, input#PreviousHouseNumber {
        width: 15%;
    }

    input#BillingAccountNumber, input#PremiseSupplement, input#PreviousSupplement {
        width: 49.7%;
    }

    /*2.0 Meters*/
    .CheckBox {
        margin-top: 15px !important;
    }
    .MoveInMeters {
        border-top-style: solid;
        border-color: #98A4AE;
        padding-bottom: 10px;
    }
    .SecondNewReading{
        margin-left: 2px;
    }
    .MoveInMeterText {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    /* 2.0 Comment */
    .MoveInNote textarea {
        width: 65%;
        height: 75px;
        padding-left: 5px;
        font-size: 15px;
        resize: none;
    }
    .MoveInNote label {
        vertical-align: top;
        min-width: 250px;
        width: 20%;
        height: 60px;
    }
    .MoveInNote {
        border-bottom-style: solid;
        border-top-style: solid;
        border-color: #98A4AE;
        padding-bottom: 5px;
        padding-top: 10px;
    }

    /* 3.0 Customer type selection */
    input#private, input#company {
        vertical-align: top;
        margin-top: 8px;
        height: 20px;
        width: 20px;
    }
    input#private:focus, input#company:focus {
        outline: transparent solid 3px;
        outline-offset: 0px;
        box-shadow: 0px 0px 3px 3px #0F464B;
    }
    #SecondRadio{
       margin-left: 253px ;
    }
    #CustSelect {
        border-bottom-style: solid;
        border-color: #98A4AE;
        padding-bottom: 5px;
    }
   

    /* 3.0 Private */
    #CPRFirstPart, #CPRSecondPart {
        width: 32%
    }
    .IdText
    {
        margin-left: 245px;
        margin-top: 5px;
        margin-bottom: 0px;
        width: 67%;
    }

    /* 3.0 Contact information */
    #ContactInfo {
        margin-top: 15px;
        border-top-style: solid;
        border-color: #98A4AE;
        padding-top: 10px;
    }
    .InfoText{
        margin-bottom: 0px;
    }

    /* 6.0 Attachments*/
    #file1, #file2{
        margin-left: 5px;
        padding-top: 3px;
    }
    #file1:focus, #file2:focus{
        outline: transparent solid 3px;
        outline-offset: 0px;
        box-shadow: 0px 0px 3px 3px #0F464B;
    } 

    /* 7.0 Buttons*/
    #MoveInButton {
        height: 42px;
        width: 120px;
        border-radius: 0;
        outline: none;
        margin: 15px 5px 15px 0;
    }
}
