/*
	colors:
	#161A1D navbar
   #708090 blueish
   #eef0f2 blu highlight
	#f16229 orange highlight

*/


@font-face {
  font-family: 'roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto Regular'), local('Roboto-Regular'), url('fonts/Roboto-Regular.ttf');
}

	*{
		background:transparent;
		border:0;
		outline:0;
		padding:0;
		margin:0;
      -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	}

	li {
		list-style:none;
	}   

	html,body,header{
		width:100%;
		height:100%;
		color:#161A1D;
		font-family: 'roboto', 'tahoma', 'arial', 'sans serif';
		font-size:16px;
	}

	.clearfix:after {
		clear: both;
		content: " ";
		display: block;
		font-size: 0;
		height: 0;
		line-height: 0;
		visibility: hidden;
		width: 0;
	}


   section:first-of-type:not(.navaware):before{/*make space for the navbar*/
		content:'';
      display:block;
      visibility:hidden;
      height:114px;
   }
   a.wheel-snap:not([href]){/*anchor point that respects the navbar*/
   	visibility: hidden;
      position  : absolute;
      top		 :-114px;
   }
   .separator-container{
 	   position  :  relative;
      height  	 :  100%;
      width   	 :  100%;
      padding	 :  0px;
      margin-top: -114px;
   }
   .separator-container .separator{
   	position:absolute;
		overflow: hidden;
      background-position : center top;
      background-repeat	  : no-repeat;
      background-size	  : cover;
      top:114px;left:0px;right:0px;bottom:0px;
   }
   .separator > img{/*the separator div contains the same image as background but with better positioning/resolution.
         if the browser doesn't see the css the user will at least the image from the tag*/
         display:none;
   }



	.container {
		margin:0 auto;
		width:960px;
		padding-top   :50px;
		padding-bottom:50px;
		z-index:10;
		position:relative;
      transition:width 1s ease;
      -webkit-transition:width 1s ease;
   }

	.white {
		color:#FFF;
	}

	.color {
		color:#708090;
	}
        .color-bg{
                background-color:#708090
        }

	.black {
		color:#2D333A;
	}

	.mb {
		padding-bottom:50px;
	}

	.mt {
		padding-top:50px;
	}

	.center {
		text-align:center;
		margin-top:70px;
	}

	.big-paragraph {
		font-size:18px;
		line-height:24px;
	}

	.left {
		float:left;
	}


	h1,h2,h3{
   	font-size: 42px; line-height:42px;
      font-family :'arial','sans-serif';
      margin-bottom:16px;
   }
   h2{
		font-size: 36px; line-height:36px;
      margin-bottom:8px;
   }
   h3{
		font-size: 30px; line-height:30px;
      margin-bottom:4px;      
   }
	h4 { font-size: 24px; line-height:24px; font-family :'arial','sans-serif';}
	h5 { font-size: 18px; line-height:18px; font-family :'arial','sans-serif';}
	h5 { font-size: 16px; line-height:24px; font-family :'arial','sans-serif';}   

	p { line-height:28px; font-size:16px; margin-top:16px;}
   p.justified{
     text-align: justify;
     -moz-text-align: justify;
   }
   p.justified.fully{
     text-align-last: justify;
     -moz-text-align-last: justify;
   }
   p.justified.fully:after {
    content: ""; display: inline-block; width: 100%;
   }
   
   p.caption {
       font-size: 13px;
           line-height: 20px;
   }

	a, li {
	  	color:#afafaf;
      text-decoration: none;
    }
    
    .captionlink {
        color:#ffffff;
    }

	img, div, input, textarea {
	}

	.one_half {
    	width: 46%;
	}

	.one_third {
		width: 28%;
	}

	.one_fourth {
		width: 19%;
	}

	.one_fifth {
		width: 13.6%;
	}
	
	.two_fifth {
		width: 35.2%;
	}

	.two_fourth {
		width: 46%;
	}	
	
	.two_third {
		width: 64%;
	}
	
	.three_fifth {
		width: 56.8%;
	}
	
	.three_fourth {
		width: 76%;
	}
	
	.four_fifth {
		width: 78.4%;
	}
	

	.one_half, .one_third, .two_third, .three_fourth, .one_fourth, .two_fourth, .one_fifth, .two_fifth, .three_fifth, .four_fifth{
		float: left;
		margin-top	 : 20px;
		margin-bottom: 20px;
		margin-right : 7.6%;
		position: relative;
	}
    
    .centered {
        margin-left: 27%;
    }
	
	.last {
		margin-right:0px!important;
	}
	
	.btn-small {
		color: #fff;
		padding: 0px 15px 0px 15px;
		background:#708090;
		height:35px;
		text-align:center;
		display:inline-block;
		line-height:35px;
		margin-top:20px;
	}
	
	.btn-small:hover {
		background:#2D333A;
		color:#fff;
		opacity:1;
	}


/* ------------------------------------------------------------------------------- */
/*  2. Menu
/* ------------------------------------------------------------------------------- */


	#navigation {
		background:#161A1D;
		width     : 100%;
		height    : 114px;
		z-index   : 1000;
	}

   #navigation.fixed {
      position:fixed;
      top	  :0px;
      bottom  :auto;
   }

   #navigation.sticky {
      position:absolute;
      bottom  :0px;
   }

	#logo {
		text-transform:none;
		margin-left:50px;
		padding:0;
		color:#fff;
      text-align:justify;
      width :280px;
      height:114px;
      line-height:114px;
      position:absolute;
      vertical-align:middle;
      float:left;
	}
   #logo img{
      vertical-align:middle;
   }
	
	.dot {
		font-size:45px;
	}

@media only screen and (min-width: 900px) {

	#navigation > ul {
		padding-top :34px;
		margin-right:30px;
		float:right;
	}
	
	#navigation > ul > li {
		display: inline;
		margin-right:20px;
      font-family : 'arial','sans-serif';
	}

	#navigation > ul > li > a, #navigation > ul > li > a:active, #navigation > ul > li > a:visited {
		color:#708090;
		padding-top:30px;
		height:104px;
		text-transform:uppercase;
		font-weight:bold;
		font-size:14px;
		padding-bottom:52px;
		transition:border 1s ease,color 1s ease;
		-webkit-transition-property:border 1s ease,color 1s ease;
	}

	#navigation > ul > li:hover > a {
		color: #708090;
		border-top: 5px solid #708090;
	}

   #navigation > ul > li > a.current {
		color: #eef0f2;
		border-top: 5px solid #eef0f2;
	}

       #navigation > ul > li > a.offline {
		color: #eef0f2;
		border-top: 5px solid #eef0f2;
	}

        /* second level menus */
        #navigation > ul > li.has-submenu:hover > a{
                padding-bottom:12px;
                background-image:url('../images/tabActiveArrow.png');
                background-repeat:no-repeat;
                background-position:bottom center;
        }

        #navigation > ul > li.has-submenu > a.current {
                padding-bottom:12px;
                background-image:url('../images/tabHoverArrow.png');
                background-repeat:no-repeat;
                background-position:bottom center;
        }
        
        #navigation > ul > li.has-submenu > a.offline {
                padding-bottom:12px;
                background-repeat:no-repeat;
                background-position:bottom center;
        }

        #navigation > ul > li > ul {
                visibility:hidden;
		          background:transparent;
		          outline:0;
		          padding:0;
                margin:0;
                position: absolute;
                margin-top :11px;
                padding-top:8px;
                right:50px;
                text-align:right;
        }

        #navigation > ul > li>a.current + ul , #navigation > ul > li:hover > ul {
                visibility:visible;
        }

        #navigation > ul > li > ul:after {
                content: ' ';
                position: absolute;
                margin : 0px;
                padding: 0px;
                left   : 0;
                right  : 0;
                bottom : 0;
                top    : -2px;
                z-index:-1;
        }
        #navigation > ul > li:hover > ul:after {
                border-top:1px solid #708090;
        }
        #navigation > ul > li>a.current + ul:after{
                border-top:1px solid #eef0f2;
        }


		  #navigation > ul > li > ul > li  {
	        display:inline;
           margin-top:4px;
		  }
        #navigation > ul > li > ul > li > a {
   		  color:#708090;
           text-transform:uppercase;
        	  font-size:14px;
		     font-weight:normal;
        }
        #navigation > ul > li > ul > li:not(:first-child) > a {
           padding-left:20px;
        }

        #navigation > ul > li > ul > li.current > a, #navigation > ul > li > ul > li > a:hover{
				color:#eef0f2;
        }

}

/* ------------------------------------------------------------------------------- */
/*  3. Pages and Subpages
/* ------------------------------------------------------------------------------- */

	.ourteam {
		background:#ebebeb;
	}
	
	.schedule-visit {
		background:#708090;
	}
	
	.projects-filters {
		background:#2D333A;
	}
	
	#news {
		background:#dddddd;
	}
	
	.twitter {
		background:#708090;
	}
	
	.contact-header {
		background:#fff;
	}

   .contact-header .container{
      padding-bottom:80px;
   }
	
	.contact-form {
		background:#ECECEC;
	}
	
	.footer {
		background:#2D333A;
	}

	.presskit {
		background:#FFFFFF;
	}

   section.infozone{
   	width:100%;
   }
	section.infozone h1{
		margin-bottom:15px;
   }
	section.infozone p{
      text-align: justify;
      -moz-text-align: justify;
   }

   section.infozone:nth-of-type(odd){
   	background-color:white;
      color:#2D333A;
   }
   section.infozone:nth-of-type(odd) a{
      color:#2D333A;
      border-bottom:1px dotted #2D333A;
   }
   section.infozone:nth-of-type(odd) a:hover{
      color:#2D333A;
      border-bottom:1px solid #2D333A;      
   }

   section.infozone:nth-of-type(odd) h2,section.infozone:nth-of-type(odd) h1{
   	background-color:white;
      color:#708090;
   }
   section.infozone:nth-of-type(even){
   	background-color:#708090;
      color:#ffffff;
   }
   section.infozone:nth-of-type(even) a{
      color:#ffffff;
      border-bottom:1px dotted #e8e8e8;
   }
   section.infozone:nth-of-type(even) a:hover{
      color:#ffffff;
      border-bottom:1px solid #e8e8e8;      
   }

   section.infozone:first-of-type{
		margin-top:0px;
   }
   section.infozone:first-of-type h1{
		color:#708090;
   }
   section.infozone:first-of-type p{
		color:#161A1D;
   }


	
/* ------------------------------------------------------------------------------- */
/*  6. About Us
/* ------------------------------------------------------------------------------- */

	
	.meter { 
		height: 30px;
		position: relative;
		margin: 0 0 35px 0;
		background:#ebebeb;
		width:100%
	}
	
	.meter > div {
		display: block;
		height: 100%;
		background-color:#708090;
	}
	
	.meter p {
		position:absolute;
		margin-top:5px;
		margin-left:10px;
	}	

	.team {
		width:225px;
		height:280px;
		background-color:#fff;
		float:left;
		margin-right:20px;
		overflow:hidden;
	}
	
	.team img.user{
		position:absolute;
	}
	
	.team-overlay {
		width:185px;
		height:240px;
		background-color:#fff;
		padding:20px;
		position:relative;
		margin-top:200px;
	}
	
	.team:hover > .team-overlay{
		margin-top:0px;		
	}
	
	.team-overlay h5 {
		margin-bottom:2px;
	}
	
	p.team-function {
		color:#A1A1A1;
		margin-bottom:20px;
	}
	
	p.team-description {
		color:#555555;
		line-height:18px;
		margin-bottom:45px;
	}
	
	.team-social {
		width:27px;
		height:27px;
		background-color:#2D333A;
		margin-right:10px;
		float:left;
		border-radius:3px;
		bottom:20px;
	}
	
	.team-social:hover {
		background-color:#708090;
	}
	
	.team-social img{
		padding:3px;
	}



/*
	tiles
*/
   .thumblink{
	  padding:0px;
     margin:0px;
     display:block;
   }

   .thumblink:hover:after{
  		content :'';
      position:absolute;
      top	  :0px;
      left	  :0px;
      right	  :0px;
      bottom  :0px;
      background-color: rgba(169,179,188,0.3);/*rgba(112,128,144,0.5);*/
	}

   .link-tile{
      position  :relative;
      min-height:200px;
      width		 :100%;
   }

   /*
   .link-tile:hover{
      filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'saturate\' values=\'0.3\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */         </filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
      a-webkit-filter: grayscale(100%);
   }
   */

	.heading-and-icon {
      position:absolute;
      width :100%;
      height:100%;
	}

	.heading-and-icon h3 {
	   position:absolute;
      bottom  : 0px;
      left    : 0px;
      right   : 0px;  
      margin  : 0px;
      padding : 10px;
      color:#2D333A;
      text-transform:uppercase;
      background:rgba(255,255,255,0.5) url('../images/arrow_right_small.png') right center no-repeat;
	}

   .heading-and-icon + p{
   	color:#161A1D;
      background-color: rgba(255,255,255,0.5);
   }

   .action-form-zone{
      position:relative;
      background:#708090;
      width:100%;
      -margin-top:-50px;
   }
   .action-form-zone .container{
      -padding-top:30px;
   }
   .action-form{
      background:#708090;
   }
	.action-form *{
		float:left;
		margin-right :20px;
		margin-top	 :8px;
      margin-bottom:8px;
      line-height  :46px;
      height       :46px;
		border:none;
	}

	.action-form input{
		width:200px;
      padding:0px 3%;
      font-size    :16px;
		background:#fff;
		color:#2D333A;
	}

	.action-form button{
		color: #fff;
      float: left;
      font-size    :16px;
		padding: 0px 20px;
		background:#2D333A;
		text-align:center;
		display:inline-block;
		cursor:pointer;
		transition: all 0.3s ease 0s;
      -webkit-transition: all 0.3s ease 0s;
	}

	.action-form button:hover {
		background:#6C7075;
	}

	.action-form button:active {
		transform:translate(1px,1px);
	}




	#contactform input{
		width:94%;
		padding-left:3%;
		padding-right:3%;
		padding-top:12px;
		padding-bottom:12px;
		background:#fff;
		color:#808080;
		font-size:16px;
	}
	#contactform input:not(:first-child){
		margin-top:20px;
   }

	#contactform input:focus {
		color:#808080;
	}

	#contactform textarea {
		width:94%;
		padding-left:3%;
		padding-right:3%;
		padding-top:12px;
		padding-bottom:12px;
		background:#fff;
		height:150px;
		resize:none;
		color:#808080;
		font-size:16px;
      font-family:inherit;

	}

	#contactform textarea:focus {
		color:#808080;
	}

	#contactform button.send_message {/*no margin here because margins of floating elements don't collapse*/
		width:120px;
      font-size:16px;
      line-height:46px;
      text-align:center;
		background:#708090;
		float:left;
		color:#FFF;
		cursor:pointer;
	}
	
	#contactform button.send_message:hover {
		background:#2D333A;
	}

	.error_message {
		background-color: #FFE9E9;
		border-color: #FBC4C4;
		border-image: none;
		border-style: solid;
		border-width: 1px 1px 1px 5px;
		color: #DE5959;
		font-size: 12px;
		line-height: 18px;
		margin-bottom: 15px;
		padding: 15px 40px 15px 18px;
		position: relative;
		float:none;
		width:auto;
	}
	
	fieldset {
		position:relative;
		float:left;
		padding:0;
		border:0 none;
		width:100%;
	}

	fieldset h1{
		font-size:24px;
		color:#000
	}

	.footer ul.contactus {
		-border-bottom: 1px solid #363942;
		display: block;
		-letter-spacing: -1px;
		-margin-bottom: 35px;
		overflow: hidden;
		padding-bottom: 24px;
	}
	
	.footer ul.contactus li {
		color: #FFFFFF;
		display: block;
		float: left;
		font-size  : 16px;
		font-weight: 700;
		line-height: 36px;
		//margin-right: 50px;
      height:36px;
	}
   .footer ul.contactus li span a{
     color:#ffffff;
   }
   .footer ul.contactus li span a:hover{
	  color:#708090;//	text-decoration:underline;
   }
	
	.footer ul.contactus li span.mail:after {
		background: url("../images/mail.png") right center no-repeat transparent;
		content : "";
		position: absolute;
		left: 0px;
		width : 36px;
		height: 36px;
	}

	.footer ul.contactus li span.mail {
		padding-left: 50px;
		position: relative;
	}

	.footer ul.contactus li span.phone:after {
		background: url("../images/phone.png") right center no-repeat transparent;
		content: "";
		position: absolute;
		left: 0px;
		width: 36px;
		height: 36px;
	}

	.footer ul.contactus li span.phone {
		color: #FFFFFF;
		padding-left: 51px;
		position: relative;
	}


	.footer ul.contactus li span.follow:after {
		background: url("../images/twitter_f.png") right center no-repeat transparent;
		content: "";
		position: absolute;
		left: 0px;
		width: 36px;
		height: 36px;
	}

	.footer ul.contactus li span.follow {
		color: #FFFFFF;
		padding-left: 51px;
		position: relative;
	}
    
	.footer ul.contactus li span.facebook:after {
		background: url("../images/facebook_q.png") right center no-repeat transparent;
		content: "";
		position: absolute;
		left: 0px;
		width: 36px;
		height: 36px;
	}

	.footer ul.contactus li span.facebook {
		color: #FFFFFF;
		padding-left: 51px;
		position: relative;
	}    
    
	.presskit ul.contactus {
		-border-bottom: 1px solid #363942;
		display: block;
		-letter-spacing: -1px;
		-margin-bottom: 35px;
		overflow: hidden;
		padding-bottom: 24px;
	}
	
	.presskit ul.contactus li {
		color: #000000;
		display: block;
		float: left;
		font-size  : 16px;
		font-weight: 700;
		line-height: 36px;
		//margin-right: 50px;
      height:36px;
	}
   .presskit ul.contactus li span a{
     color:#000000;
   }
   .presskit ul.contactus li span a:hover{
	  color:#708090;//	text-decoration:underline;
   }
	
	.presskit ul.contactus li span.mail:after {
		background: url("../images/mail.png") right center no-repeat transparent;
		content : "";
		position: absolute;
		left: 0px;
		width : 36px;
		height: 36px;
	}

	.presskit ul.contactus li span.mail {
		padding-left: 50px;
		position: relative;
	}

	.presskit ul.contactus li span.phone:after {
		background: url("../images/phone.png") right center no-repeat transparent;
		content: "";
		position: absolute;
		left: 0px;
		width: 36px;
		height: 36px;
	}

	.presskit ul.contactus li span.phone {
		color: #000000;
		padding-left: 51px;
		position: relative;
	}


	.presskit ul.contactus li span.follow:after {
		background: url("../images/twitter_f.png") right center no-repeat transparent;
		content: "";
		position: absolute;
		left: 0px;
		width: 36px;
		height: 36px;
	}

	.presskit ul.contactus li span.follow {
		color: #FFFFFF;
		padding-left: 51px;
		position: relative;
	}
    
	.presskit ul.contactus li span.facebook:after {
		background: url("../images/facebook_q.png") right center no-repeat transparent;
		content: "";
		position: absolute;
		left: 0px;
		width: 36px;
		height: 36px;
	}

	.presskit ul.contactus li span.facebook {
		color: #FFFFFF;
		padding-left: 51px;
		position: relative;
	}    

    li.pressdesc {
        padding: 5px 0px;
    }    
    
     li.pressdesc strong {
        color: #000000;
    }       
	.copyright {
		-margin-top:35px;
		padding-top:35px;
		width:100%;
		-border-top: 1px solid #363942;
		float:left;
      font-size:12px;
	}
	
	.copyright p{
		color:#fff;
		opacity:0.3;
	}





        .container.landing{
                padding-top:0px;
        }

        .button-play-overlay {
            position:absolute;                                                      
            display :block;	                                 
            width :100%;
            height:100%;
				background:url('../images/play.png') center center no-repeat;
            opacity:0.3;
        }
        .button-play-overlay:hover:after{
            content    :'click to play';
            position:absolute;     
            display    :block;
            width      :96px;
            height     :20px;
            top        :50%;
            left       :50%;
            margin-left:-48px;
            margin-top : 50px;
            font-size  : 14px;
            line-height:20px;
            text-align:center;
            background-color:#708090;
            border-radius:6px;
            color:white;

        }
        .slide .button-play-overlay{
            width :100px;
            height:100px;
            right :20px;
            top   :20px;
        }

        .button-play-overlay:hover {
            cursor:pointer;
            opacity:0.8;
        }

        .button-maxmz-overlay {
            position:absolute;
            display :block;
				width :100%;
            height:100%;
            background:url('../images/maxm.png') center center no-repeat;                          
            opacity:0.3;
        }

        .button-maxmz-overlay:hover {/*?*/
            cursor:pointer;
            opacity:0.8;
        }



		/*video player*/
		.maxwrapper{
			display	:none;
			position:fixed;
			z-index	:1200;
			top		:0px;
			left		:0px;
			width		:100%;
			height	:100%;
         overflow	:hiddden;
         background-color:black;
      }

		.maxwrapper:target{
			display:block;
		}

      .maxwrapper .maxmenu{
         height :48px;
         text-align:right;
         border-bottom:1px solid #708090;
      }
      .maxwrapper .maxmenu a{
      	margin-right:32px;
         color:white;
			font-family: monospace,sans-serif;
         font-size:32px;
      }
      .maxwrapper .maxcontent{
			position:absolute;
         top	:49px;
         bottom:0px;
         left	:0px;
         right	:0px;
      }

      .maxwrapper .maxcontent iframe{
      	width :100%;
         height:100%;
      }
      
      
.section-caption {
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    margin: 0px;
    padding: 10px;
    color: #2D333A;
    /* text-transform: uppercase; */
    font-size: 13px;
    background: rgba(255,255,255,0.5);
    width: auto;
    text-align: center;
    margin: auto;
}    

.section-caption-text h3 {
    /* text-transform: uppercase; */
    font-size: 13px;
    line-height: 20px;
    background: transparent;
    width: 960px;
    text-align: center;
    display: inline-block;
}

@media only screen and (max-width: 1024px) {
	.container {
		width:720px;
	}
   .link-tile{
      min-height:240px;
   }
   
   .section-caption h3 {
       width: 700px;
   }
}

@media only screen and (max-width: 768px) {
	#logo {
		margin-left:40px;
	}

	.container {
		width:440px;
	}

	.one_half   , .one_third   , .one_fourth, .one_fifth, .one_sixth,
   .two_fifth  , .two_fourth  , .two_third , .three_fifth, .three_fourth, .four_fifth {
		width: 100%;
	}
    
    .centered {
        margin-left: 0;
    }
    
   .section-caption h3 {
       width: 420px;
       font-size: 12px;
   }
}


@media only screen and (max-width: 480px) {

	h1 { font-size: 45px; line-height:45px;}
   h2 { font-size: 30px; line-height:30px;}
   h3 { font-size: 24px; line-height:24px;}
   h4 { font-size: 20px; line-height:20px;}
   h5 { font-size: 14px; line-height:14px;}

	.container {
		width:80%;
      min-width:288px;
	}

    .section-caption h3 {
       width: 300px;
       font-size: 12px;
   }
}


@media only screen and (max-width: 320px) {

	.container {
		width:90%;
      min-width:288px;
	}

	.one_half   , .one_third , .one_fourth, .one_fifth, .one_sixth, .two_fifth,
   .two_fourth , .two_third , .three_fifth, .three_fourth, .four_fifth {
      width:100%;
	}

	#logo {
		margin-left:10px;
	}
    
    .section-caption h3 {
       width: 250px;
       font-size: 11px;
   }
        
}



.uploadFileBox{
	visibility:hidden;
   background-color:gray;
   color:white;
   position:fixed;
   width:320px;
   height:180px;
   top:50%;
   left:50%;
   margin-left	:-160px;
   margin-top	:-90px;
   z-index:1024
}



iframe.ytvideo{
	position:absolute;
	display:none;
   width :100%;
   height:100%;
	background:black;
}

video{
	position:absolute;
	display:none;
   width :100%;
   height:100%;
	background:black;
}

video.lq{
  visibility:hidden;
}
video.hq{
  visibility:visible;
}

@media handheld, (max-device-width:1024px) {
   video.hq{
     visibility:hidden;
   }
   video.lq{
     visibility:visible;
   }
}


.separator:-webkit-full-screen{
	top	  :0px;
   bottom  :0px;
   left    :0px;
  	right   :0px;
   width   :100%;
   height  :100%;
   margin  :0px;
   padding :0px;

   background-size 	 : contain;
   background-position: center;
   background-color	 : black;
}
.separator:-webkit-full-screen .button-maxmz-overlay{
	background:url('../images/minm-p.png') right top no-repeat;
   z-index:2000;
}
.separator:-webkit-full-screen .button-play-overlay{
	background:url('../images/minm-p.png') right top no-repeat;
   z-index:2000;   
}

.separator:-moz-full-screen{
   background-size 	 : contain;
   background-position: center;
   background-color	 : black;
}
.separator:-moz-full-screen .button-maxmz-overlay{
	background:url('../images/minm.png') right top no-repeat;
   z-index:2000;
}
.separator:-moz-full-screen .button-play-overlay{
	background:url('../images/minm-q.png') right top no-repeat;
   z-index:2000;   
}



.separator-middle{
	visibility:hidden;
	position	 :absolute;
	height	 :50%;
	   top	 :50%;
}




@media only screen and (max-width: 899px) {

    #navigation ul{
    	color:#bfbfbf;
    	text-transform:uppercase;
    	font-weight:bold;
    	font-size  :16px;
    	right	     :50px;
      text-align :left;
    	position   :absolute;
	   opacity	  :0.95;        
    }
	#navigation  ul li {
	   color			 :inherit;
      height		 :50px;
      line-height	 :50px;
      background 	 :#2D333A;
      border-right :5px solid #161A1D;
	}
    #navigation a,#navigation a:visited,#navigation a:active,#navigation a:focus,#navigation a:visited{
    	color:inherit;
      background:none;
      text-decoration:none;
    }

	#navigation > ul {/*the first level is displayed as table, so that we can make the selected option table-header/footer ;-)*/
      display:table;
      border-spacing :0;
      border-collapse:collapse;
	}

	#navigation.fixed > ul {/*the first level is displayed as table, so that we can make the selected option table-header ;-)*/
    	top	   :32px;
	}
	#navigation.sticky > ul {/*the first level is displayed as table, so that we can make the selected option table-header ;-)*/
    	bottom   :32px;
	}


	#navigation > ul > li {
      display:none;
	}

    #navigation  ul > li > a{
      padding-left :15px;
      padding-right:20px;
      display	   :block;
      height	   :50px;
    }

	 #navigation > ul:hover  > li ,
    #navigation > ul:active > li ,
    #navigation > ul:focus  > li {
      display:table-row-group;
	}

    #navigation  ul > li:hover {
	  border-right: 5px solid #eef0f2;
    }
    #navigation > ul > li.current {
      background:transparent;
      border-right:none;
      background :url('../images/menu.png') right center no-repeat;
      color: #fff;
	 }
    #navigation  ul > li:hover {
     background-color:#3C3E46;   
    }

    #navigation.sticky > ul > li.current {
      display:table-footer-group;
	 }
    #navigation.fixed > ul > li.current {
      display:table-header-group;
	 }


	/* second level menus */
    #navigation li.has-submenu > ul{
	   display 	 :block;
      position	 :absolute;
      right		 :900px;
      text-align:right;
      border-right:1px solid f16229;
      opacity	 :0;
	   transition :all 0.4s ease-out;
	}
   #navigation li.has-submenu > ul > li{
      background-color:#3C3E46;
   }
	#navigation.fixed li.has-submenu > ul{
      top	:0px;
   }
	#navigation.sticky li.has-submenu > ul{
      bottom:0px;
   }
   #navigation li.has-submenu:hover > ul{/*this opens the submenu when we hover over its parent*/
      right		 :100%;
      -margin-right:-16px;
      opacity	 :1;
	}
	#navigation li.has-submenu:hover > ul > li {
      display:block;
	}
   


}/*end media */

@media only screen and (max-width: 768px) {
	#logo{
		margin-left:40px;
   }
   #navigation ul{
   	right:40px;
   }
}

@media only screen and (max-width: 640px) {
	#logo{
		margin-left:20px;
   }
   #navigation ul{
   	right:20px;
   }
}

@media only screen and (max-width: 480px) {
	#logo{
		margin-left:10px;
      width		  :45%;	
   }
	#logo img{
   	width:100%;
   }
   #logo p{
   	display:none;
   }   
   #navigation ul{
   	right:10px;
   }
}

@media only screen and (max-width: 340px), only screen and (max-width: 899px) and (max-height: 480px) {

   section:first-of-type:before{/*make space for the navbar*/
     height:82px;
   }
   a.wheel-snap:not([href]){/*anchor point that respects the navbar*/
      top:-82px;
   }
   .separator-container{
      margin-top:-82px;
   }
   .separator-container .separator{
      top:82px;left:0px; right:0px; bottom:0px;
   }

	.mb {
		padding-bottom:30px;
	}

	.mt {
		padding-top:30px;
	}
   .container{
	  padding-top   :30px;
	  padding-bottom:30px;
   }


	#logo{
		margin-left:10px;
   	width:160px;
      height:82px;
      line-height:82px;
   }
   #navigation{
   	height:82px;
   }
   #navigation.fixed >#logo img{
		vertical-align:top;
   }
   #navigation.sticky>#logo img{
		vertical-align:bottom;
   }
	#navigation.fixed > ul {/*the first level is displayed as table, so that we can make the selected option table-header ;-)*/
    	top   :32px;
	}
	#navigation.sticky > ul {/*the first level is displayed as table, so that we can make the selected option table-header ;-)*/
    	bottom:32px;
	}
   #navigation ul{
   	right:10px;
   }
   #navigation li.has-submenu:hover > ul{/*this opens the submenu when we hover over its parent*/
      right		 :50%;
      opacity	 :1;
	}
}

@media only screen and (min-width: 900px) and (max-height: 480px) {/*navigation is 82px height and menu is horz*/
	#logo{
		margin-left:10px;
   	width:160px;
      height:82px;
      line-height:82px;
   }
   #navigation{
   	height:82px;
   }

	#navigation > ul {
		padding-top :14px;
   }

	#navigation > ul > li > a, #navigation > ul > li > a:active, #navigation > ul > li > a:visited {
		padding-top:10px;
		height:74px;
		padding-bottom:22px;
	}


}


/*unfortunately we can not use .beta-version-warning:after instead of just ".beta-version-warning"...*/
/*but the we can not use "content" on all browsers when we don't apply it on ":after"...*/
/*so we need a div with the message :-( for this to work*/
@-webkit-keyframes fadeOut { from { top:32px; } to { top:2000px; } }
@keyframes fadeOut 		   { from { top:32px; } to { top:2000px; } }
.beta-version-warning{
	display :block;
	position:fixed;
	top:32px;
   left:32px;
   bottom:32px;
   right:32px;
	z-index:2000;
	background:rgba(0,0,0,0.7);
	border-radius:32px;
	border :4px solid rgba(114,151,169,0.7);
	animation:fadeOut 1s ease 2s 1 forwards;
	-webkit-animation:fadeOut 4s ease 2s 1 forwards; /* Safari and Chrome */
}
.beta-version-warning  p{
	color  	 :white;
	font-size :20pt;
	text-align:center;
	height:2em;
   top:50%;
   width:100%;
   margin-top:-1em;
   position:absolute;
}

.m1:before{
   content:'info' '\0040'
}
.m2:before{
   content:'sales' '\0040'
}
.m3:before{
   content:'support' '\0040'
}

.m1:after, .m2:after, .m3:after{
   content:'ambianti' '\002e' 'com'
}

.p1:before{
   content:'+31 (0)40';
}
.p1:after{
   content:' 202 8633';
}


form input[name='firstname']{
   display:none;
}

.share-menu{
  visibility	:hidden;
  top	         :0px;
  position		:absolute;
  z-index		:900;
  width        :100%
}
.share-menu-footer{
   display:inline-block;
}
.share-menu-footer .share-container{
   float:right;
}

:hover > .share-menu{
	visibility:visible;
}

.share-container {
   width:50px;
	height:50px;
	background-color:#363942;
	margin-right:30px;
	float:left;
	border-radius:50px;
	bottom:20px;
}
.share-menu .share-container{
   float:right;
   margin-top:30px;
}

.share-container:hover {
		background-color:#708090;
}

.share-container img {
		padding:10px;
		opacity:1;
}


.slider .share-menu{
     visibility	:hidden;
     position		:absolute;
     top	         :0px;
     left         :50px;
     z-index		:1100;/*don't disturb the video view @ 1200*/
     width:auto;
}
.slider .share-menu .share-container{
     margin-top  :20px;
     float:right;
}
.slider:hover .share-menu{
     visibility:visible; 
}

@media only screen and (max-height: 480px) {

   #navigation.fixed {
     position:absolute;
     top	    :0px;
     bottom  :auto;
   }

   a.wheel-snap:not([href]){/*anchor point that respects the navbar*/
      top		 : 0px;
   }
   .separator-container{
      margin-top: 0px;
   }
   .separator-container .separator{
      top:0px;left:0px; right:0px; bottom:0px;
   }

   .share-menu{
     visibility	:hidden;
     position		:absolute;
     top	         :0px;
     left         :0px;
     z-index		:900;
     width        :90px;
   }
   .share-menu .share-container{
      margin-top  :10px;
   }

}

.tg  {border-collapse:collapse;border-spacing:0;border-color:#eef0f2;}
.tg td{font-family:Arial, sans-serif;font-size:14px;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;border-color:#eef0f2;color:#669;background-color:#e8edff;}
.tg th{font-family:Arial, sans-serif;font-size:14px;font-weight:normal;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;border-color:#eef0f2;color:#039;background-color:#b9c9fe;}
.tg .tg-baqh{text-align:center;vertical-align:top}
.tg .tg-mb3i{background-color:#D2E4FC;text-align:right;vertical-align:top}
.tg .tg-lqy6{text-align:right;vertical-align:top}
.tg .tg-6k2t{background-color:#D2E4FC;vertical-align:top}
.tg .tg-yw4l{vertical-align:top}

img.gthumb {
    max-width: 100%;
}

img.ggthumb {
    max-width: 48%;
}