@font-face { font-family: 'SourceSansPro'; font-style: normal; font-weight: 300; src: url('../fonts/SourceSansPro-Light.otf') format('truetype');}
@font-face { font-family: 'SourceSansPro'; font-style: italic; font-weight: 300; src: url('../fonts/SourceSansPro-LightIt.otf') format('truetype');}
@font-face { font-family: 'SourceSansPro'; font-style: normal; font-weight: 400; src: url('../fonts/SourceSansPro-Regular.otf') format('truetype');}
@font-face { font-family: 'SourceSansPro'; font-style: italic; font-weight: 400; src: url('../fonts/SourceSansPro-Regular.otf') format('truetype');}
@font-face { font-family: 'SourceSansPro'; font-style: normal; font-weight: 600; src: url('../fonts/SourceSansPro-Semibold.otf') format('truetype');}
@font-face { font-family: 'SourceSansPro'; font-style: italic; font-weight: 600; src: url('../fonts/SourceSansPro-SemiboldIt.otf') format('truetype');}
@font-face { font-family: 'SourceSansPro'; font-style: normal; font-weight: 700; src: url('../fonts/SourceSansPro-Bold.otf') format('truetype');}
@font-face { font-family: 'SourceSansPro'; font-style: italic; font-weight: 700; src: url('../fonts/SourceSansPro-BoldIt.otf') format('truetype');}

body {background: #fffff; font-family: 'SourceSansPro', sans-serif; font-weight: 400; font-style: normal; font-size: 25px; line-height: 30px; color: #000000; padding:0; margin:0; overflow: hidden;}
p {margin:0 0 1em;}
a:link, a:hover, a:active, a:visited {color: #ffffff; text-decoration: none;}
.attiva {opacity: 0.7; }
.intervento {padding: 220px 40px 20px; text-align: center; background: #ffffff; color: #df1b3b; font-size: 34px; line-height: 36px; font-weight: 700;}
.intervento p {margin: 0;}

header {position: fixed; top: 0; left: 0; width: 100vw; height: 200px; background: #f0f1f2; z-index: 2; display: flex; justify-content: space-between; align-content: stretch;}
header img, footer img {height: auto;}
header .logomic {padding: 42px 30px 20px 40px;}
header .bando {font-size: 20px; line-height: 22px; padding: 38px 0 0;}
header .logobi {text-align: right; padding: 15px 40px 20px 30px;}

nav {background: #df1b3b; color: #ffffff; padding-top: 20px; padding-bottom: 20px; display: flex; justify-content: space-between; align-content: stretch;}
nav > div {text-align: center; text-transform: uppercase; font-size: 22px; line-height: 30px; display: flex; flex-direction: column; width: 20%;}
nav > div img {margin: auto auto 10px;}

footer {width: 100%; position: fixed; bottom: 0; left: 0; height: 180px; background: #f0f1f2; z-index: 2;}
footer .content {padding: 40px; display: flex; justify-content: space-between; align-content: stretch;}
footer .content > div {text-align: center; display: flex; align-items: center; vertical-align: middle;}


main.home {padding: 250px 80px 50px; background: #df1b3b; color: #ffffff; font-size: 28px; line-height: 30px;height: calc(100vh - 480px); overflow: auto;}
main.home td { vertical-align: top;}
main .lingue {text-align: right; font-weight: 700; color: #ffffff; font-size: 32px; line-height: 34px; margin-right: -40px;}
main .lingue a {font-weight: 700;}
main h1 {font-size: 50px; line-height: 60px; font-weight: 400; text-align: center;  }
main.home nav {border-bottom: 2px solid #ffffff; padding-bottom: 30px; margin-bottom: 30px; display: flex; justify-content: space-between; align-content: stretch;}
main.home nav > div {text-align: center; font-size: 22px; line-height: 30px; display: flex; flex-direction: column; width: 25%;}
main.home nav > div img {margin: auto;}

.virtual {overflow: auto; width:100vw; height: calc(100vh - 675px);}
.virtual .content {padding: 80px 40px 40px; display: flex; flex-wrap: wrap; justify-content: space-between; align-content: stretch; color: #df1b3b;}
.virtual .content > div {text-align: center; text-transform: uppercase; font-size: 22px; line-height: 30px; display: flex; flex-direction: column; width: 50%; margin-bottom: 100px;}
.virtual .content > div a {color: #df1b3b; padding: 0 30%;}
.virtual .content > div a img {margin-bottom: 10px;}
.matter {position: relative;}
.matter .back {position: absolute; top: 20px; right: 20px;}
.matter .embedmat {width:100vw; height: calc(100vh - 650px);}

.render {overflow: auto; width:100vw; height: calc(100vh - 675px);}
.render .content {padding:7px 5px; display: flex; flex-wrap: wrap; justify-content: space-between; align-content: stretch; color: #df1b3b;}
.render .content > div {display: flex; flex-direction: column; width: 350px; margin: 0 2px 0;}
.render .content > div img {max-width: 100%; height: auto;}
