
@viewport { width: device-width; }
-ms-@viewport { width: device-width; }
-o-@viewport { width: device-width; }
-moz-@viewport { width: device-width; }
-webkit-@viewport { width: device-width; }

/*-----------------------------------------------------------------------------------------------------------
BLOCO DE LOGIN
elementos: formulário de busca
------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 531px) {
	 
	.page h1, .blog-page-title{
		text-align: center;
	}
 
	.login-form input {
	 	width: 110px;
		border: solid white 1px;
	}
	.button-submit{
		display: none
	}
	.active-menu{
		display: block;
		background: #60aeea;
		border: solid #60aeea 1px;
		width: 100%;
	}
	.main-menu{
	 	text-align: center;
	 	padding: 0px 0px 10px 0px!important;
	 	margin: 0 auto;
	 	margin: 10px 0 0 0;
 		display: none;
	}
	.main-menu ul{
		display: inline-block;
	}
	.main-menu li{
		display: block;
	}
	.main-menu a{
		display: block;
		width: 99.5% !important; 
		display: block;
		position: relative;
		z-index: 10;
	}
	.page .title{
		text-align: center;
	}
}
/*-----------------------------------------------------------------------------------------------------------
BLOCO DE LOGIN
elementos: formulário de busca
------------------------------------------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------------------------------
MENU PRINCIPAL
elementos: elementos do menu
------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 1134px){
 	.main-menu a{
 		width: 141px;
 	}
}
@media screen and (max-width: 1061px){
 	.main-menu a{
 		width: 131px;
 	}
}
@media screen and (max-width: 990px){
 	.main-menu a{
 		width: 121px;
 	}
}
@media screen and (max-width: 800px){
 	.main-menu a{
 		width: 100px;
 	}
}
/*-----------------------------------------------------------------------------------------------------------
MENU PRINCIPAL
elementos: elementos do menu
------------------------------------------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------------------------------
BLOCO NOTÍCIAS E SIDEBAR
elementos: opções do menu
------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 800px){
 	
 	.notices{
 		width: 96%;
 	}
 	.main-sidebar{
 		display: block;
 		float: left;
 		width: 99%;
 		padding: 0 0 0 0;
 	}

 	.page .notices{
 		width: 96%;
 	}
 	.page .notices .post-title{
 		text-align: left !important;
 	}
 	.page .notices-sidebar{
 		display: block;
 		float: left;
 		width: 99%;
 		padding: 0 0 0 0;
 	}

  }

/*-----------------------------------------------------------------------------------------------------------
BLOCO NOTÍCIAS E SIDEBAR
elementos: opções do menu
------------------------------------------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------------------------------
PÁGINA DE TUTORIAIS
elementos: titulo, thumbnail, resumo
------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 600px){
	
	.tutorial-page-resume{
		display: inline-block;
		float: none;
		position: relative;
		top: 0px;
		left: 0px;
		margin: 10px 0 0 0;
	} 
}
@media screen and (max-width: 800px){
	.tutorial-page{
		width: 100%;
		margin:30px 0 0 0;
	}
	.tutorial-sidebar{
		width: 100%;
	}
	.tutorial-sidebar-single{
		width: 100%;
		float: left;
	}
}
/*-----------------------------------------------------------------------------------------------------------
PÁGINA DE TUTORIAIS
elementos: titulo, thumbnail, resumo
------------------------------------------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------------------------------
TOPO E ÍCONE SOCIAIS
elementos: icones, logo
------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 490px){
	.logo{
		-webkit-transform:scale(0.8);
		-moz-transform:scale(0.8);
		-o-transform:scale(0.8);
		-ms-transform:scale(0.8);
		transform:scale(0.8);
		margin: 0 auto;
	}
	.block-social{
		position: relative;
		top: 0px;
		left: 0px;
		margin: 0 auto;
		width: 100%;
		padding: 3px 0 3px 0;
		text-align: center;
	}	
	.social-icon{
		float: none;
		font-size: 40px;
		color: #D2D2D2;
		margin: 0px 10px 0 10px;
	}

}


/*-----------------------------------------------------------------------------------------------------------
TOPO E ÍCONE SOCIAIS
elementos: icones, logo
------------------------------------------------------------------------------------------------------------*/