/* DESKTOP */
@media screen and (min-width: 1191px){

	header #menuAnchor {
		display: none;
	}
	
}

/* MOBILE AND TABLET */
@media screen and (max-width: 1190px){

	#chooseGenre .center {
		max-width: 100%;
		width: 100%;
	}
	#chooseGenre .title {
		font-size: 15px;
		margin: 30px 0;
		max-width: 200px;
	}
	#chooseGenre .buttons a {
		margin: 0 15px;
		font-size: 15px;
	}
	#chooseGenre .buttons i {
		font-size: 40px;
	}
	#chooseGenre .close {
		font-size: 12px;
		margin: 35px 0 0 0;
	}
	#chooseGenre .close.icon {
		top: 25px;
		right: 15px;
	}
	#chooseGenre .close.icon:before, 
	#chooseGenre .close.icon:after {
		width: 18px;
		height: 3px;
	}

	header{
		margin: 0 0 80px 0;
		position: relative;
	}
	header .logo {
		margin: 20px;
		max-height: 52px;
	}
	header .logo img {
		max-height: 52px;
	}

	header #menuAnchor{
		width: 20%;
		padding: 0;
		height: 28px;
		cursor: pointer;
		position: absolute;
		display: inline-block;
		top: 50%;
		right: 0;
		margin: -14px 30px 0 0;
		z-index: 14;
	}
	header #menuAnchor span{
		width: 36px;
		height: 5px;
		position: absolute;
		top: 0px;
		right: 0;
		background: #fff;
		border-radius: 8px;
		display: inline-block;
		-webkit-transition: all .25s linear;
		-moz-transition: all .25s linear;
		-ms-transition: all .25s linear;
		transition: all .25s linear;
	}
	header #menuAnchor span:nth-child(2){
		top: 11px;
	}
	header #menuAnchor span:nth-child(3){
		top: 22px;
	}
	.menuopen header #menuAnchor span:nth-child(1){
		transform: rotate(45deg);
		-o-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		-webkit-transform: rotate(45deg);
		top: 11px;
		background: #626262;
	}
	.menuopen header #menuAnchor span:nth-child(3){
		transform: rotate(-45deg);
		-o-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		-webkit-transform: rotate(-45deg);
		top: 11px;
		background: #626262;
	}
	.menuopen header #menuAnchor span:nth-child(2){
		transform: scale(0);
		-o-transform: scale(0);
		-ms-transform: scale(0);
		-moz-transform: scale(0);
		-webkit-transform: scale(0);
		background: #626262;
	}
	header nav.menu {
		width: 75%;
		height: 100%;
		position: fixed;
		z-index: 99999;
		top: 0;
		left: 0;
		margin: 0;
		background: #141414;
		overflow-y: auto;
		border-right: 1px solid #000;
		box-shadow: 0 0 12px rgba(0,0,0,0.4);
		transform: translateX(-110%);
		-o-transform: translateX(-110%);
		-ms-transform: translateX(-110%);
		-moz-transform: translateX(-110%);
		-webkit-transform: translateX(-110%);
		-webkit-transition: all .25s linear;
		-moz-transition: all .25s linear;
		-ms-transition: all .25s linear;
		transition: all .25s linear;
	}
	header nav.menu > ul > li {
		width: 100%;
		margin: 0;
		padding: 0;
		position: relative;
		display: inline-block;
		border: 0;
	}
	header nav.menu > ul > li > a {
		width: 100%;
		display: inline-block;
		border-bottom: 1px dotted #555;
		line-height: 75px;
		margin: 0;
		padding: 0 25px;
	}
	header nav.menu > ul > li > a:hover {
		border-bottom-width: 1px;
	}
	.menuopen header nav.menu {
		transform: translateX(0%);
		-o-transform: translateX(0%);
		-ms-transform: translateX(0%);
		-moz-transform: translateX(0%);
		-webkit-transform: translateX(0%);
	}
	#closemenu {
		width: 100%;
		height: 100%;
		position: fixed;
		top: 0;
		left: 0;
		background: rgba(20,20,20,0.7);
		z-index: 12;
		visibility: hidden;
		filter: opacity(0%);
		-webkit-filter: opacity(0%);
	}
	.menuopen #closemenu {
		visibility: visible;
		filter: opacity(100%);
		-webkit-filter: opacity(100%);
	}

	header .city{
		float: right;
		margin: 18px 5% 0 5%;
		width: 90%;
	}

	main {
		margin: 0 5%;
		width: 90%;
		overflow: hidden;
	}

	main .titleGeral {
		margin: 0 0 12px 0;
	}
	main .titleGeral h2,
	main .titleGeral h1{
		font-size: 20px;
	}
	main .titleGeral h2 i,
	main .titleGeral h1 i { 
		font-size: 15px;
	}
	main .titleGeral .textTitle {
		font-size: 14px;
	}

	main div.tops {
		padding: 0 0 30px 0;
	}
	main div.tops .col {
		width: 100%;
		margin: 0 0 20px 0;
	}
	main div.tops .col:nth-child(3) {
		margin: 0;
	}
	main div.tops .titleGeral {
		margin: 0 0 6px 0;
	}
	main div.tops .item {
		height: 0px;
		padding-top: 125%;
	}
	.page main div.tops .item .title {
    height: 35px;
    line-height: 35px;
    padding: 0 10px;
    font-size: 11px;
	}
	.page main div.tops .item .title i {
		display: none;
	}

	main .lastGps {
		margin: 20px 0 0 0;
	}
	main .lastGps .post, 
	main .lastGps .post.last {
		width: 49%;
		height: 0px;
		padding-top: 35%;
		margin: 0 2% 2% 0;
	}
	main .lastGps .post:nth-child(odd) {
		margin: 0 0 2% 0;
	}
	main .lastGps .post .title {
		font-size: 12px;
		padding: 6px 8px 5px 8px;
		transform: translateY(0);
		-o-transform: translateY(0);
		-ms-transform: translateY(0);
		-moz-transform: translateY(0);
		-webkit-transform: translateY(0);
	}
	main .lastGps .post .title .city {
		font-size: 11px;
	}
	main .lastGps .post .title .city a {
		color: #f2f2f2;
	}
	main .lastGps .post .title .city i {
		font-size: 10px;
	}
	main .lastGps .post .title .gender {
		display: none;
	}
	main .lastGps .post a.thumb {
		position: absolute;
		top: 0;
		left: 0;
	}

	main .bannerPosts {
		margin: 0 0 2% 0;
	}
	main .buttonCenter {
		margin: 18px 0 0 0;
	}
	main .buttonCenter a {
		font-size: 18px;
		height: 52px;
		line-height: 46px;
	}

	footer {
		margin: 20px 0 -50px 0;
	}
	footer > .container{
		padding: 20px 0 0 0;
	}
	footer .widget{
		padding: 0 0 0 3%;
		margin: 0 0 6% 3%;
		font-size: 13px;
		width: 42%;
	}
	footer .widget:nth-child(even) {
		border-right: 0;
	}
	footer .widget h5{
		font-size: 14px;
	}
	footer .widget.last{
		float: right;
		border: 0;
		width: 80%;
		margin: 0 10%;
		padding: 0;
	}
	footer .widget.last .logo{
		max-width: 50%;
		margin: 0;
	}
	footer .bottom{
		font-size: 13px;
		text-align: center;
		padding: 4% 12%;
		margin: 20px 0 0 0;
	}
	footer .bottom a{
		color: #3c3c3c;
	}
	footer .bottom a:hover{
		color: #6c6c6c;
	}
	footer .bottom span{
		width: 100%;
		font-size: 14px;
		text-align: center;
		margin: 5% 0 0 0;
	}

	main article{
		width: 96%;
		margin: 0 2%;
	}
	main article .title{
		margin: 0 0 5% 0;
	}
	main article .title > i{
		font-size: 14px;
		margin: 0 4px 0 0;
	}
	main article .title h1{
		font-size: 22px;
	}
	main article .title span{
		width: 100%;
		display: inline-block;
		margin: 4px 0 0 0;
		font-size: 16px;
	}

	main article #infos .tel i{
		font-size: 36px;
		margin: 11px 17px;
	}
	main article #infos .tel > div{
		font-size: 18px;
		padding: 12px 0 0 0;
	}
	main article #infos .tel > div div{
		font-size: 12px;
	}
	main article #infos #comments{
		margin: 5% 0 0 0;
	}

	main article .photos{
		float: right;
		width: 100%;
		background: #141414;
		overflow: hidden;
		text-align: center;
		padding: 10px 10px 0 10px;
	}
	main article .photos img{
		max-width: 100%;
		height: auto;
		vertical-align: middle;
		border: 0;
		margin: 0 0 10px 0;
	}

	main article .content {
		width: 100%;
		padding: 15px 16px 0 16px;
		margin: 0 0 20px 0;
		font-size: 14px;
	}
	main article .content p {
		margin: 0 0 15px 0;
	}

	.alignright{
		float: none;
		max-width: 100% !important;
	}
	.alignleft{
		float: none;
		max-width: 100% !important;
	}
	main #related{
		width: 90%;
	}

	#commentBox .container{
		max-width: 90%;
		max-height: 88%;
	}
	#commentBox .close i{
		margin: 4% 2%;
		font-size: 26px;
	}

	main .wp-pagenavi{
		width: 90%;
		margin: 0 5% 6% 5%;
		padding: 0;
	}
	main .wp-pagenavi span, main .wp-pagenavi a{
		border: 2px solid #ddd;
		color: #ddd;
		margin: 6px;
		font-size: 16px;
		display: inline-block;
	}
	main .wp-pagenavi span.pages{
		width: 100%;
		margin: 0 0 6px 0;
	}

	main.page{
		width: 90%;
		margin: 0 5%;
	}
	main.page p{
		font-size: 15px;
		text-align: justify;
	}


	main .blog .post,
	main .blog .post.last {
		width: 100%;
	}


}

/* TABLET */
@media screen and (min-width: 750px) and (max-width: 1190px){

	#chooseGenre .center {
		max-width: 300px;
	}
	header{
		margin: 0 0 30px 0;
	}

	header nav.menu {
		width: 300px;
	}	
	header .city{
		margin: 26px 90px 0 0;
		width: 40%;
	}
	main div.tops .col {
		width: 32%;
		margin: 0 2% 0 0;
	}

	main .lastGps {
		margin: 20px 0 0 0;
	}
	main .lastGps .post, 
	main .lastGps .post.last, 
	main .lastGps .post:nth-child(odd) {
		width: 24.2%;
		height: 0px;
		padding-top: 18%;
		margin: 0 1% 1% 0;
	}
	main .lastGps .post.last {
		margin: 0 0 2% 0;
	}

	footer .widget{
		padding: 0 0 0 2%;
		margin: 2% 0 5% 0;
		width: 22%;
	}
	footer .widget:first-child {
		margin-left: 2%;
	}
	footer .widget:nth-child(even) {
		border-right: 1px solid #393939;
	}
	footer .widget:nth-last-child(2){
		border-right: 0;
	}
	footer .bottom{
		padding: 3% 12%;
		margin: 30px 0 0 0;
	}

	main article .title{
		margin: 0 0 2% 0;
	}
	main article .title > i{
		font-size: 16px;
		margin: 0 4px 0 0;
	}
	main article .title h1{
		font-size: 24px;
	}
	main article .title span{
		width: auto;
		margin: 0 0 0 6px;
		font-size: 16px;
	}
	main article #infos{
		width: 40%;
	}
	main article .photos{
		width: 57%;
		padding: 20px 20px 0 20px;
		text-align: center;
	}
	main article .photos img{
		float: none !important;
		margin: 0 auto 10px auto !important;
	}
	.alignright{
		float: none;
	}
	.alignleft{
		float: none;
	}

}

/* FIX MOBILE INFOS */
@media screen and (max-width: 749px){
	
		main article #infos{
		width: 100%;
		position: relative !important;
		top: 0 !important;
		left: 0 !important;
		margin: 0 0 6% 0;
	}

}

/* MOBILE SMALL */
@media screen and (max-width: 340px) {

	footer .widget {
		padding: 0 0 0 2%;
		margin: 0 0 6% 2%;
		font-size: 12px;
	}
	footer .widget h5 {
		font-size: 13px;
	}
	footer .widget.last{
		margin: 0 10%;
		padding: 0;
	}

}