/*  CALCULATOR */

:root {
  --azul-cg:#2857a5;
  --negro-cg:#000;
  --blanco-cg:#FFF;
}

#site_nav {
  background: url('../images/headerBg.png');
  height: 200px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.calculator {
  font-family: 'Barlow Semi Condensed', regular;
  margin-bottom: 2%;
}
.calculator .option-title {
  color: var(--azul-cg);
  font-size: 1.5em;
  font-weight: 700;
}
.calculator .option-title hr{
  border-top: 2px solid var(--azul-cg);
  margin-top: 0px;
}
.calculator .main-title, .calculator .caja .title{
  background-color: var(--negro-cg);
}
.calculator .main-title {
  /*margin-bottom: 1em;*/
  /*margin-top: 1em;*/
}
.calculator .main-title span, .calculator .caja .title span{
  font-weight: 800;
  color: var(--blanco-cg);
  margin: 0 auto;
  display: table;
  font-size: 0.9em;
}

.options {
  padding-left: 0px;
  padding-right: 0px;
}

.calculator .caja {
  padding: 0px 5px;
  position: static;
}

.calculator .caja .title {
  border-bottom: 1px solid var(--blanco-cg);
}
.calculator .caja .body {
  background-color: var(--azul-cg);
  padding: 0.1em 0.1em;
  height: 635px;
}
.calculator .caja .body .section {
  background-color: #c8c8c6;
  padding: 0.25em;
  border-radius: 0.25em;
  margin: 0.5em;
}

.calculator #op1-section-diameter, .calculator #op2-section-diameter {
  padding: 1em;
  transition: 0.3s;
}
.calculator #op1-section-tyreSize, .calculator #op2-section-tyreSize {
  transition: 0.3s;
  padding-right: 1em;
  padding-left: 1em;
}
.calculator .caja-height {
  height: 635px;
}
.calculator .caja-height-title {
  /*height: 50px;*/
}
.calculator .caja-height-body {
  height: 620px;
}
.calculator .gears-list .gear-title{
  padding-top: 1em;
  height: 80px;
}
.form-control {
  padding: 4px 4px;
}

.caja-gears .span-empty{
  height: 90px;
}

.final-drive-box {
  overflow-y: auto;
  max-height: 250px;
}

.final-drive-box label{
  margin-bottom: 1px;
}

.final-drive-box .gearbox2-label{
  line-height: 1;
}

/* FIN CALCULATOR */


/* BOOTSTRAP */
.p-0 {   padding: 0em; }
.p-1 {   padding: 0.5em; }
.p-2 {   padding: 1em; }
.p-3 {   padding: 1.5em; }

.pt-1 {   padding-top: 0.5em; }
.pt-2 {   padding-top: 1em; }
.pt-21 {   padding-top: 1.3em; }
.pt-3 {   padding-top: 1.5em; }
.pt-4 {   padding-top: 2em; }
.pt-5 {   padding-top: 3em; }
.pt-51 {   padding-top: 3.5em; }
.pt-6 {   padding-top: 4em; }

.px-2 { padding-right: 1em;  padding-left: 1em;  }

.pr-0 {   padding-right: 0%;}

.m-0 { margin: 0%;}
.mr-1{   margin-right: 0.5em; }
.ml-1{   margin-left: 0.5em; }
.mt-2 {   margin-top: 1em; }

.my-0 {   margin-right: 0em; margin-left: 0em; margin-top: 0em; margin-bottom: 0em; }
.my-3 {   margin-right: 0em; margin-left: 0em; margin-top: 1.5em; margin-bottom: 1.5em; }

.color-white {  color:#FFF;}

.d-inline-table {
  display: inline-table;
}
.d-grid {
  display: grid;
}

.m-auto {
  margin: 0 auto;
}
.w-95 {
  width: 95%;
  margin: 0 auto;
}
/* BOOTSTRAP */


.table-results {
  text-align: center;
  margin-bottom: 0px;
}



.table-results thead th{
  background-color: var(--negro-cg);
  color: var(--blanco-cg);
  text-align: center;
}

.table-results thead:first-child > tr:first-child > th
{
  padding: 4px;
}

.table-results tbody th {
  background-color: var(--negro-cg);
  color: var(--blanco-cg);
  text-align: center;  
}

.table-results tbody td {
  background-color: var(--azul-cg);
  color: var(--blanco-cg);  
}


::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #555!important;
  font-weight: 100 !important;
  opacity: 0.75; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #555!important;
  font-weight:100 !important;
}

::-ms-input-placeholder { /* Microsoft Edge */
  color: #555!important;
  font-weight:100 !important;
}

.img-banner {
  height: 100%;
}
.footer {
  z-index: 1;
}

.small-padding-x {
  padding-left: 5px;
  padding-right: 5px;
}
.small-padding-xs {
  padding-left: 2px;
  padding-right: 2px;
}

.hide-desktop {
  display: none;
}    

.gear-row {
  /*display: flex;*/
  padding-top: 1.4em;
  height: 65px;
}

.gear-row .entry-data-gears {
  padding: 2px 2px;
}





/* Fixed/sticky icon bar (vertically aligned 50% from the top of the screen) */
.icon-bar {
  position: fixed;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 9999;
}

/* Style the icon bar links */
.icon-bar a {
  display: block;
  text-align: center;
  padding: 16px;
  transition: all 0.3s ease;
  color: white;
  font-size: 20px;
}

/* Style the social media icons with color, if you want */
.icon-bar a:hover {
  background-color: #000;
}

.facebook {
  background: #3B5998;
  color: white;
}

.twitter {
  background: #55ACEE;
  color: white;
}

.ws {
  background: #25D366;
  color: white;
}

.linkedin {
  background: #007bb5;
  color: white;
}

.print-ic {
  background: #847c7c;
  color: white;
}


.d-table {
  display: table;
}

/*  Fixed/sticky icon bar */

@media screen and (max-width: 600px){
    .calculator {
      padding: 1em !important;
    }
    .caja-gears{
      padding-left: 0em !important;
      padding-right: 0em !important;
      margin-top: 1em;
    }
    .p-3 {
      padding: 0.5em !important;
    }
    .p-2 {
      padding: 0.2em !important;
    }  
    .calculator .caja .body {
      padding: 1em 1.5em;
    }
    .calculator .gears-list .gear-title{
      padding-top: 2.3em;
    }
    .calculator .caja-height {
      /*height: 700px;*/
    }
    .calculator .caja {
      padding: 0px;
    }
    #op1-section-gear-ratio, #op2-section-gear-ratio {
     /* padding-top: 4em !important;*/
    }
    #op1-section-gear-ratio .form-group, #op2-section-gear-ratio .form-group{
      padding-top: 3.3em !important;
    }
    .sub_bar_text {
      font-size: 2em;
    }
    .calculator .caja-height-body {
      height: 620px;
    }  
    .hide-mb {
      display: none !important;
    }  
    .hide-desktop {
      display: block !important;
    }    
    .gear-row {
      display: flex;
      padding-top: 1em;
    }  
    .btn-print {
      right: 8% !important;
    }        
    #op1-section-gear-tooth, #op2-section-gear-tooth {
      display: grid;
    }

    .icon-bar a {
      padding: 5px;
    }
    .d-xs-grid {
      display: grid !important;
    }
}

@media (min-width: 600px) and (max-width: 1000px){
    .caja-gears{
      padding-left: 0em !important;
      padding-right: 0em !important;
      margin-top: 1em;
    }
    .hide-mb {
      display: none !important;
    }    
    .hide-desktop {
      display: block !important;
    }      
    .btn-print {
      right: 8% !important;
    }    
    #op1-section-gear-tooth, #op2-section-gear-tooth {
      display: grid;
      padding-top: 0em;
    }
    .calculator .gears-list .gear-title:first {
      padding-top: 2em;
    }
    .calculator .gears-list .gear-title {
      padding-top: 1.3em;
    }
}

@media screen and (max-width: 380px){
    .calculator .caja-height-body {
      height: 600px;
    }  
    .calculator .caja .body {
      padding: 0.5em 0em;
    }
    #op1-section-tyreSize .col-xs-4, #op2-section-tyreSize .col-xs-4{
      padding: 0%;
    }
    #op1-section-tooth div, #op2-section-tooth div {
      padding: 1%;
    }
    .gears-list {
      padding-left: 1em;
      display: grid;
    }
    .hide-xs {
      display: none;
    }
}

@media (min-width: 600px) {
    .d-xl-inline-table {
      display: inline-table !important;
    }
    .d-md-grid {
      display: grid;
    }
    .d-md-block {
      display: block;
    }    
}









.print-head {
  display: none;
}
.btn-print {
  position: fixed;
  right: 48%;
  bottom: 5%;  
}


@media print 
{
    .hide-print, .footer, #site_nav, .main-title {display: none !important; ;}
    .print-head, .print-results { display: block  !important; }
    .panel-body { padding-top: 0px; padding-bottom: 0px;}
    /*#option2 {margin-top: 350px;}*/
    /*#op1-myChart, #op2-myChart {    width: 1082px !important; height: 540px !important;}*/
    .table > tbody > tr > td {padding: 2px;}
    .calculator { margin-bottom: 8%; }
}