@import "reset.css";

@import url('https://fonts.googleapis.com/css2?family=Roboto+Flex:opsz,wght@8..144,100..1000&family=Roboto+Serif:ital,opsz,wght@0,8..144,100..900;1,8..144,100..900&display=swap');


.roboto-flex-<uniquifier> {
  font-family: "Roboto Flex", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "slnt" 0,
    "wdth" 100,
    "GRAD" 0,
    "XOPQ" 96,
    "XTRA" 468,
    "YOPQ" 79,
    "YTAS" 750,
    "YTDE" -203,
    "YTFI" 738,
    "YTLC" 514,
    "YTUC" 712;
}

.roboto-serif {
  font-family: "Roboto Serif", serif;
  font-optical-sizing: auto;
  font-weight: 200;
  font-style: normal;
  font-variation-settings:
    "wdth" 100,
    "GRAD" 0;
}

/* ICONE */
@font-face {
  font-family: 'day';
  src:  url('https://up.day.it/font/icone-day/day.eot');
  src:  url('https://up.day.it/font/icone-day/day.eot?#iefix') format('embedded-opentype'),
    url('https://up.day.it/font/icone-day/day.ttf?') format('truetype'),
    url('https://up.day.it/font/icone-day/day.woff?') format('woff'),
    url('https://up.day.it/font/icone-day/day.svg?#day') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^="ico_"], [class*=" ico_"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'day' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.ico_mail:before {
  content: "\e914";
}
.ico_sito:before {
  content: "\e917";
}
.ico_mobile:before {
  content: "\e915";
}
.ico_tel:before {
  content: "\e916";
}
.ico_file-empty:before {
  content: "\e913";
}
.ico_arrow-right:before {
  content: "\e900";
}
.ico_arrow-left:before {
  content: "\e908";
}
.ico_arrow-down:before {
  content: "\e909";
}
.ico_arrow-up:before {
  content: "\e90a";
}
.ico_circle-left:before {
  content: "\e90b";
}
.ico_circle-down:before {
  content: "\e90c";
}
.ico_circle-right:before {
  content: "\e90d";
}
.ico_circle-up:before {
  content: "\e90e";
}
.ico_gift:before {
  content: "\e906";
}
.ico_play:before {
  content: "\e904";
}
.ico_video:before {
  content: "\e903";
}
.ico_share:before {
  content: "\ea82";
}
.ico_keyboard_arrow_up:before {
  content: "\e90f";
}
.ico_keyboard_arrow_right:before {
  content: "\e910";
}
.ico_keyboard_arrow_left:before {
  content: "\e911";
}
.ico_keyboard_arrow_down:before {
  content: "\e912";
}
.ico_download:before {
  content: "\e907";
}
.ico_menu:before {
  content: "\e901";
}
.ico_tools-2:before {
  content: "\e905";
}
.ico_locked:before {
  content: "\e902";
}
/* //ICONE */

/* VARIABILI */

:root {
	--colore_vinaccia: #490F30;
	--colore_antracite: #1A1A1A;
	--colore_arancio: #FF8500;
	--colore_bianco: #ffffff;
	--colore_grigio: #4d5a61;
	--colore_grigio_chiaro: #EDF2F2;
	--colore_grigio_medio: #dcdcdc;
	--colore_rosso: #E5022F;
	--colore_azzurro: #0F70B7;
	--colore_verde: #64B145;
	--colore_viola:#59074D;
	--font_family: "Roboto", sans-serif;
	--max_outer: 1400px;
	--max_inner: 1140px;
	--max_testo: 760px;
}
.bg_vinaccia{	
  background-color: var(--colore_vinaccia);
}
.bg_antracite{	
  background-color: var(--colore_antracite);
}
.bg_arancio{	
  background-color: var(--colore_arancio);
}
.bg_grigio{
	background-color: var(--colore_grigio);
}
.bg_grigio_chiaro{
	background-color: var(--colore_grigio_chiaro);
}
.bg_grigio_medio{
	background-color: var(--colore_grigio_medio);
}
.bg_rosso{
	background-color: var(--colore_rosso);
}
.bg_azzurro{
	background-color: var(--colore_azzurro);
}
.bg_verde{
	background-color: var(--colore_verde);
}
.bg_viola{
	background-color: var(--colore_viola);
}
.bg_bianco{	
  background-color: var(--colore_bianco);
}
.colore_vinaccia{	
  color: var(--colore_vinaccia);
}
.colore_antracite{	
  color: var(--colore_antracite);
}
.colore_arancio{	
  color: var(--colore_arancio);
}
.colore_grigio{
	color: var(--colore_grigio);
}
.colore_grigio_chiaro{
	color: var(--colore_grigio_chiaro);
}
.colore_grigio_medio{
	color: var(--colore_grigio_medio);
}
.colore_rosso{
	color: var(--colore_rosso);
}
.colore_azzurro{
	color: var(--colore_azzurro);
}
.colore_verde{
	color: var(--colore_verde);
}
.colore_viola{
	color: var(--colore_viola);
}
.colore_bianco{	
  color: var(--colore_bianco);
}
/* //VARIABILI */

ol, ul, li {
	list-style: none;
	margin: 0;
	padding: 0;
	font-family: var(--font_family);
	font-weight: 300;
}
b, strong{
	font-weight: 700;
}
i, em{
	font-style: italic;
}

html,
body{
	width: 100%;
	height:100%;
	margin: 0;
	padding: 0;
}
body{
	background-color: var(--colore_bianco);
	color:var(--colore_antracite);
	font-family: var(--font_family);
	font-weight: 300;
	font-size: 1rem;
	line-height:1.5em;
}
strong{
	font-weight:700;
}
input,
textarea,
button{
 -webkit-appearance: none;
-moz-appearance: none !important;
}
input[type=checkbox]{
  -moz-appearance:checkbox !important;
  -webkit-appearance:checkbox !important;
}
input[type=radio]{
  -moz-appearance:radio !important;
  -webkit-appearance:radio !important;
}
::-webkit-datetime-edit-fields-wrapper {
}
::-webkit-datetime-edit-text {
}
::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-year-field {
}
::-webkit-inner-spin-button {
    display: none;
}
::-webkit-calendar-picker-indicator:hover {
    background:none;
}
::placeholder { /* Chrome, Firefox, Opera, Safari 10.1 */
color: var(--colore_grigio_medio);
opacity: 1; /* Firefox */
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: var(--colore_grigio_medio);
}
::-ms-input-placeholder { /* Microsoft Edge */
color: var(--colore_grigio_medio);
}
button:focus, input:focus{
    outline: none;
}
input:focus,
textarea:focus,
input[type="checkbox"]{
    /*outline: none;*/
	box-shadow: 0 0 0 var(--colore_arancio) !important;
    border: 2px solid var(--colore_arancio)  !important;
	margin: 2px 1px 0px 0px !important;
}
input[type="date"]:not(.has-value):before{
  /*color: lightgray;*/
  content: attr(placeholder);
}
input[type=number]::-webkit-inner-spin-button {
  opacity: 1 !important;
	display: block !important;
}
input:disabled {
  background-color: var(--colore_grigio_medio) !important;
    cursor: not-allowed;
}
a,
a:hover,
a:focus,
a:active,
a:visited {
	text-decoration:none;
	font-weight: 500;
}
a.link_testo,
a.link_testo:hover,
a.link_testo:focus,
a.link_testo:active,
a.link_testo:visited {
	font-family: var(--font_family);
    color: var(--colore_vinaccia);
	text-decoration:underline;
	font-weight: 500;
}
a.link_testo:hover{
    color: var(--colore_arancio);
}
h1,h2,h3,h4,h5,h6{	
	font-family: "Roboto Flex", sans-serif;
	font-weight: 700;
}
*,
:after,
:before {
    box-sizing: border-box;
}

/* GO TO TOP MOBILE */
.go-to-top {
  position: fixed;
  z-index: 100;
  bottom: 91px;
  right: 0;
  text-align: center;
	line-height: 2.5rem;
	font-size: 2.5rem;
	padding: 1rem;
  visibility: hidden;
  -webkit-border-radius:10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  border-radius: 10px;
	color: var(--colore_vinaccia);
  background: var(--colore_arancio);
  -webkit-transform: translate(100%, 0);
  -moz-transform: translate(100%, 0);
  -ms-transform: translate(100%, 0);
  -o-transform: translate(100%, 0);
  transform: translate(100%, 0);
  -webkit-transition: 0.15s ease-in-out;
  -moz-transition: 0.15s ease-in-out;
  -o-transition: 0.15s ease-in-out;
  transition: 0.15s ease-in-out;
  cursor: pointer;
  -webkit-box-shadow: 0 3px 15px rgba(0, 0, 0, 0.30);
  -moz-box-shadow: 0 3px 15px rgba(0, 0, 0, 0.30);
  box-shadow: 0 3px 15px rgba(0, 0, 0, 0.30);
}
  .go-to-top.visible {
    visibility: visible;
   -webkit-transform: translate(-39px, 0);
        -moz-transform: translate(-39px, 0);
        -ms-transform: translate(-39px, 0);
        -o-transform: translate(-39px, 0);
        transform: translate(-39px, 0);
}
.go-to-top.visible:hover{
	color: var(--colore_arancio);
  background: var(--colore_vinaccia);
}
/* //GO TO TOP MOBILE */

#container{
	height:100%;
}

/* CLASSI COMUNI MOBILE */
.cursor_link{
	cursor: pointer;
}
.hide{
	display: none;
}
.skip_link {
  position: absolute;
  left: -9999px;
  z-index: 999;
  padding: 1em;
  background-color: var(--colore_arancio);
  color: var(--colore_vinaccia) !important;
  opacity: 0;
}
.skip_link:focus {
  left: 1%;
  top: 1%;
  opacity: 1;
}
.outer_content{
	max-width: var(--max_outer);
	margin:  auto;
	position: relative;
}
.inner_content{
	max-width: var(--max_inner);
	margin:  auto;
	position: relative;
}
.testo_content{
	max-width: var(--max_testo);
	margin:  auto;
	position: relative;
}
.img_resize{
	width: 100%;
	 height: auto;
}
.img_resize img{
	width: 100%;
	 height: auto;
}
.bottone{
	width:auto;
	margin:0.5em auto;
	text-align:center;
	border:none;
	cursor:pointer;
	height:auto;
	color: var(--colore_vinaccia);
	background-color: var(--colore_arancio);
	font-family: var(--font_family);
	font-weight: 500;
	font-size:1.25rem;
	line-height:2rem;
	padding: 0.3em 1.5em;
	border-radius:0.5em;
	-webkit-border-radius:0.3em;
	-moz-border-radius:0.3em;
	display: inline-block;
}
.bottone:focus,
.bottone:active,
.bottone:visited{
	color: var(--colore_vinaccia);
	background-color: var(--colore_arancio);
}
.bottone:hover,
.btn_grigio:hover{
	color: var(--colore_arancio);
	background-color: var(--colore_vinaccia);
}
.btn_grigio,
.btn_grigio:focus,
.btn_grigio:active,
.btn_grigio:visited{
	color: var(--colore_vinaccia);
    background-color: var(--colore_grigio_medio);
	border: none;
}
.bottone_negativo{
	color: var(--colore_vinaccia);
	background-color: var(--colore_arancio);
}
.bottone_negativo:focus,
.bottone_negativo:active,
.bottone_negativo:visited{
	color: var(--colore_vinaccia);
	background-color: var(--colore_arancio);
}
.bottone_negativo:hover{
	color: var(--colore_bianco);
	background-color: var(--colore_viola);
}
.bottone_su_bianco:hover{
	color: var(--colore_vinaccia);
	background-color: var(--colore_arancio);
}
.giustificato{
	text-align: justify;
}
.destra{
	text-align: right;
}
.sinistra{
	text-align: left;
}
.centrato{
	text-align: center !important;
}
.spacing{	
	padding: 1em !important;
}
.spacing_vert{	
	padding: 1em inherit !important;
}
.spacing_oriz{	
	padding: inherit 1em !important;
}
.margine{	
	margin:2em auto !important;
}
.margine_bottom{	
	margin-bottom:2em !important;
}
.margine_top{
	margin-top:2em !important;
}
.lista_numerata{
	margin: 0.3em;
}
.lista_numerata li{
	list-style:decimal;
	margin-bottom: 1em;
    margin-left: 1.5em;
}
.lista_puntata{
	margin: 0.3em;
}
.lista_puntata li{
	list-style: none !important;
	margin-bottom: 1em;
	margin-left: 0.5em;
}
.lista_puntata li:before{   
	display: inline-block;
    content: '';
    width: 10px;
    height: 10px;
    background-color: var(--colore_arancio);
   -moz- border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    margin-right: 0.5em;
}
.lista_puntata li p{
	display: inline !important;
}
.tit{
	font-family: var(--font_family);
	font-size:2.175rem;
	line-height:1.25em;
	font-weight: 700;
}
.titolino{
	font-family: var(--font_family);
	font-size:1.55rem;
	line-height:1.25em;
}
.titoletto{
	font-family: var(--font_family);
	font-size:1.25rem;
	line-height:1.25em;
}
.sotto_titoletto{
	font-family: var(--font_family);
	font-size:1.025rem;
	line-height:1.25em;
}
.testo,
.paragrafo p{
	font-size: 1rem;
	line-height:1.5em;
	margin-bottom: 1em;
}
.paragrafo p{
	text-align: justify;
}
/* //CLASSI COMUNI MOBILE */

/* HEADER MOBILE */
#logo{
	max-width: 130px;
	position: relative;
	margin: 0 auto;
}
/* //HEADER MOBILE */

/* FOOTER MOBILE */
#footer{
	padding: 0.5em 0;
}
#footer p{
	font-size: 1rem;
}
/* //FOOTER MOBILE */


@media screen and (min-width: 701px) { /****************************************** visualizzazione TABLET ******************************************/

	/* HEADER TABLET */
	#logo{
		margin: 0;
	}
	/* //HEADER TABLET */
	
	/* CLASSI COMUNI TABLET */
	.bottone{
		font-size:1.35rem;
	}
	.tit{
		font-size:2.525rem;
	}
	.titolino{
		font-size:1.95rem;
	}
	.titoletto{
		font-size:1.55rem;
	}
	.sotto_titoletto{
		font-size:1.115rem;
	}
	.testo,
	.paragrafo p{
		font-size: 1.063rem;
	}
	/* //CLASSI COMUNI TABLET */
	
	/* FOOTER TABLET */
	/* //FOOTER TABLET */
}

@media screen and (min-width: 901px) { /****************************************** visualizzazione DESKTOP ******************************************/
	
	/* CLASSI COMUNI DESKTOP */
	.tit{
		font-size:3.125rem;
	}
	.titolino{
		font-size:2.2258rem;
	}
	.titoletto{
		font-size:1.85rem;
	}
	.sotto_titoletto{
		font-size:1.315rem;
	}
	.testo,
	.paragrafo p{
		font-size: 1.125rem;
	}
	/* //CLASSI COMUNI DESKTOP */
}

@media screen and (min-width: 1100px) { /****************************************** visualizzazione DESKTOP landscape 1100 ******************************************/
	.box_arrotondato figure .tit_evidenziato{
		width: 45%;
	}
	.wrapper .testo_box_obliquo:before{
		clip-path: polygon(0 0, 100% 60%, 100% 0);
		shape-outside: polygon(0 0, 100% 60%, 100% 0);
	}	
}


@media screen and (min-width: 1400px) { /****************************************** visualizzazione DESKTOP landscape 1400 ******************************************/	

	/* PROGETTO DESKTOP */
	.lista_autori .ico_autore{
		width: 250px;
	}
	/* //PROGETTO DESKTOP */
}

@media screen and (min-width: 1600px) { /****************************************** visualizzazione DESKTOP landscape 1600  ******************************************/
	.slide{
		background:no-repeat 90% center scroll;
	}	
	.testo_slide{
		width: 45%;
		margin: 0 3%;
	}
}

@media screen and (min-width: 1800px) { /****************************************** visualizzazione DESKTOP landscape 1800  ******************************************/
	.slide{
		background:no-repeat right center scroll;
	}	
}