:root {
  --top-bg           : #fff;
  --main-bg          : #fff;
  --bordercol        : #D8E0E8;
  --dorat            : #e0ca82;
  --hover            : #BF953F;
  --header-height    : 56px;
  --footer-height    : 88px;
  --global-min-width : 400px;
  --global-max-form  : 400px;
}

@font-face {font-family: "RingsideNarrow-Bold"; src: url("THEMES/nea/fonts/ringside/RingsideNarrow-Medium.otf") format("opentype"); font-weight: normal; font-style: normal }
@font-face {font-family: "RingsideNarrow-normal"; src: url("THEMES/nea/fonts/ringside/RingsideNarrow-Book.otf") format("opentype"); font-weight: normal; font-style: normal }
@font-face {font-family: "RingsideNarrow-light"; src: url("THEMES/nea/fonts/ringside/RingsideNarrow-Light.otf") format("opentype"); font-weight: normal; font-style: normal }
@font-face {font-family: "ChronicleDec-normal"; src: url("THEMES/nea/fonts/ChronicleDeck/ChronicleDeck-Semibold.otf") format("opentype"); font-weight: normal; font-style: normal }

html {position: relative; min-height: 100%; }
body { margin-bottom: var(--footer-height); padding-top: 0; }
body, .formulari-wrapper {font-family: "RingsideNarrow-normal", Arial, Helvetica, sans-serif;}

body  {background-color: var(--main-bg);}
#promo-navbar {min-height: var(--header-height); background-color: #fff;  border-bottom: 1px solid var(--bordercol); display: flex; justify-content: flex-start;align-items: center; }
#promo-navbar img {height: 24px; width: auto;}

article {margin-top: 0; max-width: 300px;}
article.strong {font-family: RingsideNarrow-Bold, arial, sans-serif;}
article.container, aside.col-xs-12, main.col-xs-12 {padding-left: 0; padding-right: 0;}
aside {padding-bottom: 1.5em; }
aside img {width: 291px; display: none;}
aside h1 {font-size: 36px;font-family: "ChronicleDec-normal", serif; padding-top: 0.9em;}
aside h2 {font-size: 16px; margin-top: 1.5em; max-width: 600px;}

.formulari-wrapper {min-height: initial; padding-bottom: 2em; padding-top: 0; margin: initial; }
.formulari-wrapper > form > .form-group, .form-group-aportacio {width: 100%;}
.formulari-wrapper .form-group .form-control {min-height: 45px;padding-top: 10px; padding-bottom: 10px;}
.formulari-wrapper .form-group .label {margin-top: 10px; margin-bottom: 10px;}
.formulari-wrapper .alert {max-width: 100%;margin-top: 1em}
.formulari-wrapper input[type="submit"] {width: 100%;text-transform: uppercase; font-size: 14px; font-weight: normal; font-family: RingsideNarrow-normal}
 article.container .alert-warning, article.container .alert-success {padding: 10px 15px}
.formulari-wrapper header {margin-top: 1em; padding-bottom: 1.1em; color: #000; font-family: RingsideNarrow-Bold; font-size: 16px; line-height: 16px; }
.formulari-wrapper #pagament-options {display: none;}
.formulari-wrapper .nota {margin-bottom: 1.5em; color: #ccc; font-family: RingsideNarrow-normal;font-size: 16px;}
.formulari-wrapper .subpas-titol {display: none;}
.formulari-wrapper #domsepa .nota {font-size: 13px; margin-top: -15px; margin-bottom: 2.5em;}

.nodisp p {font-size: 16px;}

hr { border-color: var(--bordercol); }

#pagament-form {padding-top: 1.3em; border-top: 1px solid var(--bordercol);}
.form-group .form-control, .compost.swap .form-group-select select, .theme-nea .ccfields .form-control:invalid,
.minput .control-input input:first-of-type, .minput .control-input input:last-of-type {border-color: var(--bordercol)!important; color: #000; outline-color: var(--dorat); border-radius: 0;}
.form-group select.form-control, .form-group select.form-control option, .form-group select optgroup  {background-color: #10151a}
.form-group label,
.compost.swap .form-group-input input, .compost.swap .form-group-select select,
.formulari-wrapper .triple .form-group:first-child .form-control,
.formulari-wrapper .triple .form-group:last-child .form-control {border-radius: 0;}
.formulari-wrapper input, .formulari-wrapper select { font-family: RingsideNarrow-normal;}
.form-control:focus {box-shadow: none}
.compost.swap .form-group-input input:focus-within { border-right-color: var(--bordercol) !important; }
.form-group:focus-within .form-control:focus, .form-group:focus-within .form-control:not(:invalid) {border-color: var(--dorat);}
.form-group input:not(:placeholder-shown) + .label, .labelsup,
.form-control, .form-group .labelsup, .form-group:focus-within .label { background-color: var(--main-bg); color: #000; }
.form-group.form-group-redsys_date, .form-group.form-group-redsys_cvv2 {margin-bottom: 0;}

.form-group .form-control:not(:placeholder-shown) + .label {color: #aaa}
.form-group .labelsup {color: #aaa}
.formulari-wrapper .botons-peu {display: block; margin-top: 0;}
.spinner { background-color: transparent!important; width: 100%; height: 100%;}
.btn-pensant, .btn-pensant-m, [disabled].btn-pensant, [disabled].btn-pensant-m {background-image: none;}
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {background-color: #222;}
.formulari-wrapper .opcions .opcio input:checked, .formulari-wrapper .opcions .checked, .formulari-wrapper .opcions:hover .checked {background-color: #c09640;}
#pagseg {display: flex; flex-direction: row; justify-content: space-between; align-content: center; padding-top: 24px;}
#pagseg #segur {display: flex; align-content: center; justify-content: flex-start; width: 50%; font-size: 12px; }
#pagseg #segur img {padding-right: 10px; height: 23px; padding-top: 3px;}
#pagseg #cards img {padding-left: 8px;}

.formulari-wrapper .form-group .label#aportacio-label {text-align: center; width: 100%; margin-left: 0;}
#imports {padding: 0 0 5px 0; list-style: none; display: grid; grid-template-columns: 1fr 1fr; grid-gap: 15px; pa}
#imports li { padding: 8.7px 0; text-align: center;border: 1px solid var(--bordercol); font-size: 16px;}
#imports li:hover {background-color: #E9F1F8; cursor: pointer;}
#imports li.selected {background-color: #E9F1F8; border-color: #0076A8;}
#aportacio {text-align: center;}
#aportacio:hover {border-color: #0076A8;}
#aportabox.selected {text-align: center; background-color: #E9F1F8; border-color: #0076A8; padding: 12px;}
#aportabox h5 {font-size: 16px; line-height: 19.2px; padding-bottom: 25px;}
#aportabox p {font-size: 13px; line-height: 15.6px; margin-bottom: 0; margin-top: 8px;color: #0076A8;}
#aportabox h5, #aportabox p {display: none; }
#aportabox.selected #aportacio{border-color: #0076A8 !important;}
#aportabox.selected h5 {display: block;}
#aportabox.selected.gt400 p {display: block;}
#aportabox.selected {}
.form-group.form-group-aportacio {margin-bottom: 0;}
.form-group input:not(:placeholder-shown) + .label#aportacio-label, .form-group .labelsup#aportacio-label, .form-group:focus-within .label#aportacio-label {display: none;}
.theme-nea #card-data .form-group.form-group-redsys_card, .theme-nea #card-data, article#referencia {width: 100%; max-width: 100%;}
.theme-nea .form-group-redsys_date, .theme-nea .form-group-redsys_cvv2 {width: calc(50% - 10px);}
.minput .control-input input, .minput .control-input input:first-of-type, .minput .control-input input.y2:last-of-type {width: 100%; max-width: 50%;}
.minput .control-input input:first-of-type {text-align: right; padding-right: 12px;}
.minput .control-input input.y2:last-of-type {text-align: left; padding-left: 5px!important;}

#fiscals {display: none;}
#ben_acepta-sublabel {margin-top: 20px; font-family: RingsideNarrow-normal;font-size: 12px; line-height: 14px;color: #555; }

.legal {color: #aaa;}
.legal2 {font-size: 14px!important; color: #ccc;}

body.confirmacio  {background-color: #E9F1F8;}
.confirmacio article { display: block; }
.confirmacio article header {background-color: #fff; padding: 48px 10px 32px;}
.confirmacio article header h1 {font-size: 40px;font-family: "ChronicleDec-normal", serif;}
.confirmacio article header h3 {font-size: 18px; font-weight: bold; margin-top: 15px;}
.confirmacio article header h3 span {font-weight: normal; display: block; line-height: 24px;}
.confirmacio article header ul {padding: 0; list-style: none; margin-top: 25px;}
.confirmacio article header li {display: inline-block; padding: 0 7px;}
.confirmacio article header img {width: 40px; height: 40px;}
.confirmacio article main .container{ display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 24px 15px;}
.confirmacio article main section {max-width: 327px; padding:24px ;background-color: #fff; border: 1px solid #D8E0E8; border-radius: 8px; margin-bottom: 24px;}
.confirmacio article main section:last-of-type {margin-bottom: 5px;}
.confirmacio article section img {width: 80px; height: 80px;}
.confirmacio article section h2 {font-size: 24px;font-family: "ChronicleDec-normal", serif; padding-bottom: 10px;}
.confirmacio article section .btn {margin-top: 10px; padding: 16px 32px;text-transform: uppercase; font-size: 14px; font-weight: normal; font-family: RingsideNarrow-normal}
#formrec div:not(:last-of-type) {margin-bottom: 1em;}
#formrec label {font-weight: normal;}


#contacte-peu {display: none;}
footer#links {position: absolute; bottom:0; height: var(--footer-height); min-width: var(--global-min-width); border-top-color: var(--bordercol); margin-top: 25px; padding-top: 45px; background: var(--main-bg) url(/THEMES/nea/img/logo_ara_blau.png) center 1.3em  no-repeat; background-size: 65px;}
footer#links a, footer#links a:visited {color: #888; font-size: 12px; line-height: 30px; font-family: inherit;}
footer#links a:hover {color: #000;}

@media (max-width: 460px) {
  :root {
    --global-min-width : 350px;
  }

  #promo-navbar .container {width: 100%;}
  /*aside.col-xs-12, main.col-xs-12{padding-left: 0; padding-right: 0;}*/
}

@media (min-width: 768px) {
  :root {--footer-height    : 56px;}

  body > article {min-width: 768px; max-width: 100%; }

  aside {padding-bottom: 6em; }
  aside.col-xs-12, main.col-xs-12 {padding-left: 20px; padding-right: 20px;}
  aside img {display: initial;}
  aside h1 {font-size: 54px;padding-top: 0.5em;}
  aside h2 {font-size: 18px;}
  article.formaport {display: flex;flex-direction: row;}
  article.formaport aside {display: flex; flex-direction: column; justify-content: center; align-content: center; border-right: 1px solid var(--bordercol);}
  article.formaport main {min-height: calc(100vh - var(--footer-height) - var(--header-height)); padding: 24px 32px;}
  .formulari-wrapper {padding-bottom: 0;}
  #pagament-form {padding-top: 0; border-top: none;}

  .confirmacio article header {text-align: center; padding-bottom: 48px;}
  .confirmacio article main .container{flex-direction: row;justify-content: space-evenly; align-items: flex-start; gap: 15px; padding: 48px 15px;}
  .confirmacio article main section {margin-bottom: 0;}

  footer#links {text-align: right; height: var(--footer-height); padding-top: 0; display: flex; align-items: center;}
  footer#links ul {background: var(--main-bg) url(/THEMES/nea/img/logo_ara_blau.png) center left no-repeat; background-size: contain; height: 24px; margin-bottom: 0; }
}