@charset "utf-8";

/* CSS Document */

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
	color: #888;
}

#esp {
	margin: 1.5em 0 1em;
}

#esp1 {
	margin-bottom: 2.5em;
}

header{box-shadow: 0 0 2px #333;}

/************ TOPO ************/

.logo {
	width: 301px;
	height: 75px;
	background: url(../../img/site/layout/logo-magvisao.png) center no-repeat;
	text-indent: -9999px;
}

.logoMenor {
	width: 172px;
	height: 44px;
	background: url(../../img/site/layout/logo-magvisao-menor.png) center no-repeat;
	text-indent: -9999px;
}

#fixar {
	display: none;
	box-shadow: 0 0 2px #333;
}

.destaque {
	color: #cc2242;
}

.telTopo {
	font-size: 1.5em;
	font-weight: bold;
	text-align: center;
	padding-top: 1.2em;
	padding-left: 1em;
}

.menuTopo ul {
	display: inline-block;
	float: right;
	margin-bottom: 0;
	padding: 0px;
}

.menuTopo ul li {
	float: left;
	list-style: none;
	text-transform: uppercase;
	font-size: 1.16em;
	font-weight: bold;
}

.menuTopo ul a {
	text-decoration: none;
	color: #353335;
	padding: 2em .6em 2em .5em;
	line-height: 2.5em;
}

.menuTopo ul a:hover;
.menuTopo ul a:focus {
	color: white;
	background: #cc2242;
}

.hvr-sweep-to-top:before {
	color: white;
	background: #cc2242;
}

.menuTopo2 ul a {
	padding: .75em .6em .75em .5em;
	line-height: 3em;
}

.banner {
	width: 100%;
	height: 484px;
	background: url(../../img/site/layout/banner.jpg) center no-repeat;
}

.emailTopo {
	font-size: 0.8em;
}


/************ CONTEUDO ************/

.imagemEmpresa {
	width: 90%;
	margin: 0 auto 40px;
}

.faixaVinho {
	width: 100%;
	height: auto;
	background: url(../../img/site/layout/bgvinho.png) top no-repeat;
}

.title {
	text-transform: uppercase;
	color: white;
}

.titleBlack {
	text-transform: uppercase;
	color: #2F3337;
	text-align: center;
	margin-bottom: 70px;
	font-size: 2em;
	font-style: "Lato", sans-serif;
}

.bloco {
	/*float: left;*/
	display: inline-block;
	position: relative;
	margin: 0 2.5em 2em 2.5em;
}

.blServicos .bloco {
	margin: 0px 8.5em 2em;
}

.blServicos {
	margin-top: 2em;
	height: auto;
}

.blServicos img {
	float: left;
	-webkit-filter: grayscale(1);
	-moz-filter: grayscale(1);
	filter: grayscale(1);
}

.cxTexto {
	width: 275px;
	height: 230px;
	border: 1px solid orange;
	position: absolute !important;
	top: .8em;
	left: 1em;
	position: relative;
	border: 4px white solid;
	background-color: rgba(17, 17, 17, .9);
	color: white;
	padding: .6em;
	display: none;
}

.cxTexto p {
	font-size: 0.9em;
}

.cxTexto a {
	text-transform: uppercase;
}

.bloco:hover .cxTexto {
	display: block;
	-webkit-animation: pulsar .75s;
	animation: pulsar .75s;
	-webkit-animation-timing-function: ease-in-out;
	animation-timing-function: ease-in-out;
}

.btn-branco {
	background-color: white;
	border-radius: 0;
	font-weight: bold;
	color: #cc2242;
}

.btn-branco:hover {
	color: #cc2242;
}

@-webkit-keyframes pulsar {
	33% {
		transform: scale(.6);
	}
	66% {
		transform: scale(1.1);
	}
	100% {
		transform: scale(1);
	}
}

@keyframes pulsar {
	33% {
		transform: scale(.6);
	}
	66% {
		transform: scale(1.1);
	}
	100% {
		transform: scale(1);
	}
}


.center {
	text-align: center;
	margin: 20px 0;
}

.mTrabalhados {
	margin-top: 1em;
}

.mTrabalhados .bloco {
	margin: 0 2.5em 2em 2.5em;
}

.mTrabalhados .bloco figcaption {
	width: 300px;
	text-align: center;
}

.mTrabalhados .bloco figcaption h4 {
	text-transform: uppercase;
	font-weight: bold;
	margin-top: 1em;
}


/************ RODAPE ************/

.faixaCinza {
	width: 100%;
	height: auto;
	background: #2f3337;
}

.rodapeEmail {
	color: white;
	text-decoration: none;
}

.rodapeEmail:hover,
.rodapeEmail:focus {
	color: white;
}

.imgRodape {
	float: left;
}

.imgRodape:hover {
	-webkit-animation: pulsar .75s;
	animation: pulsar .75s;
	-webkit-animation-timing-function: ease-in-out;
	animation-timing-function: ease-in-out;
}

.blRodape {
	float: left;
	color: white;
	margin-left: 0.6em;
}

.copy {
	text-align: center;
	margin-top: .5em;
	color: #888888;
}

.copy a {
	text-decoration: none;
	color: #888888;
}

.mapa {
	width: 100%;
	margin-bottom: 25px;
}


/************ SERVIÇOS ************/

.cxBtn a {
	position: relative;
	top: 40%;
	left: 15%;
}

.btnContorno {
	background-color: transparent;
	border: 3px white solid;
	color: white;
	transition: .4s;
}

.btnContorno:hover {
	background-color: rgba(255, 255, 255, .75);
	color: #cc2242;
	font-weight: bold;
	transition: .4s;
}

.servicos .bltexto {
	width: 300px;
	padding: 1em;
	text-align: justify;
	background: #CC2242;
	color: white;
}

.descricaoServicos {
	text-align: justify;
}

.descricaoServicos p {
	margin: 0px 0px 15px;
	text-align: justify;
}

.imgServico {
	width: 100%;
	height: auto;
	/*box-shadow: 0 0 1px gray;*/
	margin-top: 2em;
	border-radius: 10px;
}


/************ EMPRESA ************/

#centralizaZoom {
	position: relative;
	top: 40%;
	left: 30%;
}

div p a {
	color: #63B8BD;
}


/**************  Página de serviços  **************/

.imgPagServico {
	width: 400px;
	height: 400px;
	float: left;
}

.descricaoPagServicos {
	text-align: justify;
	margin: 0 0 0 20px;
	float: left;
	width: 590px;
}

.miniImgPagServico {
	width: 200px;
	height: 200px;
	float: left;
	margin-right: 20px;
}

/* PROPRIEDADES DO MENU PRINCIPAL RESPONSIVO */
.container-fluid > .navbar-collapse,
.container-fluid > .navbar-header,
.container > .navbar-collapse,
.container > .navbar-header {
	margin-right: 0px !important;
	margin-left: 0px !important;
}
/* FIM PROPRIEDADES DO MENU PRINCIPAL RESPONSIVO */



/******************************** smarthphones no formato retrato **********************************/
@media (min-width: 320px) and (max-width: 768px) {   
	
	/*TOPO*/
	.logo{width: auto; background: transparent url("../../img/site/layout/logo-magvisao-smartphone.png") no-repeat scroll center center;}
	.telTopo{padding: 0; font-size: 1.2em; margin-bottom: 1em;}
	/*FIM TOPO*/
	
	
	/* RODAPE */
	footer{text-align: center !important;}
	.imgRodape {float: none;clear: both; margin: 0 auto;}
	.blRodape {float: none; margin-bottom: 50px;}
	/* FIM RODAPE */
	

	/* HOME */
	.blServicos .bloco{margin: 0 auto 2em; width: 100% !important; height: 260px;}
	.blServicos .bloco img{margin: 0px auto; float: none;}
	.cxTexto{width: 300px !important; height: 251px !important; text-align: center !important; margin-top: -251px;
	margin-left: auto; margin-right: auto; top: 0 !important; left: 0 !important; position: relative !important;}

	/* FIM HOME */


	/* PÁGINA SERVIÇOS */
	.servicos .bloco{margin: 0 auto 2em;; width: 100% !important;}
	.servicos .bltexto{width: 300px; margin-bottom: 30px; margin-left: auto; margin-right: auto;}
	.servicos .bltexto h3{text-align: center;}
	.servicos .bloco img{margin-left: auto !important; margin-right: auto !important;}
	.servicos .bloco .cxTexto{margin: -251px auto 0 !important; height: 30%; float: none;}
	.servicos .bloco .cxTexto a{top: 0; left: 0; float: left; clear: both; margin: 14px 0 14px 20%; width: 150px;}
	/* FIM PÁGINA SERVIÇOS */


	/*GALERIA DE FOTOS*/
	/*.descricaoServicos .bloco .cxTexto{height: 80%}*/
	.descricaoServicos .bloco{margin: 0 auto 2em; width: 100% !important; height: 260px;}
	.descricaoServicos .bloco img{margin: 0px auto; float: none;}

	/*FIM GALERIA DE FOTOS*/


	/*FUNDICOES*/
	.imgPagServico{margin: 20px auto; width: 240px !important; height: 240px; max-height: 400px; max-width: 400px; float: none;}
	.imgPagServico .fancybox .center-block{margin: 20px auto; width: 240px !important; height: 240px; max-height: 400px; max-width: 400px; float: none;}
	.descricaoPagServicos {width: 100% !important; margin: 0px 0px 0px 10px !important; float: none !important;}
	.miniImgPagServico {float: none; margin: 20px auto;}
	#centralizaZoom{position: relative; margin: auto; top: 45%; left: 0;}
	/*FIM FUNDICOES*/	

	#btn-responsivo{width: 100%;}
}

/******************************** Fim smarthphones no formato retrato **********************************/

/*@media (min-width: 693px) and (max-width: 768px) {   
.blServicos .bloco{width: calc(100% / 2.15) !important}
}*/

/******************************** Tablets e IPADs **********************************/
@media (min-width: 769px) and (max-width: 992px) {


	
	/*TOPO*/
	.logo{ background-image:  url(../../img/site/layout/logo-magvisao-smartphone.png);}
	.telTopo{padding: 0; font-size: 1.2em; margin-bottom: 1em;}
	.logoMenor{float: none; margin: 0 auto !important;}

	/*FIM TOPO*/
	
	
	/* RODAPE */
	footer{text-align: center !important;}
	.imgRodape {float: none;clear: both; margin: 0 auto;}
	.blRodape {float: none; margin-bottom: 50px;}
	/* FIM RODAPE */
	
	/* HOME */
	.blServicos .bloco{margin: 0; width: 100% !important;}
	/* .bloco{float: none;} */
	.blServicos .bloco img{margin: 50px auto; float: none;}
	.cxTexto{width: 100%; top: 30px; left: 0; height: auto;}
	/* .cxTexto {width: auto;} */
	/* FIM HOME */


	/* PÁGINA SERVIÇOS */
	.servicos .bloco{margin: 0; width: 100% !important;}
	.servicos .bltexto{width: 100%; margin-bottom: 30px;}
	.servicos .bltexto h3{text-align: center;}
	.servicos .bloco .cxTexto{width: inherit; margin: 0 auto; height: 30%;}
	.servicos .bloco .cxTexto a{top: 0; left: 0; float: left; clear: both; margin: 14px 0 14px 20%; width: 150px;}
	/* FIM PÁGINA SERVIÇOS */


	/*GALERIA DE FOTOS*/
	.descricaoServicos .bloco .cxTexto{height: 80%}
	.descricaoServicos .bloco{margin: 10px 0; width: 100% !important;}
	/*FIM GALERIA DE FOTOS*/


	/*FUNDICOES*/
	.imgPagServico{margin: 20px auto; width: 240px !important; height: 240px; max-height: 400px; max-width: 400px; float: none;}
	.imgPagServico .fancybox .center-block{margin: 20px auto; width: 240px !important; height: 240px; max-height: 400px; max-width: 400px; float: none;}
	.descricaoPagServicos {width: 100% !important; margin: 0px 0px 0px 10px !important; float: none !important;}
	.miniImgPagServico {float: none; margin: 20px auto;}
	/*FIM FUNDICOES*/	

}


@media (min-width: 767px) and (max-width: 991px) {

	.menuTopo ul, .menuTopo2 .menuTopo ul {
    margin: 0px auto -6px;
    float: none !important;
    width: 100%;
    /*border: 1px solid #000;*/
    height: 100%;
    display: inline-block;
	}

	.menuTopo ul li, .menuTopo2 ul li{
		margin-left: 1.5em;	
	}

	
}

@media (min-width: 800px) and (max-width: 999px) {
	.logo {
		transform: scale(.95);
		/*transform-origin: left;*/
		margin: 0 auto !important;
	}
}


@media (min-width: 767px) and (max-width: 880px) {
	.menuTopo2 ul{
			padding: 0 7% !important;
		}
	
}



@media (min-width: 881px) and (max-width: 999px) {
.menuTopo2 ul{
		padding: 0 13% !important;
	}

}

@media (min-width: 768px) and (max-width: 1023px) {
	#fixar .col-md-offset-1 .telTopo{position: absolute; bottom: -30px; right: 4%;}
	/*.logoMenor{position: relative; right: 100px;}*/
	
}
/******************************** Fim Tablets e IPADs **********************************/