html, body{width:100%; height:100%; margin:0; }

@font-face{
font-family: novecento;
src: url(https://contents.internazionale.it/webdoc/tomato/font/Novecentowide-Light.otf);
}






/*-------------------------------------VideoPlayer-------*/

#play{ background-color:transparent; font-family:archive; font-size:20px; color:#999 }
#restart{ background-color:transparent; font-family: 'Quattrocento', serif; font-size:20px; border: solid #fff thin}
#buttonbar{ margin-top:-75px;
font-family:archive;
color:#999;
}
button:focus {
  outline-color: transparent;
  outline-style: none;
}



/*-------------------------------------SLIDER--------*/
.firstcharacter { float: left; color: #c0392b; font-size: 100px; line-height: 90px; padding-top: 2px; margin-right: 30px; padding-left: 3px; font-family: Quattrocento; font-weight:700; border-bottom: solid #c0392b 2px;  }


/*-------------------------------------MAP--------*/


     


@font-face
{
font-family: archive;
src: url(https://contents.internazionale.it/webdoc/tomato/font/Archive.otf);
}

.quotation-mark{ font-family: archive; font-size:50px; color:#282828 }
.quotation-mark em{ color:#c0392b; font-style:normal; }

/*-------------------------------------PARALLAX--------*/     




.parallax{ padding-top: 35%;
            width: 100%;
            float: right;
            margin-left: 0;
            margin-right: 0;
            clear: none;
            overflow: visible ;
            overflow-x: visible;
            overflow-y: visible;
          
              }
   
#parallax-01{ background:url(http://isaccochiaf.me/tomato_dark_side/img/ch_01_parallax.jpg);  
    
              background-attachment: fixed !important;
            -webkit-background-size: cover !important;
            -moz-background-size: cover !important;
            -o-background-size: cover !important;
            background-size: cover !important;
           
            
              }
          
#parallax-02{ background-image:url(http://isaccochiaf.me/tomato_dark_side/img/ch_02_parallax.jpg); 
     background-attachment: fixed !important;
            -webkit-background-size: cover !important;
            -moz-background-size: cover !important;
            -o-background-size: cover !important;
            background-size: cover !important;
            
              }

#parallax-03{ background-image:url(http://isaccochiaf.me/tomato_dark_side/img/ch_03_parallax.jpg); 
            background-attachment:fixed !important;
            -webkit-background-size: cover !important;
            -moz-background-size: cover !important;
            -o-background-size: cover !important;
            background-size: cover !important;
           
              }

#parallax-04{ background:url(https://contents.internazionale.it/webdoc/tomato/img/ch_04_parallax.jpg) ; 
    background-attachment:fixed !important;
             -webkit-background-size: cover !important;
            -moz-background-size: cover !important;
            -o-background-size: cover !important;
            background-size: cover !important;
              }
          
          .overlay {position: relative;}

.overlay q {font-size:25px;
            text-align:center;
            letter-spacing:3px;
            line-height:25px;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            margin: 0;
    font-weight:100;
            color:#fff;
            padding-top: 9em;
            padding-left:9em;
            padding-right:9em;
            background-color:rgba(60,60,60,0.5);
            
            font-family:quattrocento;
            
            -webkit-transition: all 2s;
            -moz-transition: all 2s;
            -o-transition: all 2s;
            transition: all 2s;
            -webkit-filter: opacity(1);
            opacity:1;
            }


          
  .cont:hover .overlay q { padding-top:11em; -webkit-filter: opacity(0); opacity:0;}   
          
      .cont { }    
          
/*-------------------------------------COVERS--------*/     

.bg-01{ height:100%;
        width:100%;
        background-color:#000;
        padding:100px;
        text-align:center;
        color:#FFF}
          

          
/*-------------------------------------Interactive Div--------
#block{
	width: 0; 
	height: 0; 
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid #323232;
   margin-top:20px;
    margin-left:8%;
}*/ 

#block{
	width:150px;
	height: 5px; 
	background-color:#c0392b;
   margin-top:20px;
    margin-left:5%;
}


#title {letter-spacing:7px;}
#title strong {color: #c0392b}

#small-text { font-size:110%; color:#999}
#small-text-name { font-size:1em; color:#999}
          
          
input[type=range] {
    -webkit-appearance: none;
    background-color: silver;
    width: 79%;
    height:36px;
    margin:0
}

input[type="range"]::-webkit-slider-thumb {
     -webkit-appearance: none;
    background-color: #e74c3c;
    
    width: 10px;
    height: 36px;
}
     
#playpausebtn {
    float:left;
    background-color:#e74c3c;
    padding:9.5px;
    margin-top:0;
    color:#fff;
    width:10%;
}

#playpausebtn:hover {
    cursor:pointer;
    background-color:#c0392b;
   
}

#seekslider {
    margin:0
}

#mutebtn {
    float:right;
    background-color:#e74c3c;
    padding:9.5px;
    margin-top:0;
    width:10%;
    color:#fff
}

#mutebtn:hover {
    
    background-color:#c0392b;
}



#video_controls_bar {
    
}

/*____________________Typorgaphy________________*/


.head-introduction {
    font-size:120%;
   color:#2F2F2F;
    letter-spacing:0.3em
}

.head-location {
    color:#999;
    font-size:100%;
    line-height:0px;
}

.full-page {
    height:100%;
    padding-top:18%;
    
}

.graph-caption {
    margin-top:30px;
}

.graph-caption p {
    font-size:100%;
    color:#999
}




.img-quote {
    font-family:quattrocento;
    font-size:110%;
    
   color:#999;
    line-height:26px;
    
}
 .img-quote p{ font-size:14px; font-style:normal; color:#c0392b;}

footer{ background-color:#333}

footer p {
    font-size:13px;
    color:#999;
    padding:10px 0 10px 0
    
            } 

#copyright-year {
    background-color:#999
}



video {
    width:100%;
    position:absolute;
    z-index:0
    
}

.over-video {
    position:absolute;
    color: white;
    z-index:100;
    margin-top:22.5%;
    margin-left:40%;
    
}
.over-video p{
    font-family:quattrocento;
    background-color:#fff;
    color:#c0392b;
    font-size:30px;
    padding:18px;

}



.tabs dd a{margin-right:auto; margin-left:auto;}

.tabs dd a.tabs_a {
    width:150px;
    height:150px;
    background-image:url(https://contents.internazionale.it/webdoc/tomato/img/t_tomato_hover.jpg);
    background-repeat:no-repeat;
   
}
 .tabs dd.active a.tabs_a{
    width:150px;
    height:150px;
    background-image:url(https://contents.internazionale.it/webdoc/tomato/img/t_tomato.jpg);
    background-repeat:no-repeat;
    
}

.tabs dd a.tabs_b {
    width:150px;
    height:150px;
    background-image:url(https://contents.internazionale.it/webdoc/tomato/img/t_can_hover.jpg);
    background-repeat:no-repeat;
    
}
 .tabs dd.active a.tabs_b {
    width:150px;
    height:150px;
    background-image:url(https://contents.internazionale.it/webdoc/tomato/img/t_can.jpg);
    background-repeat:no-repeat;
   
}

.tabs dd a.tabs_c {
    width:150px;
    height:150px;
    background-image:url(https://contents.internazionale.it/webdoc/tomato/img/t_market_hover.jpg);
    background-repeat:no-repeat;
    
}
 .tabs dd.active a.tabs_c {
    width:150px;
    height:150px;
    background-image:url(https://contents.internazionale.it/webdoc/tomato/img/t_market.jpg);
    background-repeat:no-repeat;
    
}

.tabs dd a.tabs_d {
    width:150px;
    height:150px;
    background-image:url(https://contents.internazionale.it/webdoc/tomato/img/t_hand_hover.jpg);
    background-repeat:no-repeat;
    
}
 .tabs dd.active a.tabs_d {
    width:150px;
    height:150px;
    background-image:url(https://contents.internazionale.it/webdoc/tomato/img/t_hand.jpg);
    background-repeat:no-repeat;
    
}

.tabs-content h4 {color:#c0392b}




/*VIDEO RESIZE*/
.wrapper{padding:4% 4%;background:#e4e5d9;border:solid 2rem #fff;}.videocontent{width:80%;max-width:960px;margin:0 auto;}.video-js{padding-top:55.25%;}.vjs-fullscreen{padding-top:0px;}
#small-text-footer {
    font-size:90%; color:#999
}

.overlay-Big {
    z-index:10000;
    background-color: rgba(255,255,255,0.9);
    position:fixed;
  
    margin:0;
    height:100%;
    width:100%;
    display:none;
}

.overlay-first-band {
    background-color: rgba(192,57,43,0.8);
    height:23%;
    padding-top:4%;
    color:#fff !important;
        
}

#close {
    float:right;
    position:absolute;
    padding:15px 15px 0 0;
    right:0;
    z-index:1000
}

.overlay-second-band {
    padding-top:4%;
}
.overlay-second-band p {
    font-size:1em;
}

.buttons-social img {
    margin-left:10px;
}



#logo-media {
    position:absolute;
    float:left;
    top:0;
}

.buttons-social {
    float:right;
    position:absolute;
    right:0;
    top:0;
    margin-top:10px;
    margin-right:10px;
}

  .vjs-default-skin .vjs-play-progress,
  .vjs-default-skin .vjs-volume-level { background-color: #ca3a3a }
  .vjs-default-skin .vjs-control-bar { font-size: 81% }

#headerSlideContainer {
	position: fixed;
	top:-70px;
	width: 100%;
    background-color:rgba(255,255,255,0.95);
    border-bottom:solid thin #CCCACA;
    z-index:10;
    padding:0.4em;
    height:47px;
}
#headerSlideContainer img {
    cursor:pointer;
}


.facebook {
    border: solid #c0392b thin;
    background-color:#fff;
    color:#c0392b
}

.facebook:hover {
   
    background-color:#c0392b;
    color:#fff
}