*{ padding:0; margin:0;}


@font-face {font-family: 'neutra_textbook_alt';
    src: url('../fonts/neutratext-bookalt-webfont.eot');
    src: url('../fonts/neutratext-bookalt-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/neutratext-bookalt-webfont.woff') format('woff'),
         url('../fonts/neutratext-bookalt-webfont.ttf') format('truetype'),
         url('../fonts/neutratext-bookalt-webfont.svg#neutra_textbook_alt') format('svg');
    font-weight: normal;
    font-style: normal;
}

img{ border:none;}
body{ margin:0; padding:0; background:#fff; font-family:'neutra_textbook_alt', Arial, Helvetica, sans-serif; font-size:15px; color:#000; height:100%;}
html{ height:100%;}
video{width: 100%; height: auto;}
.videoContainer{ position:absolute; height:100%; width:100%; overflow: hidden; z-index:9}
.videoContainer video{ min-width: 100%; min-height: 100%; }
.videoContainer img{ width:100%; height:100%;}

.main{ width:94%; padding:3%; height:87%;}
header{ float:left; width:100%; z-index:9999; position:relative;}
.logo{ float:left; }
.logo img{ width:100%; max-width:302px;}

nav{ float:right; width:685px;}
nav ul{ float:left; list-style-type:none; width:100%;}
nav ul li{ float:left; display:inline; position:relative; margin:0 1%; padding:0 2%; }
nav ul li:hover{background:#2dbdb1; }
nav ul li:hover a{ color:#fff;}
nav ul li a{ color:#eaebe6; font-size:25px; text-decoration:none; line-height:31px; float:left; }
nav ul li a:hover{ color:#fff; background:#2dbdb1}

nav ul li ul{ position:absolute; left:0; top:31px; background:#abd4d1; width:160px; padding:4% 0; display:none; z-index:99999}
nav ul li:hover ul{ display:block;}
nav ul li ul li{ float:left; width:100%; margin:0}
nav ul li ul li a{ color:#fff; font-size:20px; line-height:28px; margin:0; padding:0 8%; width:84%; float:left;}
nav ul li ul li:hover{ background:none;}
nav ul li ul li a:hover{ background:none; color:#1e958c;}

footer{ position:absolute; height:130px; bottom:0; width:94%;}
.footer_contant{ float:left; position:relative; z-index:99;}
.contant_number{ font-size:16px;}
.contant_email a{ font-size:16px; color:#18a398; text-decoration:none;}
.copy_right{ float:left; width:100%; font-size:12px; border-top:solid 1px #000; padding-top:5px; margin-top:5px; position:relative; z-index:99;}

#divHide{ position:absolute; z-index:99999; height:100%; width:100%; background:#fff; left:0; top:0;
 filter:alpha(opacity=70); 
    /* works for IE 8. */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    /* works for old school versions of the Mozilla browsers like Netscape Navigator. */
    -moz-opacity:0.7; 
    /* This is for old versions of Safari (1.x) with KHTML rendering engine */
    -khtml-opacity: 0.7; 
    /* This is the "most important" one because it's the current standard in CSS. This will work in most versions of Firefox, Safari, and Opera. */  
    opacity: 0.7; }
#divHide img{ text-align:center; position:absolute; top:50%; margin-top:-63px; left:50%; margin-left:-63px;}

@media (max-width: 1024px)
{
body{ overflow:hidden}
.main{ height:90%}
.logo{ width:100%; text-align:center; padding-bottom:1%;}
.logo img{ width:25%}
nav{ margin:0 auto; float:none;}
video{width: auto; height: 100%; margin-left:0; position:relative}
.videoContainer{ position:absolute; height:100%; width:auto; overflow: hidden;}
.videoContainer video{ min-width: 100%; min-height: 100%;}
.videoContainer img{ max-width: 100%; max-height: 100%; }
}
@media (max-width: 768px)
{
.main{ height:94%}
video{width: auto; height: 100%; margin-left:-100%; position:absolute}
.videoContainer{ position:absolute; height:100%; width:100%; overflow: hidden;}
.videoContainer video{ min-width: 100%; min-height: 100%;}
.videoContainer img{ width:auto; height:100%;}
}
@media (max-width: 640px) 
{
.main{ height:90%}
.logo img{ width:30%}
nav{width:440px; margin:0 auto}
nav ul li{margin:0 1%; padding:0 1%; }
nav ul li a{ font-size:19px; line-height:28px;}
nav ul li ul li a{ font-size:16px; line-height:25px;}
nav ul li ul{ top:28px;}

video{width: auto; height: 100%; margin-left:0; position:relative}
.videoContainer{ position:absolute; height:100%; width:auto; overflow: hidden;}
.videoContainer video{ min-width: 100%; min-height: 100%;}
.videoContainer img{ width:100%; height:100%;}
}
@media (max-width: 360px) 
{
.main{ height:94%}
.logo img{ width:40%}
nav{width:305px; margin:0 auto}
nav ul li{margin:0 0.4%; padding:0 0.7%; }
nav ul li a{ font-size:15px;  line-height:25px;}
nav ul li ul li a{ font-size:14px; line-height:23px;}
nav ul li ul{ top:25px;}

video{width: auto; height: 100%; margin-left:-100%; position:absolute}
.videoContainer{ position:absolute; height:100%; width:100%; overflow: hidden;}
.videoContainer video{ min-width: 100%; min-height: 100%;}
.videoContainer img{ width:auto; height:100%;}
}