@charset "UTF-8";

@viewport {
	width: auto;
}

@media all {
	#google_translate_element, .goog-te-banner-frame, .goog-te-balloon-frame, #goog-gt-tt, 
	.goog-te-balloon-frame, .goog-tooltip, .goog-tooltip:hover {
        display: none !important;
    }
	* {
		box-sizing: border-box;
	}
	.col-0 {display: none !important;}
	.col-1 {width: 8.33%;}
	.col-2 {width: 16.66%;}
	.col-3 {width: 25%;}
	.col-4 {width: 33.33%;}
	.col-5 {width: 41.66%;}
	.col-6 {width: 50%;}
	.col-7 {width: 58.33%;}
	.col-8 {width: 66.66%;}
	.col-9 {width: 75%;}
	.col-10 {width: 83.33%;}
	.col-11 {width: 91.66%;}
	.col-12 {width: 100%;}

	[class*="col-"] {
		float: left;
		padding: 0;
		vertical-align: top;
		height: 100%;
		min-height: 1vh;
		/* border: 0.15vh solid rgb(255, 180, 180); /* TEMP */
	}
	.row::after {
		content: "";
		clear: both;
		display: table;
	}
	html {
		width: 100%;
		height: 100%;
		font-size: 17px;
		font-family: 'Open Sans', Arial, Helvetica, sans-serif;		
	}
	body {
		margin: 0 auto;
		padding: 0;
		top: 0 !important;
		width: 100%;
		height: 100%;
	}
	.desktop {
		display: block;
	}
	li.desktop {
		display: inline-block;
	}
	.mobile {
		display: none !important;
	}
	h1, h2, h3, h4, h5, h6 {
		margin: 0;
		padding: 0;
		text-transform: none;
		font-weight: normal;
		font-size: 1rem;
	}
	a,  
	a:link, 
	a:visited, 
	a:active {
		text-decoration: none;	
		color: unset;
	}
 	a:hover {
		color: unset !important;
	}
	b {
		color: #505050 !important;;
	}
	video {
		max-width: 100%;
		border: none;
		border-radius: 0;
	}
	img {
		border: none;
		max-width: 100%;
		height: auto;
		max-height: 100%;
	}
	ul {
		margin: 0;
		padding: 0;
		list-style: none;
		text-align: center;
		font-size: 0;
	}
	ol {
		list-style: disc;
	}
	ul li {
		display: inline-block;
		text-align:center;
		font-size: 1rem;
		vertical-align: middle;
		/* border: 0.15vh solid rgb(123, 255, 167); /* TEMP */
	}
	hr {
		border: 0.15vh solid #DCDCDC;
		clear: both;
	}
	iframe {
		border: none;
	}
	select {
		white-space: nowrap;
	}
	main {
		margin: 11vh auto;
		width: 100%;
		min-height: 40vh;
	}
	main.interno {
		margin-top: 15vh;
	}
	.center {
		text-align: center !important;
	}
	.left {
		text-align: left !important;
	}
	.right {
		text-align: right !important;
	}
	.top {
		vertical-align: top;
	}
	.middle {
		vertical-align: middle;
	}
	.bottom {
		vertical-align: bottom;
	}
	.menu_bg {
		z-index: 5;
		position: fixed;
		top: 0;
		width: 100%;
		height: auto;
		/* height: 11vh;*/
		background-color: white;
		/*background: linear-gradient(to bottom, rgba(255,255,255,1), rgba(255,255,255,0.9));*/
		box-shadow: 0 1vh 2vh 0 rgba(0, 0, 0, 0.3);
		/*border-bottom: 0.15vh solid #DDDDDD;*/	
	}
	.pre-menu {
		margin: 0 auto;
		display: block;
		height: 3vh;
		line-height: 3vh;
		background-color: #020430;
		transition: height .5s ease;
	}
	.pre-menu li {
		font-size: 0.7rem;
	}
	.pre-menu .links li {
		padding-left: 5vh;
		text-align: right;
	}
	.pre-menu a {
		color: white !important;
	}
	.pre-menu #idioma li {
        padding-right: 2vh;
		text-align: left;
	}
	.pre-menu #idioma li img {
		vertical-align: middle !important;
		width: 2vh;
	}
	.menup {
		display: none;
	}
	.menu {
		margin: 0 auto;
		display: block;
		width: 100%;
		height: 8vh;
		line-height: 8vh;
		text-transform: uppercase;
		background-color: white;
		color: #505050;
		transition: height .5s ease;
	}
	.menu li {
		width: 20%;
		/* height: 100%;*/
		font-size: 0.8rem;
	}
	.menu li:hover {
		background-color: #E6E7E8;
	}
	.menu li > a {
		display: block;
		width: 100%;
		height: 100%;
	}
	.menu .menu-logo {
		height: 80%;
		max-height: 80%;
		transition: all .5s linear;
	}
	.menu .dropdown {
		position: relative;
		display: inline-block;
	}
	.menu .dropbtn {
		cursor: pointer;
		transition: height .5s ease;
	}
	.menu .dropdown-content {
		z-index: 5;
		position: absolute;
		display: none;
		min-width: 100%;
		max-width: 200%;
		background-color: #020430;
		box-shadow: 0 0.8vh 1.8vh 0 rgba(0,0,0,0.5);
	}
	.menu .dropdown-content a {
		padding: 0 2vh;
		display: block;
		color: white;
		line-height: 4vh;
		text-transform: none;
		text-align: left;
		text-overflow: ellipsis;
		overflow: hidden;
		white-space: nowrap;
	}
	.menu .dropdown-content a:not(:last-child) {
		border-bottom: 0.15vh solid white;
	}
	.menu .dropdown-content a:hover, 
	.menu .dropdown-content a:focus {
		background-color: #E6E7E8;
		color: #020430 !important;
	}
	.menu .dropdown:hover .dropdown-content {
		display: block;
	}
	.menu-fixo {
		height: 5vh !important;
		line-height: 5vh !important;
	}
	.menu-fixo .dropbtn {
		height: 5vh !important;
	}
	.pre-menu-fixo {
		height: 0 !important;
	}
	.pre-menu-fixo > *{
		display: none;
	}
	.menu .search .campos {
		padding: 1vh;
		width: 7vw;
		border: none;
		background-color: #DDDDDD;
		transition: all .5s ease;
		font-size: 1rem;
	}
	.menu .search .campos:focus {
		width: 12vw;
	}
	.search input[type='submit'] {
		width: 1rem;
		height: 1rem;
		background-image: url('/images/ico_pesquisar.png');
		background-size: cover;
		border: none;
		background-color: transparent;
		cursor: pointer;
		vertical-align: middle;
	}
	.vitrine {
		margin-bottom: 0.3vh;
		position: relative;
		width: 100%;
		height: 66vh;
		/* padding-bottom: 34%; */
	}
	.vitrine .slide, 
	.vitrine .slide-mobile {
		position: absolute;
		width: 100%;
		height: 100%;
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
	}
	/*.vitrine .slide:not(:nth-child(2)){
		display: none;
	}*/
	.vitrine .buttons {
		z-index: 2;
		position: absolute;
		width: 100%;
		height: 5vh;
		bottom: 0;
	}
	.vitrine .buttons > .slide-atual {
		margin: 1vh 0.9vh 0 0.9vh;
		display: inline-block;
		width: 1rem;
		height: 1rem;
		border: 0.3vh solid gray;
		border-radius: 50%;
		color: lightGray;
		background-color: transparent;
		cursor: pointer;
	}
	.vitrine .white, 
	.vitrine .buttons > .slide-atual:hover {
		background-color: white !important;
		box-shadow: 0.1rem 0.1rem 0.2rem gray;
	}
	.vitrine .buttons > .slide-next {
		display: none;
		cursor: pointer;
		color: lightGray;
		font-size: 1.5rem;
	}
	.vitrine .buttons > .slide-next:hover {
		color: gray;
	}
	.box {
		position: relative;
		overflow: hidden;
		display: block;
		/* float: left; */
		width: 100%;
		height: 100%;
	}
	.box .text1, 
	.box .text2{
		position: absolute;
		bottom: 0.9vh;
		left: 2vh;
		width: 95%;
		color: white;
		font-size: 1rem;
		font-weight: 700;
		white-space: nowrap; 
		overflow: hidden;
		text-overflow: ellipsis;
		text-shadow: 0.15vh 0.15vh 0.4vh Black, -0.3vh -0.15vh 0.4vh Black;
	}
	.box .text1{
		bottom: 3vh;
		font-size: 1.3rem;
	}
	.box .image {
		position: absolute;
		width: 100%;
		height: 100%;
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center center;
		transition: transform .5s ease;
	}
	.box:hover .image {
		transform: scale(1.1,1.1);
	}
	.botao-produto {
		height: 33vh;
	}
	.botao-produto > div:nth-child(1) .box .image {
		background-position: right top;
		background-image:url('/images/botao_trofeu.jpg');
	}
	.botao-produto > div:nth-child(2) .box .image {
		background-position: left top;
		background-image:url('/images/botao_medalha.jpg');
	}
	.botao-produto > div:nth-child(3) .box .image {
		background-position: center top;
		background-image:url('/images/botao_orcamento.jpg?v1');
	}
	.botao-produto > div:nth-child(4) .box .image {
		background-position: center top;
		background-image:url('/images/botao_whatsapphome.jpg');
	}
	.botao-produto > div:nth-child(1){
		padding-right: 0.3vh;
	}
	.botao-produto > div:nth-child(2){
		padding-left: 0.3vh;
	}
	.slogan {
		margin: 15vh auto 16vh auto;
		width: 70vw;
		max-width: 100%;
		font-size: 1.2rem;
	}
	.slogan > p:nth-child(1){
		font-size: 2.8rem;
		margin-bottom: -3vh;
	}

} /* fim @media all */

@media screen and (min-width: 1px) and (max-width: 767px)  {
	.col-p-0, .col-m-0, .col-g-0 {display: none !important;}
	[class*="col-"] {
		width: 100% !important;
	}
	.desktop {
		display: none !important;
	}
	.mobile {
		display: block !important;
	}
	.produto li.mobile{
		display: list-item !important;
	}
	html {
		font-size: 20px;
	}
	main {
		margin: 0 auto;
	}
	main.interno {
		margin-top: 2vh;
	}	
	.menu_bg {
		width: 100%;
		height: auto;
		box-shadow: none;
	}
	.pre-menu {
		display: none;
	}
	.menu {
		display: none;
		width: 100vw;
		height: 100vh;		
		overflow: auto;
		line-height: 2.3rem;
		background-color: white;
	}
	.menu ul{
		padding-bottom: 10vh;
	}
	.menu li {
		width: 100%;
		max-width: 100%;
		height: auto;
		border-bottom: 0.3vh solid #BBB;
		font-size: 1rem;
		text-align: left;
	}
	.menu li > *{
		padding-left: 1vh;
	}
	.menu li:hover {
		background-color: unset;
	}
	.menup {
		display: block;
		position: fixed;
		top: 0.5vh;
		right: 0.5vh;
		width: 2rem;
		height: 2rem;
		background-color: white;
		border-radius: 50%;
		background-image: url('/images/ico_menumob.png');
		background-repeat: no-repeat;
		background-position:center;
		background-size: 85%;
		border: 0.1rem solid lightGray;
	}
	.menu .dropdown {
		position: unset;
	}
	.menu .dropbtn {
		color: #505050;
		text-align: left;
		padding-left: 1vh;
	}
	.menu .dropdown-content {
		display: block;
		position: unset;
		background-color: white;
		box-shadow: none;
	}
	.menu .dropdown-content a:before{
		content: " » "
	}
	.menu .dropdown-content a {
		padding-left: 3vh;
		display: block;
		line-height: 1.6rem;
		color:#505050;
		border-top: 0.15vh solid #DDD;
	}
	.menu .dropdown-content a:hover, 
	.menu .dropdown-content a:focus {
		background-color: white;
		color: #505050 !important;
	}
	.menu .whatsapp-icon {
		height: 1.5rem;
	}
	.menu .search .campos, 
	.menu .search .campos:focus {
		width: 60vw !important;
	}
	.search input[type='submit'] {
		width: 1.8rem;
		height: 1.8rem;
	}
	.idioma-mobile a {
		display: inline !important;
		padding: 0 2vw;
	}
	.idioma-mobile a img {
		vertical-align: middle;
	}
	.vitrine {
		padding-bottom: 50%;
		display: block;
		height: auto;
	}
	.box:hover .image {
		transform: none;
	}
	.box .text1 {
		font-size: 0.7rem;
	}
	.box .text2{
		font-size: 0.5rem;
	}
	.botao-produto {
		height: auto;
	}
	.botao-produto > div {
		padding: 0 0 0.4vh 0 !important;
	}
	.botao-produto .box {
		padding-bottom: 50%;
	}
	.botao-produto .mobile.col-3{
		width: 50% !important;
	}
	.botao-produto > div:nth-child(3){
		padding: 0 0.3vh 0.4vh 0 !important;
	}
	.botao-produto > div:nth-child(4){
		padding: 0 0 0.4vh 0.3vh !important;
	}
	.botao-produto .mobile.col-3 .box {
		padding-bottom: 100%;
	}
	.slogan {
		margin: 3vh auto 3vh auto;
		text-align: center;
		width: unset;
		font-size: .8rem;
	}
	.slogan > p:nth-child(1){
		margin-bottom: 0;
		font-size: 1.1rem;
	}
}

@media screen and (min-width: 768px) and (max-width: 1200px) and (orientation: landscape) { /* Default w3c: 769x992 e 993x1200*/
	.col-m-0 {display: none !important;}
	.col-m-1 {width: 8.33%;}
    .col-m-2 {width: 16.66%;}
    .col-m-3 {width: 25%;}
    .col-m-4 {width: 33.33%;}
    .col-m-5 {width: 41.66%;}
    .col-m-6 {width: 50%;}
    .col-m-7 {width: 58.33%;}
    .col-m-8 {width: 66.66%;}
    .col-m-9 {width: 75%;}
    .col-m-10 {width: 83.33%;}
    .col-m-11 {width: 91.66%;}
	.col-m-12 {width: 100%;}
	.pre-menu .links, 
	.menu .menu-logo {
		margin-right: 1vh;
	}
	.pre-menu #idioma, 
	.menu .search form {
		margin-left: 1vh;
	}
	.menu .search .campos, 
	.menu .search .campos:focus {
		width: 10vw;
	}
	.vitrine {
		height: 55vh;
	}
	.botao-produto {
		height: 25vh;
	}
	.slogan {
		margin: 9vh auto 11vh auto;
		width: 55vw;
	}
	.slogan > p:nth-child(1){
		font-size: 2rem;
	}
}

@media screen and (min-width: 1201px) and (max-width: 1440px) and (orientation: landscape) {
	.col-g-0 {display: none !important;}
	.col-g-1 {width: 8.33%;}
    .col-g-2 {width: 16.66%;}
    .col-g-3 {width: 25%;}
    .col-g-4 {width: 33.33%;}
    .col-g-5 {width: 41.66%;}
    .col-g-6 {width: 50%;}
    .col-g-7 {width: 58.33%;}
    .col-g-8 {width: 66.66%;}
    .col-g-9 {width: 75%;}
    .col-g-10 {width: 83.33%;}
    .col-g-11 {width: 91.66%;}
	.col-g-12 {width: 100%;}
	.pre-menu .links, 
	.menu .menu-logo {
		margin-right: 1vh;
	}
	.pre-menu #idioma, 
	.menu .search form {
		margin-left: 1vh;
	}	
	.slogan {
		margin: 11vh auto 14vh auto;
		width: 90vw;
	}
}

@media screen and (min-width: 768px) and (orientation: portrait) {
	.col-m-0 {display: none !important;}
	.col-m-1 {width: 8.33%;}
    .col-m-2 {width: 16.66%;}
    .col-m-3 {width: 25%;}
    .col-m-4 {width: 33.33%;}
    .col-m-5 {width: 41.66%;}
    .col-m-6 {width: 50%;}
    .col-m-7 {width: 58.33%;}
    .col-m-8 {width: 66.66%;}
    .col-m-9 {width: 75%;}
    .col-m-10 {width: 83.33%;}
    .col-m-11 {width: 91.66%;}
	.col-m-12 {width: 100%;}
	main {
		margin: 7vh auto;
		min-height: 40vh;
	}
	main.interno {
		margin-top: 10vh;
	}
	.pre-menu {
		height: 2vh;
		line-height: 2vh;
	}
	.pre-menu #idioma li img {
		width: 1.5vh;
	}
	.menu {
		height: 5vh;
		line-height: 5vh;
	}
	.menu .menu-logo {
		height: 50%;
	}
	.menu .search .campos {
		padding: 0.8vh;
	}
	.menu  .search .campos, 
	.menu  .search .campos:focus {
		width: 10vw !important;
	}
	.pre-menu .links, 
	.menu .menu-logo {
		margin-right: 1vh;
	}
	.pre-menu #idioma, 
	.menu .search form {
		margin-left: 1vh;
	}
	.vitrine {
		height: 31vh;
	}
	.vitrine .buttons {
		height: 3vh;
	}
	.vitrine .buttons > .slide-atual {
		width: 1.3vh;
		height: 1.3vh;
		border-width: 0.2vh;
	}
	.botao-produto {
		height: 13vh;
	}
	.box .text1, 
	.box .text2{
		bottom: 0.9vh;
		left: 0.5vh;
		font-size: 1rem;
	}
	.box .text1{
		bottom: 2vh;
		font-size: 1rem;
	}
	.slogan {
		margin: 5vh auto 6vh auto;
		width: 70vw;
	}
	.slogan > p:nth-child(1){
		font-size: 2rem;
		margin-bottom: -1vh;
	}
}

@media screen and (min-width: 1921px) and (max-width: 3200px) {
	html {
		font-size: 28px;
	}
}

@media screen and (min-width: 3201px) and (max-width: 5000px) {
	html {
		font-size: 42px;
	}
}

@media screen and (min-width: 5001px) {
	html {
		font-size: 84px;
	}
}

@media print, braille, embossed, tty {
	body { display: none;}
}