* {box-sizing:border-box}

/* Caption text */
.text {
	color: #f2f2f2;
	font-size: 15px;
	padding: 8px 12px;
	position: absolute;
	bottom: 8px;
	width: 100%;
	text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
	color: #f2f2f2;
	font-size: 12px;
	padding: 8px 12px;
	position: absolute;
	top: 0;
}

@keyframes fade {
	from {opacity: .4}
	to {opacity: 1}
}

.sticky {
	position: sticky;
	top:0;
	background-color: white;
	max-height: 85vh;
	overflow-y: auto;
	z-index: 1;
}

.Entrar {
	position: absolute;
	z-index: 3;
	color: white;
	left: 91%;
	margin-top: 25px;
	cursor: pointer;
	left: auto;
	right: 60pt;
}

.login {
	color: white;
	font-size: 25pt;
	cursor: pointer;
	position: absolute;
	margin-top: 20px;
	vertical-align: middle;
	left: auto;
	right: 42px;
}

#menuLogin:checked ~ .menuLogin {
	transform: translateX(5px);
	width: 400px;
	height: 100px;
	z-index: 9999;
	visibility: visible;
}

.carrinhoBarra {
	vertical-align: top;
	cursor: pointer;
	position: absolute;
	margin-top: 22px;
	font-size: 170%;
	color: white;
	right: 70pt;
	left: auto;
}

.menuLogin {
	background-color: white;
	height: 0px;
	width: 0px;
	position: absolute;
	top: 40pt;
	left: 85%;
	visibility: hidden;
	transition: all .2s linear;
	z-index: -1;
}

.itemLogin {
	padding: 20px; 
	font-size: 10pt;
	color: black;
	cursor: pointer;
	background-color: white; 
}

.btnLogout {
	background-color: #D9534F;
	color:#DDDDE2;
}

.cliente {
	padding: 20px; 
	font-size: 10pt;
	color: black;
	background-color: #ebebeb86; 
}

.logoMarca {
	max-height: 70px; 
	width: auto;
}

.barraPrincipal {
	height: 72px;
}

.hiddenButton {
	display: none;
}

.showButton:hover .hiddenButton {
	display: block;
	text-align: center;
}

.card {
	border: 1px #EDEDED solid;
	min-height: 300px;
	border-radius: 5px;
	padding-top: 10px;
	background-color: white;
	margin-top: 10px;
	margin-bottom: 20px;
}

.card-image {
	padding: 0 !important;
	vertical-align: top;
}


.card:hover {
	/* border: solid  #EDEDED 1px; */
	border: solid  lightblue 1px;
	/* padding-bottom: 10px; */
	cursor: pointer;
	box-shadow: #eaeaea 1px 1px 20px;
}

.precoCampanha {
	border-radius: 15px;
	background-color: #FE5757; 
	padding: 10px;
	color: white; 
	font-size: 80%;
	font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

.nomeProduto {
	font-size: 80%;
	line-height: 1.23;
	letter-spacing: .28px;
	font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
	text-align: center;
	min-height: 40px;
}

.imagemMain {
	height: 125px;
	max-height: 120px; 
	min-height: 100px;
	margin-top: 5px;
	margin-bottom: 15px;
	max-width: 100%;

	text-align: center;
}

.imagemMain:hover {
	/* IE 9 */
	-ms-transform: scale(1.1);
	/* Safari 3-8 */
	-webkit-transform: scale(1.1);
	transform: scale(1.1); 
	/* box-shadow: #aeaeae 2px 2px 20px; */
}
.zoom {
	text-align: center;
	max-height: 250px; 
	min-height: 200px;  
	padding-top: 2px;
}

.zoom:hover {
	z-index: 99;
	margin: 90px;
	-ms-transform: scale(2); /* IE 9 */
	-webkit-transform: scale(2); /* Safari 3-8 */
	transform: scale(2); 
}

.divProdutos {
	max-height: 90vh; 
	overflow-y: auto; 
	background-color: #F6F8F7;
}

.menu {
	text-align: left;
	position: relative;
}

.temNoCarrinho {
	text-align: right;
	vertical-align: top;
	position: relative;
	padding: 5px;
	padding-right: 7px;
	border-radius: 25px;
	color: white;
	background-color: green;
}

.barra {
	background-color: #333;
	height: 100%;
	width: 300px;
	position: absolute;
	left: -315px;
	transition: all .2s linear;
}

.barra>nav>a>div {
	padding: 20px;
	background-color: #333333;
	color:#DDDDE2;
	cursor: pointer;
	font-weight: bold;
	font-size: 18px;
	border: 1px solid #dddde2;
}

.link {
	color: #f4f4f9;
	font-family: 'Arial';
	font-size: 12pt;
	padding: 20px;
	border-bottom: 2px solid #222;
	transition:  all .2s linear;
	opacity: 0;
	margin-top: 200px;
}
.link:hover {
	background-color: #050542;
}

.barra .link {
	list-style: none;
	background-color: #494950;
	z-index:9999;
}

nav {
	width: 100%;
	position: absolute;
	top: 0px;
 
}

nav a {
	text-decoration: none;
	font-size: 10px important;
	height: 1px important;
}

.itemFamilia {
	font-size: 20%;
}

#checkb {
	display: none;
	background-color: #f00;
}

#checkb:checked ~ .barra nav a .link {
	opacity: 1;
	margin-top: 0;
	transition-delay: .2s;
}

#checkb:checked ~ .barra {
	transform: translateX(300px);
	z-index: 9999;
}

.borderless {
	border-top: 0px transparent important;
}

.barSearch {
	position: fixed;
	z-index: 3;
	top: 15px;
	left: 15%;
	width: 60%;
}

.barSearch>.input-group-addon {
	background: transparent;
	color: white;
	font-size: 18px;
	border: none;
}

.barSearch>input {
	/* border: solid #D2D6DE 1px; */
	border: none;
	background-color: transparent;
	color: white;
	font-size: 18px;
	box-sizing: unset;
	border-radius: 0;
	box-shadow: none;
}

.barSearch>input:focus {
	border-bottom: 2px white solid;
}

.barSearch>input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	color: #efefef;
	opacity: 1; /* Firefox */
}
.barSearch>input:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: #efefef;
}
.barSearch>input::-ms-input-placeholder { /* Microsoft Edge */
	color: #efefef;
}

.carousel {
	margin-top: 15px;
	margin-bottom: 10px;
}

.carousel-indicators li {
	border: solid 1px #dedede;
	width: 20px;
	height: 15px;
	margin: 0 5px 0 5px;
	background-color: #bbb;
}

.carousel-indicators .active {
	border: solid 1px #dedede;
	width: 20px;
	height: 15px;
	margin: 0 5px 0 5px;
	background-color: #717171;
}

#divListaProdutos {
	max-height: 86vh;
	overflow-y: auto;
}

.obsSenhaNova {
	margin-top: -200px;
}

.obsSenhaNova>label {
	font-size: 11px;
	background-color: #F6E7B6;
	border: #E2C568 0.5px solid;
	color: black;
	padding: 6px;
	border-radius: 5px;
	align-items: center;
	text-align: left;
}

.obsSenhaNova>label>b>.fa-asterisk {
	color: red;
}

@media screen and (max-width: 425px) {
	.Entrar {
		right: 40pt;
	}
	.login {
		left: 90%
	}
	.menuLogin {
		left: 40%;
	}
	.barraPrincipal {
		height: 140px;
	}
	.barra {
		display: inline;
		top:170px;
	}
	.imagemMain {
		max-height: 100px;
		max-width: 100px ;
	}
	.card {
		min-height: 320px;
	}
	.hiddenButton {
		display: block;
	}
	.barSearch {
		top: 80px;
		left: 2%;
		width: 90%;
	}
	.carrinhoBarra {
		right: 42pt;
	}
	.login {
		right: 10px;
	}
	
	#divListaProdutos {
		max-height: 80vh;
	}
	.obsSenhaNova {
		margin-top: 0;
	}
}
