 
/* ---- isdesign.com.br ---- */



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

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, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside,
canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time,
mark, audio, button, video { padding:0; border:none; margin:0; font:inherit; font-size:100%; vertical-align:baseline; }
article, aside, button, details, figcaption, figure, footer, header, hgroup, menu, main, nav, section { display:block; }

html { width:100%; overflow-x:hidden; font-size:100%; line-height:1; }
body {
	width:100%; min-width:320px;
	color:rgba(0,0,0,0.60); font-family:"Helvetica Neue", Arial, sans-serif; font-size:14px; line-height:1;
	text-align:left; word-wrap:break-word; -ms-text-size-adjust:100%; -webkit-text-size-adjust:100%;
}

a { color:#4c758a; }
img { vertical-align:bottom; }

blockquote:before, blockquote:after, q:before, q:after { content:""; content:none; }
blockquote, q { quotes:none; }

ul { list-style:disc; }
ol { list-style:decimal; }
li { margin-left:32px; }
li + li { margin-top:8px; }
em { font-style:italic; }
strong { font-weight:bold; }
u { text-decoration:underline; }

button { background:none; color:#4c758a; cursor:pointer; }
button:active, button:focus { box-shadow:none; outline:none; }



input, select, textarea {
	padding:0; border:none; margin:0; display:block;
	color:rgba(0,0,0,0.60); font-family:"Helvetica Neue", Arial, sans-serif; font-size:14px; line-height:1; text-align:left;
	background:none; outline:none; -webkit-appearance:none; -moz-appearance:none; appearance:none;
}
textarea { resize:none; }

input:-webkit-autofill, input:-moz-autofill, input:autofill {
	color:rgba(0,0,0,0.60) !important; -webkit-text-fill-color:rgba(0,0,0,0.60) !important;
	background:#f5f5f5 !important; transition:none;
}
input:invalid, input:required, input:required:invalid { box-shadow:none; outline:none; }



@font-face {
	font-family:"Material Icons Round"; font-style:normal; font-weight:400;
	src:url("../../fonts/Material-Icons-Round.woff2") format("woff2");
}



/* ---- Gerais ---- */



.wrap { max-width:1280px; margin-left:auto; margin-right:auto; }
.wrap-m { max-width:960px; }
.wrap-p { max-width:640px; }

.divisor { height:1px; overflow:hidden; }
.divisor-branco { background:rgba(255,255,255,0.12); }
.divisor-preto { background:rgba(0,0,0,0.12); }



.padding { padding:64px 24px; }

@media all and (min-width:960px) {
	.padding { padding:96px 24px; }
}



.texto-h1, .texto-h2,
.texto-h3, .texto-h4 { color:#6298b4; font-weight:bold; line-height:1; letter-spacing:-1px; }

.texto-h1 { color:#375765; font-size:32px; }
.texto-h2 { font-size:24px; }
.texto-h3 { font-size:20px; }
.texto-h4 { font-size:16px; }

.texto-corpo { color:rgba(0,0,0,0.60); font-size:14px; line-height:20px; }
.texto-legenda { color:rgba(0,0,0,0.38); font-size:12px; line-height:16px; }



.box { position:relative; border-radius:8px; box-shadow:0 0 0 1px rgba(0,0,0,0.12); }

.container { width:100%; height:0; padding-bottom:100%; overflow:hidden; position:relative; }
.position { width:100%; height:100%; position:absolute; top:0; left:0; object-position:center; object-fit:cover; }

.clear-both::after { content:""; width:100%; height:0; clear:both; display:block; overflow:hidden; }
.display-flex { display:flex; align-items:center; justify-content:flex-start; }



.botao {
	height:36px; padding:7px 15px; border:1px solid rgba(76,117,138,0.5); display:inline-block;
	color:#4c758a; font-size:14px; line-height:20px; text-decoration:none;
	background:#fff; border-radius:4px; transition:color 0.2s, background 0.2s, transform 0.2s;
}
.botao:hover { color:#fff; background:#4c758a; }
.botao:active { transform:scale(0.95); }



.tags { margin:-4px; flex-wrap:wrap; }
.tags-spacer { padding:4px; }
.tags-item {
	height:36px; padding:7px 15px; border:1px solid #dbb750;
	color:#dbb750; font-size:14px; line-height:20px;
	background:#fff; border-radius:18px;
}



.mi, .mib::before, .mia::after {
	display:inline-block; overflow:hidden; -moz-font-feature-settings:"liga"; -moz-osx-font-smoothing:grayscale;
	direction:ltr; font-family:"Material Icons Round"; font-size:24px; font-style:normal; font-weight:normal;
	letter-spacing:normal; line-height:1; text-transform:none; white-space:nowrap; word-wrap:normal;
}



/* ---- Efeitos ---- */



@media (hover: hover) {
	.hover-background { transition:background 0.2s; }
	.hover-background:hover { background:rgba(0,0,0,0.06); }
	.hover-background:active { background:rgba(0,0,0,0.12); }

	.hover-opacity { transition:opacity 0.2s; }
	.hover-opacity:hover { opacity:0.7; }
	.hover-opacity:active { opacity:0.5; }
}



.fx-denied { animation:fx-denied 0.6s cubic-bezier(0.36,0.07,0.19,0.97) both; }

@keyframes fx-denied {
	10%, 90% { transform:translate3d(-1px,0,0); }
	20%, 80% { transform:translate3d(2px,0,0); }
	30%, 50%, 70% { transform:translate3d(-4px,0,0); }
	40%, 60% { transform:translate3d(4px,0,0); }
}



.fx-loader { position:relative; }
.fx-loader::before {
	width:100%; height:100%; display:block; position:absolute; z-index:9990;
	background:inherit; opacity:0.5; content:"";
}
.fx-loader::after  {
	width:48px; height:48px; display:block; position:absolute; top:calc(50% - 24px); left:calc(50% - 24px); z-index:9999;
	background:#fff url("../../img/icone-loader.svg") no-repeat center / 40px;
	border-radius:50%; box-shadow:0 0 16px 0 rgba(0,0,0,0.16); animation:fx-loader 0.6s linear infinite; content:"";
}

@keyframes fx-loader {
	from { transform:none; }
	to { transform:rotate(360deg); }
}



/* ---- Topo ---- */



.topo { background:#375765; }
.topo-wrap { padding:18px 24px; flex-wrap:wrap; }

.topo-logo {
	width:156px; height:52px; padding:8px; margin:-8px;
	display:block; transition:opacity 0.2s, transform 0.2s;
}
.topo-logo:hover { opacity:0.7; }
.topo-logo:active { transform:scale(0.95); }

.topo-mobile {
	padding:7px 7px 7px 11px; border:1px solid rgba(255,255,255,0.5); margin-left:auto;
	color:#fff; font-size:14px; font-weight:bold; line-height:1; text-transform:uppercase;
	background:transparent; border-radius:4px; transition:color 0.2s, background 0.2s, transform 0.2s;
}
.topo-mobile::after {
	width:20px; height:20px; margin-left:8px; display:block;
	color:rgba(255,255,255,0.7); font-size:20px;
	content:attr(data-icone); transition:color 0.2s;
}
.topo-mobile:hover { color:#375765; background:#fff; }
.topo-mobile:hover::after { color:#375765; }
.topo-mobile:active { transform:scale(0.95); }

.topo-container {
	width:100%; padding-top:16px;
	border-top:1px solid rgba(255,255,255,0.12); margin-top:24px;
	display:none; flex-wrap:wrap;
}
.topo-container.ativo { display:flex; }



.topo-menu { width:100%; padding:16px 0 8px; flex-wrap:wrap; }
.topo-menu-container { width:100%; }

.topo-menu-botao {
	width:100%; padding:16px; justify-content:center;
	color:#fff; font-size:16px; font-weight:bold; line-height:24px; text-transform:uppercase;
	transition:opacity 0.2s, transform 0.2s;
}
.topo-menu-botao::after {
	width:24px; height:24px; margin:0 -16px 0 8px; display:block;
	color:rgba(255,255,255,0.7); content:"arrow_drop_down"; transition:transform 0.2s;
}
.topo-menu-botao:hover { opacity:0.7; }
.topo-menu-botao:active { opacity:0.5; }

.topo-menu-link {
	width:100%; padding:16px; display:block;
	color:#fff; font-size:16px; font-weight:bold; line-height:24px;
	text-align:center; text-decoration:none; text-transform:uppercase;
	transition:opacity 0.2s, transform 0.2s;
}
.topo-menu-link:hover { opacity:0.7; }
.topo-menu-link:active { opacity:0.5; }

.topo-submenu {
	width:256px; padding:16px; margin:8px auto 16px; display:none; position:relative;
	background:#4c758a; border-radius:8px;
}
.topo-submenu::before {
	content:""; display:block; position:absolute; top:-8px; left:calc(50% - 8px);
	border-right:8px solid transparent; border-bottom:8px solid #4c758a; border-left:8px solid transparent;
}
.topo-submenu-link {
	width:100%; padding:8px; display:block;
	color:#fff; font-size:14px; line-height:20px; text-align:center; text-decoration:none;
	transition:opacity 0.2s;
}
.topo-submenu-link:hover { opacity:0.7; }
.topo-submenu-link:active { opacity:0.5; }

.topo-menu-container.ativo .topo-menu-botao::after { transform:rotate(180deg); }
.topo-menu-container.ativo .topo-submenu { display:block; }



@media all and (min-width:720px) {
	.topo-overlay::after {
		width:100%; height:100%; display:block; position:absolute; top:0; left:0; z-index:990;
		content:"";
	}



	.topo { position:relative; z-index:999; }
	.topo-wrap { padding:22px 24px; flex-wrap:nowrap; }
	.topo-logo { width:142px; height:48px; }
	.topo-mobile { display:none; }

	.topo-container {
		width:calc(100% - 144px); padding-top:0; border-top:none; margin:0 -8px 0 auto;
		display:flex; align-items:center; justify-content:flex-end;
	}



	.topo-menu { width:auto; padding:0; margin-left:auto; }
	.topo-menu-container { width:auto; position:relative; }
	.topo-menu-botao { width:auto; padding:8px; font-size:12px; line-height:16px; }
	.topo-menu-botao::after { width:16px; height:16px; margin:0 -8px 0 4px; font-size:16px; }
	.topo-menu-link { width:auto; padding:8px; font-size:12px; line-height:16px; }

	.topo-submenu { width:192px; position:absolute; top:100%; left:calc(50% - 96px); }
	.topo-submenu-link { font-size:12px; line-height:16px; }
}
@media all and (min-width:960px) {
	.topo-wrap { padding:20px 24px; flex-wrap:nowrap; }
	.topo-logo { width:204px; height:64px; }

	.topo-container { width:calc(100% - 208px); }



	.topo-menu-botao { padding:18px 16px; font-size:14px; line-height:20px; }
	.topo-menu-botao::after { width:20px; height:20px; margin:0 -12px 0 6px; font-size:20px; }
	.topo-menu-link { padding:18px 16px; font-size:14px; line-height:20px; }

	.topo-submenu-link { font-size:14px; line-height:20px; }
}
@media all and (min-width:1280px) {
	.topo-container { margin-right:-16px; }



	.topo-menu-botao { padding:16px; font-size:16px; line-height:24px; }
	.topo-menu-botao::after { width:24px; height:24px; margin:0 -16px 0 8px; font-size:24px; }
	.topo-menu-link { padding:16px; font-size:16px; line-height:24px; }

	.topo-submenu { width:256px; left:calc(50% - 128px); }
	.topo-submenu-link { font-size:16px; line-height:24px; }
}



/* ---- Newsletter ---- */



.news { background:#4c758a; }
.news-wrap { padding:48px 32px; flex-wrap:wrap; align-items:flex-start; }

.news-texto { width:100%; }
.news-texto-titulo { color:#fff; font-weight:bold; }
.news-texto-legenda { margin-top:8px; color:rgba(255,255,255,0.5); }

.news-form { width:100%; padding-top:24px; }
.news-form-wrap { width:100%; flex-wrap:wrap; background:#4c758a; }
.news-form-container { width:100%; margin-bottom:16px; display:block; }

.news-form-label { color:rgba(255,255,255,0.7); font-size:12px; line-height:16px; }
.news-form-input {
	width:100%; min-height:36px; margin-top:4px; padding:8px 16px;
	color:rgba(0,0,0,0.60); font-size:14px; line-height:20px;
	background-color:#fff; border-radius:4px; transition:color 0.2s;
}
.news-form-input:focus,
.news-form-input:hover { color:rgba(0,0,0,0.87); }
.news-form-input:invalid { box-shadow:none; outline:none; }
.news-form-input::placeholder { color:rgba(0,0,0,0.38); opacity:1; }
.news-form-input-error { color:#e74c3c; }

.news-form-check { overflow:hidden; position:relative; cursor:pointer; }
.news-form-check-input {
	width:0; height:0; display:none; overflow:hidden;
	position:absolute; top:100%; left:100%; visibility:none;
}
.news-form-check-texto { color:rgba(0,0,0,0.60); font-size:14px; line-height:20px; transition:color 0.2s; }
.news-form-check-texto::before {
	width:20px; height:20px; margin:0 8px 0 -8px; flex-shrink:0;
	color:rgba(0,0,0,0.38); font-size:20px; line-height:1; transition:color 0.2s;
}

input[type=checkbox] + .news-form-check-texto::before { content:"check_box_outline_blank"; }
input[type=checkbox]:checked + .news-form-check-texto::before { content:"check_box"; }

.news-form-input:hover .news-form-check-texto { color:rgba(0,0,0,0.87); }
.news-form-input:hover .news-form-check-texto::before { color:rgba(0,0,0,0.60); }
.news-form-input-error .news-form-check-texto { color:#e74c3c; }
.news-form-input-error .news-form-check-texto::before { color:#e74c3c; }

.news-form-aviso {
	width:100%; padding:8px 16px; margin-bottom:16px; display:none;
	color:#fff; font-size:14px; line-height:20px;
	background:#000; border-radius:4px;
}
.news-form-aviso-error { display:flex; background-color:#e74c3c; }
.news-form-aviso-correct { display:flex; background-color:#2ecc71; }

.news-form-aviso::before {
	width:20px; height:20px; margin:0 8px 0 -4px; flex-shrink:0;
	color:rgba(255,255,255,0.5); font-size:20px; line-height:1;
}
.news-form-aviso-error::before { content:"error"; }
.news-form-aviso-correct::before { content:"check_circle"; }

.news-form-botao {
	width:96px; padding:7px 15px; border:1px solid rgba(255,255,255,0.5); display:block;
	color:#fff; font-size:14px; line-height:20px; text-align:center;
	background:#4c758a; border-radius:4px; transition:color 0.2s, background 0.2s, transform 0.2s;
}
.news-form-botao:hover { color:#4c758a; background:#fff; }
.news-form-botao:active { transform:scale(0.95); }

@media all and (min-width:720px) {
	.news-wrap { padding:48px 24px; }
	.news-texto { width:33%; }
	.news-form { width:67%; padding:0 0 0 24px; }
}
@media all and (min-width:960px) {
	.news-texto { width:25%; }
	.news-form { width:75%; padding:0 0 0 32px; }

	.news-form-wrap { width:calc(100% + 8px); margin-right:-8px; }
	.news-form-container { width:calc(50% - 56px); margin:0 8px 0 0; }
	.news-form-aviso { width:100%; margin-right:0; margin-bottom:8px; }
	.news-form-botao { margin-top:20px; }
}



/* ---- Rodapé ---- */



.rodape { background:#375765; }
.rodape-menu { padding:32px 24px; align-items:flex-start; flex-wrap:wrap; }
.rodape-menu-coluna { width:100%; padding:16px 8px; }
.rodape-menu-logo { width:140px; height:36px; margin-bottom:16px; display:block; }

.rodape-menu-titulo { color:#fff; font-weight:bold; }
.rodape-menu-link { margin-top:16px; display:block; color:rgba(255,255,255,0.7); text-decoration:none; }
.rodape-menu-link + .rodape-menu-link { margin-top:8px; }

.rodape-menu-botao { width:100%; margin-top:16px; text-decoration:none; }
.rodape-menu-botao-icone {
	width:16px; height:16px; margin-right:8px; flex-shrink:0;
	color:#fff; font-size:16px; opacity:0.5;
}
.rodape-menu-botao-texto { color:rgba(255,255,255,0.7); }

.rodape-creditos { padding:32px; flex-wrap:wrap; }
.rodape-creditos-texto { width:100%; color:rgba(255,255,255,0.5); }
.rodape-creditos-logo { width:44px; height:24px; display:block; margin-top:16px; }

@media all and (min-width:480px) {
	.rodape-menu-coluna { width:50%; }
	.rodape-menu-logo { margin-bottom:0; }
}
@media all and (min-width:720px) {
	.rodape-menu { padding:32px 16px; }
	.rodape-menu-coluna { width:25%; }

	.rodape-creditos { padding:24px; }
	.rodape-creditos-texto { width:75%; }
	.rodape-creditos-logo { margin:0 0 0 auto; }
}



.whatsapp {
	width:52px; height:52px; padding:8px;
	position:fixed; right:9px; bottom:9px;
	background:#25d366; border-radius:50%;
	transition:opacity 0.2s;
}
.whatsapp:hover { opacity:0.7; }



/* ---- contato@isdesign.com.br ---- */
