:root{
	--blu:#538eee;
	--arancio:#f4a117;
	--nero:#232323;
	--bianco:#fefefe;
}
h1,h2,h3,h4,h5,h6{font-family:monospace}
a:hover{text-decoration:none}
*{box-sizing:border-box}
img{max-width:100%}

@media (max-width:639px){
	.mobile{display:block}
	.desktop{display:none}
}
@media (min-width:640px){
	.mobile{display:none !important}
	.desktop{display:block}
}

.pretext{border-left:6px solid transparent;padding-left:15px;margin-bottom:15px}
.pretext *{margin:0;padding:0}
.pretext.blu{border-color:var(--blu)}
.pretext.arancio{border-color:var(--arancio)}
.pretext.nero{border-color:var(--nero)}
.pretext.bianco{border-color:var(--bianco)}

.sottotext{border-bottom:3px solid transparent;padding-bottom:20px;margin-bottom:20px;display:inline-block}
.sottotext *{margin:0;padding:0}
.sottotext.blu{border-color:var(--blu)}
.sottotext.arancio{border-color:var(--arancio)}
.sottotext.nero{border-color:var(--nero)}
.sottotext.bianco{border-color:var(--bianco)}

.textblu{color:var(--blu)}
.textarancio{color:var(--arancio)}
.textbianco{color:var(--bianco)}
.textnero{color:var(--nero)}

.sep{position:relative;display:inline-block;width:100px;height:4px;margin:10px 0 20px}
.sep.blu{background:var(--blu)}
.sep.arancio{background:var(--arancio)}
.sep.bianco{background:var(--bianco)}
.sep.nero{background:var(--nero)}

.the_content{ }

#mobilemenu{sdisplay:none}
.topmenu{display:flex;text-align:center;position:fixed;left:0;right:0;top:0;z-index:100000;background:var(--nero);color:var(--bianco);width:100%;xborder-bottom:1px solid var(--bianco)}
.topmenu .left,
.topmenu .right{width:70px}
.topmenu .center{width:100%}
.topmenu .title{padding:10px 0;line-height:1}
.topmenu .logo{position:absolute;width:60px;left:10px;z-index:100000}
.topmenu .menu a{padding:10px 15px;color:inherit;font-size:14px;display:inline-block;text-transform:uppercase;border-top:4px solid transparent;border-bottom:4px solid transparent}
.topmenu .menu a:hover,.topmenu .menu a.active{border-color:var(--arancio)}
.topmenu button{background:transparent;border:0;font-size:29px;padding:10px;color:inherit;display:inline-block;margin:0}
.topmenu button:hover{background:var(--arancio)}

.header{background-color:#000;color:var(--bianco);position:relative;background-position:left center;background-repeat:no-repeat;background-size:contain}
.header .the_content{background:transparent;color:#fff;max-width:480px}
@media (max-width:639px){
	.header{background-size:cover}
}

.flex{height:100vh;display:flex;flex-direction:row;align-items:center;justify-content:center}
.col2{justify-content:flex-start;flex:1;width:50%;overflow:auto;max-height:100%;padding:15px}
.col3{justify-content:flex-start;flex:1;width:calc(100% / 3);overflow:auto;max-height:100%;padding:15px}

.presentazione{background-color:var(--nero);text-align:center;padding:100px 50px;background-position:bottom center;background-repeat:no-repeat;background-size:cover}
.presentazione .colonne{display:flex;flex-direction:row;}
.presentazione .col{justify-content:flex-start;flex:1;overflow:auto;max-height:100%;}
.presentazione .col.left{width:calc((100% - 200px) / 2);text-align:left}
.presentazione .col.middle{max-width:200px;padding:20px}
.presentazione .col.right{width:calc((100% - 200px) / 2);text-align:left}
.presentazione .the_content{display:inline-block;background:transparent;color:#fff;max-width:480px}

.fumetto{background:#f0f0f0;color:#232323;padding:20px 20px 15px 20px;border-radius:20px;text-align:left;margin:20px 10px}

.fumetto::before{position:absolute;top:50%;transform:translateY(-50%);width:0;height:0;content:''}
.fumetto.destra::before{border-left:25px solid #f0f0f0;border-top:20px solid transparent;border-bottom:20px solid transparent;right:0}
.fumetto.sinistra::before{border-right:25px solid #f0f0f0;border-top:20px solid transparent;border-bottom:20px solid transparent;left:0}

.intermezzo{padding:100px 50px;text-align:center;background-position:bottom center;background-repeat:no-repeat;background-size:cover;}
.intermezzo.scuro{background-color:var(--nero);color:var(--bianco)}
.intermezzo.chiaro{background-color:var(--bianco);color:var(--nero)}
.intermezzo.arancio{background-color:var(--arancio);color:var(--nero)}
.intermezzo.mix{background:linear-gradient(#e66465, #9198e5)}

.corsiline{background:var(--nero);color:var(--bianco)}
.corsiline .timeline-right,
.corsiline .timeline-left{height:100%}
.corsiline .timeline-end{min-height:150px}
.corsiline .the_content{margin-top:25px}

@media (max-width:639px){
	.presentazione{padding:50px 0}
	.intermezzo{padding:50px 0}
	.corsiline{padding:50px 0}
}
.bottommenu{padding:0 50px;background:var(--blue);color:var(--bianco);text-align:center}
.bottommenu a{color:inherit;padding:20px;display:inline-block}
.bottommenu a:hover{background:var(--bianco);color:var(--blu)}
footer{padding-top:50px;padding-bottom:50px;background:#111;color:var(--bianco)}