/* Site Colors:
  #364739 - pink
  #c8ced2 - grey
  #f07b27 - orange
  #786758 - brown

  #1aa3ff - blue
  #66c2ff - fade blue
  #ffad33 - orange
  #ffe0b3 - fade orange
*/
@import url("https://fonts.googleapis.com/css?family=Merriweather:300,400|Source+Sans+Pro:200,400&display=swap");
:root {
  /*     --blue: #007bff;
    --indigo: #6610f2;
    --purple: #6f42c1;
    --pink: #e83e8c;
    --red: #dc3545;
    --orange: #fd7e14;
    --green: #28a745;
    --teal: #20c997;
    --cyan: #17a2b8;
    --white: #fff;
    --gray: #6c757d;
    --gray-dark: #343a40;
    --primary: #007bff;
    --success: #28a745;
    --info: #17a2b8;
    --warning: #ffc107;
    --danger: #dc3545;
    --light: #f8f9fa;
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --font-family-sans-serif: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
    --font-family-monospace: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace; */

  --font-family-sans-serif: "Source Sans Serif", -apple-system,
    BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif,
    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  --gray-dark: #404040;

  --font-family-serif: Merriweather, serif;
  --color-text: var(--gray-dark);
  --font-family-text: var(--font-family-serif);

  --light-blue: #e1f7f5;
  --secondary: #6c757d;
  --dark: #343a40;
  --yellow: #ffc107;
}
/* Global */

.family-sans {
  font-family: var(--font-family-sans-serif);
}

html {
  box-sizing: border-box;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

img {
  max-width: 100%;
}

body {
  font-family: var(--font-family-text);
  color: var(--color-text);
  font-weight: 200;
  background-color: #c8ced2;
}

/* SITE header -- the main header with the navbar --  */

.site-header .nav-link {
  position: relative;
  padding-bottom: 0;
  margin-bottom: 2px;
  color: #ff9933;
  text-transform: uppercase;
  font-weight: 400;
}

.highlight {
  color: #ff9933;
}

/* ----------  SPECIFIC -------------- */
select {
  border-width: 0.5px;
  border-color: black;
}

select:focus {
  background-color: #fff3e8;
}

select:disabled {
  background-color: darkgray;
}

.error {
  border: 2px solid red;
}

.blueglue {
  border-color: #0c3d66;
  box-shadow: 0px 1px 1px #18161613 inset, 0px 0px 8px #1c19c580;
}

#specs {
  min-height: 45vh;
}

#serie_descr {
  visibility: hidden;
}

#show_pos_mors,
#callout,
#errorShow-1,
#errorShow-1-1,
#errorShow_sotto-1,
#msg_PDF,
#spinner_gif,
#potenza_select,
#potenza-title,
#voltaggio_select,
#voltaggio-title,
#hz_select,
#hz-title,
#poli_select,
#poli-title,
#grandezza_select,
#grandezza-title,
#efficienza_select,
#efficienza-title,
#serie-select,
#serie-title,
#forma_select,
#forma-title,
#ventilazione_select,
#ventilazione-title,
#restart-Btn,
#report-Btn,
#altro-prodotto,
#datasheet-Btn,
#spinner,
#gdati_title,
#gdati_select,
#iec_nota,
#send-PDF-btn,
#sendEmail_form,
#designi,
#sliderDIV,
#typedDIV,
#show_specs,
#freno-title,
#freno_select,
#piu_kw_seriec,
.spec_title {
  display: none;
}

#serie-conn {
  border: #004d4d 2px solid;
  padding: 10px;
}

#piu_kw_seriec {
  color: red;
}

/* ------------- Doppia Polarita ------------- */
/* ------------- Doppia Polarita ------------- */
/* ------------- Doppia Polarita ------------- */
/* ------------- Doppia Polarita ------------- */
/* ------------- Doppia Polarita ------------- */

#P2_specs {
  min-height: 45vh;
}

#P2_serie_descr {
  visibility: hidden;
}

#P2_show_pos_mors,
#P2_callout,
#P2_errorShow-1,
#P2_errorShow-1-1,
#P2_errorShow_sotto-1,
#P2_msg_PDF,
#P2_spinner_gif,
#P2_potenza_select,
#P2_voltaggio_select,
#P2_hz_select,
#P2_poli_select,
#P2_grandezza_select,
#P2_macc_select,
#P2_serie-select,
#P2_forma_select,
#P2_ventilazione_select,
#P2_restart-Btn,
#P2_report-Btn,
#P2_altro-prodotto,
#P2_datasheet-Btn,
#P2_spinner,
#P2_gdati_title,
#P2_gdati_select,
#P2_iec_nota,
#P2_send-PDF-btn,
#P2_sendEmail_form,
#P2_designi,
#P2_sliderDIV,
#P2_typedDIV,
#P2_show_specs,
#P2_freno_select {
  display: none;
}

#P2_serie-conn {
  border: #004d4d 2px solid;
  padding: 10px;
}

/* ------------ TABS ------------ */
#tabs,
#sub_tabs {
  font: 0.8em "Lucida Sans Unicode", "Lucida Grande", sans-serif;
}

#tabs > ul,
#sub_tabs > ul {
  font: 1em;
  list-style: none;
}

#tabs ul,
#sub_tabs ul,
#tabs li,
#sub_tabs li {
  margin: 0;
  padding: 0;
}

#tabs > ul > li,
#sub_tabs > ul > li {
  margin: 0 2px 0 0;
  padding: 7px 10px;
  display: block;
  float: left;
  color: #343a40;
  background: #b9b7b7;
}

#tabs > ul > li {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

#sub_tabs > ul > li {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

#tabs > ul > li:hover,
#sub_tabs > ul > li:hover {
  background: #343a40;
  cursor: pointer;
}

#tabs > ul > .active,
#sub_tabs > ul > .active {
  background: #343a40;
  cursor: pointer;
}

#tabs a,
#sub_tabs a {
  text-decoration: none;
  color: #fff;
}

#tabinfo,
#tabinfo div {
  background: #343a40;
  padding: 10px;
  margin: 0;
  color: #fff;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

#splitter {
  min-height: 60vh;
}

/* SITE header -- the main header with the navbar --  */

footer {
  padding: 2rem;
  margin-top: 2rem;
  background-color: #343a40;
  color: #ff9933;
  font-weight: 400;
  font-size: 1.3rem;
}

/* BUTTONS */
.Btn {
  background-color: #ff9800;
  color: #364739;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  border: solid 1px #000;
  padding: 10px 10px;
  display: inline-block;
  margin: 4px 2px;
  cursor: pointer;
}

.Btn:hover {
  background-color: #364739;
  color: #fff;
  cursor: pointer;
}

/* EMAIL FORM */
/* #msg_PDF {
  width: 500px;
  height: 600px;
}

#msg_PDF #msg_form {
  padding: 10px;
  padding-top: 0px;
  width: 460px;
}

#msg_PDF #msg_form #eSENT_pdf,
#msg_PDF #msg_form #eSENT_pdf-2 {
  display: block;
  width: 100%;
}

#msg_PDF #msg_form h3 {
  /* border: 2px #364739 solid; */
/* background-color: #364739;
  color: #fff;
  width: 100%;
  padding: 10px;
  margin-bottom: 15px;
  text-align: center;
  display: block;
  line-height: 1.5em;
  box-sizing: border-box;
}

#msg_PDF #msg_form label {
  display: block;
  font-weight: bold;
  width: 100%;
  box-sizing: border-box;
}

#msg_PDF #msg_form input[type="text"] {
  display: block;
  padding: 3px;
  width: 100%;
  box-sizing: border-box;
}

#msg_PDF #msg_form textarea {
  display: block;
  width: max-content;
  max-width: 100%;
  max-height: 120px;
  padding: 3px;
  margin: 0px;
  box-sizing: border-box;
}
 */
/* Learn More links */

a.learnmore {
  color: #364739;
  font-size: 14px;
  font-weight: bold;
  text-decoration: none;
}

a.learnmore:hover {
  text-decoration: underline;
}

#message {
  color: #0055dd;
  background: white;
  border: 2px solid #0055dd;
  padding: 1em 15px;
  margin: 1em 30px;
  width: 890px;
}
/* 
.alert {
  padding: 10px;
  background-color: #f44336;
  color: white;
  opacity: 1;
  transition: opacity 0.6s;
  margin: 15px 0px;
  width: 350px;
  line-height: 1.6em;
}

.alert .success {
  background-color: #4caf50;
}
.alert .info {
  background-color: #7dbaec;
}
.alert-warning {
  padding: 10px;
  opacity: 1;
  transition: opacity 0.6s;
  margin: 15px 0px;
  width: 350px;
  line-height: 1.4em;
  background-color: #ff9800;
  color: #364739;
  line-height: 1.6em;
  /* margin-top: 50px;
  margin-bottom: 10px; */

.closebtn {
  margin-left: 15px;
  color: #8d8d8d;
  font-weight: bold;
  float: right;
  font-size: 22px;
  line-height: 20px;
  cursor: pointer;
  transition: 0.3s;
}

.closebtn:hover {
  color: black;
}

/* call out */
/* .callout {
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  margin-right: 1rem;
  max-height: 30vh;
  max-width: 40vw;
  z-index: 10;
}

.callout-header {
  padding: 1.4rem 1rem;
  background: #555;
  font-size: 1rem;
  font-weight: bold;
  color: white;
}

.callout-container {
  line-height: 1rem;
  padding: 0.8rem;
  background-color: #ccc;
  color: black;
  border: #555 1px solid;
  width: auto;
} */

.closebtn-2 {
  position: absolute;
  top: 1rem;
  right: 1rem;
  color: white;
  font-size: 1.5rem;
  cursor: pointer;
}

.closebtn-2:hover {
  color: lightgrey;
}

/* the SLIDER */
.slidecontainer {
  width: 100%;
}

.slider {
  -webkit-appearance: none;
  width: 100%;
  height: 25px;
  background: #ffad33;
  outline: none;
  opacity: 0.7;
  -webkit-transition: 0.2s;
  transition: opacity 0.2s;
}

.slider:hover {
  opacity: 1;
}

.slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 25px;
  height: 25px;
  background: #004d4d;
  cursor: pointer;
}

.slider::-moz-range-thumb {
  width: 25px;
  height: 25px;
  background: #004d4d;
  cursor: pointer;
}

/* Auto-suggest styles */
/* 
ul#suggestions {
  list-style: none;
  margin: 0;
  padding: 0;
  width: 220px;
  display: none;
}

ul#suggestions li {
  display: block;
  min-height: 0.2em;
  padding: 0.2em;
  background: #ffe0b3;
  color: #000;
  text-decoration: none;
  cursor: pointer;
}
ul#suggestions li:hover {
  background: #aaa;
}

ul#suggestions li a {
  display: block;
  min-height: 0.2em;
  padding: 0.2em;
  background: #ffe0b3;
  color: #000;
  text-decoration: none;
}

ul#suggestions li a:hover {
  background: #aaa;
} */
/* 
progress {
  background-color: #ecd2a9;
  border: 0;
  height: 18px;
  width: 300px;
  border-radius: 9px;
}

progress::-webkit-progress-bar { */
/* CHROM AND SAFARI */
/* background-color: #ecd2a9;
  border: 0;
  height: 18px;
  width: 300px;
  border-radius: 9px;
}
progress::-webkit-progress-value { */
/* CHROM AND SAFARI */
/* background-color: #ffad33;
  border: 0;
  height: 18px;
  width: 300px;
  border-radius: 9px;
}
progress::-moz-progress-bar { */
/* FIREFOX */
/* background-color: #ecd2a9;
  border: 0;
  height: 18px;
  width: 300px;
  border-radius: 9px;
} */

.loader {
  border: 12px solid #c8ced2;
  border-radius: 50%;
  border-top: 12px solid #364739;
  border-bottom: 12px solid #364739;
  width: 40px;
  height: 40px;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
  }
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* \\\\\\\\ MEDIA QUERIES \\\\\\\\ */
@media (max-width: 576px) {
  body {
    padding-top: 2rem;
  }
}

/* Site Colors:
  #364739 - pink
  #c8ced2 - grey
  #f07b27 - orange
  #786758 - brown

  #1aa3ff - blue
  #66c2ff - fade blue
  #ffad33 - orange
  #ffe0b3 - fade orange
*/