﻿@charset "utf-8";

/*  header_web  */
#header_web { height:473px; }
#header_web .headerimg { background-position: center top; background-repeat: no-repeat; width:100%; height:473px; position:absolute; }
#headertxt { display:none;width:978px; margin:0 auto; clear:both; position:relative; top:74px; }
#firstline { display:none;color:#333; font-size:40px; padding:4px 13px 7px; float:left; }
#secondline { display:none;color:#CD2B3A; text-decoration:none; font-size:60px; padding:0 13px 10px; float:left; clear:both; }
#secondline:hover { text-decoration:underline; color:#7F000C; }
.pictured { display:none;background-color:#CC3333;color:#FFF; font-size:12px; padding:9px 16px; text-transform:uppercase; float:left;clear:both; margin-top:10px; }
.pictured a { font-size:16px; font-style:italic; letter-spacing:0; text-transform:none; color:#FFF; text-decoration:none; }
.pictured a:hover { text-decoration:underline; }
#headernav-outer { position:relative;top:430px;margin:0 auto;width:978px; }
#headernav { display:none;padding-left:864px; }
#headernav .btn { height:32px; width:32px; float:left; cursor:pointer; }
#headernav #back { background-image:url(../img/btn_back.png); }
#headernav #next { background-image:url(../img/btn_next.png); }
#headernav #control { background-image:url(../img/btn_pause.png); }

/*  Projects  */
#bodyHome #projects { background:#FFF;}
#bodyHome22 #projects .screen .csc-header { width:978px;}
#bodyHome #projects .screen h1 { margin:20px 0;padding:0 0 0 205px;width:auto;height:50px;line-height:46px;text-indent:0;font-size:18px;font-family:"寰蒋闆呴粦";font-weight:normal;color:#474747;background:url(../img/btn.png) no-repeat 2px -28px;}
#bodyHome #projects .screen h1 .fr { font-size:12px;}
#bodyApp #projects { background:url(../img/appbg.gif) repeat-x 0 -730px;}
#bodyApp #projects .screen h1 { width:900px; height:22px; line-height:22px;background:url(../img/Works.png) no-repeat center -104px;}
#bodyApp #project-container { top:469px;}
.Case_txt { height:74px;line-height:20px;text-align:center;font-family:'FZLTXHKM';font-size:16px;color:#383838;}
.sprite { position: absolute; width: 100%; height: 1000px; z-index: 200; top: 0; padding: 0; }
.screen { position: absolute; width: 100%; height: 1000px; z-index: 201; top: 0; padding: 0; }
.screen .content { width:280px; margin-left: 20%; margin-top: 10%; }
.screen .content h1 { background: url(../img/bg_content_border.png) no-repeat 0 0; }
#projects { position:relative;height:180px;margin: 0 auto;padding:0;overflow:hidden;background:#dbdfde;color:#666; }
#projects-a { position:relative;height:540px;margin: 0 auto;padding:0;overflow:hidden;background:#dbdfde;color:#666; }
#projects .screen .content,#projects-a .screen .content { width: 100%; height: 180px; margin-left: 0; margin-top: 0; padding-top: 0; background: none; }
#projects .screen #project-content,#projects-a .screen #project-content { background: url(../img/ajax-loader.gif) no-repeat 42% 50%; }
#projects .screen .csc-header,#projects-a .screen .csc-header {margin: auto; width: 900px;}
#projects .screen h1,#projects-a .screen h1 { padding:30px 0 10px;width:275px;height:50px;line-height:50px;text-indent:-9999px; background:url(../img/projects.png) no-repeat;}
/* -- Project Thumbs ----------------------------- */
#projects .screen { position: relative;}
#projects .content { position: absolute;top:23px;}

#project-container { position: absolute;top:250px; z-index:100; width: 100%; height: 467px;}
/* -- #thumbscreen */
.thumbscreen-slides { width: 980px; margin: auto; }
.thumbscreen-slides .inner { width: 970px; height: 150px; margin: 0px auto 0; position: relative; overflow: hidden; }
.thumbscreen-slides ul { position: absolute; left: 0; top: 0; }
.thumbscreen-slides ul li { float: left; padding-right: 15px; }
.thumbscreen-slides ul li img { width: 145px; height: 105px; padding: 2px; border: 1px #DEDEDE solid; }
.thumbscreen-slides ul li p { line-height: 30px; text-align: center; }


#projects-case { position:relative;height:140px;margin: 0 auto;padding:0;overflow:hidden;background:#dbdfde;color:#666; }
#projects-case .screen .content,#projects-a .screen .content { width: 100%; height: 180px; margin-left: 0; margin-top: 0; padding-top: 0; background: none; }
#projects-case .screen #project-content,#projects-a .screen #project-content { background: url(../img/ajax-loader.gif) no-repeat 42% 50%; }
#projects-case .screen .csc-header,#projects-a .screen .csc-header {margin: auto; width: 900px;}
#projects-case .screen h1,#projects-a .screen h1 { padding:30px 0 10px;width:275px;height:50px;line-height:50px;text-indent:-9999px; background:url(../img/projects.png) no-repeat;}
/* -- Project-case Thumbs ----------------------------- */
#projects-case .screen { position: relative;}
#projects-case .content { position: absolute;top:23px;}

#project-container { position: absolute;top:250px; z-index:100; width: 100%; height: 467px;}
.thumbscreen-slides-case { width: 980px; margin: auto; }
.thumbscreen-slides-case .inner { width: 970px; height: 100px; margin: 0px auto 0; position: relative; overflow: hidden; }
.thumbscreen-slides-case ul { position: absolute; left: 0; top: 0; }
.thumbscreen-slides-case ul li { float: left; padding-right: 15px; }
.thumbscreen-slides-case ul li img { width: 145px; height: 55px; padding: 2px; border: 1px #DEDEDE solid; }
.thumbscreen-slides-case ul li p { line-height: 30px; text-align: center; }
#thumbscreen .pagination { display: none; /*position: fixed; top: 0; left: 0; z-index: 1000;*/}
#thumbscreen .prev { position: absolute; top: 305px; left: 0px; z-index: 250; width: 0px; height: 0px; display: block; text-indent: -999em; background: url(../img/bg_project-slider_navs.png) no-repeat 0 0; }
#thumbscreen .next { position: absolute; top: 305px; right: 0px; z-index: 250; width: 0px; height: 0px; display: block; text-indent: -999em; background: url(../img/bg_project-slider_navs.png) no-repeat 0 -180px; }
#thumbscreen .prev:hover {background-position: 0 -60px;}
#thumbscreen .prev:active {background-position: 0 -120px;}
#thumbscreen .next:hover {background-position: 0 -240px;}
#thumbscreen .next:active {background-position: 0 -300px;}

/* -- #thumbscreena */
.thumbscreen-slides-a { width: 980px; margin: auto; }
#thumbscreena .pagination { display: none; /*position: fixed; top: 0; left: 0; z-index: 1000;*/}
#thumbscreena .prev { position: absolute; top: 305px; left: 0px; z-index: 250; width: 0px; height: 0px; display: block; text-indent: -999em; background: url(../img/bg_project-slider_navs.png) no-repeat 0 0; }
#thumbscreena .next { position: absolute; top: 305px; right: 0px; z-index: 250; width: 0px; height: 0px; display: block; text-indent: -999em; background: url(../img/bg_project-slider_navs.png) no-repeat 0 -180px; }
#thumbscreena .prev:hover {background-position: 0 -60px;}
#thumbscreena .prev:active {background-position: 0 -120px;}
#thumbscreena .next:hover {background-position: 0 -240px;}
#thumbscreena .next:active {background-position: 0 -300px;}
/* -- .project-thumbnails */
.project-thumbnails-wrap { width: 980px; height: 1100px; margin: auto; }
.project-thumbnails { width: 980px; margin: auto; position: relative; overflow: hidden; }
.project-div { clear: both; height: 300px; display: none;}
.project-thumbnails li { width: 195px; height: 166px; margin: 0 1px 1px 0; float: left; }
.project-thumbnails li a { width: 195px; height: 166px; display: block; position: relative; color: #000; text-decoration: none; cursor:pointer; }
.project-thumb-client { width:195px;height:83px;display:none;position:absolute;top:68px;left:0;font-size:18px;font-family:"寰蒋闆呴粦", Arial, Helvetica, sans-serif;font-weight:normal;text-align:center; z-index:100; }
.project-thumb-task { width:195px;display:none;position:absolute;top:94px;left:0;font-size:14px;font-weight:normal;font-style:italic;text-align:center; z-index:100;}
.project-thumbnails a:hover { background:#fff;}
.project-thumbnails a:hover img {display:none;}
/*.project-thumbnails a:link #img_hovers,.project-thumbnails a:visited #img_hovers{
	background:#000;
	display:none;
	width:195px;
	height:166px;
	filter:alpha(opacity=70);
	opacity: 0.7;
	position:absolute;
	top:0px;
	left:0px;
	z-index:20;
}
.project-thumbnails a:hover #img_hovers,.project-thumbnails a:active #img_hovers{
	display:block;
}*/

.project-thumbnails a:hover .project-thumb-client,
.project-thumbnails a:hover .project-thumb-task {display: block;}
/* -- Project Thumbs [END] ----------------------------- */
/* -- Project Detail ----------------------------- */
#content {height: 467px;}
#project-wrap { width: 100%; height: 467px; background: url(../img/bg_project_wrap.gif) repeat-x 0 0; }
#project-content { position: relative; width: 899px; height: 467px; margin: 0 auto; }
#project-slider { width: 899px; height: 467px; overflow: hidden; }
.project-slide { width: 897px; height: 392px; padding: 25px 0 0 2px; }
#project-content a.project-slider-close { position: absolute; top: 8px; right: 6px; color: #9e9c9c; font-size: 14px; font-family: Times, serif; font-weight: normal; font-style: italic; background: url(../img/bg_project-slider_close.png) no-repeat 100% 2px; padding-right: 15px; height: 14px; width: 60px; text-align: right;}
.project-slider-prev { position: absolute; top: 192px; left: -140px; width: 110px; height: 60px; display: block; text-indent: -999em; background: url(../img/bg_project-slider_nav_text.png) no-repeat 0 0; }
.project-slider-next { position: absolute; top: 192px; right: -140px; width: 110px; height: 60px; display: block; text-indent: -999em; background: url(../img/bg_project-slider_nav_text.png) no-repeat 0 -180px; }
.project-slider-prev:hover {background-position: 0 -60px;}
.project-slider-prev:active {background-position: 0 -120px;}
.project-slider-next:hover {background-position: 0 -240px;}
.project-slider-next:active {background-position: 0 -300px;}
.project-cycle { width: 701px; height: 417px; overflow: hidden; float: left; }
.project-cycle li { width: 701px; height: 417px; }
.bx-wrapper { box-shadow: 2px 2px 5px 0px #000000; -moz-box-shadow: 2px 2px 5px 0px #000000; -webkit-box-shadow: 2px 2px 5px #000000;}
.bx-pager { position: absolute; top: -16px; right: 0; width: 40px; z-index: 2000; text-align: right; color: #7f7f7f; font-family: Arial,sans-serif; font-size: 11px;}
.bx-pager .bx-pager-current { color: #fff;}
.bx-prev { position: absolute; left: -2px; top: 0px; display: block; width: 100px; height: 417px; background: url(../img/bg_project-cycle_nav.gif) no-repeat 0 182px; z-index: 2000; text-indent: -999em;}
.bx-next { position: absolute; right: -2px; top: 0px; display: block; width: 100px; height: 417px; background: url(../img/bg_project-cycle_nav.gif) no-repeat -100px 182px; z-index: 2000; text-indent: -999em;}
.bx-prev:hover { background-position: 0 -238px;}
.bx-next:hover { background-position: -100px -238px;}
.project-info { float: right; width: 178px; height: 417px; }
.project-info-text { padding-right:10px;height:260px;line-height:20px;overflow-x:hidden;overflow-y:auto;color:#9e9c9c;}
.project-info h2 { height:50px; padding: 30px 0 15px 0; color: #fff; font-size: 18px;font-family:"寰蒋闆呴粦", Arial, Helvetica, sans-serif;font-weight: normal;line-height:22px;}
.project-info h3 { height: 30px; margin-bottom: 16px; background: url(../img/bg_project-info_border.gif) no-repeat 0 100%; color: #fff; font-size: 14px;font-weight: normal; font-style: italic;}
.project-info-text p { }
#projects .project-info p { }
#projects .project-info .manufactured p { color: #9e9c9c; font-size: 14px; padding: 0; font-family: Times, serif; font-weight: normal; font-style: italic;}
.manufactured p a:link,.manufactured p a:visited{
	color:#646567;
	font-size:14px;
}
.manufactured p a:hover,.manufactured p a:active{
	color:#ab072a;
	text-decoration:underline;
}
.project-info .manufactured ul {margin-top: 3px;}
.project-info .manufactured ul li { float: left; width: 15px; height: 15px; margin-right: 5px; text-indent: -999em;position: relative;}
.ok-d-active { background: url(../img/bg_manufactured.png) no-repeat 0 0;}
.ok-t-active { background: url(../img/bg_manufactured.png) no-repeat -20px 0;}
.ok-l-active { background: url(../img/bg_manufactured.png) no-repeat -40px 0;}
.ok-d-inactive { background: url(../img/bg_manufactured.png) no-repeat -60px 0;}
.ok-t-inactive { background: url(../img/bg_manufactured.png) no-repeat -60px 0;}
.ok-l-inactive { background: url(../img/bg_manufactured.png) no-repeat -60px 0;}
#tooltip {position: absolute; z-index: 1000; top: -34px; left: -3px; text-indent: 0; display: block; height: 26px; width: 59px; padding: 4px 8px; background: url(../img/bg_tooltip.png) no-repeat 0px 100%; color: #000; white-space: nowrap; text-align: center;}
/* -- Project Detail [END] ----------------------------- */

/*  app  */
.header-content{ z-index:1;position:relative;max-width:1600px;margin: 0 auto;}
.header-content .shadow-top { position:absolute;top:0px;left:0px;width:100%;height:3px;z-index: 3;background: transparent url(../img/shadow-top.png) left top repeat-x;}
.header-content .shadow-bottom { position:absolute;bottom:0px;left:0px;width:100%;height:3px;z-index:3;background: transparent url(../img/shadow-bottom.png) left bottom repeat-x;}
.animation-container { position:relative;width:100%;height:473px;zoom:1;z-index:2;overflow:hidden;font-family:"寰蒋闆呴粦"}
.animation-container .animation-page { position:absolute;top:-10px;left:0px;width:100%;height:540px;overflow: visible;z-index:1;-webkit-transform-style: preserve-3d;}
.animation-container .animation-page .catch-wrapper{position: relative;width:1000px;height: 100%;margin:0 auto;}
.catch { z-index:3;position: absolute;top:50%;left:40px;margin-top:-55px;-webkit-transform-style: preserve-3d;}
.dkirBox { display: block;position:relative;z-index:3;zoom:1;overflow:hidden;zoom:1;}
.dkir { display:block;text-decoration:none;width:100%;height:100%;overflow:hidden;zoom:1;}
.dkir span { position:relative;z-index:-1;}
.catch .title { width:500px;height:90px;line-height:90px;font-size:44px; color:#ff9914; font-weight:bold; text-transform:uppercase; }
.catch .title a { display:block; height:90px; text-indent:-9999px; background:url(../img/btn.png) no-repeat 0 -146px;}
.catch .title a:hover { text-decoration:none;}
.catch .intro { width:470px;height:120px;line-height:24px;color:#151515;}
.iphone .catch .title a { background-position:0 -231px;}
.pc .catch .title a { background-position:0 -316px;}
.animation-container .animation-page .hand{	position: absolute;	right: 0px;	bottom: 0px;-webkit-transform-style: preserve-3d;}
.animation-container .animation-page.pc{ background: transparent url(../img/pc.jpg) center center no-repeat  }
.animation-container .animation-page.ipad{ background: transparent url(../img/ipad-bg.jpg) center center no-repeat  }
.animation-container .animation-page.iphone{ background: transparent url(../img/iphone-bg.jpg) center center no-repeat  }
.animation-container .animation-page.ipad .hand{ right:15% }
.animation-container .animation-page.iphone .hand{ right:20% }
.ie6 .animation-container .animation-page.ipad{ background: transparent url(../img/ipad-static-full.jpg) center center no-repeat  }
.ie6 .animation-container .animation-page.iphone{ background: transparent url(../img/iphone-static-full.jpg) center center no-repeat  }
.ie6 .animation-container .animation-page .hand{ display: none; visibility:hidden;}
.ie7 .animation-container .animation-page.ipad{ background: transparent url(../img/ipad-static-full.jpg) center center no-repeat  }
.ie7 .animation-container .animation-page.iphone{ background: transparent url(../img/iphone-static-full.jpg) center center no-repeat  }
.ie7 .animation-container .animation-page .hand{ display: none; visibility:hidden;}
.ie8 .animation-container .animation-page.ipad{ background: transparent url(../img/ipad-static-full.jpg) center center no-repeat  }
.ie8 .animation-container .animation-page.iphone{ background: transparent url(../img/iphone-static-full.jpg) center center no-repeat  }
.ie8 .animation-container .animation-page .hand{ display: none; visibility:hidden;}


.cp{margin:0 auto 15px;width:1000px;}
.cp-l{width:210px; float: left;overflow: hidden; position:relative;}
.cp-l h2{height:35px;line-height:35px;color:#fff; text-align:center;font-weight:normal;font-size:16px;background:#005837;}
.cp-l h2 a{color:#fff;}
.cp-l h3{height:32px; line-height: 32px;padding-left:45px; font-size:14px;background:url('../img/cp_a.gif') no-repeat;}
.cp-l h3 a{color:#DA251D;}
.cp-l h4{height:35px; line-height:35px;border-bottom:1px dotted #efefef; padding-left:15px; background:url('../img/ico1.gif') no-repeat 7px center;}
.cp-l h4 a{color:#000; display:inline-block; width:168px; font-size:12px; font-weight:normal; overflow: hidden;}
.cp-l ul{padding:5px 0 0 34px;}
.cp-l li{height:35px; line-height:35px;border-bottom:1px dotted #efefef; padding-left:45px; background:url('../img/ico1.gif') no-repeat 27px center;}
.cp-l li a{color:#000; display:inline-block; width:148px; overflow: hidden;}
.cp-r{width:755px; float:right; overflow: hidden;}
.cp-r h3{height:36px; line-height:36px; border-bottom:1px solid #7b99da;}
.cp-r h3 em{float: left;font-size:16px;font-family:'Microsoft YaHei';font-weight:normal;}
.cp-r h3 em a{display:inline-block; height:36px; padding:0 28px; margin-left:5px;}
.cp-r h3 em a.cur,.cp-r h3 em a:hover{background:url('../img/ico2.gif') no-repeat 0 center; color:#DA251D;}
.cp-r h3 b{float: right; font-weight:normal; font-size:12px; margin-top:12px;}
.cp-r h3 b a{color:#999;}

.cp-r ul{margin-right:-25px;padding:25px 0 0;}
.cp-r li{width:255px; float:left; margin-right:5px;}
.cp-r li img{display:block; width:255px; height:190px;}
.cp-r li span{display:block; text-align:center; padding:15px 0 20px; height:20px; }
.cp-r li span a{ height:20px;}


/*abt*/
.abtW{margin:0 auto;height:673px; overflow:hidden; background:url(../img/abt_bg.gif) center top no-repeat;}
.abt{padding:50px 50px 0;}
.abt h3{text-align:center; font-size:32px; color:#d8000f; line-height:52px;height:145px; overflow:hidden;}
.abt .abt_t_b{left:729px;top:18px;}
.abt h3 span{ font-size:24px; color:#fff;margin:0 0 0 20px;}
.abt h3 b{ font-size:18px; color:#b36900; line-height:36px;}
.ab_l{width:740px; overflow:hidden;}
.ab_l_c dl{width:680px;height:247px;}
.ab_l_c dt{ float:left;}
.ab_l_c dt img{width:269px;height:219px; overflow:hidden;padding:2px; border:1px #e0c18b solid;}
.ab_l_c dd{ float:right;width:380px;}
.ab_l_c dd h4{ line-height:28px; font-size:14px;font-family:"Microsoft YaHei";}
.ab_l_c dd h4 a{ color:#b36900;}
.ab_l_c dd h4 a:hover{ color:#b36900;}
.ab_l_c dd p{ line-height:24px; padding:14px 0 0;color:#5b5c5a;height:146px;}
.ab_l_c h5{ margin:0 10px 0 0;background:url(../img/abt_l.gif) left center repeat-x; line-height:24px;height:24px; font-size:16px;margin:0 23px 0 0;}
.ab_l_c h5 a{ font-family:"Microsoft YaHei"; color:#b36900; font-weight:100; display:inline-block;padding:0 10px 0; background:#fff;}
.ab_l_c_b{ clear:both;padding:18px 0 0;}
.ab_l_c_b .to_l,.ab_l_c_b .to_r{margin-top:36px;}
.ab_l_c_b .to_l{margin-right:5px;}
.ab_l_c_b .to_r{margin-right:24px;}
.ab_l_c_b ul li{ float:left;width:172px; display:inline;margin:0 8px;text-align:center;}
.ab_l_c_b li img{width:160px;height:113px; overflow:hidden; padding:2px; border:1px #e0c18b solid;}
.ab_l_c_b ul li span{ line-height:28px; height:28px;}
.ab_l_c_b ul li span a{color:#5b5c5a;}
.ab_l_c_b ul li span a:hover{color:#5b5c5a;}
.ab_r{width:240px;overflow:hidden;background:url(../img/hon_sd.gif) center 190px no-repeat;}
.ab_r_c .changeBox_a1{width:220px;height:190px;position:relative;}
.ab_r_c .changeBox_a1 .a_bigImg img{position:absolute;top:0px;left:0px;display:none; width:250px;height:190px;}
.ab_r_c dd a{ color:#5b5c5a; line-height:26px;}
.ab_r_c dd a:hover{ color:#5b5c5a;}
.ab_r_c ul{ padding:5px 0;clear:both; }
.ab_r_c li{height:39px; line-height:39px;padding:0 0 0 28px;background:url(../img/abt_l2.gif) left bottom repeat-x;}
.ab_r_c li a{ display:block;padding:0 0 0 16px;background:url(../img/abt_ic.gif) left 18px no-repeat;}
.ab_r_c li a{color:#5b5c5a;}
.ab_r_c li a:hover{color:#5b5c5a;}
.ab_r_c .last{ background:none;}
.ab_s{width: 685px; height: 147px; margin: 0px auto 0; position: relative; overflow: hidden;}
.ab_s ul { position: absolute; left: 0; top: 0; }
 

 

.ab,.dt{width:960px; margin:0 auto 15px; padding:20px 0 0;}
.dt-con{padding:15px 0 0;}
.dt-l{width:640px;height: 380px; float: left;}
.dt-l dl{width:320px; float: left;}
.dt-l dt img{display:block; width:316px; height:190px;border:2px solid #fff;}
.dt-l dd{margin-right:-5px;padding:6px 0 0;}
.dt-l dd span{display:block; width:154px; float: left; padding:0 3px;}
.dt-l dd img{display:block; width:150px; height:84px;border:2px solid #fff;}
.dt-l ul{width:302px; float: right;margin-top:-5px;}
.dt-l li{height:32px; line-height:32px;overflow:hidden; border-bottom:1px dotted #9f9f9f; padding-left:14px; background:url('../img/ico1.gif') no-repeat 2px center;}
.wd{width:318px; float: right; padding:10px;}
.wd dl {padding:18px 0 16px;border-bottom:1px dashed #d6d6d6;}
.wd dt{ background: url(../img/wd_w.gif) no-repeat 0 2px;line-height:18px; padding:0 0 10px 25px; overflow: hidden;}
.wd dt a { color:#333;}
.wd dd { background:url(../img/wd_d.gif) no-repeat 0 5px; padding-left:25px; line-height:20px; color:#666; max-height:80px; overflow:hidden;}
  .dt-l h3 em a,.wd h3 em a{color:#000;margin-right:8px;font-size:18px;}

@media (max-width: 1000px)
{
	.animation-container .animation-page .catch-wrapper	{ width:auto;padding:0px 20px;}
	.animation-container { height:100%;}
	.animation-container .spacer { display:inline-block;zoom:1;width:100%;z-index: -1;}
	.animation-container .animation-page{ background-size:cover;height:100%;padding-bottom:10px;}
	.animation-container .animation-page.pc{ background: transparent url(../img/pc-static.jpg) center center no-repeat; background-size: cover; }
	.animation-container .animation-page.ipad{ background: transparent url(../img/ipad-static.jpg) center center no-repeat; background-size: cover; }
	.animation-container .animation-page.iphone{ background: transparent url(../img/iphone-static.jpg) center center no-repeat; background-size: cover; }
	.animation-container .animation-page .hand{ display: none; }
}

@media (min-width: 800px) and (max-width: 999px){
	.header-content { margin:0px 0px;}
    .hdr-bg { width:100%;}
    .animation-container .animation-page .catch { top:50%;position:absolute;z-index:3;}
    .animation-container .animation-page .catch .catch-copy .dkir { background: url(../img/hdr-title-m.png) 0px 0px no-repeat;width:317px;height:72px;}
    .animation-container .animation-page .catch .catch-copy-white .dkir { background: url(../img/hdr-title-m.png) 0px -72px no-repeat;width:317px;height:72px;}
    .animation-container .animation-page .catch { margin-top: -58px;}
}

@media only screen and (-webkit-min-device-pixel-ratio: 2)  and (max-width: 750px) {
	.animation-container .animation-page .catch .catcy-copy .dkir {background: url(../img/hdr-try3.png) no-repeat;background-size: 102px 204px;}
}

@media (max-width: 800px) {
	.header-content { /*padding-top: 50px;*/}    
    .animation-container .animation-page .catch-wrapper	{ width:auto;padding:0px 0px;}
    .hdr-bg { width:100%;position:relative;padding-bottom:0px;}
	.animation-container .animation-page .catch { position:static;margin-top:0px;height:100%;}
	.animation-container .animation-page .catch .catch-copy	{ display:none;visibility:hidden;}
	.animation-container .animation-page .catch .catch-copy-white { display:none;visibility: hidden;}
	.animation-container .animation-page .catch .sample-button { position:absolute;bottom:20px;left:20px;z-index:3;}
	.animation-container .animation-page .catch .sample-button .dkir { background: url(../img/hdr-try3.png) no-repeat center 0px;width:102px;height:102px;}
	.animation-container .animation-page .catch .sample-button .dkir span { text-indent:-9999px;font-size:0%;color:transparent;}
	.animation-container .animation-page .catch .sample-button .dkir:hover { background-position: center -102px;}
}
