

/* COSMETICA PARA CALVOS ========================= */
.total_look_header{ position: absolute; z-index: 2; right: 0; }

	.total_look_nirvel_men{ float: left; padding: 15px; }

	.total_look_logo_mc{ float: left; background-color: #080808; padding: 20px 120px 15px 25px; }
		.total_look_logo{ float: left; }
		.total_look_slogan{ float: left; color: #fff; font-size: 34px; font-weight: 300; padding: 10px 0 0 10px; }
		.total_look_slogan h1{ font-weight: normal; }


.calvos_banner{ width: 100vw; height: 80vh; position: relative; overflow: hidden;
	background-size: cover; background-position: center; background-repeat: no-repeat; }

	.calvos_banner_screen{ background-image: url('../images/cosmetica-para-calvos/total-look-cosmetica-para-calvos.jpg'); }

	.calvos_banner_mobile{ background-image: url('../images/cosmetica-para-calvos/cosmetica-para-calvos-productos-mobile.jpg'); }


.calvos_banner_textos{ position: absolute; bottom: 30px; left: 30px; }
	.calvos_banner_textos .calvos_banner_txt{ font-size: 21px; color: #000; background-color: #fff; padding: 8px 12px; margin: 4px 0; max-width: max-content; line-height: 1; display:flex; align-items: center; }

	.calvos_banner_textos .calvos_banner_txt div{ margin-right:7px; }

.calvos_banner_textos_mobile{ display: none; }

.calvos_check{ width:20px; height: 20px; background-image:url('../images/check.png'); background-size:cover; }

.calvos_banner_bottom{ font-family: 'Rokkitt', serif;  background-color: #080808; padding: 35px 30px; font-size: 46px; color: #fff; }
.calvos_banner_bottom_mobile{ display: none; }



.calvos_banner_products{ position: absolute; right: 10px; margin-top: -260px; overflow: hidden; }



.container_total_look{ width: 100%; max-width: 1120px; margin: auto; padding: 10px; }

.calvos_texto{ width: 67%; margin: 40px 0; }

.total_look_productos{ background-color: #F2F6F9; margin-bottom: 6px; padding: 40px 0; }
	
	.total_look_producto{ float: left; width: 70%; }
		.total_look_producto_title{ font-size: 22px; font-weight: 900; background-color: #000; color: #fff; padding: 15px 20px 15px 15px; max-width: max-content; line-height: 1; }
		.total_look_producto_txt{ margin-top: 20px; padding-left: 10px; }

	.total_look_item{ float: left; width: 30%;  text-align: center; position:relative; }
		.total_look_item_inner{ width:100%; max-width:300px; margin:auto; position:relative; }

		.total_look_item_name{ font-size: 22px; color: #000; }
		
		.total_look_price{ text-align:center; color:#000; }
		.total_look_price .producto_precio{ margin:auto; font-size:16px; }

		.total_look_item_bt{ max-width: max-content; background-color: #000; color: #fff; position: relative; margin-top: 20px; font-size: 18px; padding: 15px;
			top:50%; left:50%; -webkit-transform:translate(-50%, -0%); transform:translate(-50%, -0%); }

		.total_look_dto{ position:absolute; right:5px; margin-top: 10px; width:75px; height:75px; background-image:url('../images/black_friday/20dto_black_friday_2025.png'); 
			background-size: contain; background-position: center; background-repeat:no-repeat; }


	.total_look_item:hover .total_look_item_img{ transform: scale(1.1); }
	.total_look_item:hover .total_look_item_bt{  background-color: #fff; color: #000; }


.total_look_footer{ font-size: 12px; }

.logo_nirvel_cosmetics{ text-align: center; margin-top: 40px; }
.logo_nirvel_cosmetics img{ width: 165px; height: auto; }


@media only screen and (max-width: 1240px) {

	.calvos_banner_bottom{ font-size: 36px; }

	.calvos_banner_products{ right: 10px; margin-top: -190px; }
	.calvos_banner_products img{ width: 300px; height: auto; }

}


@media only screen and (max-width: 880px) {

	.total_look_header{ position: relative; right: auto; display: flex; }

		.total_look_nirvel_men{ float: none; padding: 15px 15px 10px 15px; }
		.total_look_nirvel_men img{ width: 80px; height: auto; }

		.total_look_logo_mc{ float: none; padding: 4px 12px; width: 100%; }
			.total_look_logo{ float: none; margin-top: 15px; }
			.total_look_logo img{ width: 215px; height: auto; }

			.total_look_slogan{ position: absolute; top: 90px; right: 0; padding: 0 10px 0 0; text-align: right; max-width: 250px; font-size: 45px; font-weight: 300; }
			.total_look_slogan h1{ font-weight: 300; }


	.calvos_banner{ height: 55vh; }
		.calvos_banner_textos{ display: none; }

	.calvos_banner_bottom_mobile{ display: inherit; height: 60px; background-color: #080808; }
	.calvos_banner_bottom{ margin-top: 0; background-color: transparent; padding: 10px; font-size: 46px; color: #000; line-height: 0.9; }

	.calvos_banner_products{ position: absolute; right: 10px; margin-top: -140px; }
	.calvos_banner_products img{ width: 200px; height: auto; }

	.calvos_banner_textos_mobile{ display: inherit; margin-top: 80px; padding: 10px;}
		.calvos_banner_textos_mobile .calvos_banner_txt{ font-size: 17px; color: #fff; background-color: #000; margin: 4px 0; padding: 8px 12px; max-width: max-content; display:flex; align-items: center; }
		.calvos_banner_textos_mobile .calvos_banner_txt div{ margin-right:3px; }

	.calvos_banner_textos_mobile .calvos_banner_txt .calvos_check{ filter: brightness(0) invert(1); }

	.calvos_texto{ width: 100%; margin: 10px 0; }


	.total_look_producto{ float: none; width: 100%; }

	.total_look_item{ float: none; width: 100%; margin-top: 25px;  }


}
