@font-face {
    font-family: 'Klein 55';
    src: url('/global/fonts/Klein-55Regular.eot');
    src: url('/global/fonts/Klein-55Regular.eot?#iefix') format('embedded-opentype'),
        url('/global/fonts/Klein-55Regular.woff2') format('woff2'),
        url('/global/fonts/Klein-55Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
		body{
			background: white;
			font-family: 'Klein 55';
		}
		.bloque{text-align: center;
			 padding-top: 5%;
			 text-decoration:none;
			 font-size: 350%;
			 text-align:center;
			 line-height: 0px;
		}
        h1{
            font-weight: normal;
        }
		a {
			text-align: center;
			color: #000000;
			line-height: 0px;
			font-size: 90%;
		}
		p {
			text-align: center;
			align-content: left;
			text-decoration:none;
			text-align:  center;
			line-height: 20px;
			font-size: 105%;
		}
		b {
			text-align: center;
			align-content: left;
			text-decoration:none;
			text-align: center;
			line-height: 0px;
			font-size: 100%;
		}
	.left{
	    float:left;
	}
	.right{
	    float:right;
	}
    .bloque-form{text-align: center;
         padding-top: 5%;
         padding-bottom: 5%;
         font-size: larger;
         margin: 0 auto;
         
    }
    input[type=text], input[type=email], input[type=tel], select{ 
        font-family: 'Klein 55';
        text-align: left;
        border: 2px solid #C83531;
        /*border-bottom: 1px solid black;*/
        padding: 5px;
        width: 600px;
        font-size: large;
        color: black;
    }
    
    ::placeholder{
        color: #000000;
    }
    
    select{
        width: 615px;
        color: #000000;
    }
    button{
        display: table;
        margin: 20px auto;
        padding-bottom: 20px;
        padding-top: 20px;
        padding-right: 60px;
        padding-left: 60px;
        font-weight: 900;
        border: none;
    }
    .bloque-form1{text-align: center;
         padding-top: 5%;
         padding-bottom: 5%;
         font-size: larger;
         margin: 0 auto;
    }
    .negro{color: black; background-color:white; border: 2px solid #C83531;}
    .blanco{color: white}
    .bloque-chamarra{
        text-align: center;
        display: table;
        margin: 0px auto;
    }

    .btn-designer{
        display: table;
        margin: 20px 10px;
        color: black;
        padding-bottom: 10px;
        padding-top: 10px;
        padding-right: 15px;
        padding-left: 15px;
        font-weight: 900;
        background-color: white;
        float: left;
        border: 1px solid #666666;
        text-align: left;
        min-width: 290px;
    }
    .btn-designer:hover{
        border: 2px solid #C83531;
        
    }
    .mitad{
        width: 291px !important;
        padding-right: 10%;
    }

    .popup-overlay {
        /*Hides pop-up when there is no "active" class*/
        visibility: hidden;
        position: absolute;
        background: #ffffff;
        border: 3px solid #666666;
        width: 80%;
        left: 10%;
        z-index: 1000;
      }
      
      .popup-overlay.active {
        /*displays pop-up when "active" class is present*/
        visibility: visible;
        text-align: center;
      }
      
      .popup-content {
        /*Hides pop-up content when there is no "active" class */
        visibility: hidden;
      }
      
      .popup-content.active {
        /*Shows pop-up content when "active" class is present */
        visibility: visible;
      }

      .req{
        display: table;
        margin: 0 auto;
        color: red;
      }

      .bloque-imagen{
        min-width: 400px;
      }
      .bloque-iniciales{
        position: absolute;
        top: 15%;
        left: 23%;
        font-size: 8em;
        color: rgba(255, 255, 255, 0.7);
      }
      .bloque-iniciales div{
        float: left;
        
      }
      .bloque-iniciales div.min{
        margin-top: 40px;
        height: 90px;
        width: 90px;       
        background-color: white;
        mask-size: contain !important;
        -webkit-mask-size: contain !important;
      }
      .bloque-iniciales div.max{
        margin-top: 20px;
        margin-left: -20px;
        height: 130px;
        width: 130px;       
        background-color: white;
        mask-size: contain !important;
        -webkit-mask-size: contain !important;        
      }
      button.active{
        background: #C83531;
        color: white;
      }

    b.error{
        color: #C83531;
        font-size: 12px;
    }
      .float{
        position:fixed;
        width:60px;
        height:60px;
        bottom:40px;
        right:40px;
        background-color:#25d366;
        color:#FFF;
        border-radius:50px;
        text-align:center;
        font-size:30px;
        box-shadow: 2px 2px 3px #999;
        z-index:100;
      }
      
      .my-float{
        margin-top:16px;
      }

    .clothing-cotainer{
        position: relative;
        display: table;
        margin: 0 auto;
    }
      .prendas img{
        cursor: pointer;
        padding: 5px 30px;
        max-width: 30%;
        max-height: 30%;
      }
      
      .prendas img:hover, .prendas img.active, .designer-icons img:hover, .designer-icons img.active{
        border: 1px solid black;
      }
      
      .designer-icons img{
          max-width: 60px;
          max-height: 60px;
          cursor: pointer;
          padding: 15px;
      }
      
      .icons img{
          width: 40px;
      }
      
    .prenda-seleccionada{
        position:relative;
    }
    .prenda-seleccionada img{
        max-width: 800px;
    }
      
    .prenda-seleccionada .icon{
        max-width: 50px;
        max-height: 50px;
        position:absolute;
    }
    .prenda-seleccionada .hotspot{
        width: 50px;
        height: 50px;
        position:absolute;
        background: rgba(200, 53, 49, 0.5);
        border-radius: 25px;
        cursor:pointer;
    }
    .prenda-seleccionada .border-black{
        border: 1px solid;
    }

      @media screen and (min-width: 470px) {
        p {
          line-height: initial;
        }
      }