
/*-----------------------------------------------------------------------------------
	Theme Name: DIAMANTES LINGERIE
	Theme URI: https://diamantesl.com
	Description: Site da DIAMANTES LINGERIE
	Author: Anexus Thiago Bluhm 
	
	License: Proibida alteraÃ§Ã£o, reproduÃ§Ã£o, distribuiÃ§Ã£o, transmissÃ£o ou cÃ³pia 
	parcial ou total de qualquer dos arquivos e cÃ³digos que compÃµem este 
	software (tema para Wordpress), sob proteÃ§Ã£o da Lei 9.609/98. 
	
	Copyright Â© 2019 - Todos os direitos reservados. 
-----------------------------------------------------------------------------------*/
/* FONTS /sejaconsultora/web/css/fonts/roboto/ */

@font-face {
    font-family: 'Roboto-Regular';
    font-display: optional;
	src: url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Regular.eot'); /* IE9 Compat Modes */
	src: url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Regular.woff2') format('woff2'), /* Super Modern Browsers */
		 url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Regular.woff') format('woff'), /* Pretty Modern Browsers */
		 url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Regular.ttf')  format('truetype'), /* Safari, Android, iOS */
		 url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Regular.svg#svgFontName') format('svg'); /* Legacy iOS */
  }

  @font-face {
    font-family: 'Roboto-Thin';
    font-display: optional;
	src: url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Thin.eot'); /* IE9 Compat Modes */
	src: url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Thin.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Thin.woff2') format('woff2'), /* Super Modern Browsers */
		 url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Thin.woff') format('woff'), /* Pretty Modern Browsers */
		 url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Thin.ttf')  format('truetype'), /* Safari, Android, iOS */
		 url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Thin.svg#svgFontName') format('svg'); /* Legacy iOS */
  }

  @font-face {
    font-family: 'Roboto-Light';
    font-display: optional;
	src: url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Light.eot'); /* IE9 Compat Modes */
	src: url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Light.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Light.woff2') format('woff2'), /* Super Modern Browsers */
		 url('.https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Light.woff') format('woff'), /* Pretty Modern Browsers */
		 url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Light.ttf')  format('truetype'), /* Safari, Android, iOS */
		 url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Light.svg#svgFontName') format('svg'); /* Legacy iOS */
  }

  @font-face {
    font-family: 'Roboto-Bold';
    font-display: optional;
	src: url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Bold.eot'); /* IE9 Compat Modes */
	src: url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Bold.woff2') format('woff2'), /* Super Modern Browsers */
		 url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Bold.woff') format('woff'), /* Pretty Modern Browsers */
		 url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Bold.ttf')  format('truetype'), /* Safari, Android, iOS */
		 url('https://diamantesl.com/sejaconsultora/web/css/fonts/roboto/Roboto-Bold.svg#svgFontName') format('svg'); /* Legacy iOS */
  }


/* RESETS
**********************************************************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: 'Roboto-Regular';
	font-size: 100%;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}
a { text-decoration: none; color: inherit; cursor: pointer; }
:focus {/* remember to define focus styles! */
	outline: 0;
}
html {
  overflow-y: scroll; 
  -webkit-text-size-adjust: 100%; 
  -ms-text-size-adjust: 100%;
}
body {
	background: #fff;
	line-height: 1;
}
iframe {
	-webkit-overflow-scrolling: touch;
  	overflow-y: scroll;
}
ol, ul {
	list-style: none;
}
table {/* tables still need 'cellspacing="0"' in the markup */
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	font-weight: normal;
	text-align: left;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
a img {
	border: 0;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

strong { font-weight:bold}
.marginb { margin-bottom: 7%; }

/*DEFINICOES GERAIS
**********************************************************/
body {color:#333; padding:0; font-family: 'Source Sans Pro', sans-serif; background:#FFF}

.container { width:1200px; margin:0 auto; padding:0 }

.left {text-align: left; }
.center {text-align: center; }

h1 { font-family: 'Roboto-Thin', sans-serif; font-size:2.5em !important; color:#cc0001;  }

h1::after {
	
	content: '';
    background-color: #cc0001;
    height: 4px;
    width: 15%;
	margin: 0 auto;
	margin-top:0.5%;
	margin-bottom:0.5%;
    display: block;
}
h2 { font-family: 'Roboto-Light', sans-serif; font-size:2.2em; color: #a6192e; margin: 5.5% 0 3.5% 0;}
h3 { font-family: 'Roboto-Light', sans-serif; font-size:2.2em; color: #a6192e;   }
h5 { font-family: 'Roboto-Light', sans-serif; font-size:1.8em; color: #a6192e; }

.branco { color: #FFFFFF; }

h5.topo {
    color: #000000;
	text-align: left;
	font-size:1.4em;
	line-height:1.5em;
}

h2::after, h3::after {
	content: '';
    background-color: #cc0001;
    height: 4px;
    width: 15%;
	margin: 0 auto;
	margin-top:0.5%;
	margin-bottom:0.5%;
    display: block;
}


h2.branco::after, h3.branco::after {
	content: '';
    background-color: #FFFFFF;
    height: 4px;
    width: 15%;
	margin: 0 auto;
	margin-top:0.5%;
	margin-bottom:0.5%;
    display: block;
}

p { font-size:16px; line-height:23px; letter-spacing:0.5px; margin:0 0 20px; text-align:justify}

html, body { margin:0; }
#ivete { 
	width: 100%;
	display: block;
	height: 100vh;
    min-height: 100%;
    background: url(./assets/topo.jpg) no-repeat center top;
    background-size: cover;
}
#ivete .container { height:100%; border:1px solid white;}


#ivete #box-1 { 
	display: inline-block;
    position: absolute;
    top: 55%;
    right: 18%;
    z-index: 1;
    width: 50%;
    /* min-height: auto; */
    margin: 3% 0 0 0;
}

#ivete #box-1 #texto { display:block; width:100%; float:left}
#ivete #box-1 #texto span {font-family: 'Roboto-Regular', sans-serif; font-size:18px; font-weight:bold; color:#FFF; width:260px; float:left; display:block; margin:27px 0 0 15px; text-align:right}

#ivete #box-1 #cadastrese { float:right; margin:20px 30px 0 0}
#ivete #box-1 #cadastrese a { background:#FFF; color:#A70101; border-radius:20px; font-size:28px; font-weight:900; padding:10px 20px; display:block; text-decoration:none}
#ivete #box-1 #cadastrese a:hover { background:#F1f1f1; color:#333;}

#ivete #box-1 .kitsHome  {
	display: inline-block;
    width: 100%;
    text-align: center;
}

#ivete #box-1 .kitsHome .kit a img {
	 width: 100%;
	 position: relative;
	 left: 90%;
}

#ivete #box-1 .kitsHome .kit  {

	width:100%;
}

#ivete #box-1 #deseje {
	text-align: center;
 } 

 #ivete #box-1 #deseje img {
	width:100%;
 } 

 #ivete #box-1 #frase{
	text-align:center;
	margin:0 0 5% 0;
 } 
 #ivete #box-1 #frase img{
	width:450px;
 } 



#ivete #box-1 #fim{ width:100%; text-align:center; margin:50px 0 0; display:block; float:left}

#ivete #box-1 #seta { width:100%; display:block; float:left; text-align:center; margin:35px 0 0}


#ivete #box-2 { display:inline-block; position:relative; z-index:10; vertical-align:bottom; }
#ivete #box-2 img{ vertical-align:bottom; display: table-cell; height:auto; }



#chatbot { position:fixed; top:0; left:0; z-index:9999}
#bgchat { width:100%; height:100%; background:#333; opacity:0.9; position:fixed; z-index:999}
#fecharchat { position:absolute; top:0; right:0; z-index:99999}

#pop { position:fixed; bottom:0; right:0; z-index:999}


/*HEADER
**********************************************************/
#header { width:100%; float:left; display:block; position: relative; left:0; top:0; z-index:99; background:#dcdcdc; }

#header #logo { margin:0px auto;}

#header #nav { float:left; margin:0 0 0 40px;  }
#header #nav li { float:left; margin:30px 0 0; }
#header #nav li a { font-family: 'Roboto-Bold', sans-serif; padding:0;font-size:18px; margin:0 30px;  text-decoration:none; color:#FFF;}
#header #nav li a:hover { color:#F1f1f1; border-bottom:3px solid #f1f1f1; text-decoration:none; }

#header #cadastrese { float:right; margin:20px 40px 0 0} 
#header #cadastrese a { background:#FFF; color:#A70101; border-radius:20px; font-size:18px; font-weight:900; padding:10px 20px; display:block; text-decoration:none}
#header #cadastrese a:hover { background:#F1f1f1; color:#333;}

#header #nav.menu-cel{ text-align:center; z-index:9999;}
#header #nav.menu-cel {  top:0; right:0; background:#FFF; width:60%; height:100%; margin:0; position:fixed; padding:10% 0 0; z-index:10000}
#header #nav.menu-cel li { text-align:center; margin:0 0 10px; padding:0 0 10px; border-bottom:1px solid #CCC; width:100%; float:left;}
#header #nav.menu-cel li:first-child {border-top:1px solid #CCC; margin:10px 0; padding:10px 0}
#header #nav.menu-cel li a { font-size:14px; color:#333; font-weight:700;}
#header #nav.menu-cel li a span {font-size:9px; line-height:9px; color:#707070}
#header #nav.menu-cel:before {content: ""; background: url(https://diamantesl.com/sitenovo/images/fechar.png) no-repeat; width:12px; height:15px; display:block; position:absolute; top:20px; right:10px}


/*DESTAQUE
**********************************************************/
#destaque {  height:660px; position:relative}
#destaque #bgdestaque { position: absolute; top: 0px; left: 0px; width: 50%; height: 100%; background: #470103 url(https://diamantesl.com/sitenovo/images/background-header.jpg) no-repeat top right;z-index: 1;}
#destaque .container { position:relative; z-index:2;}

#destaque #texto { float:left; margin:200px 0 0; display:block;}
#destaque h2 { font-size:75px; color:#FFF; font-weight:400;}
#destaque h2 strong{ font-weight:900}
#destaque p { color:#FFF; font-size:20px; margin:30px 0}
#destaque #botaocadastre { background:#FFF; color:#cc0001; font-size:18px; font-weight:900; padding:15px 20px; display:table}
#destaque #botaocadastre:hover { background:#333; color:#FFF}

#destaque #video { float:right; background:url(https://diamantesl.com/sitenovo/images/bg-video.png); width:782px; height:400px; margin:150px -20px 0 0}
#destaque #video iframe { margin:22px 0 0 14px;}


/*PORQUE
**********************************************************/
#porque { padding:120px 0; width:100%; display:block; float:left}
#porque #titulo { float:left; margin:70px 0 0}
#porque #titulo h3{ font-size:60px; font-weight:900; color:#cc0001}

#porque #texto { float:right; width:750px}


/*BENEFICIOS
**********************************************************/
#beneficios { 
	background-color: #ead5d9;
	padding: 7% 0;
	text-align: center;
}

#beneficios h2 {
    margin: 1% 0 3% 0;
}

#beneficios h3 { font-weight:900; color:#A70101; text-align:center; margin:0 0 40px}

#beneficios .cada_beneficios { 
	width:228px; 
	height:228px;  
	border-radius: 125px; 
	display: inline-block;
	margin:0 6px 12px; 
	background:#FFF; 
	text-align:center; 
	font-family: 'Roboto-Bold', sans-serif;
}

#beneficios .cada_beneficios #icon { margin:50px 0 20px;  }    
#beneficios .cada_beneficios h4 { font-size:19px; color:#444; padding:0 20px; 	font-family: 'Roboto-Bold', sans-serif;}

/*CTA *****************************************************/
.cta {	
	width: 100%;
    /*min-height: 400px;*/
    display: inline-block;
    text-align: center;
	padding: 3% 0;
	margin:2% 0 0 0;
    background: transparent url(/sejaconsultora/web/images/bg_beneficios.jpg)no-repeat 0 0;
    background-size: cover;
    background-attachment: fixed;
}
.cta a {
	vertical-align:middle;
}
.cta a img {
	width:100%;
	margin:2% 0;
}

/*BOTOES DENTRO DO FANCYBOX...*/
#kit_1_lista.fancybox-content a,
#kit_2_lista.fancybox-content a {
	margin: 5%;
    padding: 5% 5%;
    display: inline-block;
    float: right;
    color: #ffe5e5;
    background-color: red;
	border-radius: 20px;
	text-decoration: none;
}

.cta a.kits-descricao {
	font-size: 1em;
    color: white;
    font-weight: bolder;
    background-color: #AC1F23;
    padding: 5% 10%;
    border-radius: 30px;
    margin: 10% 0;
    display: inline-block;
    /* vertical-align: -webkit-baseline-middle; */
    /* min-height: 50px; */
    text-decoration: none;
}

.cta .i.fas {
	vertical-align: middle !important;
}

/*PASSO A PASSO
**********************************************************/
#passoapasso { padding:0; width:100%; display:block; float:left; text-align:center; background-color: whitesmoke;}
#passoapasso p { 
	text-align: center;
    width: 80%;
    margin: 0 auto;
    margin-bottom: 2%;
    color: #000;
	font-size: 0.9em;
	font-family: 'Roboto-Regular', sans-serif;
}
#passoapasso h3 { font-weight:900; color:#cc0001; text-align:center; margin:0 0 40px}

#passoapasso #texto { text-align:center}

#passoapasso .row.veveta {
	
    padding: 2% 0 2.5% 0;
}


#passoapasso .row.ivete img {
	/*border: 5px solid #cc0001;
    border-radius: 8px;
    /*width: 650px;*/
}

/* QUERO FALAR */
#passoapasso .row.queroFalar {
	background: #d1d1d1 url(https://diamantesl.com/sitenovo/images/ligar_agora.jpg) 0 50% no-repeat;
	height: 325px;
	padding: 5% 10%;
}

#passoapasso .row.colecoes {

	padding: 2% 0% 0% 0%;
}


/*DEPOIMENTO
**********************************************************/
#depoimento { background-color:#ffffff; width:100%; display:block; padding:20px 0; font-family: 'Roboto-Light', sans-serif; }
#depoimento .row.consultoras { 
	text-align: center;
	padding: 5% 0 2% 0;
	
}
#depoimento .row.consultoras h2 {
	
	width: 40%;
    margin: 0 auto;
}


#depoimento .cada_depoimento { width:20%; display: inline-block; margin:0 2%; vertical-align: text-top;}
#depoimento .cada_depoimento p { 
		text-align: center; 
		font-size: 1em; 
		font-family: 'Roboto-Thin', sans-serif;
		font-weight: 600;
		
}

#autor p {
	font-size: 1em !important;
    font-weight: bold !important;
    font-family: 'Roboto-Bold', sans-serif !important;
    color: #a6192e;
}

#texto p {
    font-weight: 600 !important;
    font-family: 'Roboto-Thin', sans-serif !important;
    color: #000;
}


#depoimento .cada_depoimento img { 
		width:230px; 
		border-radius:100%;
		vertical-align: text-top;
	
}


/* CATALOGOS */
#catalogos {margin:15% 0 5% 0%; }
#catalogos #colecoes { display: inline-block; width: 300px; padding:0.5% 3.5%}
#catalogos #colecoes img { width: 100%; height: auto; }
#catalogos #colecoes a { 	display: inline-block;
							width: 45%;
							border: 2px solid #948e9c;
							color: #777480;
							font-size: 1.1em;
							padding: 2% 1%;
							margin: 2% 0;
							border-radius: 5px; 
						
						}
#catalogos #colecoes a:hover { background-color: #C0C0C0; text-decoration:none}



/* FOOTER
**********************************************************/
#footer { background:#150f01; width:100%; display:block; float:left;  padding:30px 0; font-family: 'Roboto-Light', sans-serif; }

#footer #logo { float:left;}

#footer #info { float:left; margin:3% 0;}
#footer #info span { color:#FFF; font-size:19px; font-weight:300; margin:0 10px; float:left; display:block;}
#footer #info span img { float:left; margin:0 10px 0 0; }
#footer #info span a {
	color: #999999;
	font-family: 'Roboto-Light', sans-serif;
}

#footer #info span a:hover {
	color:whitesmoke;
}

#footer #redes { margin:10px 0 0 0; width: 250px;}
#footer #redes span { color: #999999; font-size:14px; font-weight:300; float:left; display:block; margin:15px 10px 0 0}
#footer #redes a { float: left; margin:0 0 0 5px; font-family: 'Roboto-Light', sans-serif;}
 


/* MIDDLE
**********************************************************/
#middle { min-height:600px; width:100%; float:left; display:block; padding:80px 0 40px 0}
#middle .container { width:540px}


/* BOX-FORM
**********************************************************/
#box-form { background:#FFF; box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.20); padding:50px;}

#box-form label { font-size:14px; display:block; margin:0 0 5px; font-weight:bold}
#box-form input[type=text],
#box-form input[type=tel] { width:418px; height:43px; padding:0 10px; border:1px solid #c5c5c5; margin:0 0 20px; font-family: 'Source Sans Pro', sans-serif; font-size:14px; color:#333}
#box-form select { width:436px; height:43px; padding:0 10px; border:1px solid #c5c5c5; margin:0 0 20px; font-family: 'Source Sans Pro', sans-serif; font-size:14px; color:#333}

/*btn pagamentos*/
a.btnPagamento {
	display:block;
	width:250px;
	margin:0 auto;
	background-color: #AC1F23;
	padding: 4%;
	border: 1px solid #d6191b;
	border-radius: 10px;
	margin-top: 5%;
	color:#FFFFFF;
	font-weight: bold;
}

a.btnPagamento:hover {
	
	color:#ff6600;
	
}


/*#pedidoform-cvc {}*/
.field-pedidoform-cvc { width:200px; float:left; margin:0}
.field-pedidoform-cvc input[type=tel] { width:200px !important;}

.field-pedidoform-nome,
.field-pedidoform-dataexpiracao { margin:0}

.field-pedidoform-nome { margin:0 0 35px !important;}

#box-form input[type=text]#celular { margin:0}
/*#box-form input[type=checkbox] { margin:5px 0 20px}*/
#box-form #whats { font-size:12px; display: unset;}

#box-form #botao { background:#cc0001; color:#FFF; font-size:14px; font-weight:900; padding:10px 15px; display:table; border:none; cursor:pointer}
#box-form #botao:hover { background:#333; color:#FFF}
#box-form .help-block-error, .error-summary { color: #cc0001 }

/* OBSERVACAO
**********************************************************/
#box-form .cada_obs { margin:0 0 40px;}
#box-form .cada_obs img { margin:0 0 10px; display:block; text-align:center}
#box-form  textarea#termo { height:160px; width:100%; margin:0 0 10px}
#box-form  #aceitatermo { font-size:14px}


/* KIT
**********************************************************/
#box-form .cada_kit { text-align:center; margin:0 0 40px; }
#box-form .cada_kit #imgkit { margin:0 0 10px; display:block; text-align:center; width:100%}
#box-form .cada_kit h6 { font-size:54px; color:#cc0001 !important; font-weight:900;}
#box-form .cada_kit span { display:block; font-size:16px;}
#box-form .cada_kit #jaquero { background:#cc0001; color:#FFF; font-size:24px; font-weight:900; padding:10px 15px; margin:10px 0 0; display:inline-block; border:none; cursor:pointer}
#box-form .cada_kit #jaquero:hover { background:#333; color:#FFF}
#box-form .cada_kit p { font-size:12px; text-align:center; display:inherit; line-height:12px; margin:20px 0 0}

#box-form span { text-align:center; display:inline-block; margin:0 0 10px}
#box-form #televendas {  background:#333; color:#FFF; padding:5px 10px; text-align:center; font-size:12px; font-weight:bold; display:inherit}


/* LOJA
**********************************************************/
#box-form .cada_loja { width:100%; padding:0 0 20px; margin:0 0 20px; text-align:left; float:left; display:block; border-bottom:1px solid #E5E5E5}
#box-form .cada_loja #texto { width:100%; float:right;}
#box-form .cada_loja #texto h3 { font-family: 'Playfair Display', serif; font-size:28px; color:#cc0001; font-weight:bold; margin:0 0 10px;}
#box-form .cada_loja #texto p { color:#646464; font-size:16px; text-align:left; line-height:20px}
#box-form .cada_loja #texto button { background:#cc0001; color:#FFF; font-size:12px; font-weight:900; padding:5px 10px; margin:0; display:inline-block; border:none; cursor:pointer}
#box-form .cada_loja #texto button:hover { background:#333; color:#FFF}


/* CATALOGO
**********************************************************/
.cada_catalogo { width:203px; display:inline-block; margin:0 0 30px 15px; padding:0 0 30px; border-bottom:1px solid #e5e5e5;}
.cada_catalogo img { width:100%}
.cada_catalogo h4 {font-family: 'Playfair Display', serif; font-size:16px; color:#12090A; margin:10px 0;}
.cada_catalogo a { display:block; float:left; background:#cc0001; color:#FFF; font-family: 'Playfair Display', serif; font-size:13px;  padding:5px 5px; margin:0 5px 0 0}
.cada_catalogo a:hover { background:#333; color:#FFF}

.cada_frete { width:100%; padding:0 0 20px; margin:0 0 20px; text-align:left; float:left; display:block; border-bottom:1px solid #E5E5E5}
.cada_frete input[type=radio] { float:left; margin:15px 20px 0 0}
.cada_frete img { float:left; margin:0 20px 0 0}
.cada_frete p { float:left; margin:0}


#box-form #pequeno { width:188px; float:left; margin:0 20px 10px 0}



table { 
	width: 100%; 
	border-collapse: collapse; 
}

/* Zebra striping */
tr:nth-of-type(odd) { 
	background: #FFF; 
	}

th { 
	background: #333; 
	color: white; 
	font-weight: bold; 
	}

td, th { 
	padding: 10px; 
	border: 1px solid #ccc; 
	text-align: left; 
	font-size: 12px;
	}

/* 
Max width before this PARTICULAR table gets nasty
This query will take effect for any screen smaller than 760px
and also iPads specifically.
*/
@media 
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {

	table { 
	  	width: 100%; 
	}

	/* Force table to not be like tables anymore */
	table, thead, tbody, th, td, tr { 
		display: block; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	tr { border: 1px solid #ccc; }
	
	td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding-left: 50%; 
		display:table;
	}

	td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
		/* Label the data */
		content: attr(data-column);

		color: #000;
		font-weight: bold;
	}

}

h1 {
	
    font-size: 1.8em;
}

h5.topo {

    font-size: 1.4em;
}

.row.queroFalar {
	background: #d1d1d1 url(..https://diamantesl.com/sitenovo/images/ligar_agora.jpg) 5% 50% no-repeat !important;
    height: 325px;
    padding: 20% 10% !important;
}
.row.queroFalar h5 {
	font-size: 1.2em;
	text-shadow: 0px 0px 5px #fff;
}

#depoimento .row.consultoras h2 {
	width: 80%;
	padding:0 0 1% 0;
}

#menumobile #bgtotal { display:none}
.menu-mobile,
#menumobile { display:none}

/* NOTEBOOK 1366PX = 14" */

@media all and (min-width:1100px) {

	.row.queroFalar {
		height: 325px;
		padding: 5% 5% !important;
		background: #d1d1d1 url(https://diamantesl.com/sitenovo/images/ligar_agora.jpg) 0% 50% no-repeat !important;
	}	

	.row.queroFalar h5 {
		font-size: 1.8em;
		text-shadow: 0px 0px 5px #FFF;
	}

	#beneficios .cada_beneficios {
		width: 200px;
		height: 200px;
		border-radius: 125px;
		display: inline-block;
		/* float: left; */
		margin: 0 6px 12px;
		background: #FFF;
		text-align: center;
		font-family: 'Roboto-Bold', sans-serif;
	}

	#beneficios .cada_beneficios h4 {
		font-size: 1em;

	}

	#beneficios h2 {
		margin: 5% 0 5% 0;
	}

}

/* MOBILE */
@media only screen and (min-width: 280px) and (max-width: 736px) {
#catalogos #colecoes {
    display: inline-block;
    width: 250px;
    padding: 4.5% 3.5%;
}
	
#menumobile { display: block; float:right; margin:0 0 0; cursor:pointer; z-index:9999}
.small .menu-mobile { margin:17px 0 0}
.menu-cel { display: block !important;}

#menumobile #bgtotal { background:#333; opacity:0.5; position:fixed; width:100%; height:100%; top:0; left:0; z-index:999; }
.menu-cel{
-webkit-animation-name: showMenu;
animation-name: showMenu;
-webkit-animation-duration: .500s;
animation-duration: .500s;
}

@-webkit-keyframes showMenu {
from { right: -70%; }
to { right: 0; }
}
@keyframes showMenu {
from { right: -70%; }
to { right: 0; }
}

.container { width:94% !important; padding:0 2%}

/*HEADER
**********************************************************/
#header { width:100% !important}
#header #logo { float:left; margin:0px 0 0}

#header .container { padding:20px 3%}

#header #cadastrese { float:right; margin:10px 0 0 0} 
#header #cadastrese a { background:#cc0001; color:#FFF; font-size:14px; font-weight:900; padding:10px 15px; display:block;}

#header #nav { display:none;}

#header #menumobile { float:right; border:0.5px solid #999; border-radius:5px; padding:0 8px 0 0;}
#header #menumobile a { font-weight:600; font-size:12px; padding:8px 33px 8px 8px; background:url(https://diamantesl.com/sitenovo/images/menu.png) no-repeat right; display:block}
#header #menumobile:hover { border-color:#9D3E49}
#header #menumobile:hover a { color:#9D3E49}


/*DESTAQUE
**********************************************************/
#destaque {  min-height:660px;}
#destaque #bgdestaque { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background: #470103 url(https://diamantesl.com/sitenovo/images/background-header.jpg) no-repeat top right;z-index: 1;}

#destaque #texto { float:left; margin:130px 0 0; display:block;}
#destaque h2 { font-size:60px; color:#FFF; font-weight:400;}

#destaque #video { float:left; background:none; width:100%; height:auto; margin:40px 0 0 0}
#destaque #video iframe { margin:0; width:100% !important; height:auto !important; min-height:190px}


/*PORQUE
**********************************************************/
#porque { padding:60px 0; width:100%; display:block; float:left;}
#porque #titulo { float:left; margin:0 0 40px; }
#porque #titulo h3{ font-size:50px; font-weight:900; color:#cc0001;}

#porque #texto { float:right; width:100%;}


/*BENEFICIOS
**********************************************************/
#beneficios h3 { font-size:50px; }

#beneficios .cada_beneficios { width:46%; height:228px; margin:0 6px 12px; background:#FFF; }
#beneficios .cada_beneficios h4 { font-size:16px; font-weight:900; color:#444; padding:0 20px}
#beneficios .cada_beneficios img { width:auto; }

.cta {
	padding:1% 0;
	background-color:whitesmoke;
	background-image: none;
}
/*CTA */
.cta a img {
	width:65%;
	margin:2% 0;
}

.cta ul {
	margin-top:2%;
	margin-bottom:2%;
}


.cta ul li {
	font-size: 1.2em;
}

.cta ul li em {
	color: red;
}

.cta a.kits-descricao {
	margin:2%;
}
.cta #kit_1_lista a.link-kit {
	background-color: #cc0001;    padding: 4%;    margin: 0% 0;    float: right;    color: white;    border-radius: 15px;
}
.cta #kit_2_lista a.link-kit {
	background-color: #cc0001;    padding: 4%;    margin: 0% 0;    float: right;    color: white;    border-radius: 15px;
}


/*PASSO A PASSO
**********************************************************/
#passoapasso { padding:0px 0; }
#passoapasso #titulo { margin:0 0 10px }
#passoapasso #titulo h3{ font-size:50px; font-weight:900; color:#cc0001}

#passoapasso #texto { float:right; width:100%}

#passoapasso img { 
    width: 100%;
    margin: 0% 0;
}

#passoapasso #footer img {
    width: auto;
    margin: 2% 0;
}

#passoapasso img.video, #passoapasso img.video2 { 
	width: 100%;
	margin: 0;
}
/*DEPOIMENTO
**********************************************************/
#depoimento {   padding:60px 0}
#depoimento .consultoras div h2 { 

    text-align: center;
    margin: 2% 0 2% 0;


}
#depoimento .cada_depoimento { float:left; width:100%; margin:0 0 20px; padding:0 0 20px; border-bottom:1px solid #CCC}
#depoimento .cada_depoimento IMG { margin:0 10px 0 0}
#depoimento .cada_depoimento p {
  
    display: inline-block;
}


/* FOOTER
**********************************************************/
#footer { background:#070803; width:100%; display:block; float:left;  padding:30px 0;}

#footer #logo { float:left;}

#footer #info { text-align:left; margin:30px 0 0}
#footer #info span { color:#FFF; font-size:19px; font-weight:300; margin:0 0 20px; float:left; display:block; width:100%}
#footer #info span img { float:left; margin:0 10px 0 0}

#footer #redes { float:left; margin:0}
#footer #redes span { color:#FFF; font-size:14px; font-weight:300; float:left; display:block; margin:15px 10px 0 0}
#footer #redes a { float: left; margin:0 0 0 5px}


/* MIDDLE
**********************************************************/
#middle { width:100%; padding:150px 0 40px 0}


/* BOX-FORM
**********************************************************/
#box-form {  padding:30px;}
#box-form input[type=text],
#box-form select  { width:93%; }

#box-form input[type=tel] { width:100%}

#box-form img { width:100%}

.input-group { width:100% !important}


img#imgdetres { width:70px !important; height:42px !important; margin:-25px 0 25px !important }


html, body { margin:0; height:auto; position:relative}
#ivete {
	width: 100%;
    height: 520px;
    background: url(./assets/topo_mobile.jpg) no-repeat center top;
    background-size: auto;
}
#ivete .container { height:auto}


#ivete #box-1 { 
	
    right: 0;
    z-index: 1000;
    width: 100%;
    text-align: center;
}
#ivete #box-1 #deseje  { width: 60%; float: right;}
#ivete #box-1 #deseje img { width:100% }
#ivete #box-1 #frase { display:none;}

#ivete #box-1 .kitsHome {
    width:100%;
}

#ivete #box-1 .kitsHome .kit-texto p {

    text-align:right;


}

#ivete #box-1 .kitsHome .kit {
    margin: 2% 2%;
    width: 100%;
    float: right;
}

#ivete #box-1 .kitsHome .kit a.btn { 
	padding: 25% 10% 0 15%;
    position: relative;
    right: 25%;
}

#ivete #box-1 .kitsHome .kit a img {
    width:100%;
}

#ivete #box-1 #texto { display:block; width:100%; float:left}
#ivete #box-1 #texto span { font-size:18px; font-weight:bold; color:#FFF; width:100%; float:none; display:block; margin:27px 0 0 0; text-align:center}

#ivete #box-1 #cadastrese { float:none; margin:20px auto 0; width:190px;}
#ivete #box-1 #cadastrese a { background:#FFF; color:#A70101; border-radius:20px; font-size:28px; font-weight:900; padding:10px 20px; display:block; text-decoration:none}
#ivete #box-1 #cadastrese a:hover { background:#F1f1f1; color:#333;}

#ivete #box-1 #fim{ width:100%; text-align:center; margin:50px 0 0; display:block; float:left}

#ivete #box-1 #seta { width:100%; display:block; float:left; text-align:center; margin:50px 0 0}

#ivete #box-2 { z-index: 1000; left: -40%; }
#ivete #box-2 img{ vertical-align:bottom; display: table-cell; height:100%; width:100%}

#chatbot { position:fixed; top:0; left:0; z-index:9999; width:100%}
#bgchat { width:100%; height:100%; background:#333; opacity:0.9; position:fixed; z-index:999}
#fecharchat { position:absolute; top:0; right:0; z-index:99999}

#pop { position:fixed; bottom:0; right:0; z-index:999; width:30%}
#pop img { width:100%}

}

@media screen and (min-width: 1500px) {
	#ivete {
		min-height: 648px;
	}
	#ivete #box-1 { 
	
		right: 10%;
		
	}
}

@media screen and (min-width: 1900px) {
	#ivete #box-1 { 
		
		right: 10%;
		top:70%;
		
	}
}


#bgchat{ display:none}
#chatbot { display:none}

.kitsHome {
    display: inline-block;
    width:100%;
    text-align:center;
}

.kit {
    display: inline-block;  
}

.kit-texto p {
    font-size: 1em;
    /* line-height: 23px; */
    letter-spacing: 0.5px;
    margin: 0 5%;
    /* text-align: justify; */
    text-align: center;
    color: whitesmoke;

}

.kit img {
    /*border-radius: 15px;*/
}

.kit a.btn {
	/*background-color: #df0024;*/
    padding: 2.5% 8%;
    /*border-radius: 20px;*/
    color: #FFF;
    font-size: 1.4em;
    font-family: 'Roboto-Bold', sans-serif;
}


#galeria {
    margin: 2% 0 0 0;
}

#galeria h2 {
    margin:4% 0 3% 0;
}

#galeria a img {
    margin:.5% 0 0 0;
}
.video {
    width:450px;
}

/*NECESSARIO ITENS*/

#necessarios {
    background-color: #a6192e; 
    text-align: center; 
    padding:5% 0;
}
   
#necessarios .itens {
	padding:2%;
}

#necessarios .itens ul {
    list-style:none;
	text-decoration: none;
}

#necessarios .itens ul li {
    display: inline-block;
    vertical-align:middle;
	margin: 1%;
	width: 30%;
}

#necessarios .itens ul li h6 {
    width: 75%;
    margin: 0 auto;
    font-family: 'Roboto-Bold', sans-serif;
    font-size: 1.1em;
    color: #ffffff;
}

#necessarios .itens ul li img {
    width: 50%;
    height: auto;
}

.ctaPadrao {
    text-align: center;
}

.ctaPadrao .btn {
    background-color: #a6192e;
    padding: 2.5% 4%;
    margin: 5% 0% 5% 0%;
    border-radius: 50px;
    color: #FFF;
    font-family: 'Roboto-Bold', sans-serif;
    font-size: 1.4em;
    box-shadow: 0px 0px 10px #484848;
}

.ctaPadrao .btn:hover {
    background: none;
    border:1px solid #a6192e;
    color: #a6192e;
}

.ctaPadrao .btn.branco {
    background-color: #FFFFFF;
    color: #A6192E;
    box-shadow: 0px 0px 10px #dddddd;
   

}

.ctaPadrao .btn.branco.plus-2 {
    padding:10%;
}

.ctaPadrao .btn.branco:hover {
    background:none;
    border:1px solid #FFFFFF;
    color: #FFFFFF;
    

}


@media all and(max-width: 500px) {
    
    .kitsHome {
        width: 100%;
        margin: 0 auto;
        text-align: center;
        /* margin: 0% 6%; */
    }

    .kit a.btn {
        
        padding: 5% 15%;
 
    }

    #necessarios .itens ul li img {
        width: 80%;
    }

    h5.topo {
        text-align: center;
    }

}