/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/

:root {
  --dsv-black: #000;
  --dsv-blue: #192862;
  --dsv-light-blue: #C5CAE9;
  --dsv-dark-blue: #0D113B;
  --dsv-red: #EC0016;
  --dsv-dark-red: #a51b00;
  --dsv-amber: #e09600;
  --dsv-dark-grey: #646973;
  --dsv-darker-grey: #464646;
  --dsv-mid-grey: #878C96;
  --dsv-light-grey: #D7DCE1;
  --dsv-exra-light-grey: #F0F3F5;
  --dsv-green: #77b259;
  --dsv-link-submit: #0431a6;
  --dsv-goods-icon: #0b2967;
  /* Card system */
  --card: #fff;
  --border: #e2e5ea;
  --radius: 10px;
  --radius-sm: 6px;
  --shadow: 0 1px 3px rgba(0, 0, 0, .06), 0 4px 16px rgba(0, 0, 0, .06);
  --text: #000;
  --muted: #878C96;
  --mono: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
}

/** General classes **/


body {
    font-family: 'Foundry Sterling', sans-serif;
    font-weight: 300;
    font-style: normal;
    font-size: 100%;
}

h1, h2 {
  font-family: 'Foundry Sterling', sans-serif;
    font-weight: bold;
    font-style: normal;
}
h1 {
  font-size: clamp(1.3rem, 3vw, 1.6rem);
}

.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -ms-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.flexsb {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -ms-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.flexsb100 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -ms-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
}
.flex1 {
  -webkit-box-flex: 1;
      -ms-flex: 1;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-width: 240px;
}
.flex2 {
  -webkit-box-flex: 2;
      -ms-flex: 2;
  -webkit-box-flex: 2;
  -ms-flex: 2;
  flex: 2;
  padding: 0 10px;
}
.center {
  -webkit-box-align: center;
      -ms-flex-align: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  text-align: center;
}
.icon img {
  width: 18px;
  max-width: initial;
}
.page-title {
  margin: 20px 0;
  text-align: center;
}
table {
  width: 100%;
}
#user-logout-confirm {
  margin: auto;
  text-align: center;
}

/** Buttons **/

input.form-submit,
.button,
.ui-dialog .ui-dialog-buttonpane button,
.swal2-popup .swal2-styled.swal2-confirm, button {
  font-size: 1rem;
  font-weight: bold;
  padding: 15px 20px;
  background: var(--dsv-link-submit) !important;
  color: #fff !important;
  text-shadow: none !important;
  border: 0;
  -webkit-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
  cursor: pointer;
  text-decoration: none!important;
  /* margin: 3px 5px; */
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: -webkit-inline-flex;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-appearance: none;
  -moz-appearance:    none;
  appearance:         none;
  margin: 10px 0;

}
input.form-submit:hover,
.button:hover,
.ui-dialog .ui-dialog-buttonpane button:hover,
.swal2-popup .swal2-styled.swal2-confirm:hover, button:hover {
  -webkit-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
  /* background: var(--dsv-dark-blue) !important; */
  -webkit-box-shadow: inset 0px -3px 0px #0431a6, inset 0 -5px 0px #fff;
          box-shadow: inset 0px -3px 0px #0431a6, inset 0 -5px 0px #fff;
}
.ui-dialog .ui-dialog-buttonpane button + button {
  margin-left: 10px;
}
.button.small {
  font-size: 0.85em;
  padding: 10px 15px;
}
a.dr-form:hover {
  -webkit-box-shadow: inset 0px -4px 0px #fff, inset 0 -8px 0px #002664;
          box-shadow: inset 0px -4px 0px #fff, inset 0 -8px 0px #002664;
  -webkit-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
}
.dr-form {
  -webkit-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
}
[id^="dr-form"], #sign-dr-form, #block-dsv-page-title, #start-new-dr-form, #user-login-form {
  max-width: 850px;
  margin: 40px auto;
  padding: 0 20px;
}
[id^="dr-form"] [id^="edit-actions"],
#sign-dr-form #edit-actions {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-column-gap: 20px;
     -moz-column-gap: 20px;
          column-gap: 20px;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  clear: both;
}


/** Header **/

header {
  margin: 0 24px;
}
header .flexsb100 {
  max-width: 1280px;
  margin: auto;
  -webkit-box-align: center;
      -ms-flex-align: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

/* .dsv-logo {
  padding: 0.5em 0 0;
  margin-left: -1em;
} */
.dsv-logo img {
  width: 15vw;
  height: auto;
  max-width: 150px;
  min-width: 100px;
}
#dsvlogo {
  display: inline-block;
}


a[href*="/masquerade?"],
a[href*="/unmasquerade?"] {
  background: var(--dsv-red);
  color: #fff;
  font-weight: bold;
  padding: 5px 10px;
  display: inline-block;
}

.dsv-menus svg {
  width: 30px;
}
.dsv-menus summary {
  display: inline-block;
}

#dsv-settings-menu {
  position: relative;
}
.settings-menu {
  position: absolute;
  right: 0;
  margin-top: 6px;
  background: #fff;
  padding: 10px 0 10px 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  z-index: 100;
  min-width: 250px;
  -webkit-box-shadow: -2px 5px 5px 0px #0006;
          box-shadow: -2px 5px 5px 0px #0006;
}
.settings-menu .linkicon {
  color: var(--dsv-blue);
  padding: 7px;
  margin-right: 10px;
  font-weight: bold;
  font-size: 0.9rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -ms-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.settings-menu .linkicon img {
  width: 25px;
  height: 25px;
  padding-right: 10px;
}
.settings-menu a {
  text-decoration: none!important;
}
.settings-menu a.linkicon:hover {
  background: rgba(22,125,134,0.08);
  text-decoration: none!important;
}
#block-dsv-languagedropdownswitcher {
  z-index: 1000;
  position: absolute;
  top: 0;
  font-size: 0.7rem;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
      transform: translateX(-50%);
  
}
#block-dsv-languagedropdownswitcher select, #lang_dropdown_form_lang-dropdown-form {
  border: 0;
  border-radius: 0 0 5px 5px;
  padding: 1px 5px 3px;
  background: var(--dsv-link-submit);
  color: #fff;
  width: 120px !important;
}



#block-dsv-drformbanner img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  max-height: 200px;
  -o-object-position: bottom;
     object-position: bottom;
}

/** Dialog popup **/

.ui-widget-overlay {
  background: rgba(25, 40, 98, 0.85);
  opacity: 1;
}
.ui-dialog {
  margin-top: 100px;
  border: 0!important;
  border-radius: 5px!important;
  width: auto!important;
  max-width: 85vw;
  min-width: 320px;
  position: relative;
  margin: 100px auto 0!important;
  z-index: 1000;
  background-color: #fff;
}
#drupal-modal {
  overflow-x: hidden;
}
#drupal-modal .no-modal {
  display: none;
}
.modal-only {
  display: none;
}
#drupal-modal #project-links {
  display: none;
}

#drupal-modal .modal-only {
  display: inherit;   
}
form #messages {
  display: none;
}
#drupal-modal form #messages {
  display: inherit;
}
#drupal-modal h1 {
  display: none;
}
.ui-dialog-titlebar {
  padding: 50px 1em 0!important;
  border: 0!important;
  background: url(/themes/dsv/images/dsv-logo-small.png) 15px 15px no-repeat #fff!important;
  background-size: 120px!important;
  border-radius: 5px!important;
}
.ui-dialog .ui-dialog-title {
  width: 100%;
  text-align: center;
  font-size: 1.3rem;
  margin: 0 0 5px;
  background-color: #fff!important;
}
.ui-dialog-titlebar-close {
  background: url(/themes/dsv/images/icons/close-button.jpg) no-repeat!important;
  background-size: 20px!important;
  width: 20px;
  height: 20px;
  top: 15px!important;
  right: 15px!important;
  border: 0!important;
  margin: 0!important;
}
.ui-dialog-titlebar-close span {
  display: none;
}
.ui-dialog-titlebar-close:hover,
.ui-dialog-titlebar-close:focus {
  background: url(/themes/dsv/images/icons/close-button.jpg) no-repeat!important;
  background-size: 20px!important;
}
.ui-dialog .entity-meta {
  padding: 15px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.ui-dialog .form-item {
  margin-bottom: 10px;
}
.ui-dialog input {
  padding: 5px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.ui-dialog .select2 {
  margin-top: 5px;
  border: 1px solid #999;
}
.ui-dialog .description {
  font-size: 0.8rem;
  margin-top: 3px;
  max-width: 400px;
}
.ui-dialog label {
  width: 100%;
  display: block;
  font-weight: bold;
}
.ui-dialog .field--type-boolean label {
  display: inline-block;
  font-weight: normal;
  width: inherit;
}
.ui-widget textarea {
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin-top: 5px;
}
.ui-widget .js-form-type-vertical-tabs {
  -webkit-box-ordinal-group: 999;
      -ms-flex-order: 998;
          order: 998;
}
.ui-widget form {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.ui-widget .entity-content-form-footer {
  -webkit-box-ordinal-group: 1000;
      -ms-flex-order: 999;
          order: 999;
}
.ui-dialog input.form-submit {
  border: 0;
}
#drupal-modal form div[data-drupal-selector="edit-actions"] {
  display: none;
}


/*---- certs start ---*/

.view.view-goods-certificates, .view.view-dr-forms, .view.view-control-measures {
  max-width: 850px;
  margin: 0 auto;
  padding: 20px;
}
.view.view-goods-certificates .button {
  margin: 0 0 20px;
}
.form--inline .form-item {
  float: none!important;
  margin-right: 0.5em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-column-gap: 20px;
     -moz-column-gap: 20px;
          column-gap: 20px;
  -webkit-box-align: center;
      -ms-flex-align: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

/*---- certs end ----*/

/*------ Home page start ----*/

.homepage-content-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-column-gap: 20px;
     -moz-column-gap: 20px;
          column-gap: 20px;
  row-gap: 20px;
  -ms-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  max-width: 1225px;
  margin: 0 auto;
}
.homepage-content-left-wrapper, .homepage-content-right-wrapper {
  -webkit-box-flex: 1;
      -ms-flex: 1;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  padding: clamp(30px, 3vw, 50px);
  min-width: 350px;
}
.homepage-content-left-wrapper {
  background-color: #002664;
  color: #fff;
  line-height: 1.5;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-size: clamp(1rem, 3vw, 1.3rem);
}
.homepage-content-right-wrapper {
  background-color: #fff;
  color: #002664;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-box-flex: 1;
      -ms-flex: 1;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-column-gap: 40px;
     -moz-column-gap: 40px;
          column-gap: 40px;
  row-gap: 20px;
  -ms-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.form-title {
  font-weight: 300;
}
.customer-login-form-wrapper input, .quickpay-form-wrapper input {
  width: 100%;
  display: block;
  margin: 0.5em 0;
  height: 35px;
}
.customs-billing-app-title, .customs-agent-title {
  font-size: clamp(1.5rem, 3vw,2rem);
  font-weight: bold;
}
a.dr-form {
  color: #002664;
  text-decoration: none;
  padding: 20px;
  background: white;
  display: block;
  text-align: center;
  font-size: clamp(1rem, 3vw, 1.2rem);
  font-weight: bold;
  margin-top: 1em;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.homepage-banner.wrapper {
  padding: clamp(20px, 2vw, 40px) 5vw;
  background-image: url(/themes/dsv/images/home-banner-opt.jpg);
  background-position: center;
}
.custom-billing-app-logo {
  -webkit-box-flex: 1;
      -ms-flex: 1;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  max-width: 100px;
}
.home-forms-wrapper {
  -webkit-box-flex: 1;
      -ms-flex: 1;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-width: 300px;
}


/*------ Home page End ----*/


/*------ Direct form pages start ----*/
#edit-country, #edit-divisions-requiring-rep, #edit-import-export {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-column-gap: 40px;
     -moz-column-gap: 40px;
          column-gap: 40px;
  row-gap: 20px;
  -ms-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.form-item-country {
  -webkit-box-flex: 1;
      -ms-flex: 1;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
      -ms-flex-direction: column-reverse;
          flex-direction: column-reverse;
  row-gap: 20px;
  text-align: center;
  min-width: 120px;
  max-width: 20vw;
}
[class*="form-item-divisions-requiring-rep-"], [class*="form-item-import-export-"] {
  -webkit-box-flex: 1;
      -ms-flex: 1;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
      -ms-flex-direction: column-reverse;
          flex-direction: column-reverse;
  row-gap: 20px;
  /* min-width: 120px;
  max-width: 20vw; */
  text-align: center;
}

.form-item-divisions-requiring-rep-road img {
  max-height: 180px;
  text-align: center;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  /* min-width: 100px; */
  min-height: 100px;
}
.form-item-divisions-requiring-rep-air-sea img {
  max-height: 180px;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  min-width: 100px;
  min-height: 100px;
}
.form-item-divisions-requiring-rep-air-sea {
  -webkit-box-flex: 2;
      -ms-flex: 2;
  -webkit-box-flex: 2;
  -ms-flex: 2;
  flex: 2;
}
.form-item-import-export-import img,
.form-item-import-export-export img {
  max-height: 180px;
  text-align: center;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  /* min-width: 100px; */
  min-height: 100px;
}

.divisions-wrapper {
  display: flex;
  width: 100%;
  gap: 2em;
  flex-wrap: wrap;
  justify-content: center;
}
.divrep-wrapper {
  flex: 1;
  flex-basis: 40%;
}
.divrep-wrapper .form-item {
  display: flex;
  flex-direction: column-reverse;
  text-align: center;
}
.divrep-wrapper .form-checkboxes {
  display: flex;
  justify-content: center;
  gap: 2em;
}
.divrep-wrapper .form-item img {
  height: clamp(100px, 8vw, 150px);
  width: auto;
  display: block;
  margin: auto;
}



div.phone-number-field div.form-item input {
  -webkit-margin-before: 1em;
          margin-block-start: 1em;
}



.js-form-item input, .js-form-item textarea{
  display: block;
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-margin-before: 10px;
          margin-block-start: 10px;
}
.js-form-item input {
  height: 35px;
}
[type="checkbox"], [type="radio"] {
  height: 25px!important;
  /* width: 25px!important; */
  -webkit-margin-before: 0em!important;
          margin-block-start: 0em!important;
}
.form-item-dan-usage,
.form-item-tan-usage,
.form-item-cds-cash-account,
.form-item-comprehensive-guarantee,
.form-item-postponed-vat {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
      -ms-flex-direction: column-reverse;
          flex-direction: column-reverse;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-bottom: 30px !important;
}
.form-item-dan-usage label.option,
.form-item-tan-usage label.option,
.form-item-cds-cash-account label.option,
.form-item-comprehensive-guarantee label.option,
.form-item-postponed-vat label.option {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.form-item-expiry {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.form-item-dan-usage,
.form-item-tan-usage,
.form-item-cds-cash-account,
.form-item-comprehensive-guarantee,
.form-item-postponed-vat,
.form-item-expiry {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  row-gap: 10px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.form-item-expiry label {
  margin-right: 10px;
}

div[data-drupal-selector="edit-summary"] .field {
  margin-bottom: 20px;
}
div[data-drupal-selector="edit-summary"] .field__label {
  margin-bottom: 0.5em;
}
.form-item-confirmation {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;

}
.form-item-confirmation input{
  width: 50px;
}

#dr-goods-section-form {
  max-width: 850px;
  margin: 0 auto;
  padding: 0 20px;
}




.goods-section-tile-icon {
  background: var(--dsv-goods-icon);
  /* width: 100% !important;
  aspect-ratio: 16/9; */
  -webkit-box-flex: 2;
      -ms-flex: 2;
  -webkit-box-flex: 2;
  -ms-flex: 2;
  flex: 2;
}
#edit-goods-chapters .js-form-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  margin-bottom: 20px;
  

}
#edit-goods-chapters label.option {
  -webkit-box-flex: 2;
      -ms-flex: 2;
  -webkit-box-flex: 2;
  -ms-flex: 2;
  flex: 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  font-size: clamp(0.8rem, 3vw, 1rem);
  line-height: 1.5;
  
}
#edit-goods-chapters input {
  -webkit-box-flex: 1;
      -ms-flex: 1;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  margin: 0;
  
  
}
a.goods-section-tile {
  -webkit-box-flex: 1;
      -ms-flex: 1;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-width: 240px;
  padding: 5px;
  background-color: #fff;
  max-width: 20%;
  -ms-flex-preferred-size: 20%;
      flex-basis: 20%;
  -webkit-box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
          box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  text-decoration: none;
  color: var(--dsv-black);
  text-align: center;
}
a.goods-section-tile:hover {
  -webkit-box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
          box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
  
}
.goods-section-tile-description {
  font-size: 0.9rem;
  padding: 10px;
  -webkit-box-flex: 1;
      -ms-flex: 1;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}


.goods-section-tile-flex-wrapper{
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-column-gap: 20px;
     -moz-column-gap: 20px;
          column-gap: 20px;
  row-gap: 20px;
  margin: auto;
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.goods-section-tile-number {
  background-color: #577585;
  color: #fff;
  font-size: 2rem;
  font-weight: bold;
  padding: 5px;
  -webkit-box-flex: 1;
      -ms-flex: 1;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.goods-section-tile-code-range {
  background-color: #315668;
  color: #fff;
  font-size: 1rem;
  font-weight: bold;
  padding: 5px;
  -webkit-box-flex: 1;
      -ms-flex: 1;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.goods-section-tile-top-section {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  aspect-ratio: 4/2;
  -webkit-column-gap: 5px;
     -moz-column-gap: 5px;
          column-gap: 5px;
          height: fit-content;
}
.goods-section-tile-number-section {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
      -ms-flex: 1;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.goods-section-tile-selected-chapters {
  background: var(--dsv-light-blue) ;
  padding: 5px;
  color: var(--dsv-dark-blue);
  font-size: 0.8rem;
  line-height: 1.3;
  font-weight: 400;
}
form[id^="settings-settings-"] {
  max-width: 850px;
  margin: 0 auto;
}

.control-measures {
  display: flex;
  flex-wrap: wrap;
  column-gap: 20px;
  row-gap: 20px;
  margin-top: clamp(20px,2vw,40px);
  justify-content: center;
}

.control-measure {
  border: 1px solid var(--dsv-light-grey);
  margin-bottom: 1em;
  overflow: hidden;
  -webkit-box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
  flex: 1;
    flex-basis: 0%;
  flex-basis: 0%;
  min-width: 280px;
  max-width: 48%;
  flex-basis: 48%;
}
.goods-chapter {
  font-weight: bold;
  display: inline-block;
  padding: clamp(5px,1vw,10px);
  background-color: #577585;
  color: #fff;
  font-size: clamp(1em, 0.5vw, 2em);
}
.control-measure fieldset {
  all: unset;
  padding: 1em;
}
.goods-chapters {
  padding: 1em;
  background-color: #eaeaea;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-column-gap: 5px;
     -moz-column-gap: 5px;
          column-gap: 5px;
  row-gap: 5px;
  -ms-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
}
.goods-certificates {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-column-gap: 5px;
     -moz-column-gap: 5px;
          column-gap: 5px;
  row-gap: 5px;
  -ms-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.goods-certificate {
  padding: 5px 10px;
  background-color: #315668;
  color: #fff;
  font-weight: 400;
  font-size: clamp(0.8rem, 3vw, 1rem);
}
.control-measure fieldset legend {
  padding: 1em 0 0.5em 0!important;
  font-size: clamp(1rem, 2vw, 1.3rem);
}
.control-measure .field-prefix {
  -webkit-margin-after: 1em;
          margin-block-end: 1em;
  display: block;
}

.control-measure input  {
  width: 25px;
  margin: auto;
}
.control-measure label.option {
  -webkit-box-flex: 1;
      -ms-flex: 1;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-width: 120px;
  font-size: clamp(0.9rem, 2vw, 1rem);
  line-height: 1.2;
}

/*------ Direct form pages end ----*/


/*------ Footer start ----*/

.footer-section {
  display: block;
  background: var(--dsv-dark-blue);
  width: 100%;
  height: 60px;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.footer-section a {
  color: #fff;
}
.footer-section a:hover {
  color: #ffa500;
}

/*------ Footer End ----*/


/*------ Description tooltip Start ----*/

.description-trigger {
  position: relative;
}
.description-trigger + legend {
  display: contents;
}
.description-tooltip {
  display: none;
  z-index: 1000;
}
.description-icon {
  padding: 2px 7px;
  border-radius: 100px;
  background-color: var(--dsv-blue);
  color: #fff;
  font-weight: bold;
  float: right;
  font-size: 1rem;
  margin-top: 10px;
  margin-right: 5px;
  cursor: help;
  max-width: 300px;
  position: absolute;
  top: 0;
  right: 0;
}
.description-icon-right {
  padding: 2px 7px;
  border-radius: 100px;
  background-color: var(--dsv-blue);
  color: #fff;
  font-weight: bold;
  float: left;
  font-size: 1rem;
  margin-top: -6px;
  margin-left: 5px;
  cursor: help;
  max-width: 300px;
}
.description-trigger:hover .description-tooltip {
  display: block;
  position: absolute;
  background-color: white;
  color: var(--dsv-black);
  padding: 10px;
  border-radius: 5px;
  border: 1px solid var(--dsv-dark-blue);
  top: 22px;
  -webkit-box-shadow: 5px 5px 5px #4040403b;
          box-shadow: 5px 5px 5px #4040403b;
  right: 40px;
}
.description-tooltip h3, .description-tooltip h2{
  -webkit-margin-before: 0;
          margin-block-start: 0;
}
.form-item .description {
  max-width: 65vw;
}
[class*="form-item-control-"] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
  -webkit-column-gap: 40px;
     -moz-column-gap: 40px;
          column-gap: 40px;
  -ms-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  row-gap: 20px;
  -webkit-margin-after: 40px;
          margin-block-end: 40px;
  padding: 1em;
  border: 1px solid var(--dsv-dark-blue);
  border-radius: 10px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  
}
.form-item .description {
  font-size: 0.85em;
  line-height: 1.5;
  min-width: 250px;
  -webkit-box-flex: 1;
      -ms-flex: 1;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.form-item select {
  height: 35px;
}
.form-composite > legend, .label {
  padding: 0 10px!important;
}
.control-measure .form-type-radio:first-child {
  border-left: 5px solid green;
  background-color: #fff;
}
.control-measure .form-type-radio:last-child {
  border-left: 5px solid red;
  background-color: #fff;
}

.control-measure .form-type-radio:first-child:hover {
  background-color: #d4ffd4;
}
.control-measure .form-type-radio:last-child:hover {
  background-color: #ffdddd;
}


.control-measure .fieldgroup {
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

iframe {
  width: 100%;
  aspect-ratio: 1/1.4142;
  margin: auto;
}

label.option {
  line-height: 1.5;
}

tr, td, th{
  padding: 10px;
  text-align: left;
}
tr:nth-child(even) {background-color: #f9f9f9;}
tr:nth-child(odd) {background-color: #eaeaea;}
.view.view-goods-certificates {
  max-width: 1225px;
  margin: 0 auto;
  padding: 20px;
}
.view.view-goods-certificates table {
  width: 100%;
}
th {
  background-color: var(--dsv-blue);
  color: #fff;
}
.view-filters {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  display: -webkit-flex;
}


/*------ Description tooltip End ----*/

.tabs.primary {
  text-align: center;
}

#sign-qr-code {
  width: 250px;
  float: left;
}
#sign-qr-code label {
  display: inline-block;
}
.qr-svg {
  width: 200px;
  height: 200px;
}
#current-signature img {
  width: 200px;
}
fieldset#edit-signature-method--wrapper {
  all: unset;
  display: block;
  margin: 1em 0;
}
fieldset#edit-signature-method--wrapper legend {
  padding: 0!important;
  font-size: 1.2em;
}
fieldset#edit-signature-method--wrapper .form-item {
  display: flex;
}
fieldset#edit-signature-method--wrapper .form-item input {
  width: 50px;
}

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

.control-measure {
  flex: 1;
    flex-basis: 0%;
  flex-basis: 0%;
  min-width: 100%;
  max-width: 100%;
  flex-basis: 100%;
}
}



@media only screen and (max-width: 600px) {
 .homepage-content-left-wrapper, .homepage-content-right-wrapper {
  min-width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

 .home-forms-wrapper {
  min-width: 100%;
}
.custom-billing-app-logo {
  max-width: 70px;
}
a.goods-section-tile {
  width: 100%;
  min-width: 100%;
}
.tile-top-section {
  max-height: 75px;
}


}



@media only screen and (max-width: 427px) {
  [id*="edit-control-"] .fieldset-wrapper {
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
      -ms-flex-direction: column-reverse;
          flex-direction: column-reverse;
}
.control-measure label.option {
  text-align: center;
}


}


/* ---- DR Form View (Full) ---- */

.dr-form-wrap {
  max-width: 1200px;
  margin: 0 auto;
  padding: 18px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.dr-form-wrap .df-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.dr-form-wrap .card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  -webkit-box-shadow: var(--shadow);
          box-shadow: var(--shadow);
  overflow: hidden;
}

.dr-form-wrap .card .hd {
  padding: 14px 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: flex-start;
      -ms-flex-align: flex-start;
          align-items: flex-start;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid var(--border);
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(25, 40, 98, .05)), color-stop(72%, transparent));
  background: linear-gradient(180deg, rgba(25, 40, 98, .05), transparent 72%);
}

.dr-form-wrap .card .hd h2 {
  margin: 0;
  font-size: 14px;
  font-weight: 850;
  letter-spacing: .2px;
}

.dr-form-wrap .card .bd {
  padding: 14px 16px;
}

.dr-form-wrap .kv {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.dr-form-wrap .kv-field {
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 10px 12px;
  background: #fff;
}

.dr-form-wrap .kv-field--wide {
  grid-column: 1 / -1;
}

/* Map Drupal field wrappers to transparent containers */
.dr-form-wrap .kv-field .field {
  display: block;
}

.dr-form-wrap .kv-field .field__label {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-bottom: 6px;
  font-weight: 600;
}

.dr-form-wrap .kv-field .field__item {
  font-size: 13px;
  font-weight: 800;
  color: var(--text);
  font-family: var(--mono);
  line-height: 1.4;
}

.dr-form-wrap .kv-field .field__item--empty {
  color: var(--muted);
  font-weight: 400;
}

/* Status pill */
.dr-form-wrap .kv-field .field--name-field-status .field__item {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 700;
  font-family: inherit;
  background: #e6f4ea;
  color: #1e7e34;
  text-transform: capitalize;
}

@media (max-width: 900px) {
  .dr-form-wrap .kv {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .dr-form-wrap .kv {
    grid-template-columns: 1fr;
  }
}



/* DR Forms Menu */

.dr-forms-menu a,
.dr-forms-menu .selected {
  font-size: 1rem;
  margin-right: 1em;
}

.dr-forms-menu a {
  text-decoration: underline!important;
  display: inline-block;
  position: relative;
}

.dr-forms-menu a:hover {
  text-decoration: none!important;
}

.dr-forms-menu .selected {
  color: var(--dsv-blue);
  font-weight: bold;
}
.video-button {
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  background-color: var(--dsv-link-submit);
  background-image: url('/themes/dsv/images/icons/video.svg');
  background-repeat: no-repeat;
  background-position: right 8px center;
  background-size: 25px;
  color: #fff;
  font-weight: bold;
  border-radius: 4px;
  text-decoration: none;
  font-size: 14px;
  padding-right: 38px;
  align-self: flex-start;
}
.video-button svg {
  width: 1em;
  height: 1em;
  vertical-align: middle;
  margin-right: 0.3em;
  fill: currentColor;
}