/* variables */
:root{
	--main-topnavigation-height: 120px;
	--main-card-height: calc(100vh - var(--main-topnavigation-height) - 100px);
	--main-card-bound-height: calc( var(--main-card-height)*0.65 );
    --main-card-bound-width: calc( var(--main-card-bound-height)*1.116 );
	--main-card-text-scale: calc( var(--main-card-bound-height)/7 ) ;
	--main-card-open: calc( 500px) ;
}



/* #topnavigation */
header #topnavigation {  }
header #topnavigation button.navbar-toggler{ display: none; padding-right: 40px;}
header #topnavigation button.navbar-toggler img{width: 42px; }
header #topnavigation > .container{ height: var(--main-topnavigation-height); display: flex; flex-wrap: wrap; justify-content: space-between; width: 1080px; padding: 15px 40px 20px 40px;}
header #topnavigation .logo.container { height: 100%;  margin: 0; width: auto;}
header #topnavigation .nav.container { height: 100%; margin: 0; width: auto;}
header #topnavigation .logo.container img.societylogo{ height: 105% }
.internal header #topnavigation .logo.container img.societylogo {    height: 110%; }
header #topnavigation .nav {  display: block;}
header #topnavigation nav.PageNav{ margin-top: -5px; }
header #topnavigation nav.PageNav.primary{ margin-top: 2px; }
header #topnavigation nav.PageNav ul.menu { text-align: right; padding-left: 10px}
header #topnavigation nav.PageNav ul.menu li{ padding: 0 5px;}
header #topnavigation nav.PageNav ul.menu li a{ padding: 5px 11px 6px; }
header #topnavigation .topmenu{ text-align: right; }
header #topnavigation .topmenu nav.PageNav{ display: inline-block; }

header #centralheader .container{ height:var(--main-card-height)  }
.internal header #centralheader .container{ height: auto  }  

header #centralheader #clippingmask{ -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 90%, 70% 90%, 50% 100%, 30% 90%, 0% 90%); 
	clip-path: polygon(0% 0%, 100% 0%, 100% 90%, 70% 90%, 50% 100%, 30% 90%, 0% 90%); 
	background-size: cover; 
	height: 100%;
	background-size: 800px;
	background-repeat: no-repeat;
	background-position: center 5%;
}

/* topnavigation custom */
header #topnavigation nav.PageNav.chi-siamo ul.menu li a{ padding: 5px 2px 6px; }


/* #menuwrapper */
header #menuwrapper{position: absolute; top: calc( var(--main-topnavigation-height)*1.5); height: 100%}
header #menuwrapper .halfcard{ position: relative;  width: 100%; transition-duration: 0.5s; transition-property: left,right,top; z-index: 3;}
header #menuwrapper #rightcard.halfcard { left: 0; top: calc( var(--main-card-bound-height)*-1 ); /* top: calc( var(--main-card-height)*-0.182 ) ;*/}
header #menuwrapper #leftcard.halfcard { right: 0; top: 0px;}
header #menuwrapper.hover #rightcard.halfcard { left: 30px; }
header #menuwrapper.hover #leftcard.halfcard { right: 30px; }
header #menuwrapper.open { height: calc( var(--main-card-height) + 120px); overflow: hidden;  }
header #menuwrapper.open #rightcard.halfcard { left: var(--main-card-open); top: calc( var(--main-card-bound-height)*-1 ); z-index: 0}
header #menuwrapper.open #leftcard.halfcard { right: var(--main-card-open); top: 0px; z-index: 0}
header #menuwrapper .halfcard .textcontainer{ height: var(--main-card-bound-height); max-width: none;}
header #menuwrapper .halfcard .textcontainer > div{ height: 100%;  display: inline-block;}
header #menuwrapper .halfcard .textcontainer .textbox{ width: 50%; }
header #menuwrapper .halfcard .textcontainer .corner{ width: calc( var(--main-card-height)*0.38 );}
header #menuwrapper .halfcard .imagecontainer{ position: relative; height: calc( var(--main-card-height)*0.27 ) }
header #menuwrapper .halfcard .imagecontainer img{ height: 100%; }


header #menuwrapper #leftcard .textcontainer .textbox{float: left; height: 75%; border-top-right-radius: calc( var(--main-card-height)*0.042 ); }
header #menuwrapper #leftcard .textcontainer .corner{ float: right; clip-path: polygon(0% 0%, 100% 0%, 0% 100%); -webkit-clip-path: polygon(0% 0%, 100% 0%, 0% 100%);}
header #menuwrapper #rightcard .imagecontainer{ height: var(--main-card-bound-height); left: calc( var( --main-card-bound-width)*0.5 ); top: calc( var( --main-card-height)*0.042 );}
header #menuwrapper #leftcard .imagecontainer{ text-align: right; background: transparent !important; right: calc( var( --main-card-bound-width)*0.5 ); top: calc( var( --main-card-height)*0.042 );}
header #menuwrapper #rightcard { position: relative; float: right; text-align: right;}
header #menuwrapper #rightcard .imagecontainer{ text-align: left; background: transparent !important;}
header #menuwrapper #rightcard .textcontainer .textbox{float: right; height: 80%; margin-top: calc( var(--main-card-height)*0.042*2 ); }
header #menuwrapper #rightcard .textcontainer .corner{ float: left; clip-path: polygon(0% 100%, 100% 100%, 100% 0%); -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 0%);}

header #menushower{	position: absolute; width: 100%; z-index: 1;}
header #menushower > div.container{	margin: auto; max-width: 660px; padding: 0 20px;}
/* #menuwrapper transition */
header #menuwrapper #menushower #staticmenu_advanced_render > div{ transition-duration: 0.5s; transition-property: visibility,opacity, height; }
header #menuwrapper #menushower #staticmenu_advanced_render .right-block { opacity:0; visibility: hidden; margin-left: -200px; margin-top: 10px;}
header #menuwrapper.open #menushower #staticmenu_advanced_render .right-block { opacity:1; visibility: visible; }

header #menuwrapperinternal #menushower{height: 0; position: inherit; overflow: hidden; transition-duration: 0.5s; transition-property: visibility,opacity, height; }
header #menuwrapperinternal #menushower #clippingmask > div.container{	margin: auto; max-width: 740px; padding: 0 20px;}
header #menuwrapperinternal.open #menushower{ height:var(--main-card-height) ; position: inherit; opacity: 1; visibility: visible;}
header #menuwrapperinternal #menushower #staticmenu_advanced_render > div{ transition-duration: 0.5s; transition-property: visibility,opacity, height; }
header #menuwrapperinternal #menushower #staticmenu_advanced_render .right-block { opacity:0; visibility: hidden; margin-left: -200px;}
header #menuwrapperinternal.open #menushower #staticmenu_advanced_render .right-block { opacity:1; visibility: visible; }




header .textboxcontainer{ display: table; position: relative; top: 0; left: 0; height: 100%;  width: 220px; overflow: hidden; font-weight: bold;}
header .textboxcontainer > div { display: table-cell; vertical-align: middle; }

header #claimbox{ text-align: right; float: right; margin-right: calc( var( --main-card-bound-width)*0.46 ); font-size: calc( var(--main-card-text-scale)*0.65 ); line-height: 1em}
header #newsbox{ text-align: left; float: left; margin-left: calc( var( --main-card-bound-width)*0.53 ); font-weight: 300}

header #newsbox.textboxcontainer > div { display: block; vertical-align: top; }
header .post-list-homeposts{ overflow: hidden; width: 300px;}
header .post-list-homeposts ul{ list-style: none; padding: 0; margin: 0; width:9999px; height: var(--main-card-bound-height) - var(--main-card-text-scale) ) }
header .post-list-homeposts li{ display: inline-block; width: 300px; vertical-align: top; position: relative; right: 0; transition-duration: 0.5s; transition-property: left,right; }
header #newsbox .slidable .blocktitle{ font-size: calc( var(--main-card-text-scale)*0.35 ); margin-bottom: 10px; font-weight:400}
header #newsbox .slidable h3{ font-size: calc( 12px + var(--main-card-text-scale)*0.45 ); ) ; font-weight: 300; margin:0 0 12px; line-height: 90%;  text-overflow: ellipsis;}
header #newsbox .slidable h3 a{ text-decoration: none;  text-overflow: ellipsis;}
header #newsbox .slidable .excerpt { font-size: calc( 12px + var(--main-card-text-scale)*0.1 );    line-height: 95%;  text-overflow: ellipsis;}
header #newsbox .slidable .slidepointsbox { height: calc(var(--main-card-bound-height)*0.15 ) ; text-align: right; padding-right: 10px; position: relative; z-index: 3  }
header #newsbox .slidable .circle { display: inline-block; border-radius: 50%; height: calc(var(--main-card-bound-height)*0.04 ); width:calc(var(--main-card-bound-height)*0.04 ); vertical-align: top; float: left; margin: 0 2px; cursor: pointer; }
header #newsbox .slidable .readmore { display: inline-block; height: calc(var(--main-card-bound-height)*0.08 ); font-size: calc( var(--main-card-text-scale)*0.35 ); float: right; position: relative; top: -10px; }


/* grid sistem */

.gridwrapper {  width: 100%;  margin: 0 auto; margin-bottom: 10px }
.gridwrapper h3{ font-size: 28px}
.gridwrapper > div.gridelement {  border-radius: 3px;}
.gridwrapper {  display: grid;  grid-template-columns: 1fr 1fr 2fr;  grid-gap: 10px;  grid-auto-rows: minmax(100px, auto);}

.gridrow1 {  grid-template-columns: 1fr 1fr 2fr; }
.gridrow2 {  grid-template-columns: 2fr 1fr 1fr; }
.gridrow3 {  grid-template-columns: 1fr 2fr 1fr; }

.gridwrapper .gridelement{ overflow: hidden; }

/* main */
main{ margin-top: calc( var(--main-card-height)*-0.2 ) ; }
.internal main{ margin-top: 30px }
main article section {padding: 30px 0;}
main article:first-of-type section{ padding-top: calc( var(--main-card-height)*0.2 + 40px ) }
.internal main article:first-of-type section{ padding-top: 5px }

/* Pages list */
main .pageslist .firstitem.container{ display: flex; padding: 20px; margin-bottom: 20px;}
main .pageslist .firstitem.container .info div{ width: 50%; }
main .pageslist .firstitem.container .info .header_pageteaser .readmore{ text-align: right }
main .pageslist .firstitem.container .info .header_pageteaser .readmore a{ display: inline-block; padding: 3px 10px }
main .pageslist .firstitem.container .info div img{ width: 100%; }
main .pageslist .otheritemscontainer{ display: grid;  grid-template-columns: 1fr 1fr 1fr;  grid-gap: 10px;  grid-auto-rows: minmax(100px, auto); }
main .pageslist.in_row_2 .otheritemscontainer{ display: grid;  grid-template-columns: 1fr 1fr;  grid-gap: 20px;  grid-auto-rows: minmax(100px, auto); }
main .pageslist.in_row_2 .otheritemscontainer .header_pageteaser{ display: none}
main .pageslist .info .image_container{display: block; width: 100%; height: 160px; background-size: cover; background-repeat: no-repeat; background-position: center center }
main .pageslist .otheritemscontainer .item{ padding: 0 10px; margin-bottom: 10px; overflow: hidden; min-width: 0;}
main .pageslist .otheritemscontainer .item .imgwrapper{ width: 100%;  }
main .pageslist .otheritemscontainer .item img{ width: 100%; }
main .pageslist .otheritemscontainer .item .readmore a{ display: inline-block; padding: 3px 10px }
main .pageslist .otheritemscontainer .item .header_pageteaser .header_pageteaser_text{ padding: 0 5px}

main .pageslist.in_column .otheritemscontainer{ padding: 20px; margin-bottom: 20px;width: 100%; display: block;}
main .pageslist.in_column .otheritemscontainer .item { width:100% }
main .pageslist.in_column .otheritemscontainer .item .info{ }
main .pageslist.in_column .otheritemscontainer .item .info .imgwrapper{ width: 30%; }
main .pageslist.in_column .otheritemscontainer  .item .info.row .imgwrapper{ width: auto; }
main .pageslist.in_column .otheritemscontainer .item .info .header_pageteaser{ padding-left: 20px}
main .pageslist.in_column .otheritemscontainer .item .info .readmore{ text-align: left }
main .pageslist.in_column .otheritemscontainer .item .info .readmore a{ display: inline-block; padding: 3px 10px }
main .pageslist.in_column .otheritemscontainer .item .info div img{ width: 100%; }

/* download area */
main #download_area{ padding: 40px 0}
#download_area h2{ font-size: 44px; }
main #download_area a:hover {text-decoration: none;}
main #download_area > div {padding-left: 50px;}
main #download_area > div > div.row > div:first-of-type { text-align: center; font-size: 150% ; }
main #download_area > div > div.row > div:first-of-type img{ width: 300px ;}
main #download_area > div > div div.iconcontainer img{ width: 62px ;}
main #download_area .container.downloadfile{ padding: 10px 0 5px 0; margin-bottom: 5px;}
main #download_area .description{ line-height: 24px; }
main #download_area .title{ font-size:130%; padding: 0 20px 3px 5px; margin-left: -5px;    padding: 10px 0 5px 0; font-weight: 600;  }
main #download_area a{border-radius: 5px;}

/* video area*/
main #video_area .videoholder{ width: 740px; margin: auto}
main #video_area .video .title{margin-top: 10px;}
main #video_area .video .videopacker{ border-radius: 20px; height: 170px; width: 40%}
main #video_area .video:first-of-type .videopacker{  height: 415px; width: 85%}
main #video_area .video .videopacker div.bcolor { border-radius: 20px; height: 100%; width: 100%; display: table; }
main #video_area .video .videopacker  div.bimage { border-radius: 20px; background-position: center; background-size: 120%; background-repeat: no-repeat; height: 100%; width: 100%; display: table-cell; vertical-align: middle; text-align: center;}
main #video_area .video .videopacker  span.icon-play { display: inline-block; background-color: #fff;  height: 30px; width: 30px; -webkit-clip-path: polygon(0% 0%, 0% 100%, 70% 50%); clip-path: polygon(0% 0%, 0% 100%, 70% 50%); }
main #video_area .video:first-of-type .videopacker  span.icon-play { display: inline-block; background-color: #fff; height: 70px; width: 70px;  }


/* single page */
.internal main { margin-top: 0 }
.internal main h1{ font-weight: 200; margin-top: 0px;}
.internal main article > .container { padding: 0 20px; padding-top: 20px;}
article section .container {    padding: 0 20px; }
article section .container.description {padding: 0;}
main .imageteaser{ text-align: center; padding: 20px 0;  height: 40vw; max-height: 70vh; min-height: 50vh; width: 100%; display: table; background-size: cover; background-position: center; background-repeat: no-repeat}
main .imageteaser h1{ display: table-cell; vertical-align: bottom }
main .imageteaser h1 p{ text-align: left}
main .imageteaser h1 p span{ padding: 0 50px 0 20px; font-weight: 300;}
main .pageheader .pageteaser{ font-size: 120%; font-weight: 300; text-align: center;  }

/* sportelli list */
main .placeslist { font-size: 15px }
main .placeslist h3{ text-transform: uppercase; font-weight: bold }
main .placeslist .place img.icon{ width: 32px; }
main .placeslist .gridwrapper{ grid-template-columns: 1fr 1fr;  }
main .placeslist .address{ display: table; }
main .placeslist .address > *{ display: table-cell; }
main .placeslist .address > *{ display: table-cell; }
main .placeslist .address > span { padding-left: 10px; }
main .placeslist .openinginfo li{ list-style: none;  }
main .placeslist .openinginfo li::before{ content: "- ";  }

/* plainimage */
main .section_block.plainimage .row{ margin: 0  }
main .section_block.plainimage .row > div.backgroundimage{ background-position: center; background-size: cover; background-repeat: no-repeat; }
main .section_block.plainimage .container{ width: 100%; max-width: none; padding: 0 }
main .section_block.plainimage { margin-bottom: 20px; padding-bottom: 0 }
main .section_block.plainimage.attachedmap { margin: 0px;}
main .section_block.plainimage .textcontainer{ padding-top: 20px; padding-bottom: 40px }

/* separator */

main .section_block.separator, main .section_block.separator .container{ background-size: cover; background-repeat: no-repeat; background-position: center; }
main .section_block.separator.justified  .container{ height: 100% }

/* internal Blog */
article .gridwrapper .gridelement div.featured_image{ width: 100%;height: 250px; background-repeat: no-repeat; background-position: center center;background-size: cover; }
article .gridwrapper .gridelement h3{ padding: 10px; line-height: 0.9em; }
.internal article .gridwrapper .gridelement h3 { font-size: 28px }
article .gridwrapper .gridelement .info { padding: 5px 10px; font-size: 80%; }
article .gridwrapper .gridelement .excerpt { padding: 5px 10px; font-size: 90%; }

article .gridrow1 .gridelement:nth-of-type(3) .excerpt,
article .gridrow2 .gridelement:first-of-type .excerpt,  
article .gridrow3 .gridelement:nth-of-type(3) .excerpt{   font-size: 120%; }

article .category_link{ text-align: center; margin-top: 20px; }

article .container {max-width: 960px; margin-top: 0px }
article .container h1 {max-width: 85%; text-align: left; font-weight: 300; padding-top: 20px;}
article.blog .container h1 { margin-top: 3px; }
article.blog .container.pagetitle { border-left: 2px solid #ffffff; padding-left: 20px; }
article.blog .container.pagetitle p.info{margin-bottom: 1px; font-size: 80%;}
article.blog section .container{ margin-top: 5px; }
article.blog .blog.container { max-width: 960px; padding-left: 20px;}
article.blog .category-list { text-align: right; font-size: 16px; }
article.blog blockquote { width: 40%; margin: 20px; font-size: 40px; font-style: italic; font-weight: lighter; line-height: 45px; 
text-align: justify; }
article.blog blockquote:nth-of-type(odd){ float: right; border-left: 1px solid; padding-left: 20px;}
article.blog blockquote:nth-of-type(even){ float: left; border-right: 1px solid; padding-right: 20px;}

.pagination{ justify-content: center; }
.pagination li a{ padding: 0 4px; margin: 0 1px}

.category-list li{ display: inline-block; list-style: none; margin: 3px;}
.category-list li a{  padding: 0 3px }

/* showreel */
.showreel{ height: 80vh }

/* genericForm */
.genericForm textarea#comments{ width: 100%; padding: 10px 20px; }

/* Boxes */
.boxes .main_link{ text-align: right; margin-top: 5px; padding: 0 5px;}
.boxes .main_link a{ padding: 3px 5px}

/* easyform */
.luketowerform  form.easyform-container{ border: none; border-radius: 0 !important}
.luketowerform .easyform-container .form-control{ border: none; border-radius: 0 !important}

/*paypla*/
.paypal-button{ border-radius: 3px; padding: 0.2em 2em; height: 2em; }

/* footer */
footer { padding: 20px 0; font-weight: 300;}
footer .imageholder{  height: 80px; width: 270px; margin-top: 40px; }
footer .vl{ height: 180px; margin: 0 20px} 
footer .text{ margin-top: 20px; }
footer .social{ height: 180px; display: table; }
footer .social nav{ display: table-cell; text-align: right; vertical-align: bottom;}
footer .social nav.PageNav ul li{ padding: 0; }
footer .social nav.PageNav ul li  span{ display: none; }
footer .social nav.PageNav ul.menu li img { height: 30px; }


/* modalmenu */
#menu-modal .mainContainer{ margin-bottom: 40px }
#menu-modal #menusupport{ margin-top: 20px;}
#menu-modal #menusupport .close{width: 32px; margin: 18px;}
#menu-modal #menusupport .search{width: 80%;}
#menu-modal #menusupport .search button{	width: 32px;}
#menu-modal #menusupport .search button img{	width: 32px;}
#menu-modal #menusupport .search input{ width: 80%; }
#menu-modal #menusupport .search .form-group {margin-left: 10px;}
#menu-modal nav.PageNav ul.menu li{ display: block; }
#menu-modal .social nav.PageNav ul.menu li span{ display: none; }
#menu-modal .social nav.PageNav ul.menu li{ display: inline-block; }
#menu-modal .social nav.PageNav ul.menu li:first-of-type{ margin-left: 0; padding-left: 0 }
#menu-modal .social{ padding-left: 20px }
#menu-modal .social nav.PageNav ul.menu { padding-left: 0 }
#menu-modal .primary {margin-top: 20px;}
#menu-modal .privacy { padding-left: 20px; margin-top: 40px;}

/* modal */
.modal .close{ width: 30px; margin: 15px; }

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

	header #topnavigation > .container {    padding-right: 0; padding-left: 20px; }
	header #menuwrapper .halfcard .imagecontainer img{ display: none }
	header #menuwrapper #rightcard.halfcard {     top: calc( var(--main-card-height)*-0.45 );}
	header #menuwrapper .halfcard{ width: calc(50vw + var(--main-card-height)/2 - 40px );}
	header #menuwrapper .halfcard .textcontainer .corner {  width: calc( var(--main-card-height)*0.38 - 40px ); }
	header #menuwrapper #leftcard .textcontainer .corner { clip-path: polygon(0% 0%, 50% 100%, 0% 100%);}
	header #menuwrapper #rightcard .textcontainer .corner { clip-path: polygon(50% 0%, 100% 100%, 100% 0%);}
    header #menuwrapper .halfcard .textcontainer .textbox {    width: calc(50vw + var(--main-card-height)*0.4 ); }
    header #menuwrapper .halfcard .imagecontainer {   height: calc( var(--main-card-height)*0.15 ); }
	
	header #claimbox{ margin-right: calc( var( --main-card-bound-width)*0.2 ); width: 70%;}
    header #menuwrapper #leftcard .textcontainer .textbox {height: 50%;}
    header #menuwrapper #rightcard .textcontainer .textbox { height: 70%; border-bottom-left-radius: calc( var(--main-card-height)*0.042 );}
    header #newsbox { margin-left: calc( var( --main-card-bound-width)*0.2 );}
	header .post-list-homeposts, header .post-list-homeposts li{ width: 450px; }
	article .gridwrapper .gridelement div.featured_image{ height: 120px;}
	article .gridwrapper .gridelement h3{ font-size: 24px }
	article .gridwrapper .gridelement .excerpt { font-size: 80%; }
	article .gridwrapper .gridelement .info { font-size: 70%; }
	article .gridrow1 .gridelement:nth-of-type(3) .excerpt,
	article .gridrow2 .gridelement:first-of-type .excerpt,  
	article .gridrow3 .gridelement:nth-of-type(3) .excerpt{ 
	  font-size: 100%; 
	}

	

}

@media screen and (max-width: 1080px) {
	header #topnavigation > .container{ width: auto; }
	nav.PageNav ul.menu li { font-size: 18px; }
	header #menuwrapper #rightcard .textcontainer .textbox { height: 80%;}
}
@media screen and (max-width: 992px) {

	main .pageslist .otheritemscontainer {  grid-template-columns: 1fr 1fr;	padding: 0 20px;}
	main #download_area > div > div div.iconcontainer{ visibility: collapse ;}
	
	header #topnavigation nav.PageNav ul.menu li a { padding: 5px 5px 6px; }
	header #topnavigation nav.PageNav ul.menu li { padding: 0 0px; }
	header #menuwrapper.open #leftcard.halfcard { right: 100%;}
    header #menuwrapper.open #rightcard.halfcard { left: 100%;}
    header #topnavigation > .container {    max-width: 90%; }
    header #topnavigation nav.PageNav ul.menu li { margin: 0 3px; }
}

@media screen and (max-width: 768px) {
	header #topnavigation button.navbar-toggler{ display: block; }
	header #topnavigation .topmenu{ display: none; }
	header #topnavigation nav.PageNav{ display: none; }

	header #menuwrapper .halfcard{ width: calc(100vw);}

	header #menuwrapper .halfcard .textcontainer .textbox {    width: 96%; }
	header #menuwrapper .halfcard .textcontainer .corner {  width: calc( 30vw ); }
	header #newsbox .slidable .excerpt { display: none }
	header #menushower { display: none  }
	header .post-list-homeposts, header .post-list-homeposts li{ width: 350px; }
    header #claimbox { margin-right: calc( var( --main-card-bound-width)*0.1 );}
    header #newsbox { margin-left: calc( var( --main-card-bound-width)*0.1 );}
	section .mailchimp .form-group { margin: 0 40px; }
	section .mailchimp input{ width: calc(100% - 70px); }

	article .gridwrapper {    display: block; }
	article .gridwrapper .gridelement { margin-bottom: 10px }
	article .gridwrapper .gridelement:last-of-type { margin-bottom: 0px }
    article .gridwrapper .gridelement div.featured_image{ height: 160px;}
    
	main .pageslist .firstitem.container{ display: block;}
	main .pageslist .firstitem.container .info div{ width: 100%; }
	main .pageslist .otheritemscontainer,  main .pageslist.in_row_2 .otheritemscontainer{ display: block}
	main .pageslist .otheritemscontainer .item { margin-bottom: 30px; }
	main .pageslist .otheritemscontainer .item .imgwrapper{ width: 70%; }
	main .pageslist.in_row_2 .otheritemscontainer .item .imgwrapper{ width: 100%; }
	main .pageslist .otheritemscontainer .item .info{ font-size: 80%; }

	

	footer .logo, footer .vl{ display: none }
	footer .row {margin: 0 20px;}
	footer .text { width: 70%; padding-left: 25px;}
	footer .social { width: 30%; }
	footer .social nav{ vertical-align: middle;text-align: center; }
	footer .social nav.PageNav ul.menu li { display: block; }


}

@media screen and (max-width: 578px){
	main #download_area > div > div div:not(.modal, .close){ visibility: visible; display: inline-block; width: 100%;}
	main #download_area > div > div div.iconcontainer{ visibility: visible; display: none; width: 20%;}
}