*,
*::before,
*::after {
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

body{
    height: 100vh;
    background-color: #303030;
    font-family: "Raleway", sans-serif;
}

.geral {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow-y: scroll;
}


.container{
  position: relative;
    width: 100%;
    height: 100vh;
    background-image: url("../assets/capa0001.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
  	align-items: center;
    
}

.logo {
  margin: 0 auto 30px;
  width: 500px;
}

h1{  
    background: linear-gradient(90deg, rgba(246,211,47,1) 0%, rgba(253,243,116,1) 100%);
    background-clip: text;
    color: transparent;
    /* color: #fff; */
    text-align: center;
    font-family: "Raleway", sans-serif;
    font-size: 46px;
    font-weight: 700;
    padding-top: 10px;
}

.texto1{
    color: white;
    text-align: center;
    font-family: "Raleway", sans-serif;
    font-size: 18px;
    font-weight: 300;
    text-transform: uppercase;
    margin: 5px 0 30px;
}

.botao1{
    border: 1px solid #ffffff;
    border-radius: 3px;
    background-color: #ffffff00;
    color: #ffffff;
    padding: 10px;
    text-align: center;
    font-size: 18px;
    text-decoration: none;
    font-weight: 300;
    cursor: pointer;
}

.botao1:hover {
  background-color: #ffffff;
  color: #303030;
  font-size: 18px;
}

.container .contato {
  display: flex;
  margin: 20px auto;
}

.container .zap {
  border: 0;
  padding: 0;
  width: 130px;
  margin-bottom: 30px;
}

.container .fone{
  width: 130px;
  background-color: #ffffff00;
  color: #ffffff;
  padding: 0;
  margin-bottom: 20px;
  text-align: center;
  text-decoration: none;
  font-weight: 300;
  cursor: pointer;
  text-decoration: none;
}

.container .fone:hover {
  background-color: #ffffff51;
}

.container .fone:visited {
  background-color: #ffffff00;
  color: #ffffff;
  text-decoration: none;
}


@media all and (max-width: 500px) {
  .logo{
    width: 300px;
  }
  h1{
    font-size: 30px;
  }
  .texto1{
    font-size: 16px;
  }

}


/* +++conteiner da produtos+++ */

.container2{
  position: relative;
    width: 100%;
    height: auto;
    background-color: #dcdbdb;
    display: flex;
    justify-content: space-around;
    flex-direction: column;
  	align-items: center;
    padding: 80px 0;
}

.bloco1 {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  gap: 150px;
}

.bloco2 {
  width: 350px;
}

.bloco-foto {
  display: block;
  overflow: hidden;
  width: 350px;
  height: 350px;
  object-fit: cover;
  object-position: center;
  border-radius: 5px;
  margin-bottom: 20px;
}

.foto-apre {
  width: 350px;
  height: 350px;
  object-fit: cover;
  object-position: center;
  border-radius: 5px;
  margin-bottom: 20px;
  /* filter: grayscale(80%);
  cursor: pointer;
  transform: scale3d(1, 1, 1);
  transition: transform 1s ease-in-out; */
}


/* .foto-apre:hover {
  filter: grayscale(0%);
  transform: scale3d(1.3, 1.3, 1);
  transition: transform 2s ease-in-out;
} */

h2{
  text-align: left;
  font-family: "Raleway", sans-serif;
  font-size: 22px;
  font-weight: 300;
  padding-bottom: 10px;
}

.texto2 {
  font-weight: 300;
  line-height: 1.4;
  padding-bottom: 15px;
}


@media all and (max-width: 500px) {
  .container2{
      width: 100%;
      height: auto;
      padding: 70px 20px; 
  }
  .bloco1 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    
  }
  .bloco2 {
    width: 280px;
    height: auto;
  }
  .bloco-foto {
    width: 280px;
    height: auto;
  }
  .foto-apre {
    width: 280px;
    height: 280px;
  }

}


/* +++conteiner da apresentação+++ */

.container3{
  position: relative;
    width: 100%;
    height: auto;
    background-color: #303030;
    display: flex;
    justify-content: space-around;
    flex-direction: column;
  	align-items: center;
    padding: 80px 0 0;
}

.container3 .bloco1 {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  gap: 80px;
}

.container3 .bloco2 {
  width: 420px;
}

.container3 h2{
  text-align: left;
  font-family: "Raleway", sans-serif;
  font-size: 22px;
  font-weight: 300;
  padding-bottom: 10px;
  color: #acacac;
}

.container3 .texto2 {
  font-weight: 300;
  line-height: 1.4;
  padding-bottom: 30px;
  color: #acacac;
}

.foto-apre2 {
  width: 420px;
  height: 700px;
  object-fit: cover;
  object-position: center;
  border-radius: 5px;
  margin-bottom: 10px;
}

@media all and (max-width: 500px) {
  .container3{
      width: 100%;
      height: auto;
      padding: 70px 20px 0; 
  }
  .container3 .bloco1 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    
  }
  .container3 .bloco2 {
    width: 280px;
    height: auto;
  }

  .foto-apre2 {
    width: 280px;
    height: auto;
  }
}

.container3b{
  position: relative;
    width: 100%;
    height: auto;
    background-color: #303030;
    display: flex;
    justify-content: space-around;
    flex-direction: column;
  	align-items: center;
    padding: 80px 0;
}

.container3b .bloco1 {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  gap: 80px;
  border-top: #acacac 1px solid;
  padding-top: 50px;
}

.container3b .bloco2 {
  width: 420px;
}

.container3b h2{
  text-align: left;
  font-family: "Raleway", sans-serif;
  font-size: 22px;
  font-weight: 300;
  padding-bottom: 10px;
  color: #acacac;
}

.container3b .texto2 {
  font-weight: 300;
  line-height: 1.4;
  padding-bottom: 30px;
  color: #acacac;
}

@media all and (max-width: 500px) {
  .container3b{
      width: 100%;
      height: auto;
      padding: 70px 20px; 
  }
  .container3b .bloco1 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    
  }
  .container3b .bloco2 {
    width: 280px;
    height: auto;
  }

}


/* +++conteiner comentários+++ */

.container4{
  position: relative;
    width: 100%;
    height: 500px;
    background-color: #dcdbdb;
    display: flex;
    flex-direction: column;
  	align-items: center;
    justify-content: center;
    padding: 10px 20px;
}

.container4 h2{
  padding-top: 80px;
}


/* +++conteiner dos contatos+++ */

.container5{
  position: relative;
  width: 100%;
  height: 100vh;
  background-image: url("../assets/IMG_1146.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;  
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.contat {
  display: flex;
  flex-direction: column;
  align-items: center;
  color: #ffffff;
  text-align: center;
  font-weight: 200;
  border: 1px solid #ffffff;
  padding: 20px;
  border-radius: 5px;
}

h3{
  text-align: center;
  font-family: "Raleway", sans-serif;
  font-size: 22px;
  font-weight: 300;
  padding-bottom: 20px;
}

.icone {
  width: 30px;
}

.contat2{
  display: flex;
  justify-content: space-between;
  gap: 30px;
}

.fone{
  width: 130px;
  background-color: #ffffff00;
  color: #ffffff;
  padding: 10px;
  margin-bottom: 20px;
  text-align: center;
  text-decoration: none;
  font-weight: 300;
  cursor: pointer;
  text-decoration: none;
}

.fone:hover {
  background-color: #ffffff51;
}

.fone:visited {
  background-color: #ffffff00;
  color: #ffffff;
  text-decoration: none;
}

.zap {
  border: 1px solid #ffffff;
  border-radius: 5px;
  padding: 10px;
  width: 150px;
  margin-bottom: 30px;
}

.botao-wa{
  border: 1px solid #ffffff;
  border-radius: 3px;
  background-color: #ffffff00;
  color: #ffffff;
  padding: 10px;
  text-align: center;
  text-decoration: none;
  font-weight: 300;
  cursor: pointer;
}

.botao-wa:hover {
  background-color: #ffffff51;
}

.local{
  background-color: #ffffff00;
  color: #ffffff;
  text-align: center;
  text-decoration: none;
  font-weight: 300;
  cursor: pointer;
}

.local:hover {
  background-color: #ffffff51;
}

.hora {
  padding: 15px 0;
  margin: 30px 0 20px;
  border-top: 1px solid #ffffff;
  border-bottom: 1px solid #ffffff;
}



/* === galeria === */

:root {
	--img: url(/assets/imagem1.png);
}

.carrossel {
  position: relative;
	width: 100%;
	height: 100vh;
	overflow: hidden;
	display: flex;
	/* align-items: center; */
	justify-content: center;
  padding-top: 10vh;
}

.carrossel:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background: #303030;
	z-index: 0;
}

.content {
	width: 80vmin;
	height: 80vmin;
	display: flex;
	align-items: center;
	justify-content: center;
	background-size: cover;
	background-position: center center;
	background-image: var(--img, url(/assets/imagem1.png));
	max-width: 700px;
	max-height: 450px;
	z-index: 0;
}

/* .content:before {
	content: "";
	position: absolute;
	width: 100%;
	text-align: center;
	margin-bottom: -55vmin;
	text-shadow: -1px -1px 0 #0007;
	color: #fff4;
	font-size: 18px;
} */

/* CONTROLS */
.controls {
	width: 100vw;
	height: 100vh;
	overflow: hidden;
	display: flex;
	justify-content: flex-end;
	flex-direction: row;
	flex-wrap: wrap;
	position: absolute;
}

input[type=radio] {
	display: none;
}		

label {
	width: 50vw;
	height: 100vh;
	position: relative;
	cursor: pointer;
	opacity: 0.15;
}

label:hover {
	opacity: 1;
}

input:first-child:checked ~ .content .controls label:first-child,
input:last-of-type:checked ~ .content .controls label:last-of-type {
	cursor: default;
	opacity: 0.025;
}


/* HIDE LABELS */
#b2:checked ~ .content .controls label[for=b2], 
#b3:checked ~ .content .controls label[for=b3], 
#b4:checked ~ .content .controls label[for=b4], 
#b5:checked ~ .content .controls label[for=b5], 
#b6:checked ~ .content .controls label[for=b6], 
#b7:checked ~ .content .controls label[for=b7], 
#b8:checked ~ .content .controls label[for=b8], 
#b9:checked ~ .content .controls label[for=b9], 
#b10:checked ~ .content .controls label[for=b10], 
#b11:checked ~ .content .controls label[for=b11], 
#b12:checked ~ .content .controls label[for=b12], 
#b13:checked ~ .content .controls label[for=b13], 
#b14:checked ~ .content .controls label[for=b14], 
#b15:checked ~ .content .controls label[for=b15], 
#b16:checked ~ .content .controls label[for=b16], 
#b17:checked ~ .content .controls label[for=b17], 
#b18:checked ~ .content .controls label[for=b18], 
#b19:checked ~ .content .controls label[for=b19], 
#b20:checked ~ .content .controls label[for=b20], 
#b21:checked ~ .content .controls label[for=b21], 
#b22:checked ~ .content .controls label[for=b22], 
#b23:checked ~ .content .controls label[for=b23], 
#b24:checked ~ .content .controls label[for=b24], 
#b25:checked ~ .content .controls label[for=b25], 
#b26:checked ~ .content .controls label[for=b26], 
#b27:checked ~ .content .controls label[for=b27], 
#b28:checked ~ .content .controls label[for=b28], 
#b29:checked ~ .content .controls label[for=b29], 
#b30:checked ~ .content .controls label[for=b30], 
#b31:checked ~ .content .controls label[for=b31],

#b3:checked ~ .content .controls label[for=b1],
#b4:checked ~ .content .controls label[for=b1],
#b4:checked ~ .content .controls label[for=b2],
#b5:checked ~ .content .controls label[for=b1],
#b5:checked ~ .content .controls label[for=b2],
#b5:checked ~ .content .controls label[for=b3],
#b6:checked ~ .content .controls label[for=b1],
#b6:checked ~ .content .controls label[for=b2],
#b6:checked ~ .content .controls label[for=b3],
#b6:checked ~ .content .controls label[for=b4],
#b7:checked ~ .content .controls label[for=b1],
#b7:checked ~ .content .controls label[for=b2],
#b7:checked ~ .content .controls label[for=b3],
#b7:checked ~ .content .controls label[for=b4],
#b7:checked ~ .content .controls label[for=b5],
#b8:checked ~ .content .controls label[for=b1],
#b8:checked ~ .content .controls label[for=b2],
#b8:checked ~ .content .controls label[for=b3],
#b8:checked ~ .content .controls label[for=b4],
#b8:checked ~ .content .controls label[for=b5],
#b8:checked ~ .content .controls label[for=b6],
#b9:checked ~ .content .controls label[for=b1],
#b9:checked ~ .content .controls label[for=b2],
#b9:checked ~ .content .controls label[for=b3],
#b9:checked ~ .content .controls label[for=b4],
#b9:checked ~ .content .controls label[for=b5],
#b9:checked ~ .content .controls label[for=b6],
#b9:checked ~ .content .controls label[for=b7],
#b10:checked ~ .content .controls label[for=b1],
#b10:checked ~ .content .controls label[for=b2],
#b10:checked ~ .content .controls label[for=b3],
#b10:checked ~ .content .controls label[for=b4],
#b10:checked ~ .content .controls label[for=b5],
#b10:checked ~ .content .controls label[for=b6],
#b10:checked ~ .content .controls label[for=b7],
#b10:checked ~ .content .controls label[for=b8],
#b11:checked ~ .content .controls label[for=b1],
#b11:checked ~ .content .controls label[for=b2],
#b11:checked ~ .content .controls label[for=b3],
#b11:checked ~ .content .controls label[for=b4],
#b11:checked ~ .content .controls label[for=b5],
#b11:checked ~ .content .controls label[for=b6],
#b11:checked ~ .content .controls label[for=b7],
#b11:checked ~ .content .controls label[for=b8],
#b11:checked ~ .content .controls label[for=b9],
#b12:checked ~ .content .controls label[for=b1],
#b12:checked ~ .content .controls label[for=b2],
#b12:checked ~ .content .controls label[for=b3],
#b12:checked ~ .content .controls label[for=b4],
#b12:checked ~ .content .controls label[for=b5],
#b12:checked ~ .content .controls label[for=b6],
#b12:checked ~ .content .controls label[for=b7],
#b12:checked ~ .content .controls label[for=b8],
#b12:checked ~ .content .controls label[for=b9],
#b12:checked ~ .content .controls label[for=b10],
#b13:checked ~ .content .controls label[for=b1],
#b13:checked ~ .content .controls label[for=b2],
#b13:checked ~ .content .controls label[for=b3],
#b13:checked ~ .content .controls label[for=b4],
#b13:checked ~ .content .controls label[for=b5],
#b13:checked ~ .content .controls label[for=b6],
#b13:checked ~ .content .controls label[for=b7],
#b13:checked ~ .content .controls label[for=b8],
#b13:checked ~ .content .controls label[for=b9],
#b13:checked ~ .content .controls label[for=b10],
#b13:checked ~ .content .controls label[for=b11],
#b14:checked ~ .content .controls label[for=b1] ,
#b14:checked ~ .content .controls label[for=b2] ,
#b14:checked ~ .content .controls label[for=b3] ,
#b14:checked ~ .content .controls label[for=b4] ,
#b14:checked ~ .content .controls label[for=b5] ,
#b14:checked ~ .content .controls label[for=b6] ,
#b14:checked ~ .content .controls label[for=b7] ,
#b14:checked ~ .content .controls label[for=b8],
#b14:checked ~ .content .controls label[for=b9],
#b14:checked ~ .content .controls label[for=b10],
#b14:checked ~ .content .controls label[for=b11],
#b14:checked ~ .content .controls label[for=b12],
#b15:checked ~ .content .controls label[for=b1] ,
#b15:checked ~ .content .controls label[for=b2] ,
#b15:checked ~ .content .controls label[for=b3] ,
#b15:checked ~ .content .controls label[for=b4] ,
#b15:checked ~ .content .controls label[for=b5] ,
#b15:checked ~ .content .controls label[for=b6] ,
#b15:checked ~ .content .controls label[for=b7] ,
#b15:checked ~ .content .controls label[for=b8],
#b15:checked ~ .content .controls label[for=b9],
#b15:checked ~ .content .controls label[for=b10],
#b15:checked ~ .content .controls label[for=b11],
#b15:checked ~ .content .controls label[for=b12],
#b15:checked ~ .content .controls label[for=b13],
#b16:checked ~ .content .controls label[for=b1] ,
#b16:checked ~ .content .controls label[for=b2] ,
#b16:checked ~ .content .controls label[for=b3] ,
#b16:checked ~ .content .controls label[for=b4] ,
#b16:checked ~ .content .controls label[for=b5] ,
#b16:checked ~ .content .controls label[for=b6] ,
#b16:checked ~ .content .controls label[for=b7] ,
#b16:checked ~ .content .controls label[for=b8],
#b16:checked ~ .content .controls label[for=b9],
#b16:checked ~ .content .controls label[for=b10],
#b16:checked ~ .content .controls label[for=b11],
#b16:checked ~ .content .controls label[for=b12],
#b16:checked ~ .content .controls label[for=b13],
#b16:checked ~ .content .controls label[for=b14], 
#b17:checked ~ .content .controls label[for=b1],
#b17:checked ~ .content .controls label[for=b2],
#b17:checked ~ .content .controls label[for=b3],
#b17:checked ~ .content .controls label[for=b4],
#b17:checked ~ .content .controls label[for=b5],
#b17:checked ~ .content .controls label[for=b6],
#b17:checked ~ .content .controls label[for=b7],
#b17:checked ~ .content .controls label[for=b8],
#b17:checked ~ .content .controls label[for=b9],
#b17:checked ~ .content .controls label[for=b10],
#b17:checked ~ .content .controls label[for=b11],
#b17:checked ~ .content .controls label[for=b12],
#b17:checked ~ .content .controls label[for=b13],
#b17:checked ~ .content .controls label[for=b14],
#b17:checked ~ .content .controls label[for=b15],
#b18:checked ~ .content .controls label[for=b1],
#b18:checked ~ .content .controls label[for=b2],
#b18:checked ~ .content .controls label[for=b3],
#b18:checked ~ .content .controls label[for=b4],
#b18:checked ~ .content .controls label[for=b5],
#b18:checked ~ .content .controls label[for=b6],
#b18:checked ~ .content .controls label[for=b7],
#b18:checked ~ .content .controls label[for=b8],
#b18:checked ~ .content .controls label[for=b9],
#b18:checked ~ .content .controls label[for=b10],
#b18:checked ~ .content .controls label[for=b11],
#b18:checked ~ .content .controls label[for=b12],
#b18:checked ~ .content .controls label[for=b13],
#b18:checked ~ .content .controls label[for=b14],
#b18:checked ~ .content .controls label[for=b15],
#b18:checked ~ .content .controls label[for=b16],
#b19:checked ~ .content .controls label[for=b1],
#b19:checked ~ .content .controls label[for=b2],
#b19:checked ~ .content .controls label[for=b3],
#b19:checked ~ .content .controls label[for=b4],
#b19:checked ~ .content .controls label[for=b5],
#b19:checked ~ .content .controls label[for=b6],
#b19:checked ~ .content .controls label[for=b7],
#b19:checked ~ .content .controls label[for=b8],
#b19:checked ~ .content .controls label[for=b9],
#b19:checked ~ .content .controls label[for=b10],
#b19:checked ~ .content .controls label[for=b11],
#b19:checked ~ .content .controls label[for=b12],
#b19:checked ~ .content .controls label[for=b13],
#b19:checked ~ .content .controls label[for=b14],
#b19:checked ~ .content .controls label[for=b15],
#b19:checked ~ .content .controls label[for=b16],
#b19:checked ~ .content .controls label[for=b17],
#b20:checked ~ .content .controls label[for=b1],
#b20:checked ~ .content .controls label[for=b2],
#b20:checked ~ .content .controls label[for=b3],
#b20:checked ~ .content .controls label[for=b4],
#b20:checked ~ .content .controls label[for=b5],
#b20:checked ~ .content .controls label[for=b6],
#b20:checked ~ .content .controls label[for=b7],
#b20:checked ~ .content .controls label[for=b8],
#b20:checked ~ .content .controls label[for=b9],
#b20:checked ~ .content .controls label[for=b10],
#b20:checked ~ .content .controls label[for=b11],
#b20:checked ~ .content .controls label[for=b12],
#b20:checked ~ .content .controls label[for=b13],
#b20:checked ~ .content .controls label[for=b14],
#b20:checked ~ .content .controls label[for=b15],
#b20:checked ~ .content .controls label[for=b16],
#b20:checked ~ .content .controls label[for=b17],
#b20:checked ~ .content .controls label[for=b18],
#b21:checked ~ .content .controls label[for=b1],
#b21:checked ~ .content .controls label[for=b2],
#b21:checked ~ .content .controls label[for=b3],
#b21:checked ~ .content .controls label[for=b4],
#b21:checked ~ .content .controls label[for=b5],
#b21:checked ~ .content .controls label[for=b6],
#b21:checked ~ .content .controls label[for=b7],
#b21:checked ~ .content .controls label[for=b8],
#b21:checked ~ .content .controls label[for=b9],
#b21:checked ~ .content .controls label[for=b10],
#b21:checked ~ .content .controls label[for=b11],
#b21:checked ~ .content .controls label[for=b12],
#b21:checked ~ .content .controls label[for=b13],
#b21:checked ~ .content .controls label[for=b14],
#b21:checked ~ .content .controls label[for=b15],
#b21:checked ~ .content .controls label[for=b16],
#b21:checked ~ .content .controls label[for=b17],
#b21:checked ~ .content .controls label[for=b18],
#b21:checked ~ .content .controls label[for=b19],
#b22:checked ~ .content .controls label[for=b1],
#b22:checked ~ .content .controls label[for=b2],
#b22:checked ~ .content .controls label[for=b3],
#b22:checked ~ .content .controls label[for=b4],
#b22:checked ~ .content .controls label[for=b5],
#b22:checked ~ .content .controls label[for=b6],
#b22:checked ~ .content .controls label[for=b7],
#b22:checked ~ .content .controls label[for=b8],
#b22:checked ~ .content .controls label[for=b9],
#b22:checked ~ .content .controls label[for=b10],
#b22:checked ~ .content .controls label[for=b11],
#b22:checked ~ .content .controls label[for=b12],
#b22:checked ~ .content .controls label[for=b13],
#b22:checked ~ .content .controls label[for=b14],
#b22:checked ~ .content .controls label[for=b15],
#b22:checked ~ .content .controls label[for=b16],
#b22:checked ~ .content .controls label[for=b17],
#b22:checked ~ .content .controls label[for=b18],
#b22:checked ~ .content .controls label[for=b19],
#b22:checked ~ .content .controls label[for=b20],
#b23:checked ~ .content .controls label[for=b1],
#b23:checked ~ .content .controls label[for=b2],
#b23:checked ~ .content .controls label[for=b3],
#b23:checked ~ .content .controls label[for=b4],
#b23:checked ~ .content .controls label[for=b5],
#b23:checked ~ .content .controls label[for=b6],
#b23:checked ~ .content .controls label[for=b7],
#b23:checked ~ .content .controls label[for=b8],
#b23:checked ~ .content .controls label[for=b9],
#b23:checked ~ .content .controls label[for=b10],
#b23:checked ~ .content .controls label[for=b11],
#b23:checked ~ .content .controls label[for=b12],
#b23:checked ~ .content .controls label[for=b13],
#b23:checked ~ .content .controls label[for=b14],
#b23:checked ~ .content .controls label[for=b15],
#b23:checked ~ .content .controls label[for=b16],
#b23:checked ~ .content .controls label[for=b17],
#b23:checked ~ .content .controls label[for=b18],
#b23:checked ~ .content .controls label[for=b19],
#b23:checked ~ .content .controls label[for=b20],
#b23:checked ~ .content .controls label[for=b21],
#b24:checked ~ .content .controls label[for=b1],
#b24:checked ~ .content .controls label[for=b2],
#b24:checked ~ .content .controls label[for=b3],
#b24:checked ~ .content .controls label[for=b4],
#b24:checked ~ .content .controls label[for=b5],
#b24:checked ~ .content .controls label[for=b6],
#b24:checked ~ .content .controls label[for=b7],
#b24:checked ~ .content .controls label[for=b8],
#b24:checked ~ .content .controls label[for=b9],
#b24:checked ~ .content .controls label[for=b10],
#b24:checked ~ .content .controls label[for=b11],
#b24:checked ~ .content .controls label[for=b12],
#b24:checked ~ .content .controls label[for=b13],
#b24:checked ~ .content .controls label[for=b14],
#b24:checked ~ .content .controls label[for=b15],
#b24:checked ~ .content .controls label[for=b16],
#b24:checked ~ .content .controls label[for=b17],
#b24:checked ~ .content .controls label[for=b18],
#b24:checked ~ .content .controls label[for=b19],
#b24:checked ~ .content .controls label[for=b20],
#b24:checked ~ .content .controls label[for=b21],
#b24:checked ~ .content .controls label[for=b22],
#b25:checked ~ .content .controls label[for=b1],
#b25:checked ~ .content .controls label[for=b2],
#b25:checked ~ .content .controls label[for=b3],
#b25:checked ~ .content .controls label[for=b4],
#b25:checked ~ .content .controls label[for=b5],
#b25:checked ~ .content .controls label[for=b6],
#b25:checked ~ .content .controls label[for=b7],
#b25:checked ~ .content .controls label[for=b8],
#b25:checked ~ .content .controls label[for=b9],
#b25:checked ~ .content .controls label[for=b10],
#b25:checked ~ .content .controls label[for=b11],
#b25:checked ~ .content .controls label[for=b12],
#b25:checked ~ .content .controls label[for=b13],
#b25:checked ~ .content .controls label[for=b14],
#b25:checked ~ .content .controls label[for=b15],
#b25:checked ~ .content .controls label[for=b16],
#b25:checked ~ .content .controls label[for=b17],
#b25:checked ~ .content .controls label[for=b18],
#b25:checked ~ .content .controls label[for=b19],
#b25:checked ~ .content .controls label[for=b20],
#b25:checked ~ .content .controls label[for=b21],
#b25:checked ~ .content .controls label[for=b22],
#b25:checked ~ .content .controls label[for=b23],
#b26:checked ~ .content .controls label[for=b1],
#b26:checked ~ .content .controls label[for=b2],
#b26:checked ~ .content .controls label[for=b3],
#b26:checked ~ .content .controls label[for=b4],
#b26:checked ~ .content .controls label[for=b5],
#b26:checked ~ .content .controls label[for=b6],
#b26:checked ~ .content .controls label[for=b7],
#b26:checked ~ .content .controls label[for=b8],
#b26:checked ~ .content .controls label[for=b9],
#b26:checked ~ .content .controls label[for=b10],
#b26:checked ~ .content .controls label[for=b11],
#b26:checked ~ .content .controls label[for=b12],
#b26:checked ~ .content .controls label[for=b13],
#b26:checked ~ .content .controls label[for=b14],
#b26:checked ~ .content .controls label[for=b15],
#b26:checked ~ .content .controls label[for=b16],
#b26:checked ~ .content .controls label[for=b17],
#b26:checked ~ .content .controls label[for=b18],
#b26:checked ~ .content .controls label[for=b19],
#b26:checked ~ .content .controls label[for=b20],
#b26:checked ~ .content .controls label[for=b21],
#b26:checked ~ .content .controls label[for=b22],
#b26:checked ~ .content .controls label[for=b23],
#b26:checked ~ .content .controls label[for=b24],
#b27:checked ~ .content .controls label[for=b1],
#b27:checked ~ .content .controls label[for=b2],
#b27:checked ~ .content .controls label[for=b3],
#b27:checked ~ .content .controls label[for=b4],
#b27:checked ~ .content .controls label[for=b5],
#b27:checked ~ .content .controls label[for=b6],
#b27:checked ~ .content .controls label[for=b7],
#b27:checked ~ .content .controls label[for=b8],
#b27:checked ~ .content .controls label[for=b9],
#b27:checked ~ .content .controls label[for=b10],
#b27:checked ~ .content .controls label[for=b11],
#b27:checked ~ .content .controls label[for=b12],
#b27:checked ~ .content .controls label[for=b13],
#b27:checked ~ .content .controls label[for=b14],
#b27:checked ~ .content .controls label[for=b15],
#b27:checked ~ .content .controls label[for=b16],
#b27:checked ~ .content .controls label[for=b17],
#b27:checked ~ .content .controls label[for=b18],
#b27:checked ~ .content .controls label[for=b19],
#b27:checked ~ .content .controls label[for=b20],
#b27:checked ~ .content .controls label[for=b21],
#b27:checked ~ .content .controls label[for=b22],
#b27:checked ~ .content .controls label[for=b23],
#b27:checked ~ .content .controls label[for=b24],
#b27:checked ~ .content .controls label[for=b25],
#b28:checked ~ .content .controls label[for=b1],
#b28:checked ~ .content .controls label[for=b2],
#b28:checked ~ .content .controls label[for=b3],
#b28:checked ~ .content .controls label[for=b4],
#b28:checked ~ .content .controls label[for=b5],
#b28:checked ~ .content .controls label[for=b6],
#b28:checked ~ .content .controls label[for=b7],
#b28:checked ~ .content .controls label[for=b8],
#b28:checked ~ .content .controls label[for=b9],
#b28:checked ~ .content .controls label[for=b10],
#b28:checked ~ .content .controls label[for=b11],
#b28:checked ~ .content .controls label[for=b12],
#b28:checked ~ .content .controls label[for=b13],
#b28:checked ~ .content .controls label[for=b14],
#b28:checked ~ .content .controls label[for=b15],
#b28:checked ~ .content .controls label[for=b16],
#b28:checked ~ .content .controls label[for=b17],
#b28:checked ~ .content .controls label[for=b18],
#b28:checked ~ .content .controls label[for=b19],
#b28:checked ~ .content .controls label[for=b20],
#b28:checked ~ .content .controls label[for=b21],
#b28:checked ~ .content .controls label[for=b22],
#b28:checked ~ .content .controls label[for=b23],
#b28:checked ~ .content .controls label[for=b24],
#b28:checked ~ .content .controls label[for=b25],
#b28:checked ~ .content .controls label[for=b26],
#b29:checked ~ .content .controls label[for=b1],
#b29:checked ~ .content .controls label[for=b2],
#b29:checked ~ .content .controls label[for=b3],
#b29:checked ~ .content .controls label[for=b4],
#b29:checked ~ .content .controls label[for=b5],
#b29:checked ~ .content .controls label[for=b6],
#b29:checked ~ .content .controls label[for=b7],
#b29:checked ~ .content .controls label[for=b8],
#b29:checked ~ .content .controls label[for=b9],
#b29:checked ~ .content .controls label[for=b10],
#b29:checked ~ .content .controls label[for=b11],
#b29:checked ~ .content .controls label[for=b12],
#b29:checked ~ .content .controls label[for=b13],
#b29:checked ~ .content .controls label[for=b14],
#b29:checked ~ .content .controls label[for=b15],
#b29:checked ~ .content .controls label[for=b16],
#b29:checked ~ .content .controls label[for=b17],
#b29:checked ~ .content .controls label[for=b18],
#b29:checked ~ .content .controls label[for=b19],
#b29:checked ~ .content .controls label[for=b20],
#b29:checked ~ .content .controls label[for=b21],
#b29:checked ~ .content .controls label[for=b22],
#b29:checked ~ .content .controls label[for=b23],
#b29:checked ~ .content .controls label[for=b24],
#b29:checked ~ .content .controls label[for=b25],
#b29:checked ~ .content .controls label[for=b26],
#b29:checked ~ .content .controls label[for=b27],
#b30:checked ~ .content .controls label[for=b1],
#b30:checked ~ .content .controls label[for=b2],
#b30:checked ~ .content .controls label[for=b3],
#b30:checked ~ .content .controls label[for=b4],
#b30:checked ~ .content .controls label[for=b5],
#b30:checked ~ .content .controls label[for=b6],
#b30:checked ~ .content .controls label[for=b7],
#b30:checked ~ .content .controls label[for=b8],
#b30:checked ~ .content .controls label[for=b9],
#b30:checked ~ .content .controls label[for=b10],
#b30:checked ~ .content .controls label[for=b11],
#b30:checked ~ .content .controls label[for=b12],
#b30:checked ~ .content .controls label[for=b13],
#b30:checked ~ .content .controls label[for=b14],
#b30:checked ~ .content .controls label[for=b15],
#b30:checked ~ .content .controls label[for=b16],
#b30:checked ~ .content .controls label[for=b17],
#b30:checked ~ .content .controls label[for=b18],
#b30:checked ~ .content .controls label[for=b19],
#b30:checked ~ .content .controls label[for=b20],
#b30:checked ~ .content .controls label[for=b21],
#b30:checked ~ .content .controls label[for=b22],
#b30:checked ~ .content .controls label[for=b23],
#b30:checked ~ .content .controls label[for=b24],
#b30:checked ~ .content .controls label[for=b25],
#b30:checked ~ .content .controls label[for=b26],
#b30:checked ~ .content .controls label[for=b27],
#b30:checked ~ .content .controls label[for=b28],
#b31:checked ~ .content .controls label[for=b1],
#b31:checked ~ .content .controls label[for=b2],
#b31:checked ~ .content .controls label[for=b3],
#b31:checked ~ .content .controls label[for=b4],
#b31:checked ~ .content .controls label[for=b5],
#b31:checked ~ .content .controls label[for=b6],
#b31:checked ~ .content .controls label[for=b7],
#b31:checked ~ .content .controls label[for=b8],
#b31:checked ~ .content .controls label[for=b9],
#b31:checked ~ .content .controls label[for=b10],
#b31:checked ~ .content .controls label[for=b11],
#b31:checked ~ .content .controls label[for=b12],
#b31:checked ~ .content .controls label[for=b13],
#b31:checked ~ .content .controls label[for=b14],
#b31:checked ~ .content .controls label[for=b15],
#b31:checked ~ .content .controls label[for=b16],
#b31:checked ~ .content .controls label[for=b17],
#b31:checked ~ .content .controls label[for=b18],
#b31:checked ~ .content .controls label[for=b19],
#b31:checked ~ .content .controls label[for=b20],
#b31:checked ~ .content .controls label[for=b21],
#b31:checked ~ .content .controls label[for=b22],
#b31:checked ~ .content .controls label[for=b23],
#b31:checked ~ .content .controls label[for=b24],
#b31:checked ~ .content .controls label[for=b25],
#b31:checked ~ .content .controls label[for=b26],
#b31:checked ~ .content .controls label[for=b27],
#b31:checked ~ .content .controls label[for=b28],
#b31:checked ~ .content .controls label[for=b29],
#b32:checked ~ .content .controls label[for=b1],
#b32:checked ~ .content .controls label[for=b2],
#b32:checked ~ .content .controls label[for=b3],
#b32:checked ~ .content .controls label[for=b4],
#b32:checked ~ .content .controls label[for=b5],
#b32:checked ~ .content .controls label[for=b6],
#b32:checked ~ .content .controls label[for=b7],
#b32:checked ~ .content .controls label[for=b8],
#b32:checked ~ .content .controls label[for=b9],
#b32:checked ~ .content .controls label[for=b10],
#b32:checked ~ .content .controls label[for=b11],
#b32:checked ~ .content .controls label[for=b12],
#b32:checked ~ .content .controls label[for=b13],
#b32:checked ~ .content .controls label[for=b14],
#b32:checked ~ .content .controls label[for=b15],
#b32:checked ~ .content .controls label[for=b16],
#b32:checked ~ .content .controls label[for=b17],
#b32:checked ~ .content .controls label[for=b18],
#b32:checked ~ .content .controls label[for=b19],
#b32:checked ~ .content .controls label[for=b20],
#b32:checked ~ .content .controls label[for=b21],
#b32:checked ~ .content .controls label[for=b22],
#b32:checked ~ .content .controls label[for=b23],
#b32:checked ~ .content .controls label[for=b24],
#b32:checked ~ .content .controls label[for=b25],
#b32:checked ~ .content .controls label[for=b26],
#b32:checked ~ .content .controls label[for=b27],
#b32:checked ~ .content .controls label[for=b28],
#b32:checked ~ .content .controls label[for=b29],
#b32:checked ~ .content .controls label[for=b30]

 { 
	display: none;
}


/* ARROWS */
label:before {
	content: "";
	position: absolute;
	background: 
		linear-gradient(30deg, #fff0 60%, #fff calc(60% + 1px)), 
		linear-gradient(-30deg, #fff 40%, #fff0 calc(40% + 1px)), 
		linear-gradient(-90deg, #fff0 70%, #fff calc(70% + 1px));
	width: 6vmin;
	height: 6vmin;
	border-radius: 5px;
	right: 7vmin;
	top: calc(50% - 3vmin);
}

/* LEFT ARROW */
#b1:checked ~ .content .controls label[for=b1]:before,
#b2:checked ~ .content .controls label[for=b1]:before,
#b3:checked ~ .content .controls label[for=b2]:before,
#b4:checked ~ .content .controls label[for=b3]:before,
#b5:checked ~ .content .controls label[for=b4]:before,
#b6:checked ~ .content .controls label[for=b5]:before,
#b7:checked ~ .content .controls label[for=b6]:before,
#b8:checked ~ .content .controls label[for=b7]:before,
#b9:checked ~ .content .controls label[for=b8]:before,
#b10:checked ~ .content .controls label[for=b9]:before,
#b11:checked ~ .content .controls label[for=b10]:before,
#b12:checked ~ .content .controls label[for=b11]:before,
#b13:checked ~ .content .controls label[for=b12]:before,
#b14:checked ~ .content .controls label[for=b13]:before,
#b15:checked ~ .content .controls label[for=b14]:before,
#b16:checked ~ .content .controls label[for=b15]:before,
#b17:checked ~ .content .controls label[for=b16]:before,
#b18:checked ~ .content .controls label[for=b17]:before,
#b19:checked ~ .content .controls label[for=b18]:before,
#b20:checked ~ .content .controls label[for=b19]:before,
#b21:checked ~ .content .controls label[for=b20]:before,
#b22:checked ~ .content .controls label[for=b21]:before,
#b23:checked ~ .content .controls label[for=b22]:before,
#b24:checked ~ .content .controls label[for=b23]:before,
#b25:checked ~ .content .controls label[for=b24]:before,
#b26:checked ~ .content .controls label[for=b25]:before,
#b27:checked ~ .content .controls label[for=b26]:before,
#b28:checked ~ .content .controls label[for=b27]:before,
#b29:checked ~ .content .controls label[for=b28]:before,
#b30:checked ~ .content .controls label[for=b29]:before,
#b31:checked ~ .content .controls label[for=b30]:before,
#b32:checked ~ .content .controls label[for=b31]:before
{
	left: 7vmin;
	transform: rotate(180deg);
}




/*** THUMBNAILS ***/
.thumbnails {
	position: absolute;
	background: #ffffff05;
	width: 100vw;
	bottom: 3vh;
	text-align: center;
	padding: 1vmin;
}

.thumbnails label {
	background-color: #0008;
	position: relative;
	width: 10vmin;
	height: 10vmin;
	display: inline-block;
	margin-left: 1vw;
	background-image: var(--img);
	background-size: cover;
	background-position: center;
	opacity: 0.5;
	border-radius: 2px;
}

/* IMAGES / THUMBNAILS */
.carrossel:has(input#b1:checked), .thumbnails label[for=b1] {
	--img: url(/assets/cortinas/cortina01.jpg);
}

.carrossel:has(input#b2:checked), .thumbnails label[for=b2] {
	--img: url(/assets/cortinas/cortina02.jpg);
}

.carrossel:has(input#b3:checked), .thumbnails label[for=b3] {
	--img: url(/assets/cortinas/cortina03.jpg);
}

.carrossel:has(input#b4:checked), .thumbnails label[for=b4] {
	--img: url(/assets/cortinas/cortina04.jpg);
}

.carrossel:has(input#b5:checked), .thumbnails label[for=b5] {
	--img: url(/assets/cortinas/cortina05.jpg);
}

.carrossel:has(input#b6:checked), .thumbnails label[for=b6] {
	--img: url(/assets/cortinas/cortina06.jpg);
}

.carrossel:has(input#b7:checked), .thumbnails label[for=b7] {
	--img: url(/assets/cortinas/cortina07.jpg);
}

.carrossel:has(input#b8:checked), .thumbnails label[for=b8] {
	--img: url(/assets/cortinas/cortina08.jpg);
}

.carrossel:has(input#b9:checked), .thumbnails label[for=b9] {
	--img: url(/assets/cortinas/cortina09.jpg);
}

.carrossel:has(input#b10:checked), .thumbnails label[for=b10] {
	--img: url(/assets/cortinas/cortina10.jpg);
}

.carrossel:has(input#b11:checked), .thumbnails label[for=b11] {
	--img: url(/assets/cortinas/cortina11.jpg);
}

.carrossel:has(input#b12:checked), .thumbnails label[for=b12] {
	--img: url(/assets/cortinas/cortina12.jpg);
}

.carrossel:has(input#b13:checked), .thumbnails label[for=b13] {
	--img: url(/assets/cortinas/cortina13.jpg);
}

.carrossel:has(input#b14:checked), .thumbnails label[for=b14] {
	--img: url(/assets/cortinas/cortina14.jpg);
}

.carrossel:has(input#b15:checked), .thumbnails label[for=b15] {
	--img: url(/assets/cortinas/cortina15.jpg);
}

.carrossel:has(input#b16:checked), .thumbnails label[for=b16] {
	--img: url(/assets/cortinas/cortina16.jpg);
}

.carrossel:has(input#b17:checked), .thumbnails label[for=b17] {
	--img: url(/assets/cortinas/cortina17.jpg);
}

.carrossel:has(input#b18:checked), .thumbnails label[for=b18] {
	--img: url(/assets/cortinas/cortina18.jpg);
}

.carrossel:has(input#b19:checked), .thumbnails label[for=b19] {
	--img: url(/assets/cortinas/cortina19.jpg);
}

.carrossel:has(input#b20:checked), .thumbnails label[for=b20] {
	--img: url(/assets/cortinas/cortina20.jpg);
}

.carrossel:has(input#b21:checked), .thumbnails label[for=b21] {
	--img: url(/assets/cortinas/cortina21.jpg);
}

.carrossel:has(input#b22:checked), .thumbnails label[for=b22] {
	--img: url(/assets/cortinas/cortina22.jpg);
}

.carrossel:has(input#b23:checked), .thumbnails label[for=b23] {
	--img: url(/assets/cortinas/cortina23.jpg);
}

.carrossel:has(input#b24:checked), .thumbnails label[for=b24] {
	--img: url(/assets/cortinas/cortina24.jpg);
}

.carrossel:has(input#b25:checked), .thumbnails label[for=b25] {
	--img: url(/assets/cortinas/cortina25.jpg);
}

.carrossel:has(input#b26:checked), .thumbnails label[for=b26] {
	--img: url(/assets/cortinas/cortina26.jpg);
}

.carrossel:has(input#b27:checked), .thumbnails label[for=b27] {
	--img: url(/assets/cortinas/cortina27.jpg);
}

.carrossel:has(input#b28:checked), .thumbnails label[for=b28] {
	--img: url(/assets/cortinas/cortina28.jpg);
}

.carrossel:has(input#b29:checked), .thumbnails label[for=b29] {
	--img: url(/assets/cortinas/cortina29.jpg);
}

.carrossel:has(input#b30:checked), .thumbnails label[for=b30] {
	--img: url(/assets/cortinas/cortina30.jpg);
}

.carrossel:has(input#b31:checked), .thumbnails label[for=b31] {
	--img: url(/assets/cortinas/cortina31.jpg);
}

.carrossel:has(input#b32:checked), .thumbnails label[for=b32] {
	--img: url(/assets/cortinas/cortina32.jpg);
}

.thumbnails label:before { display: none; }
.thumbnails label:hover { opacity: 1; }
.thumbnails label:first-child { margin-left: 0; }

#b1:checked ~ .content .thumbnails label[for=b1],
#b2:checked ~ .content .thumbnails label[for=b2],
#b3:checked ~ .content .thumbnails label[for=b3],
#b4:checked ~ .content .thumbnails label[for=b4],
#b5:checked ~ .content .thumbnails label[for=b5],
#b6:checked ~ .content .thumbnails label[for=b6],
#b7:checked ~ .content .thumbnails label[for=b7],
#b8:checked ~ .content .thumbnails label[for=b8],
#b9:checked ~ .content .thumbnails label[for=b9],
#b10:checked ~ .content .thumbnails label[for=b10],
#b11:checked ~ .content .thumbnails label[for=b11],
#b12:checked ~ .content .thumbnails label[for=b12],
#b13:checked ~ .content .thumbnails label[for=b13],
#b14:checked ~ .content .thumbnails label[for=b14],
#b15:checked ~ .content .thumbnails label[for=b15],
#b16:checked ~ .content .thumbnails label[for=b16],
#b17:checked ~ .content .thumbnails label[for=b17],
#b18:checked ~ .content .thumbnails label[for=b18],
#b19:checked ~ .content .thumbnails label[for=b19],
#b20:checked ~ .content .thumbnails label[for=b20],
#b21:checked ~ .content .thumbnails label[for=b21],
#b22:checked ~ .content .thumbnails label[for=b22],
#b23:checked ~ .content .thumbnails label[for=b23],
#b24:checked ~ .content .thumbnails label[for=b24],
#b25:checked ~ .content .thumbnails label[for=b25],
#b26:checked ~ .content .thumbnails label[for=b26],
#b27:checked ~ .content .thumbnails label[for=b27],
#b28:checked ~ .content .thumbnails label[for=b28],
#b29:checked ~ .content .thumbnails label[for=b29],
#b30:checked ~ .content .thumbnails label[for=b30],
#b31:checked ~ .content .thumbnails label[for=b31],
#b32:checked ~ .content .thumbnails label[for=b32] {
	opacity: 1;
	box-shadow: 0 0 0.01vmin 0.5vmin #fff;
}



/* MEDIA QUERIES */
@media only screen and (max-width:767px) {
	.carrossel:after {
		top: 2vh;
		/* font-size: 20px; */
		white-space: initial;
	}
}

@media only screen and (max-width:500px) {
	
  .carrossel {
    padding-top: 15vh;
  }
  
  .carrossel:after {
		/* font-size: 25px; */
		white-space: pre-wrap;
	}

  .content {
    height: 80vmin;
    max-width: 400px;
    max-height: 192px;
  }

  .thumbnails {
    bottom: 10vh;
    
  }
}

/* BROWSER SUPPORT */
.firefox {
	background: #0008;
	color: #fff;
	position: absolute;
	top: 45vh;
	width: 45vmin;
	padding: 2vmin 3vmin;
	border-radius: 5px;
	text-align: center;
	font-size: 24px;
}

.firefox span code {
	font-size: 24px;
	background: #0008;
	padding: 0 10px;
	border-radius: 25px;
}

@supports (-webkit-font-smoothing: antialiased) {
	.firefox {
		display: none;
	}
}