@charset "utf-8";
/* CSS Document */

@media all and (max-width: 1021px){
	.pos-center {
		width: 100%;
		margin: 0 auto;}
		
	#top {
		background: none;}
	
	#top .contener-slider {
		border-left: none;
		border-right: none;}

	#top .contener-slider {
		width: 100%;}
		
	#top .home-quote,
	 {background-size: cover;}
	
	#content .items > div{
		width: 29.333%;}
		
	#vlightbox1 .vlightbox1,
	#vlightbox2 .vlightbox2 {
		width:31.5%;}
		
	#content div.multimedia  > div {
	height: 175px;}	
	
	#content .items > div > a img {
		width: 95%;}
		
	#content .items > div h2 a {
		font-size: .8em;}	
}

@media screen and (max-width: 900px){

	#content .items > div {
		width: 45%;}
		
	#content div.multimedia  > div	{
		height: 160px;}
		
	#content .items > div h2 a {
		font-size: .875em;}
		
	#top .home-quote blockquote p {
		font-size: 1em;}
	
}
	
@media screen and (max-width: 48em){
	
	#main-nav li.long,
	#top .logo-o2t,
	#top.home-slider .pagination {
		display: none;}
		
	#slider {
		width: 100%;}
		
	#top .logo-o2t-mobile {
		display: block;
		border: none;
		top: 23%;
		left: 20px;
		width: 40%;
		position: absolute;
		z-index: 9;}
		
	#top .logo-o2t-mobile img {
		width: 100%;}	
			
	#main-nav li.short {
		display: block;}
	
	body {
		padding-top: 60px;}
    
	#header,
	#header.article {
		height: 60px;
        position:absolute;
        top: 0;
        left: 0;
        width: 100%;
		z-index: 10;
		border: none;}
	
	#header h2 a {
		height: 55px;
		background-size: 75%;}
	
	#header h2 {
		background-size: 70%;
		margin-bottom: 0;
		margin-top: 5px;
		margin-left: 7%;}
	
    #header nav{
        width: 100%;
		background: rgba(255,255,255,.9);
    }
	
	#header nav ul li a {
	font-weight: bold;
	font-size: .875em}
	
	#header nav .menu-toggler{
		display: block;
		background: rgba(199,182,165,.7);
		width: 30px;
		height: 25px;
		top: 10px;
		position: fixed;}

	#header nav .menu-toggler .bar{
		margin-bottom: 3px;}

    #header nav ul{
        display: none;
    }
	
	header nav ul > li > a{
    height: 50px;
    line-height: 50px;}
	
	#header nav ul.menu li.current-menu {
	background: none;}
	
	#top .contener-slider {
		border-bottom: none;}
		
	#top.article .home-quote {
	background: url(../_img/gradient.png) center bottom no-repeat;
	background-size: cover;}
	
	#top .home-quote blockquote p {
	font-size: .9em;}
	
	#content div.multimedia  > div	{
	height: 150px;}
		
	#art-content.article #side-menu {
	float: none;
	width: 100%;
	background-color: rgba(255,255,255,0.3);}
	
	#art-content.article .art-content .title h2 {
		text-align: center;}
	
	#art-content.article .art-content {
		float: none;
		width: 100%;}

	#art-content article.article header h2,
	#art-content article.article header h3 {
		margin-left: 0;
		text-align: center;}
		
	#vlightbox1 .vlightbox1,
	#vlightbox2 .vlightbox2 {
		width:31%;}
		
	#kontakt .kontakt,
	#kontakt .kontakt h2,
	#kontakt .kontakt h3,
	#kontakt .form > p,
	#kontakt .form h2 {
		text-align:center;}
		
	#kontakt .kontakt,
	#kontakt .form {
		width:100%;
		float: none;}
}

@media screen and (max-width: 600px){
		
		#content .items > div.art-04,
		#content .items > div.art-05,
		#content .items > div.art-06{
			display: none;}
		
		#content .items > div,
		#content div.multimedia  > div {
			width: 70%;
			padding: 5%;
			margin: 5% 10%;}
		
		#content .items > div > a img {
		width: 90%;}
		
		#content div.multimedia  > div	{
			height: 170px;}
		
		#content .items > div h2 a {
			font-size: .9375em;}
		
		#top .home-quote blockquote p {
			font-size: .75em;}
	
		#vlightbox1 .vlightbox1,
		#vlightbox2 .vlightbox2 {
		width:30%;}
}


@media screen and (max-width: 30em){
	
	body,
	#header,
	.pos-center {
		min-width: 480px;}
	
	#top.home-slider .pagination,
	#art-content article.article div.tabela,
	#top .home-quote {
		display: none;}
		
	#fon-minimenu ul.fon-minimenu {
		display: block;}
	
	#header nav ul.visible{
        display: block;
	}
	
	#header nav ul li a {
		font-size: 1.5em;}
		
	header nav ul > li > a{
    height: 75px;
    line-height: 75px;}

    #header nav ul li{
        width: 100%;
		float: left;}
	
	#slider {
		width: 100%;}
		
	#top .home-quote blockquote p {
		font-size: .8em;}
	
	#content div.multimedia  > div {
		height: 160px;}
		
	#content .items > div > a img {
	width: 95%;}
		
	#top .logo-o2t-mobile {
		top: 20px;}
		
	#art-content article.article div.sub-article {
	margin: 0 15px;}

}