.txt-box {
    font-family: Arial,Verdana,Helvetica,sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 16px;

    border: 1px solid #c2c2c2;
    
    padding: 5px;
    height: 30px;

    box-sizing: border-box;

    width: 100%;
}

.txt-box:focus {
    border-color: #000000;
    outline: #000000 solid 1px;
}

@media screen and (min-width: 624px) {

    .order-data-frame {
        position: relative;
        width: 100%;
    }

    .order-header-container, .order-content-container, .order-button-container {
        width: calc(90% + 25px);
    }

    .login-box {
        width: 45%;
        
        display: inline-block;
        margin-right: 22px;
    }

    .passwd1-box {
        width: 45%;
        
        display: inline-block;
        margin-right: 22px;
    }

    .passwd2-box {
        width: 45%;
        
        display: inline-block;
    }

    .name-box {
        width: 45%;
        
        display: inline-block;
        margin-right: 22px;
    }

    .jobt-box {
        width: 45%;
        
        display: inline-block;
    }

    .indst-box {
        width: 45%;
        
        display: inline-block;
        margin-right: 22px;
    }

    .corp-box {
        width: 45%;
        
        display: inline-block;
    }

    .addr1-box {
        width: 45%;
        
        display: inline-block;
        margin-right: 22px;
    }

    .addr2-box {
        width: 45%;
        
        display: inline-block;
    }

    .city-box {
        width: 45%;
        
        display: inline-block;
        margin-right: 22px;
    }

    .country-box {
        width: 45%;
        
        display: inline-block;
    }

    .state-box {
        width: 20%;
        
        display: inline-block;
        margin-right: 22px;
    }

    .zipc-box {
        width: 16%; 
        
        display: inline-block;
        margin-right: 22px;
    }

    .phone-box {
        width:  calc((100% - 10% - 20% - 16% - 22px - 22px) / 2);
        
        display: inline-block;
        margin-right: 22px;
    }

    .faxim-box {
        width:  calc((100% - 10% - 20% - 16% - 22px - 22px) / 2);
        
        display: inline-block;
    }

    .email1-box {
        width: 45%;
        
        display: inline-block;
        margin-right: 22px;
    }

    .email2-box {
        width: 45%;
        
        display: inline-block;
    }

    .tc-box {
        width: calc(90% + 25px);
        display: inline-block;
    }

    .country-envelope {
        width: 100%;
        height: 30px;
    }

    .country-elem {
        width: 100%;
        display: inline-block;
        position: relative;
    }

    .country-elem-short {
        width: 30%;
        display: inline-block;
        position: relative;

        margin-right: 22px;
    }

    .other-elem {
        width: calc(70% - 26px);
        display: inline-block;
        position: relative;
    }

    .zip5-elem {
        width: 48%;
        display: inline-block;
        position: relative;
    }

    .dash-elem {
       width: calc(14% - 9px);

       display: inline-block;
       position: relative;

       font-family: Arial;
       font-size: 18px;

       text-align: center;
    }

    .zip4-elem {
        width: 38%;

        display: inline-block;
        position: relative;
    }

    .ph1-elem {
        width: 29%;
        display: inline-block;
        position: relative;

        margin-right: calc(4.5% - 4px);
    }

    .ph2-elem {
        width: 29%;
        display: inline-block;
        position: relative;

        margin-right: calc(4.5% - 4px);
    }

    .ph3-elem {
        width: 33%;
        display: inline-block;
        position: relative;
    }

    .pho-elem {
        width: 100%;
        display: inline-block;
        position: relative;
    }

    .button-order-full {
        width: 160px;
        display: normal; 
    }

    .button-pos-1 {
        right: 200px;
    }

    .button-pos-2 {
        right: 0px;
    }
}

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

    .order-data-frame {
        position: relative;
        width: 100%;
    }

    .order-header-container, .order-content-container, .order-button-container {
        width: 100%;
    }

    .login-box {
        width: 100%;
        
        display: inline-block;        
    }

    .passwd1-box {
        width: 100%;
        
        display: inline-block;        
        padding-bottom: 23px; 
    }

    .passwd2-box {
        width: 100%;
        
        display: inline-block;
    }

    .name-box {
        width: 100%;
        
        display: inline-block;        
        padding-bottom: 23px; 
    }

    .jobt-box {
        width: 100%;
        
        display: inline-block;
    }

    .indst-box {
        width: 100%;
        
        display: inline-block;        
        padding-bottom: 23px; 
    }

    .corp-box {
        width: 100%;
        
        display: inline-block;
    }

    .addr1-box {
        width: 100%;
        
        display: inline-block;
        padding-bottom: 23px;  
    }

    .addr2-box {
        width: 100%;
        
        display: inline-block;
    }

    .city-box {
        width: 100%;
        
        display: inline-block;
        padding-bottom: 23px;  
    }

    .country-box {
        width: 100%;
        
        display: inline-block;
    }

    .state-box {
        width: 180px;
        
        display: inline-block;
        margin-right: 22px;

        padding-bottom: 23px;
    }

    .zipc-box {
        width: 180px; 
        
        display: inline-block;

        padding-bottom: 23px;
    }

    .phone-box {
        width: 180px;
        
        display: inline-block;
         margin-right: 22px;
    }

    .faxim-box {
        width: 180px;
        
        display: inline-block;
    }

    .email1-box {
        width: 100%;
        
        display: inline-block;
        padding-bottom: 23px;
    }

    .email2-box {
        width: 100%;
        
        display: inline-block;
    }

    .tc-box {
        width: 100%;
        display: inline-block;
    }

    .country-envelope {
        width: 100%;
        height: 83px;
    }

    .country-elem {
        width: 100%;
        display: inline-block;
        position: relative;
    }

    .country-elem-short {
        width: 100%;
        display: inline-block;
        position: relative;

        margin-bottom: 23px;
    }

    .other-elem {
        width: 100%;
        display: inline-block;
        position: relative;

        margin-bottom: 23px;
    }

    .zip5-elem {
        width: 48%;
        display: inline-block;
        position: relative;

    }

    .dash-elem {
        width: calc(14% - 9px);

        display: inline-block;
        position: relative;

        font-family: Arial;
        font-size: 18px;

        text-align: center;
    }

    .zip4-elem {
        width: 38%;

        display: inline-block;
        position: relative;
    }

    .ph1-elem {
        width: 27%;
        display: inline-block;
        position: relative;

        margin-right: calc(4.5% - 4px);
    }

    .ph2-elem {
        width: 27%;
        display: inline-block;
        position: relative;

        margin-right: calc(4.5% - 4px);
    }

    .ph3-elem {
        width: 37%;
        display: inline-block;
        position: relative;
    }

    .button-order-full {
        width: 130px;
        display: normal; 
    }

    .button-pos-1 {
        right: 170px;
    }

    .button-pos-2 {
        right: 0px;
    }
}

.textmessage {
    font-family: Webfont, Arial, Helvetica, sans-serif;
	font-size: 13px;
    font-weight:500;
	color: #000000;
}

.textmessagelarge {
    font-family: Webfont, Arial, Helvetica, sans-serif;
	font-size: 16px;
    font-weight:500;
	color: #000000;
}

.order-header-gradient-4 {
    background-color: rgba(255,255,255,1);
    width: 100%;
    height: 100%;
    position: relative;
    padding-bottom: 10px;
}

.order-header-gradient-3 {
    background: linear-gradient(rgba(255,255,255,1.00), rgba(255,255,255,0.66));
    width: 100%;
    height: 15px;
    position: relative;
}

.order-header-gradient-2 {
    background: linear-gradient(rgba(255,255,255,0.66), rgba(255,255,255,0.33));
    width: 100%;
    height: 15px;
    position: relative;
}

.order-header-gradient-1 {
    background: linear-gradient(rgba(255,255,255,0.33), rgba(255,255,255,0.00));
    width: 100%;
    height: 15px;
    position: relative;
}

.order-buttons-gradient-1 {
    background: linear-gradient(rgba(255,255,255,0.00), rgba(255,255,255,0.33));
    width: 100%;
    height: 15px;
    position: relative;
}

.order-buttons-gradient-2 {
    background: linear-gradient(rgba(255,255,255,0.33), rgba(255,255,255,0.66));
    width: 100%;
    height: 15px;
    position: relative;
}

.order-buttons-gradient-3 {
    background: linear-gradient(rgba(255,255,255,0.66), rgba(255,255,255,1.00));
    width: 100%;
    height: 15px;
    position: relative;
}

.order-buttons-gradient-4 {
    background-color: rgba(255,255,255,1);
    width: 100%;
    height: 50px;
    position: relative;
}

.order-header-container, .order-content-container, .order-button-container {
    position: relative;
    height: 100%; 
}

.order-header-float {

    width: 100%;

    position: -webkit-sticky;
    position: sticky; 
    top: 0px;

    z-index: 99;
}

.order-header-float-ie {

    width: 100%;

    position: fixed; 
    top: 0px;

    z-index: 99;
}

.order-buttons-float {

    width: 100%;
    height: 95px;

    position: -webkit-sticky;
    position: sticky; 
    bottom: 0px;
}

.order-buttons-float-ie {

    width: 100%;
    height: 95px;

    position: fixed;
    bottom: 0px;
}

.error-hidden {
    display: none;
}