@import url('https://fonts.googleapis.com/css?family=Roboto');
html{
	font-family: 'Roboto', sans-serif;
	font-size: 16px;
	color:#000;
	height: 100%;
	padding: 0;
	background: #ECF0F5;
}

body {
	margin: 0px;
	height: 100%;
	padding: 0;
}
/*FONTS*/
.font30{
	font-size:30px;	
}
.font12{
	font-size:12px;
}
.erro{
	font-size:12px;
	color:#FF0000;
}
.font12Laranja{
	font-size:12px;
	color:#D84DA8;
}
.fontLaranja{
	color:#D84DA8;
}
.linkPreto{
	text-decoration:underline;
	color:#000;
}
.font10{
	font-size: 10px; 
	color:#666;
	padding:0px;
	margin:0px;
}
.vermelho{
	color:#FF0000;
}
/*FONTS*/
#wrapper{
	position:relative;	
	width:100%;
	min-height: 100%;
}
#content{
	max-width: 1150px;
	margin:auto;
	position:relative;
	height: 100%;
	min-height:100%;
}
#head{
	width:100%;
	height:50px;
	background:#D84DA8;
}
#headContent{
	max-width:1150px;
	margin:auto;
	white-space:nowrap;
    text-align:center;
}
#logoLarome{
	margin-top:5px;
	width:auto;
	height:35px;
}

/*NAVIGATION*/
#nav
{
	width:calc(100% - 10px);
	margin-top:5px;
	margin-left:5px;
	margin-right:5px;
}
#nav > a
{
	display: none;
}
#nav li
{
	position: relative;
}
#nav li a
{
	color: #fff;
	display: block;
}
#nav li a:active
{
	background-color: #D84DA8; !important;
}
#nav span:after
{
	width: 0;
	height: 0;
	border: 0.313em solid transparent; /* 5 */
	border-bottom: none;
	border-top-color: #efa585;
	content: '';
	vertical-align: middle;
	display: inline-block;
	position: relative;
	right: -0.313em; /* 5 */
}
/* first level */
#nav > ul
{
	height: 45px;
	background-color: #303032;
	list-style: none; /* Remove list bullets */
    padding: 0;
    margin: 0;
}
#nav > ul > li
{
	width: 16.66%;
	height: 100%;
	float: left;
}
#nav > ul > li > a
{
	height: 100%;
	font-size: 12px;
	line-height: 45px;; /* 60 (24) */
	text-align: center;
	text-decoration:none;
}
#nav > ul > li:not( :last-child ) > a
{
	border-right: 1px solid #FFF;
}
#nav > ul > li:hover > a,
#nav > ul:not( :hover ) > li.active > a
{
	background-color: #CA108A;
}
/* second level */
#nav li ul
{
	background-color: #D84DA8;
	display: none;
	position: absolute;
	top: 100%;
	list-style: none; /* Remove list bullets */
    padding: 0;
    margin: 0;
	z-index:10;
}
#nav li:hover ul
{
	display: block;
	left: 0;
	right: 0;
}
#nav li:not( :first-child ):hover ul
{
	left: -1px;
}
#nav li ul a
{
	font-size: 12px; /* 20 */
	border-top: 1px solid #FFF;
	padding: 0.75em; /* 15 (20) */
	text-decoration:none;
	
}
#nav li ul li a:hover,
#nav li ul:not( :hover ) li.active a
{
	background-color: #CA108A;
}
/*NAVIGATION*/

.LogoBox {
    width: 32%;
    display:inline-block;
}
#rodape{
	position:absolute;
	bottom:0;
	height:50px;
	background:#FFFFFF;
	width:100%;
	border-top: 1px solid #B9B9C8;
	font-size:14px;
	display: table;
}
#rodape span {
  display: table-cell;
  vertical-align: middle;
  padding-left:10px;
  padding-right:10px;
}
.inline{
	display:inline-block;	
}
.boxContentNormal{
	max-width:1150px;
	margin:auto;
	margin-top:5%;
	margin-bottom:80px;
	text-align:center;
}
.boxContent{
	max-width:450px;
	margin:auto;
	margin-top:5%;
	margin-bottom:80px;
	text-align:center;
	height: 600px;
  	min-height: 400px;
	vertical-align:top;
}
.boxLogin{
	width:calc(100% - 2px);
	background:#FFF;
	padding-top:20px;
	padding-bottom:20px;
	border-top: 5px solid #D84DA8;
	border-left: 1px solid #B9B9C8;
	border-right: 1px solid #B9B9C8;
	border-bottom: 1px solid #B9B9C8;
}
.boxcontent{
	width:calc(100% - 2px);
	background:#FFF;
	padding-bottom:20px;
	border-top: 5px solid #D84DA8;
	border-left: 1px solid #B9B9C8;
	border-right: 1px solid #B9B9C8;
	border-bottom: 1px solid #B9B9C8;
	vertical-align:top;
	position:relative;
	min-height:500px;
}
#inside{
	width:calc(100% - 80px);
	margin:auto;
}
.inside2{
	width:calc(100% - 80px);
	max-width:370px;
	margin:auto;
}
.forms{
	outline: none !important;
	height:38px;
	padding-left:10px;
	width:calc(100% - 10px);
	margin-top:15px;
	border: 2px solid #EEEAEC;
	font-size:20px;
}
.forms2{
	outline: none !important;
	height:38px;
	padding-left:10px;
	width:calc(100% - 10px);
	border: 2px solid #EEEAEC;
	font-size:20px;
}
.forms:focus, .forms2:focus{
    outline: none !important;
    border:2px solid #D84DA8;
}
.boxesMorada{
	width:48%;
	display:inline-block;
	margin-top:10px;
}
.boxesSpace{
	width:10px;
	display:inline-block;
}
#utilizador{
	background:#FFF url(https://www.perfumes-serone.com/Revenda/images/user.png) no-repeat 98%
}
#pass, #pass2{
	background:#FFF url(https://www.perfumes-serone.com/Revenda/images/pass.png) no-repeat 98%
}
#email{
	background:#FFF url(https://www.perfumes-serone.com/Revenda/images/email.png) no-repeat 98%
}
#telemovel{
	background:#FFF url(https://www.perfumes-serone.com/Revenda/images/smartphone.png) no-repeat 98%
}
#telefone{
	background:#FFF url(https://www.perfumes-serone.com/Revenda/images/phone.png) no-repeat 98%
}
#procuraField{
	background:#FFF url(https://www.perfumes-serone.com/Revenda/images/search.png) no-repeat 98%
}
::-webkit-input-placeholder { color:#C1BFBB; }
::-moz-placeholder { color:#C1BFBB; } /* firefox 19+ */
:-ms-input-placeholder { color:#C1BFBB; } /* ie */
input:-moz-placeholder { color:#C1BFBB; }

#memorizarPass{
	text-align:left;
	width:100%;
	margin:auto;
	margin-top:30px;
}
#memorizar, #outraMorada{
	-ms-transform: scale(1.5); /* IE */
	-moz-transform: scale(1.5); /* FF */
	-webkit-transform: scale(1.5); /* Safari and Chrome */
	-o-transform: scale(1.5); /* Opera */
	padding: 10px;
}
.BTsubmit{
	width:100% ;
	margin:auto;
	margin-top:30px;
	background:#303032;
	text-align:center;
	height:45px;
	line-height:45px;
}
.BTsubmit a{
	text-decoration:none;
	color:#FFF;	
	display:block;
}
.BTsubmitCategorias{
	width:150px;
	margin:auto;
	background:#303032;
	text-align:center;
	height:45px;
	line-height:45px;
	margin-top:2px;
}
.BTsubmitCategorias a{
	text-decoration:none;
	color:#FFF;	
	display:block;
}

.BTsubmitCarrinho{
	width:90px; ;
	margin:auto;
	margin-top:5px;
	background:#303032;
	text-align:center;
	height:25px;
	line-height:25px;
}
.BTsubmitCarrinho a{
	text-decoration:none;
	color:#FFF;	
	display:block;
	font-size:14px;
}
.BTwait{
	width:100% ;
	margin:auto;
	margin-top:30px;
	background:#D84DA8;
	text-align:center;
	height:45px;
	line-height:45px;
	display:none;
	color:#FFF;
}
.BTsent{
	width:100% ;
	margin:auto;
	margin-top:30px;
	background:#303032;
	border: 1px solid #B9B9C8;
	text-align:center;
	height:45px;
	line-height:45px;
	display:none;
}
.BT{
	width:300px;
	margin:auto;
	background:#303032;
	text-align:center;
	height:45px;
	line-height:45px;
}
.BT a{
	text-decoration:none;
	color:#FFF;	
	display:block;
}

hr{
	margin-top:30px;
	border-top: 1px dotted #B9B9C8;
	width:100%;
}
/*POPUS*/
#popupAlert{
	border: 1px solid;
	border-color:#B9B9C8;
	padding:10px;
	display:none; 
	width:400px; 
	height:200px; 
	position:fixed; 
	top:50%; 
	left:50%; 
	margin:-100px 0 0 -200px;
	z-index:4000;
	background-color:#FFF;	
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}
.close{
	float: right;	
}
#html{
	position:relative;
	top:30px;
	width:300px;
	margin:auto;
	text-align:center;
	font-size: 14px;
}
#amostras{
	height: auto !important;
	max-width: 310px !important;
	width:calc(100% - 80px) !important;
}

#promoLacas{
	height: auto !important;
	max-width: 891px !important;
	width:100% !important;
}
/*POPUS*/

#conteudo{
	width:calc(100% - 265px);
	border-top: 5px solid #D84DA8;
	border-left: 1px solid #B9B9C8;
	border-right: 1px solid #B9B9C8;
	border-bottom: 1px solid #B9B9C8;
	margin-left:5px;
	margin-top:5px;
	margin-right:265px;
	padding:5px;
	text-align:left;
	vertical-align:top;
}

#conteudoCarrinho{
	width:calc(100% - 26px);
	border-top: 5px solid #D84DA8;
	border-left: 1px solid #B9B9C8;
	border-right: 1px solid #B9B9C8;
	border-bottom: 1px solid #B9B9C8;
	margin-left:5px;
	margin-top:5px;
	padding:5px;
	text-align:left;
	vertical-align:top;
}

#lateral{
	position:absolute;
	top:103px;;
	right:5px;
	width:220px;
	background:#FFF;
	border-top: 5px solid #D84DA8;
	border-left: 1px solid #B9B9C8;
	border-right: 1px solid #B9B9C8;
	border-bottom: 1px solid #B9B9C8;
	text-align:left;
	padding:5px;
}
.search{
	text-align:left;
}
.formPesquisa{
	margin-top:3px;
	margin-left:5px;
	width:calc(100% - 150px);
}
/*LISTAGEM DE PRODUTOS*/
.lista_produtos {
	margin-top:5px;
	padding-top:5px;
	border: 1px solid #B9B9C8;
	width:32.6%;
	text-align:center;
	display: inline-block;
	vertical-align:top;
	position:relative;
	padding-bottom:5px;
}
.lista_produtos:hover{
	background-color:#F1F1F3;
}
.produtosRev{
	vertical-align:top;
	position:relative;
	width:48%;
}
.seloNovo{
	position:absolute;
	left:15px;
	top:15px;
	z-index:3;
}
.botoesAdd{
	font-size:25px;
	display:inline-block;
	cursor:pointer;
	vertical-align: middle;
	text-align:center;
	width:25px;
	height:25px;
	line-height:25px;
	background-color:#D84DA8;	
	color:#FFF;
}
.qtyCarrinho{
	background-color: #FFF;	
	outline: none !important;
	border: 1px solid #B9B9C8;
	width:18px;
	font-size:16px;
	text-align:center;
	vertical-align: middle;
	padding:5px;
	height:13px;
}
#carrinhoMobile{
	display:none;
}
.carrinhoIMG{
	margin-right:5px;
	width:32px;
}
.carrinhoNOME{
	font-size:12px;
	width:150px;
}
.carrinhoAPAGAR{
	width:8px;
	height:32px;
	line-height:32px;
	vertical-align:middle;
}
.botaoAPAGAR{
	margin:auto; 
	width:23px;
	height:23px;
	line-height:23px;
	background-color:#D84DA8;
	text-align:center;
	vertical-align:middle;
}
.botaoAPAGAR a{
	TEXT-DECORATION:none;
	color:#FFF;
	font-size:12px;
	font-weight:bold;
	vertical-align:top;
	display:block;
}
.carrinhoTOTAIS{
	color:#666;
	width:135px;
	font-size:14px;
}
.carrinhoTOTAISnumeros{
	width:75px;
	text-align:right;
	color:#666;
	font-size:14px;
}
.barrinhas{
	border-top: 1px solid;
	width:190px;
	height:5px;
	line-height:5px;
	border-color:#B9B9C8; 
	margin:auto;
}
.NVerde{
	width:100%;
	text-align:center;
	margin-top:10px;
}
#titSpace{
	width:calc(100% - 420px);
	display:inline-block;
}
#titPreco{
	display:inline-block;
	width:90px;
}
#titQuantidade{
	display:inline-block;
	width:135px;
}
#titTotal{
	display:inline-block;	
	width:80px;
}
.imgCarrinho{
	width:60px;
	padding:10px;
}
.descriCarrinho{
	padding:10px;
	width:calc(100% - 540px);
	display:inline-block;
	vertical-align:top;
}
.precoCarrinho{
	width:60px; 
	padding:10px;
	text-align:center; 
	vertical-align:top;
	display:inline-block;
}
.quantidadeCarrinho{
	width:120px; 
	padding:10px;
	text-align:center; 
	vertical-align:top;	
	display:inline-block;
}
.precoCarrinhoTotal{
	width:70px; 
	padding:10px;
	text-align:center; 
	vertical-align:top;	
	display:inline-block;
	font-weight:bold;
}
.eliminarCarrinho{
	padding:10px;	
	vertical-align:top;	
	display:inline-block;
	width:80px;
	cursor:pointer;

}
.barrinhasCarrinho{
	border-top: 1px solid;
	width:96%;
	height:5px;
	line-height:5px;
	border-color:#B9B9C8; 
	margin:auto;
}
.titSpace2{
	width:calc(100% - 420px);
	display:inline-block;
}
.titDescri{
	display:inline-block;
	width:135px;
}
.titNumbers{
	display:inline-block;	
	width:80px;
}
#outraMoradaDiv{
	display:none;
	margin-top:25px;
}
.precoRevenda{
	width:24%;
	font-size:12px;
	text-align:center;
}
.encomendas{
	width:29%;
	text-align:left;
	display:inline-block;
	vertical-align:top;
}
#perfume-list {
	background:#FFF;
	border: 1px solid #B9B9C8;
	background:#FFF;
	margin-left:15px;
	margin-top:0px;
	padding-left:0px;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}
#perfume-list li{
	padding: 10px;
	background:#FFF;
	border-bottom:#D84DA8 1px solid;
	list-style:none;
	text-align:left;
}
#perfume-list li:hover{
	cursor: pointer;
	background:#F0F0F0;
}
#suggesstion-box{
	position:absolute;
	z-index:5;
	width:calc(100% - 20px);
}
.mb{
	max-width:400px;
	height:320px;
	background-color:#FFF;
	margin:auto;
	margin-top:10px;
	border: 1px solid #0774C6;
	vertical-align:top;
}
.mbTit{
	height:30px;
	line-height:30px;
	background-color:#0774C6;
	text-align:center;
	vertical-align:middle;
	color:#FFF;
}
.mbLogo{
	display:inline-block;
	padding-top:10px;
}
#mbImage{
	padding:5px;	
}
.mbFields{
	width:190px;
	padding-left:5px;
	margin-top:10px;
	vertical-align:top;
}
.mbFields div, .mbFieldsDir div{
	height:30px;
	min-height:30px;
}
.mbFieldsDir{
	height:30px;
	min-height:30px;
	text-align:right;
	margin-top:10px;
	vertical-align:top;	
}
.cr{
	max-width:400px;
	height:auto;
	background-color:#FFF;
	margin:auto;
	margin-top:10px;
	border: 1px solid #F31D25;
	vertical-align:top
}
.crTit{
	height:30px;
	line-height:30px;
	background-color:#F31D25;
	text-align:center;
	vertical-align:middle;
	color:#FFF;
}
.valeDesconto{
	width:300px; 
	font-size:14px;
}
@media all and (min-width:1150px) 
{
	
}
@media all and (min-width:801px) and (max-width: 1149px) 
{
	.boxContentNormal{
		max-width:calc(100% - 50px);
	}

}
@media all and (min-width:801px) and (max-width: 1000px) 
{
	.lista_produtos {
		width:49%;
	}
}
@media all and (min-width:801px) and (max-width: 900px) 
{
	#nav > ul > li > a
	{
		font-size: 11px;
	}
	#nav li ul a
	{
		font-size: 11px; /* 20 */
	}

}
@media all and (min-width:0px) and (max-width: 800px) 
{
	/*POPUS*/
	#popupAlert{
		border: 1px solid;
		border-color:#B9B9C8;
		padding:10px;
		display:none; 
		width:250px; 
		height:200px; 
		position:fixed; 
		top:50%; 
		left:50%; 
		margin:-10px 0 0 -125px;
		z-index:4000;
		background-color:#FFF;	
	}
	.close{
		float: right;	
	}
	#html{
		position:relative;
		top:20px;
		width:220px;
		margin:auto;
		text-align:center;
		font-size: 14px;
	}
	/*POPUS*/
	#logoserone{
		margin-top:15px;
		width:auto;
		height:20px;
	}
	#logoLarome{
		margin-top:15px;
		width:auto;
		height:20px;
	}
	#logoPhemor{
		margin-top:15px;
		width:auto;
		height:20px;
	}
	.boxContent{
		max-width:calc(100% - 50px);
	}
	.boxContentNormal{
		max-width:calc(100% - 50px);
	}
	.BT{
		width:150px;
	}
	.BT a{
		font-size:12px;
	}
	/*NAVIGATION*/
	#nav
	{
		position: relative;
		top: auto;
		left: auto;
	}
	#nav > a
	{
		width: 50px; /* 50 */
		height: 50px;; /* 50 */
		text-align: left;
		text-indent: -9999px;
		background-color: #D84DA8;
		position: relative;
	}
	#nav > a:hover
	{
		background-color: #D84DA8;
	}
	
	#nav > a:before,
	#nav > a:after
	{
		position: absolute;
		border: 2px solid #fff;
		top: 35%;
		left: 25%;
		right: 25%;
		content: '';
	}
	#nav > a:after
	{
		top: 60%;
	}
	#nav:not( :target ) > a:first-of-type,
	#nav:target > a:last-of-type
	{
		display: block;
	}
	/* first level */
	#nav > ul
	{
		height: auto;
		display: none;
		position: absolute;
		left: 0;
		right: 0;
	}
	#nav:target > ul
	{
		display: block;
		z-index:11;
	}
	#nav > ul > li
	{
		width: 100%;
		float: none;
		
	}
	#nav > ul > li > a
	{
		height: auto;
		text-align: left;
		padding: 0 0.833em; /* 20 (24) */
		
	}
	#nav > ul > li:not( :last-child ) > a
	{
		border-right: none;
		border-bottom: 1px solid #FFFFFF;
	}
	/* second level */
	#nav li ul
	{
		position: static;
		padding: 1.25em; /* 20 */
		padding-top: 0;
		z-index:11;
	}
	/*NAVIGATION*/
	
	#conteudo{
		width:calc(100% - 20px);
		margin-left:5px;
		margin-top:5px;
		margin-right:5px;
	}
	#lateral{
		display:none;
	}
	::-webkit-input-placeholder { 
		color:#C1BFBB;
		font-size:12px;
	}
	::-moz-placeholder { 
		color:#C1BFBB;
		font-size:12px;
	} /* firefox 19+ */
	:-ms-input-placeholder {
		color:#C1BFBB; 
		font-size:12px;
	} /* ie */
	input:-moz-placeholder {
		color:#C1BFBB;
		font-size:12px;
	}
	.lista_produtos {
		width:49%;
	}
	#carrinhoMobile{
		display:block;
		position:absolute;
		top:5px;;
		right:10px;
		cursor:pointer;
		font-size:14px;
	}
	#carrinhoBolaDesk{
		color:#FFF;
		background:#D84DA8;
		position:absolute;
		width:20px;
		height:20px;
		line-height:20px;
		vertical-align:middle;
		text-align:center;
		top:0;
		right:-3px;
		border-radius: 10px 10px 10px 10px;
		-moz-border-radius:10px 10px 10px 10px;
		-webkit-border-radius:  10px 10px 10px 10px;
	}
	#carrinhoPreco{
		padding-left:5px;
		text-align:left;
		width:160px;
	}
	.BTsubmitCategorias {
		width:120px;
		margin-top:2px;
	}
	.BTsubmitCategorias a{
		font-size:12px;
	}
	#arrow{
	display: inline-block;
	vertical-align: middle;
	position:absolute;
	top:10px;
	right:5px;
	}
	#arrow a {
		display: inline-block;
		border-radius: 50%;
		-moz-border-radius: 50%;
		-webkit-border-radius: 50%;
	}
	#arrow a:hover .right{
		border: 0.3em solid #D84DA8;
	}
	#arrow a:hover .right:after {
		border-top: 0.3em solid #D84DA8;
		border-right: 0.3em solid #D84DA8;
	}
	.right {
		display: inline-block;
		width: 1.8em;
		height: 1.8em;
		border: 0.3em solid #D84DA8;
		border-radius: 50%;
		-moz-border-radius: 50%;
		-webkit-border-radius: 50%;
	}
	.right:after {
		content: '';
		display: inline-block;
		margin-top: 0.4em;
		margin-left: -0.4em;
		width: 0.7em;
		height: 0.7em;
		border-top: 0.3em solid #D84DA8;
		border-right: 0.3em solid #D84DA8;
		-moz-transform: rotate(45deg);
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	#titSpace{
		display:none;
	}
	#titPreco{
		display:none;
	}
	#titQuantidade{
		display:none;
	}
	#titTotal{
		display:none;	
	}
	.imgCarrinho{
		width:50px;	
	}
	.descriCarrinho{
		padding:10px;
		width:calc(100% - 100px);
		font-size:12px;
	}
	.precoCarrinho{
		display:none;	
	}
	.quantidadeCarrinho{
		padding-top:10px;
		width:50px;
	}
	.precoCarrinhoTotal{
		padding-top:10px;
	}
	.eliminarCarrinho{
		padding-top:10px;
		float:right;
		width:30px;
	}
	.boxesMorada{
		width:100%;
		display:block;
		margin-top:10px;
	}
	.boxesSpace{
		display:none;
	}
	.forms2{
		width:calc(100% - 15px);
		font-size:12px;
	}
	.encomendas{
		font-size:12px;
	}
	.mb, .cr{
		max-width:300px;
		font-size:12px;
	}
	.mbFields{
		width:80px;
	}
	.valeDesconto{
		width:200px; 
		font-size:10px;
	}
}
@media all and (min-width:0px) and (max-width: 550px) 
{
	.lista_produtos {
		width:100%;
	}
	.encomendas{
		display:block;
		width:80%;
	}
	#perfume-list li{
		font-size:12px;
	}
}
@media all and (min-width:0px) and (max-width: 400px) 
{
	#logoserone{
		margin-top:20px;
		width:auto;
		height:15px;
	}
	#logoLarome{
		margin-top:20px;
		width:auto;
		height:15px;
	}
	#logoPhemor{
		margin-top:20px;
		width:auto;
		height:15px;
	}
	.boxContent{
		max-width:calc(100% - 20px);
	}
	.boxContentNormal{
		max-width:calc(100% - 20px);
	}
	.font30{
		font-size:20px;	
	}	
	.BT{
		width:120px;
	}
	.BT a{
		font-size:10px;
	}
	
}

.BTsubmit:hover,.BT:hover, .botaoAPAGAR:hover{
	background: #D84DA8;
}
