/*default scrollbar*/
.cuadro-comp::-webkit-scrollbar {
    width: 10px;
    background: #fff;
    height: 10px;
}
.cuadro-comp::-webkit-scrollbar-thumb {
    background: #0c4c91;
    border-radius: 20px;
}
/*default scrollbar*/
.logoAr{
    width: 205px;
    margin: auto;
    margin-top: 20px;
}
.modal{
    background: rgba(0, 0, 0, 0.336);
} 
.modal-body{
  text-align: center; 
}
.mail .modal-content{
  text-align: center;
    background: white;
    max-width: 500px;
    width: 100%;
    margin: auto;
    padding: 20px;
}
.mail.modal{
    background: rgba(0, 0, 0, 0.336);
    width: 100%;
    height: 100vh;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.bodymail{
        margin: 0;
    background: url(https://www.ocu.org/-/media/ocu/images/home/dinero/seguros/coronavirus_seguros_1600x900.jpg?rev=d6ec2a8e-36af-4e70-bc2e-7197eaf43d94&hash=B5E472519A597DDB56DBA4C231F1557B);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    font-family: sans-serif; 
}
#msjModal{
    font-size: 24px;
}
.btn-close{
    margin-left: auto;
    padding: 10px;
}
.btnCerrar{
    position: absolute;
    right: 30px;
    top: 10px;
    font-size: 22px;
    font-weight: bold;
    color: #0c4c91;
    z-index: 2333;
    cursor: pointer;
}
select {
    width: 100%;
    padding: 7px 5px;
}
input[type=text], select, input[type=email], input[type=tel], textarea, input[type=number] {
    width: 100%;
    padding: 5px;
    resize: vertical;
    color: black;
    margin-bottom: 10px;
    background: transparent;
    border: 1px solid #5dace5;
}
* {
  box-sizing: border-box;
}
th { 
    min-width: 300px;
    color: #72b9e7;
}
 tr { 
    border-bottom: 1px solid #f7f7f7 !important;
}
.check{
    width: 25px;
}
.cober{
    text-align: left;
    min-width: 400px;
    position: sticky;
    left: 0;
    padding: 5px 15px;
    font-weight: bold;
    color: #0c4c91;
}
.footerTabla{
    position: sticky;
    left: 0;
} 
.Hcober{
    min-width: 400px;
    position: sticky;
    left: 0;
    padding: 5px 15px;
}
input[type=text],input[type=email], input[type=tel],textarea,input[type=number] {
  width: 100%;
  padding: 5px;
  resize: vertical;
  color: black;
}

label {
  padding: 12px 12px 12px 12px;
  display: inline-block;
}

input[type=button],input[type=submit] {
  margin-top: 10px;
}
.container2{
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
}
.width50{
    width: 50%;
}
.col-25 {
  width: 25%;
  margin-top: 6px;
}
.col-100 {
  width: 100%;
  margin-top: 6px;

}
.col-75 {
  width: 75%;
  margin-top: 6px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}
.pad10, input[type=checkbox]{
    padding-right :10px;
        font-size: 14px;
}
.center{
   margin-left: 68px
}
.centro{
    text-align:center ;
}
.oculto{
    display:none;
}
.mostrar{
    display: block;
}
.hidden{
    display: hidden !important;
}
.btncotizar {
    background: #72b9e7 !important;
    padding: 3px 40px !important;
    border: 1px solid #72b9e7 !important;
    border-radius: 3px !important;
    color: white !important;
    transition: 500ms all ease !important;
    cursor: pointer;
}
.btncotizar:hover {
    border: 1px solid #72b9e7 !important;
    background: transparent !important;
    color: #72b9e7 !important;
}
th, td {
    border: 1px solid #c3c3c3;
    text-align: center;
}
tr:nth-last-child(2) {
    color: #fcb514;
    font-size: 40px;
    font-weight: bold;
    border-bottom: 0;
} 

tr:nth-last-child(2) td::before {
    content: '$'; 
} 
tr:nth-last-child() {
    border-bottom: 0 !important;
} 
 #trlast{
    border-bottom: 0 !important;
} 
tr:nth-last-child(2) td:first-child  {
    color: #72b9e7;
    font-size: 18px;
    font-weight: bold;
}   

tr:nth-last-child(2) td:first-child::before  {
    content: '';
}  
.volver{
	background: #fcb514!important;
    padding: 3px 40px !important;
	border:1px solid #fcb514 !important;
    border-radius: 3px !important;
    color: white;
	transition:500ms all ease !important;
}
.volver:hover{
		border:1px solid #fcb514 ;
	  background: transparent !important;
    color: #fcb514 !important; 
}
a {
    color: white;

}
a:hover {
    color: #fcb514;
}
table {
  background: white;
  margin-bottom: 30px;
  margin-top: 20px;
  border: 0 !important;
}
.cuadro-comp table tr td:nth-child(even) {
    background-color: #fdfdfd;
}
.titulo{
    background-color: #fcb514;
    color: white;
    text-align:center;
    font-size: 25px;
}
.subtitulo{

    color: #fcb514;
    text-align:center;
    font-size: 25px;
}
.azul{
    background: rgba(42,184,210,1);
    color: white;
}
.ptop{
    padding-top: 10px
}
.tit{

    color: #fcb514;
    font-size: 17px;
    font-weight: bold;
}
.scroll{
    overflow: auto;
    height: 400px;
}
.cuadro-comp{
    border-radius: 3px;
    padding: 20px 0;
    box-shadow: 0px 10px 50px 1px;
    overflow-x: auto;
    width: 100%;
    height: 77vh;
    position: absolute;
    background: white;
    border: 3px solid #72b9e7;
    z-index: 99;
    margin: auto;
    left: 0;
    right: 0;
}
 
.tabla-plan{
    border-radius:5px;
    padding:20px 120px;
    box-shadow: 0px 10px 50px 1px;
    overflow-x: auto;
    width: 1000px;
    height: 600px;
    position:absolute;
    background: white;
    border:3px solid #72b9e7;
    top:-480%;
    left: -90%;
    z-index:999;
}
.cuadro-comp table tr td, th{
    background: white;
    border: none;
    width: 10% !important;
    font-weight: bold;
}  

.tbody tr:hover{
    background: #dddddd !important;
}
.col-w100 {
    margin-top: 6px;
    width: 100%;
    display: inline-flex;
}
.w100 {
    margin-top: 6px;
    width: 100%;
}
.w25{
    width: 32% !important;
}
.col-60{
    margin-top: 6px;
    width: 60%;
    display: inline-flex;
}
.col-45{
    margin-top: 6px;
    width: 49%;
    display: inline-flex;
}
.col-20{
    margin-top: 6px;
    width: 37%;
    display: inline-flex;
}
.width100{
    width: 100%;
}
.mright{
margin-right: 10px;
}

.col-3c{
    margin-top: 6px;
    width: 33,33%;
}
.left{
    text-align: left;
}
.right {
    text-align: right;
}
.padbot{
    padding-bottom: 15px;
}
.img-compania{
    width: 250px;
    cursor: cell;
}
#imgcompania{
    width: 350px;
    cursor: cell;
}

.info{
    color:#72b9e7 ;
    transition: 500ms all ease;
}
.info:hover{
    cursor: pointer;
    color:#fcb514 ;
}
.plantit{
  color:#72b9e7 ; 
  font-weight: bold;
  text-transform: uppercase;
}
.monto{
    color: #fcb514;
    font-size: 40px;
    font-weight: bold
}
.recta{
    position:relative;
    
}
.tooltip {
  position: relative;
  display: inline-block;

}
.tooltip .tooltiptext {
  visibility: hidden;
  width: 200px;
  background-color: #fcb514;
  color: #fff;
  text-align: center;
  border-radius: 3px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  bottom: -85%;
  opacity: 0;
  transition: opacity 0.5s;
  
}

.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  top: -12%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color:  transparent  transparent #fcb514 transparent;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
  
}
.img-tip{
    width: 65px;
    cursor:pointer;
}
.img-recta{
    width: 250px;
}

.tabla-plan .img-recta{
    width: 500px;
}
.fbold{
    font-size: 15px;
    font-weight: 400;
    color:#fcb514;
}
#fila1,#fila2, #fila3, #fila4,#fila5, #fila6, #fila7,#tool1,#tool2,#tool3,#tool4,#tool5,#tool6,#tool7{
  display: none;
}
.borderb{
  border-bottom: 1px solid #72b9e7;

  padding: 5px 50px;
}
.abso{
    position: absolute;
    right: 0;
    top: 0;
}
.rela{
    position: relative;
}
.margintop{
    margin-top: 30px;
}
.nota{
    font-size: 15px;
    color: #72b9e7;
    font-weight: bold;
}
.naranja{
    color:#fcb514;   
}
.co-amplia{
    position: relative;
    top: -27px;
    right: -230px;
}
/* Style the tab */
.tab {
  overflow: hidden;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
}

/* Style the buttons inside the tab */
.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
  font-size: 17px;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #ddd;
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: #ccc;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 12px;
  -webkit-animation: fadeEffect 1s;
  animation: fadeEffect 1s;
}

/* Fade in tabs */
@-webkit-keyframes fadeEffect {
  from {opacity: 0;}
  to {opacity: 1;}
}

@keyframes fadeEffect {
  from {opacity: 0;}
  to {opacity: 1;}
}
.modal-dialog{
    top: 20%;
}
.text1, .text2, .text3 {
    position: relative;
    width: 30%;
    text-align: center;
    font-weight: bold;
}
.text1:before {
    content: '1';
    position: absolute;
    top: -50px;
    font-size: 23px;
    font-weight: bold;
    padding: 10px 16px;
    background: #0c4c91;
    color: #f5faff;
    left: 0;
    right: 0;
    border-radius: 100%;
    margin: auto;
    width: 45px;
    z-index: 1;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.text1:after {
    content: '';
    position: absolute;
    width: 122%;
    height: 2px;
    top: -30px;
    left: 65px;
    z-index: 0;
    border-bottom: 5px dotted #0c4c91;
}
.text2:before {
    content: '2';
    position: absolute;
    top: -50px;
    font-size: 23px;
    font-weight: bold;
    padding: 10px 14px;
    background: #0c4c91;
    color: #f5faff;
    left: 0;
    right: 0;
    border-radius: 100%;
    margin: auto;
    width: 45px;
    z-index: 1;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.text2:after {
    content: '';
    position: absolute;
    width: 122%;
    height: 2px;
    top: -30px;
    left: 65px;
    z-index: 0;
    border-bottom: 5px dotted #cfebff;
}
.text3:before {
    content: '3';
    position: absolute;
    top: -50px;
    font-size: 23px;
    font-weight: bold;
    padding: 10px 14px;
    background: #cfebff;
    color: #0c4c91;
    left: 0;
    right: 0;
    border-radius: 100%;
    margin: auto;
    width: 45px;
    z-index: 1;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
}
input, select{
    margin-bottom: 10px;
}
.boxFlex{
    display: flex;
    justify-content: flex-start;
}
select{
    width: 100%;
    padding: 7px 5px;
}
.box{
    margin-bottom: 10px;
}
.boxCotizaBtn{
    display: flex; 
    position: relative;
    justify-content: space-between;
    width: 560px;
    margin: auto;
}
#comprativoTabs{
    width: 100%;
    position: relative;
    margin: auto;
}
#formTabs{
    max-width: 560px;
    width: 100%;
    margin: auto;
}
/* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 768px) {
  .col-25, .col-75, input[type=submit] {
    width: 100%;
    margin-top: 0;
  }
  .abso {
    position: absolute;
    right: 25px;
    top: 106px;
}
.margintop {
    margin-top: 88px;
}
.width40{
    width: 49%;
}
.col-60 {
    margin-top: 6px;
    width: 100%;
    display: inline-flex;
}
.col-20 {
    margin-top: 6px;
    width: 49%;
    display: inline-flex;
} 
.cuadro-comp {
    width: 200% !important;
    left: -370px !important;
}
  input[type=text],input[type=email], input[type=tel],textarea,input[type=number] {
  width: 100%;
  padding:10px;
  margin-top: 3px;
}
.center{
    margin: 0px;
    text-align: center
}
.tit{
    font-size: 17px;
    text-shadow: 1px 1px  black;
}
.borderb {
    border-bottom: 1px solid #2ab8d2;
    padding: 5px 17px;
}
}
@media screen and (max-width: 470px) {
   .cuadro-comp {
    width: 100% !important;
    left: 0 !important;
} 
.borderb {
    border-bottom: 1px solid #2ab8d2;
    padding: 5px 5px;
}
}