@charset "utf-8";
@font-face {
    font-family: PlutoSansDPDExtraLight;
    src: url(../../php/speedy_address_form/fonts/OTF/PlutoSansDPDExtraLight.otf);
}

@font-face {
    font-family: PlutoSansDPDLight;
    src: url(../../php/speedy_address_form/fonts/OTF/PlutoSansDPDLight.otf);
}

@font-face {
    font-family: PlutoSansDPDRegular;
    src: url(../../php/speedy_address_form/fonts/OTF/PlutoSansDPDRegular.otf);
}

@font-face {
    font-family: PlutoSansDPDThin;
    src: url(../../php/speedy_address_form/fonts/OTF/PlutoSansDPDThin.otf);
}

body{
    box-sizing: border-box;
}

:root {
    --DPD-Red: #dc0032;
    --DPD-Dark-Red: #a90034;
    --DPD-Black: #414042;
    --DPD-Warm-Grey: #cac4be;
    --DPD-Mid-Grey: #808285;
    --DPD-Light-Grey: #e6e7e8;
    --white: #FFFFFF;
}

.container {
    margin: auto;
    color: var(--DPD-Black);
    font: 12px PlutoSansDPDLight, Arial, Helvetica, sans-serif;
    padding: 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    vertical-align: top;
}





.divBlock1 {
    /*float: left;*/
    margin: auto;
    width: 100%;
}

.headerInfo {
    height: auto;
    margin: auto;
    max-width: 800px;
}

.d-inline{
   display: inline;
   text-align: center;
   color: var(--DPD-Red);
}








.formWidget {
    border-top: 1px solid #CCCCCC;
    border-bottom: 1px solid #CCCCCC;
    padding: 5px 10px;
    margin: 5px 0;
}









#frameOfficeLocator {
    border: 0px solid var(--DPD-Black);
}


.languages {
    float: right;
}

#choose_office{
    /*display: none;*/
}

.columnAdditional{
    width: 158px;
}

.addressFormOptions, .selectLanguage {
   /* width: 100%; */
   border-radius: unset;
   padding: 3px 3px 2px 3px;
   font: 12px PlutoSansDPDLight, Arial, Helvetica, sans-serif;
   border: 1px solid var(--DPD-Black);
   color: var(--DPD-Red);
   -moz-box-shadow: inset 0 0 6px #E9E9E9;
   -webkit-box-shadow: inset 0 0 6px #E9E9E9;
   box-shadow: inset 0 0 6px #E9E9E9;
}
.selectLanguage { width: 100px; }
.frameCodeDiv{
    max-width: 1250px;
    display: block;
    margin: auto;
}

.officeTextContainer{
    margin: auto;
    height: auto;
    display: block;
    max-width: 1072px;
}

.displayNone {
    display: none;
}


.divFilterLabel { display: inline-block; }



/* ----------------- NEW ----------------- */
.left { text-align: left; }
.center { text-align: center; }
.right { text-align: right; }
.sectionTitle { color: var(--DPD-Black); font-weight: bold; font-size: 12px }

.divContainer {
    display: inline-block;
    width: 100%;
    vertical-align: top;
    padding-top: 20px;
}
.divLeft {
    display: inline-block;
    width: 560px;
    min-width: 560px;
    vertical-align: top;
    margin: 0px;
}
.divRight {
    display: inline-block;
    width: 800px;
    min-width: 800px;
    vertical-align: top;
    margin: 0px;
}

.divResultTextareaLeft, .divResultTextareaRight { display: inline-block; width: calc(50% - 7px); }
.divResultTextareaRight { margin-left: 10px; }

.inputFrameParam, .selectFrameParam, .textareaFrameParam, .textareaResultJson {
   color: var(--DPD-Red);
   font: 12px PlutoSansDPDLight, Arial, Helvetica, sans-serif;
   border: 1px solid var(--DPD-Warm-Grey);
   margin: 0;
   padding: 3px;
   -moz-box-shadow: inset 0 0 6px #E9E9E9;
   -webkit-box-shadow: inset 0 0 6px #E9E9E9;
   box-shadow: inset 0 0 6px #E9E9E9;
}

.inputFrameParam { width: 112px; }
.selectFrameParam { width: 120px; }

.textareaFrameParam {
   width: calc(100% - 22px);
   height: 60px;
   padding: 10px;
   color: var(--DPD-Black)
}

.textareaResultJson {
   width: calc(100% - 22px);
   height: 150px;
   padding: 10px;
   color: var(--DPD-Black);
   background-color: #f1f1f1;
}

.inputFrameButton {
    height: auto;
    width: 250px;
    color: #FFFFFF;
    font: 12px PlutoSansDPDLight, Arial, Helvetica, sans-serif;
    margin: 20px auto;
    padding: 4px 20px 4px 20px;
    border: 1px solid var(--DPD-Dark-Red);
    background-color: var(--DPD-Dark-Red);
}
.inputFrameButton:hover, .inputFrameButton:active, .inputFrameButton:focus {
    background-color: var(--DPD-Red);
}







@media all and (max-width: 700px){

}

