/*---- colours









--------*/

:root {
  --d_blue: #00457c;
  --m_blue: #4871a1;
  --l_blue: #6099c5;
  --text: #808285;
  --greybg: #80828520;
  --greybg_over: #80828550;
  --red: #b60000;
  --l_red: #e19696;
  --font: 12px;
  --border: #c0c0c0;
}

.feed_code {
  font-size: 18px;
  color: red;
  font-weight: 700;
  line-height: 100%;
}

* {
  font-family: Arial, Helvetica, sans-serif;
  font-size: var(--font);
  margin: 0;
  padding: 0;
  color: var(--text);
  line-height: 100%;
}


p {
  font-weight: normal;
  color: var(--text);
  text-align: left;
  line-height: 180%;
}

b, strong {
  font-weight: bold;
}

li {
  line-height: 180%;
  margin-left: 20px;

}

a:link,
a:visited {
  color: #00457c;
  text-decoration: none;
}

a:hover,
a:active {
  color: #6099c5;
  text-decoration: none;
}

.poweredby {
  font-size: 8px;
  color: #999999;
  text-align: right;
  padding-top: 0px;
  letter-spacing: 2px;
  border-top: 1px solid var(--border);
}

a.powered:link,
a.powered:visited {
  color: #666666;
  font-size: 8px;
  text-decoration: none;
  font-weight: bold;
}

a.powered:hover,
a.powered:active {
  color: #999999;
  font-size: 8px;
  text-decoration: none;
  font-weight: bold;
}

/* inputs and select starts here */

input {
  font-family: Arial, Helvetica, sans-serif;
  font-size: var(--font);
  color: var(--text);
  font-weight: normal;
  border: 1px solid var(--border);
  border-radius: 3px;
  cursor: pointer;
  line-height: normal;
  padding: 1.25em;  
}

input[name="txtIRClienteMail"] {
  width: clamp(100px, 100%, 300px);
}

input[name="search"],
input[name="submit"],
input[name="calculate"] {
  background-color: var(--greybg);
  text-transform: uppercase;
  font-weight: bold;
}

input[name="search"]:hover,
input[name="submit"]:hover,
input[name="calculate"]:hover {
  background-color: var(--greybg_over);
}

input[name="PriceMovesAbove"],
input[name="PriceMovesBelow"],
input[name="PriceChange"] {
  text-align: right;
  padding: 1.25em 1.025em;
 max-width: 136px;

}

select {
  font-family: Arial, Helvetica, sans-serif;
  font-size: var(--font);
  color: var(--text);
  font-weight: normal;
  text-align: left;
  outline: none;
  border: 1px solid var(--border);
  border-radius: 3px;
  cursor: pointer;
  line-height: normal;
  padding: 1.25em;
  background: url(images/select_down_arrow.svg) no-repeat right #fff;
  background-position-x: calc(100% - 12px);
  background-size: 12px;
  -webkit-appearance: none;
}

/* inputs and select ends here */


/* k02 starts here */

#k02 {
  border: 0px solid red;
}

#k02 div {
  border: 0px solid blue;
  margin: 0.75em 0.5em;
}

#k02 div:nth-of-type(1):not(#k02 div div:nth-of-type(1)) {
  margin-top: 0;
  line-height: 90%;
}

#k02 div.options {
  border: 0px solid blue;
  margin: 2em 0 1em 0;
}

#k02 div.row {
  border: 0px solid orange;
  display: grid;
  grid-template-columns: auto auto;
  align-items: center;
  border-bottom: 1px solid var(--border);
  margin: 0;
  padding: 0.95em 0.5em;
}

#k02 div.row div {
  margin: 0;
}

#k02 div.row div:nth-child(2n) {
  text-align: end;
}

#k02 div.btn {
  text-align: end;
}

#k02 div.note *{
  color: var(--red);
}

#k02 .button_low,
#k02 .button_low:hover {
  color: var(--text);
  font-size: 1.25em;
  background-color: #ffffff;
  border: 1px solid var(--border);
  padding: 0.75em 1.76em;
}

#k02 .button_low2,
#k02 .button_low2:hover {
  color: var(--text);
  font-size: 1.25em;
  background-color: #ffffff;
  border: 1px solid var(--border);
  padding: 0.75em 1.76em;
}

#k02 .button_no,
#k02 .button_no:hover {
  color: #ffffff;
  font-size: 1.25em;
  background-color: #a31a2d80;
  border: 1px solid #a31a2d;
  padding: 0.75em 1.76em;
}

#k02 .button_yes,
#k02 .button_yes:hover {
  color: #ffffff;
  font-size: 1.25em;
  background-color: #00954b80;
  border: 1px solid #00954b;
  padding: 0.75em 1.76em;
}

#k02 input[name="submit"] {
  width: 135px;
}

/* k02 ends here */


/* e02 starts here */

.marquee {
  height: 1.75em;
  /* background-color: #00457c; */
}

.marquee span {
  font-size: 0.75em;
  margin-left: 1em;
  letter-spacing: 0.05em;
}

.marquee a {
  font-size: 1em;
}

.marquee b {
  color: var(--d_blue);
}

.marquee img {
  width: auto;
  height: 1.25em;
  margin-bottom: -3px;
  margin-left: 1em;
  margin-right: 0.5em;
}

/* e02 ends here */

/*---- E01 starts here ------*/

#e01 {
  border: 0px solid red;
  display: flex;
  flex-wrap: wrap;
  column-gap: clamp(0px, 5%, 50px);
  align-items: flex-end;
}

#e01 .column {
  border: 0px solid green;
  flex: 1 1 200px;
}

#e01 .column .row {
  border: 0px solid orange;
  display: grid;
  grid-template-columns: auto auto;
  padding: 0.85em 0;
}

#e01 .column:nth-child(1) .row:nth-child(1) {
  padding: 0 0 0.85em 0;
}

#e01 .column .row div:nth-child(2) {
  text-align: end;
}


#e01 .price {
  font-size: 40px;
  color: var(--d_blue);
  font-weight: bold;
  line-height: 100%;
}

#e01 img {
  height: 35px;
  width: auto;
  margin-top: 3px;
}

.outside {
  padding-top: 5px;
}

@media only screen and (max-width: 705px) {

  #e01 .column {
    min-width: 100%;
  }

  #e01 .column:nth-child(2) {
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
  }

}

/*---- e01 ends here ------*/

/* E03 starts here */

#e03 {
  border: 0px solid red;
  display: flex;
  flex-wrap: wrap;
  column-gap: clamp(0px, 5%, 50px);
  align-items: flex-end;
}

#e03 div.column {
  border: 0px solid blue;
  flex: 1 1 220px;
}

#e03 div.column div.row {
  border: 0px solid orange;
  display: grid;
  grid-template-columns: auto auto;
  padding: 0.95em 0.5em;
}

#e03 div.column div.row:nth-child(1) {
  background-color: var(--d_blue);
  border-radius: 3px;
}

#e03 div.column div.row:nth-child(1) div {
  color: #fff;
  font-weight: 700;
}

#e03 div.column div.row:nth-child(2) div {
  font-weight: bold;
}

#e03 div.column div.row:nth-child(2n+3) {
  background-color: var(--greybg);
  border-radius: 3px;
}

#e03 div.column div.row div {
  border: 0px solid greenyellow;
  display: flex;
  align-items: center;
}

#e03 div.column div.row div:nth-child(2) {
  justify-content: end;
}

@media only screen and (max-width: 735px) {

  #e03 div.column {
    min-width: 100%;
  }

}

/* E03 ends here */

/* S01_share calc starts here */

#s01 {
  border: 0px solid red;
}

#s01 #select_area {
  border: 0px solid blue;
}

#s01 .section_head {
  font-weight: bold;
  color: var(--d_blue);
  margin-bottom: 1em;
}

#s01 .section_head:nth-of-type(3) {
  margin-top: 1.5em;
}

#s01 ol {
  margin-top: 1em;
  margin-bottom: 2em;
}

#s01 .row {
  border: 0px solid lightgreen;
  width: clamp(200px, 80%, 500px);
  display: flex;
  flex-wrap: wrap;
  column-gap: 2em;
  row-gap: 1em;
  margin-bottom: 1em;
}

#s01 .row .column {
  border: 0px solid purple;
  flex: 1 1 200px;
}

#s01 .row:nth-of-type(5) .column {
  grid-template-columns: 140px auto;
}

#s01 .row .column div {
  border: 0px solid lightcoral;
  align-self: center;
}

#s01 .row .column .label {
  margin-bottom: 0.5em;
}

#s01 .btns {
  border: 0px solid pink;
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  max-width: fit-content
}

#s01 .btns div {
  border: 0px solid blue;
  flex: 1 1 255px;
}

#s01 .btns div:nth-child(1) {
  max-width: fit-content;
}

#s01 .btns .radio_buttons {
  border: 0px solid orangered;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  row-gap: 0.5em;
}

#s01 .btns .radio_buttons div {
  border: 0px solid lightblue;
  flex: 1 1 200px;
  max-width: fit-content;
}

#s01 .row .radio_buttons div:last-child {
  margin-left: 20px;
}

#s01 select[name="quickperiod"],
#s01 input[name="fromA"],
#s01 input[name="toA"] {
  width: 100%;
  text-align: left;
}

#s01 select[name="quickperiod"] {
  width: clamp(200px, 38%, 238px);
}

#s01 input[name="number"] {
  width: clamp(200px, 48%, 238px);
}

#s01 input[name="calculate"] {
  width: clamp(200px, 38%, 238px);
}

#s01 #results_area {
  border: 0px solid green;
  margin-top: 2em;
}

#s01 #results_area > div {
  padding: 0.85em;  
}

#s01 #results_area > div:nth-child(2n+1 ) {
  background-color: var(--greybg);
  border-radius: 3px;
}

#s01 .results_row,
#s01 .tri_row {
  display: flex;
  flex-wrap: wrap;
  border: 0px solid lightgreen;
  row-gap: 0.5em;
}

#s01 .results_row .name {
  border: 0px solid pink;
  flex: 1 1 11em;
  padding-left: 0px;
}

#s01 .results_row .amounts {
  border: 0px solid green;
  flex: 1 1 20.5em;
  display: flex;
  justify-content: end;
}

#s01 .amounts div:nth-child(1),
#s01 .amounts div:nth-child(2) {
  border: 0px solid violet;
  flex-basis: 100%;
  text-align: end;
}

#s01 .amounts div:nth-child(1) {
  max-width: 10em;
}

#s01 .amounts div:nth-child(2) {
  max-width: 8em;
}

#s01 .tri_row div:nth-child(1) {
  border: 0px solid pink;
  flex: 1 1 27em;
}

#s01 .tri_row div:nth-child(2) {
  border: 0px solid blueviolet;
}

#s01 .notes {
  font-size: 0.85em;
  border-top: 1px solid var(--border);
  padding-top: 0.5em;
}

#s01 .poweredby {
  margin-top: 1em;
  padding-top: 0.5em;
}


@media only screen and (min-width: 529px) {

  #s01 .poweredby {
    margin-top: -25px;
    padding-top: 0.5em;
    border: 0;
  }
  
}



@media only screen and (max-width: 529px) {

  #s01 .row .column,
  #s01 .btns {
    max-width: 201px;
  }

  #s01 .btns .radio_buttons div:last-child {
    margin-left: 0;
  }

  #s01 .btns > div:nth-child(1) {

    margin-bottom: -5px;
   
  }
  
}


@media only screen and (max-width: 386px) {

  div .blank {
    display: none;
  }
  
  #s01 .results_row .amounts {
    justify-content: start;
  }

  #s01 .amounts div:nth-child(1),
  #s01 .amounts div:nth-child(2),
  #s01 .tri_row div:nth-child(2) {
    text-align: left;
  }

}

/* S01_share calc ends here */


/* N03 sens starts here */

#n03 {
  border: 0px solid red;
}

#n03 > div:nth-child(1){
  line-height: 150%;
}


#n03 .section_head {
  font-weight: bold;
  color: var(--d_blue);
  margin-top: 1em;
  margin-bottom: 1em;
}

#n03 #selection {
  border: 0px solid blue;
  display: flex;
  flex-wrap: wrap;
  max-width: 600px;
  row-gap: 1em;
  align-items: flex-end;
}

#n03 #selection > div {
  border: 0px solid orange;
  flex: 1 1 173px;
}

#n03 #selection > div:last-child {
  max-width: fit-content;
}

#n03 #selection > div div:nth-child(1){
  margin-bottom: 0.5em;
}

#n03 select[name="month"] {
  width: 120px;
}

#n03 select[name="year"] {
  width: 80px;
}

#n03 input[name="search"] {
  width: 135px;
}

#n03 #sens {
  border: 0px solid red;
  margin-top: 2em;
}

#n03 #sens .row {
  border: 0px solid pink;
  display: flex;
  flex-wrap: wrap;
  column-gap: 2em;
  padding: 0.95em 0.5em;
}

#n03 #sens .row:nth-child(2n+3) {
  background-color: var(--greybg);
}

#n03 #sens .header {
  padding-bottom: 0.75em;
  border-bottom: 1px solid var(--border) ;
}

#n03 #sens .header > div{
  font-weight: bold;
  color: var(--d_blue);
}

#n03 #sens .row > div {
  border: 0px solid lightgreen;
  flex: 1 1 435px;
}

#n03 #sens .row .date {
  max-width: 150px;
  text-align: right;
}


@media only screen and (max-width: 620px) {

  #n03 #selection > div {
    min-width: 100%;
  }

  #n03 input[name="search"] {
    width: 206px;
  }

  #n03 #sens .row .date {
    min-width: 100%;
    text-align: left;
  }

  #n03 #sens .header {
    display: none;
  }

  #n03 #sens .row .date {
    margin-bottom: 0.7em;
  }

  
  
}
/* N03 sens ends here */

/*---- SENS pop-up styles starts here ------*/

body.sens {
  margin: 20px;
}

.sens_head {
  border: 0px solid red;
  font-size: 2em;
  color: var(--d_blue);
  text-transform: uppercase;  
  margin-bottom: 10px;
}

.sens_date {
  font-size: 1.5em;
  border: 0px solid blue;
  border-bottom: 1px solid var(--border);
  margin-bottom: 1em;
  padding-bottom: 0.5em;
}

.sens_body {
  border: 0px solid orange;
  text-align: justify;
  margin-bottom: 10px;
  line-height: 1.75em;
}

.sens_left {
  border: 0px solid green;
  padding-top: 10px;
  border-top: 1px solid var(--border);
}

.sens_right {
  border: 0px solid purple;
  text-align: right;
  margin-bottom: 10px;
}

pre {
  font-family: "Courier New", Courier, monospace;
  margin-bottom: 10px;
  line-height: 1.75em;
}

.sens img {
  width: 250px;
}

/*---- SENS pop-up styles ends here ------*/