/* --------------- Above --------------- */

.above {
   width: 100%;
   max-width: 1000px;
   min-width: 960px;
   height: 340px;
   text-align: left;
   position: relative; 
   background: url(/theme/img/above.png) repeat-x center top;
   } 



/* --------------- Hero --------------- */

#hero {
    width: 640px;
    height: 300px;
    background-color: white;
    position: absolute; 
    top: 20px;
    left: 20px;
    }
    
    @media (max-width : 1000px) { #hero { left: 0; } } 
	
.slide {
    border: 3px solid white;
    background-repeat: no-repeat;
    background-position: center top;
    position: relative; 
    }	
	
.slide a { 
    width: 634px;
    height: 294px;
    position: relative;
    display: block; 
    }

#hero .text {
    background: rgba(0,0,0,.6);
    width: 554px;
    height: 54px;
    overflow: hidden;
    padding: 11px 40px;  
    position: absolute;
    bottom: 0;
    -webkit-transition: background .3s ease-in-out;
    -moz-transition:    background .3s ease-in-out;
    -o-transition:      background .3s ease-in-out;
    -ms-transition:     background .3s ease-in-out;
    transition:         background .3s ease-in-out;     
    } 
  
#hero a:hover .text { background: rgba(0,0,0,1); }

#hero a h1 {
    height: 36px;
    overflow: hidden;
    color: white;
    font-size: 36px;
    line-height: 1;
    font-weight: 600;
    margin: 0;	
    -webkit-transition: all .3s ease-in-out;
    -moz-transition:    all .3s ease-in-out;
    -o-transition:      all .3s ease-in-out;
    -ms-transition:     all .3s ease-in-out;
    transition:         all .3s ease-in-out; 
    }	

#hero a p {
    height: 17px;
    overflow: hidden;
    margin: 0;  
    color: white;
    font-size: 15px;
    line-height: 1;
    }
    

/* --- Slide Tabs --- */
#hero ul { display: none; }

/* --- Back/Next Buttons --- */

#hero .control {
    background-position: center center;
    background-repeat: no-repeat;
    width: 15px;
    height: 23px;  
    position: absolute;
    bottom: 30px;
    opacity: .5; 
    -webkit-transition: all .3s ease-in-out;
    -moz-transition:    all .3s ease-in-out;
    -o-transition:      all .3s ease-in-out;
    -ms-transition:     all .3s ease-in-out;
    transition:         all .3s ease-in-out; 
    }	
    
    #hero .control:hover { 
        opacity: 1;  
        }
         
    #hero .control:active { 
        opacity: .75; 
        }
         
    #hero .control.back {
        background-image: url(/theme/img/left.png);
        left: 15px; 
        }			
    
    #hero .control.next {
        background-image: url(/theme/img/right.png);
        right: 15px; 
        }			



/* --------------- Below --------------- */

.below {;
   width: 960px;
   padding: 20px 0;
   text-align: left;
   position: relative; } 

.below .col1 { 
   width: 640px;
   float: left;
   padding: 0 20px 0 0; }    
.below .col2 { 
   width: 300px;
   float: left; }   
   
.below h2 { text-transform: uppercase; }     
                     
/* ------------ Promos ------------ */   

.promos a { 
   width: 200px;
   float: left; 
   margin-right: 20px; }
.promos a:last-child { margin-right: 0; } 

.promos a .thumb {
   background-color: #e6e6e6;
   background-repeat: no-repeat;
   background-position: center center;
   -moz-box-shadow:    inset 0 0 0 3px #e5e5e5;
   -webkit-box-shadow: inset 0 0 0 3px #e5e5e5;
   box-shadow:         inset 0 0 0 3px #e5e5e5;
   height: 110px; 
   margin: 0 0 5px;
   display: block; 
   transition:         all .35s ease-in-out;    
   -webkit-transition: all .35s ease-in-out;  
	-moz-transition:    all .35s ease-in-out;  
	-o-transition:      all .35s ease-in-out;  
	-ms-transition:     all .35s ease-in-out; } 
.promos a:hover .thumb {
   -moz-box-shadow:    inset 0 0 0 3px #be0000;
   -webkit-box-shadow: inset 0 0 0 3px #be0000;
   box-shadow:         inset 0 0 0 3px #be0000; }
.promos a:active .thumb {
   -moz-box-shadow:    inset 0 0 0 3px #710000;
   -webkit-box-shadow: inset 0 0 0 3px #710000;
   box-shadow:         inset 0 0 0 3px #710000; }

.promos h3 {
   margin-bottom: 5px;
   font-size: 28px;
   line-height: 1;
   color: #505050; 
   transition:         all .35s ease-in-out;    
   -webkit-transition: all .35s ease-in-out;  
   -moz-transition:    all .35s ease-in-out;  
	-o-transition:      all .35s ease-in-out;  
	-ms-transition:     all .35s ease-in-out; }
.promos a:hover h3 { color: #be0000; }
.promos a:active h3 { color: #710000; }

.promos p {
   font-size: 13px;
   line-height: 1.1;
   color: #585858; }
.promos a:hover p { color: #464646; }


/* ---- Feed Controls ---- */  

.feed .title {
   background: #a1a1a1;
   padding: 10px;
   margin-bottom: 15px;
   text-align: left;
   clear: both; 
   position: relative; }
.title a { color: #fff; }
.title a:hover { color: #e1e1e1; }

.title h2 { margin: 0; }

.feed ul {
    list-style: none;
    margin: 0;
    position: absolute;
    right: 0;
    top: 0; }
      
.feed li { 
   font-family: 'nimbus-sans-condensed','Arial Narrow',arial,sans-serif;   
   display: block;
   margin: 10px 10px 10px 0;
   float: left; }

   .feed li a { 
      display: block;
      padding: 0 10px;
      font-size: 16px;
      line-height: 28px;      
      position: relative;
      -webkit-transition: all .3s ease-in-out;
      	-moz-transition: all .3s ease-in-out;
   		-o-transition:   all .3s ease-in-out;
   		-ms-transition:  all .3s ease-in-out;
   		transition:      all .3s ease-in-out; }
   .feed li:hover a {
      background: #858585; }
         
   .feed li:active a {
      background: #c6c6c6;
      color: #000;
      -moz-box-shadow:    inset 0 1px 2px rgba(0,0,0,.3);
      -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.3);
      box-shadow:         inset 0 1px 2px rgba(0,0,0,.3); }
         
   .feed li.ui-tabs-active a {
      position: relative; }  
         
   .feed li.ui-tabs-active a:after { 
      border: solid transparent; 
      content: " "; 
      height: 0; 
      width: 0; 
      pointer-events: none;
      border-color: rgba(255, 255, 255, 0); 
      border-bottom-color: #ffffff;
      position: absolute;
      left: 50%; 
      bottom: -10px;
      border-width: 7px; 
      margin-left: -7px; }         

/* ------- Activity Feed ------ */  

.activity {
   background: #eaeaea;
   padding: 10px 15px 15px; }




/* ------- Multimedia buttons on translation pages ------ */  

.multimedia-buttons {
    height: 48px;
    margin-bottom: 20px;
    position: relative;
    }

.multimedia-buttons a {
    position: absolute;
    padding: 15px;
    text-align: center;
    color: white;
    font-family: 'nimbus-sans-condensed','Arial Narrow',arial,sans-serif;
    font-size: 23px;
    line-height: .8;
    font-weight: 600;
    text-transform: uppercase;
    display: block;
    width: 110px;
    -webkit-transition: color .3s ease-in-out;
    -moz-transition: color .3s ease-in-out;
    -o-transition:   color .3s ease-in-out;
    -ms-transition:  color .3s ease-in-out;
    transition:      color .3s ease-in-out; 
    }

.multimedia-buttons a.video {
    background: #be0000;
    left: 0;
    }
    
    .multimedia-buttons a.video:hover {
        background: #710000;
        }

.multimedia-buttons a.photos {
    background: #710000;
    right: 0;
    }
    
    .multimedia-buttons a.photos:hover {
        background: #3e0000;
        }