/* ---------------------------------
@version Beta v0.1
@date 08.Jan.2019
@author Marcio Camargo
@email marcio@seepix.com.br

Estrutura do site
Quebras de layout em: 
- 1600
- 1200
- 1024
- 840
- 720
- 600
- 480
- 320
--------------------------------- */
.main-content{
	position: relative;
	display: table;
	left: 50%;
	width: 1600px;
	margin-left: -800px;
	}
.content-center{
	position: relative;
	display: table;
	margin-left: 20%;
	width: 60%;
	}

@media (max-width: 480px) {
	.content-center{
		margin-left: 5%;
		width: 90%;
		}
	}

@media (min-width: 481px) and (max-width: 840px) {
	.content-center{
		margin-left: 15%;
		width: 70%;
		}
	}

@media (min-width: 841px){

	}

.swiper-container {
	width: 100%;
	height: 100%;
	}

header#header{
    position: fixed;
    display: block;
    left: 0px;
    right: 0px;
    height: 100px;
    z-index: 10;
    -moz-box-shadow: 2px 2px 5px rgba(0,0,0,0.1);
    -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.1);
    box-shadow: 2px 2px 5px rgba(0,0,0,0.1);
    /* border-bottom: solid 10px #19223F; */
    margin-bottom: 20px;
	}
#logo{
	position: absolute;
    left: 40px;
    top: 30px;
	}
#logo > a > img{
	width: 140px;
	}
#login-header{
	position: absolute;
	right: 20px;
	top: 38px;
	z-index: 2;
	color: #EEE;
	}
#menu-head{
	position: fixed;
	top: 25px;
	left: 230px;
	z-index: 11;
	border: solid 1px rgba(255,255,255,0.1);
	}
#menu-head > ul{
	display: table;
	margin: 0px;
	padding: 0px;
	}
#menu-head > ul > li{
	display: table;
	float: left;
	margin: 0px;
	padding: 0px;
	}
#menu-head > ul > li > a{
	display: block;
	font-size: 13px;
	padding: 15px;
	color: #FFF;
	transition: 1s;
	}
#menu-head > ul > li > a:hover{
	background-color: rgba(0,0,0,0.5);
	color: #FFF;
	}
#content{
	padding-top: 100px;
}
.share-footer{
	display: table;
	width: 100%;
	text-align: center;
	margin: 10px 0px 20px 0px;
	}
.share-footer > div{
	display: inline-table;
	background-color: #FFF;
	padding: 5px;
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
	-moz-box-shadow: 1px 1px 4px rgba(0,0,0,0.1); 
	-webkit-box-shadow: 1px 1px 4px rgba(0,0,0,0.1); 
	box-shadow: 1px 1px 4px rgba(0,0,0,0.1);
	}
.share-footer > div > span{
	display: block;
	margin-bottom: 5px;
	font-size: 11px;
	}
.share-footer > div > a > i{
	font-size: 22px !important;
	}

.footer-icons{
	font-size: 22px;
	margin-right: 10px;
	}
#logo-rodape{
	margin: 20px;
	height: 40px;
	}
#footer-credito {
    position: relative;
    padding: 25px 15px;
}

@media (max-width: 1600px) {
	.main-content{
		width: 1200px;
		margin-left: -600px;
		}
}
@media (max-width: 1200px) {
	.main-content{
		left: 0;
		width: 100%;
		margin-left: 0px;
		}
}
@media (max-width: 1024px) {
	#logo{
		position: absolute;
	    left: 30px;
	    top: 33px;
		}
	#logo > a > img{
		width: 110px;
		}
	#menu-head{
		left: 180px;
		}
}
@media (max-width: 720px) {
	header#header{
		height: 60px;
		}
	#logo{
		position: absolute;
	    left: 30px;
	    top: 15px;
		}
	#logo > a > img{
		width: 100px;
		}
	#login-header{
		right: 20px;
		top: 20px;
		}
	#menu-head{
		position: fixed;
		background-color: #3eb080;
		top: 60px;
		left: 0px;
		width: 100%;
		height: 30px;
		overflow: auto;
		}
	#menu-head > ul{
		display: table;
		width: 100%;
		}
	#menu-head > ul > li{
		display: inline-block;
		float: left;
		}
	#menu-head > ul > li > a{
		font-size: 11px;
		padding: 0px 15px;
		line-height: 30px;
		border-right: solid 1px #FFF;
		}
	#menu-head > ul > li:last-child > a{
		border: none;
		}
}
@media (max-width: 600px) {
	#logo{
		top: 18px;
		}
	#logo > a > img{
		width: 80px;
		}
}
@media (max-width: 480px) {
	#login-header{

		font-size: 12px;
		}
	#logo-rodape{
		margin: 30px;
		height: 50px;
		}
	
	#footer-credito {
		position: relative;
		padding: 30px 20px;
		text-align: left;
	}
}
@media (max-width: 320px) {

}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
CONFIGURAÇÕES DE ANÚNCIOS
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.ad{
	display: block;
	text-align: center !important;
	margin: 30px 0px 0px 0px;
	padding: 10px;
	}

/* ---------------------------------
120X600
--------------------------------- */
.ad[data-type="v120x600"]{
	position: absolute;
	top: -40px;
	left: 81%;
}
.ad[data-type="v120x600"] > img{
	width: 120px;
	height: 600px;
	}
@media (max-width: 840px) {
  .ad[data-type="v120x600"]{
	position: relative;
	top: auto;
	left: auto;
	}
}

/* ---------------------------------
160X600
--------------------------------- */
.ad[data-type="v160x600"]{
	position: absolute;
	top: -40px;
	left: 81%;
}
.ad[data-type="v160x600"] > img{
	width: 160px;
	height: 600px;
	}
@media (max-width: 860px) {
  .ad[data-type="v160x600"]{
	position: relative;
	top: auto;
	left: auto;
	}
}

/* ---------------------------------
240X400
--------------------------------- */
.ad[data-type="v240x400"]{
	position: absolute;
	top: -40px;
	left: 81%;
}
.ad[data-type="v240x400"] > img{
	width: 240px;
	height: 400px;
	}
@media (max-width: 1380px) {
  .ad[data-type="v240x400"]{
	position: relative;
	top: auto;
	left: auto;
	}
}

/* ---------------------------------
250X250
--------------------------------- */
.ad[data-type="q250x250"]{
	position: absolute;
	top: -40px;
	left: 81%;
}
.ad[data-type="q250x250"] > img{
	width: 250px;
	height: 250px;
	}
@media (max-width: 1440px) {
  .ad[data-type="q250x250"]{
	position: relative;
	top: auto;
	left: auto;
	}
}

/* ---------------------------------
468X60
--------------------------------- */
.ad[data-type="h468x60"] > img{
	width: 468px;
	height: 60px;
	}
@media (max-width: 468px) {
  .ad[data-type="h468x60"] > img{
	width: 100%;
	height: auto;
	}
}

/* ---------------------------------
728X90
--------------------------------- */
.ad[data-type="h728x90"] > img{
	width: 728px;
	height: 90px;
	}
@media (max-width: 728px) {
  .ad[data-type="h728x90"] > img{
	width: 100%;
	height: auto;
	}
}

/* ---------------------------------
728X90
--------------------------------- */
.ad[data-type="h720x300"] > img{
	width: 720px;
	height: 300px;
	}
@media (max-width: 720px) {
  .ad[data-type="h720x300"] > img{
	width: 100%;
	height: auto;
	}
}