@charset "utf-8";
/* CSS Document */


.cabecera-novacion{
  height:90px;
  padding:0px 0px;
}
 .buttom-contratar-prod{
  width: auto!important;
  float:left;
  text-align:center;
  margin:20px 30px;
  background-color: #6096b9;
  border: none;
  color: #fff!important;
  padding: 10px 20px;
}
.buttom-contratar-prod a{
  color: #fff!important;
}
 .contenedor-contrato{
  width:90%;
  margin:0 auto;
  padding-top:30px;
}
 .contenedor-contrato h4{font-size: 1.3rem!important;}
 .contenedor-contrato h5{font-size: 1.15rem;}
 
.buttom-ver-contrato {
  width: 30%;
  float: left;
  text-align: center;
  margin:20px;
  background-color: #D24723;
  border:none;
  color: #fff!important;
  padding:10px 20px;
  text-decoration:none;
  cursor: pointer;
  border-radius:0%;
}
.buttom-ver-contrato a{
  color: #fff!important;
  text-decoration:none;
  text-transform: uppercase;
}
.btn-cerrar {
  width:25%;
  background-color: #2c4b6c !important;
  border-color:#2c4b6c!important;
  color: #fff!important;
  padding:5px 20px;
  margin-left:20px;
}
.btn-cerrar:hover {
  background-color: #92b5e9;
  border-color:#92b5e9;
}
 
 .buttom-firmar-contrato{
  display:none!important;
 }
 .buttom-firmar-contrato-ipad{
  display:none!important;
}
.contenedor-firma{
  display:block!important;
  width:80%;
  margin:0 auto;
  margin-top:50px;
  position:relative
}
.contenedor-firma-movil{
  display:none;
}
.contenedor-firma-firmado{
  width:90%;
  margin:0 auto;
  margin-top:50px;
  margin-bottom:50px;
  position:relative
}
.contenedor-firma-movil-firmado{
    display:none!important
}
#contenedor-representante{
  width: 50vw;
  margin:0 auto;
  min-height: 100vh;
  transition: all 0.3s;
  padding:10px
}
#contenedor-representante img{
  width: 20vw;
}
canvas{
  /*width:320px;
  height:200px;
  margin-top: 10px;*/
  border: 1px solid #000;
  margin-top: 30px;
  margin-bottom: 10px;
  cursor: default;
  position: relative;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.24), 0 1px 5px rgba(0, 0, 0, 0.05);
  display: inline-block;
}
.cuadro-firma-company{
  float:left;
  width:45%;
  margin-right:5%
}
.cuadro-firma-company-firmado{
  float:left;
  width:45%;
  margin-right:5%
}
.cuadro-firma-worker{
  float:left;
  width:50%
}
.banda-firma{
    height: 120px;
    background-color: #b6d3ea;
    position: relative;
    text-align:center;
    color: #686969;
    background-clip: padding-box;
    padding-top:20px;
    margin-top:30px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    display:block;
  }
.banda-firmado{
    height: 80px;
    width:100%;
    margin:5px 0px 40px 0px;
    background-color: #b6d3ea;
    position: relative;
    text-align:center;
    color: #686969;
    background-clip: padding-box;
    padding-top:20px;
    display:block;
  }
.buttom-ver-contrato{
    width:30%;
    text-align:center;
    margin:20px;
    background-color: #6096b9;
    border: none;
    color: #fff;
    padding: 10px 20px;
    text-decoration: none;
    cursor: pointer;
    border-radius: 0%;
    display: inline-block;
  }
.no_firma_saved{
    width:40%;margin:0 auto;
  }

  @media all {
   div.saltopagina{
      display: none;
   }
 }
   
 @media print{
   div.saltopagina{ 
      display:block; 
      page-break-before:always;
   }
 }


/******************************************************************************************************************************/
/***************************IPAD HORIZONTAl********************/
@media only screen and (min-width:768px) and (max-width:1326px) {
/*@media screen and  (min-width: 1048px) and (max-width: 1024px) and (orientation: landscape) {*/


.buttom-contratar-prod {
  width: 50%;
}
.buttom-firmar-contrato-ipad{
  display:block!important;
  width:70%;
  text-align:center;
  background-color: #D24723;
  border: none;
  color: #fff;
  padding: 10px 20px;
  cursor: pointer;
  margin-bottom:20px;
  margin:0 auto;
}
.buttom-firmar-contrato{
  display:none!important;
}
.contenedor-firma{
  display:none!important;
}

.firma-worker-ipad{
  float: left;
  width:40%;
  margin:30px
}
.firma-company-ipad{
  float: left;
  width:40%;
  margin:30px
}
.fondo-azul-guardar-contrato{
  height: 96px;
  background-color: #00008f;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background-clip: padding-box;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  padding:0px 20px;
  margin-top: 0px;
}
.banda-firma{
  /*display:none!important;*/
  padding-top: 0px!important;
}
.banda-firma span{
  padding: 30px 5px!important;
}
.banda-firma .btn-cerrar{
  margin-top:20px;
}
.cuadro-firma-company{float:left; width:50%;margin-top:15px}
.cuadro-firma-worker {
  float:left;
  width:50%;
  margin-bottom:60px!important}


}


/****************************************************************************************************************/
/************************************MÓVIL**************************************/

@media (min-width: 320px) and (max-width: 768px){


.contenedor-contrato{
  margin-top:0px!important;
  overflow:scroll; 
  height:auto;
  width:100%!important;
  padding: 0px 10px;
}
.contenedor-contrato h4{
  font-size: 1.15rem!important;
  padding-top:10px;
}
.contenedor-contrato h5{
  font-size: 1.0rem;
}
.contenedor-contrato p{
  font-size: 0.85rem!important;
}
.contenedor-contrato ul{
  padding-left:10px!important;
  font-size: 0.88rem !important;
}
.contenedor-firma{
  display:none!important
}
.contenedor-firma-movil{
    display:none!important
}
.contenedor-firma-firmado{
  display:none;
}
.contenedor-firma-movil-firmado{
    display:block!important
}
#contenedor-representante{
  width: 90vw;
  margin:0 auto;
  min-height: 100vh;
  transition: all 0.3s;
  margin: 10px 10px 30px 18px;
}
#contenedor-representante img{
  width:65vw;
}
.contenedor-botones-firma{
  display:block;
  height:70px;
  padding: .5rem !important;
}
canvas{
  margin-top: 0px;
  border: 1px solid black;
  padding:10px;
}
.cuadro-firma-company-oculto{
  display:none!important
}
.cuadro-firma-company{
  display:block;
  float:left;
  width:100%;
  margin-top:15px
}
.cuadro-firma-worker {
  float:left;
  width:100%;
}
.cuadro-firma-worker-movil{
  float:left;
  width:100%;
  /*margin-top:15px;*/
}
.cuadro-firma-company-firmado{
  float:left;
  width:50%;
  margin-top:15px
}
.buttom-firmar-contrato{
  display:block!important;
  width:70%;
  margin:0 auto;
  text-align:center;
  background-color: #324844;
  border: none;
  color: #fff;
  padding: 10px 20px;
  cursor: pointer;
  margin-bottom:80px;   
}
.buttom-firmar-contrato a{
  color:#fff;
  text-transform: uppercase;
}
.buttom-firmar-contrato-ipad{
  display:none!important;
}
.banda-firma{
  /*display:none!important;*/
  height: 106px;
}
.banda-firma span{
  padding: 30px 5px!important;
}
.fondo-azul-guardar-contrato .btn-cerrar{
  width: 65%!important;
}
.fondo-azul-guardar-contrato{
  height: 96px;
  background-color: #b6d3ea;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background-clip: padding-box;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  padding:0px 20px;
  margin-top: 0px;
}
.buttom-ver-contrato{
  width:70%!important;
  margin:5% 15%;
}
.no_firma_saved{
  width:70%!important;margin:0 auto;
}
.no_firma_saved .btn .btn-info{
  padding-left:10%
}
.banda-firma{
 display:none!important
}
.banda-firmado{
    height: 100px!important;
}
.hash {
   word-break: break-all;
}
}