/*  作者:神笔天成网络 | 版本:1.1 */
/*--------------------------------------------------------------------- */
/* @import url('colors/turq.css'); */
*{ padding:0; margin:0;}

body {
	font:14px/23px '微软雅黑', 宋体;
	color:#575757;
	-webkit-font-smoothing:antialiased; /* Fix for webkit rendering */
	-webkit-text-size-adjust:100%;
}

h1, h2, h3, h4, h5, h6 {
	color:#181818;
	font-family:'微软雅黑', 宋体;
	font-weight:700; 
	text-transform:uppercase;}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight:inherit; }
	
h1 { font-size:45px; letter-spacing:-2px;}
	
h2 { color:#575757; font-size:24px; line-height:40px; margin-bottom:10px; }
	
h3 { color:#575757; font-size:28px; line-height:34px; margin-bottom:8px; }
	
h4 { font-size:21px; line-height:30px; margin-bottom:4px; }
	
h5 { font-size:17px; line-height:24px; }
	
h6 { font-size:14px; line-height:21px; }

p img { margin:0; }

a, a:visited, a:hover {text-decoration:none;}

em { font-style:italic; }
	
strong { font-weight:bold; color:#333; }
	
small { font-size:80%; }

/* Page Title */
.page-title {text-align:center; font-size:57px; color:#f0f0f0; margin:50px 0; line-height:47px; opacity:0; }

.page-title span{ font-size:52px;}

.lead {
	margin:0 auto 80px;
	width:90%;
	text-align:left;
	line-height:32px; font-size:14px;
}

.white-bullet { width:100%; height:11px; margin-top:-11px; background:url("../img/bullets/white_bullet.png") no-repeat center center;}

.white-bullet-right { width:20px; height:100px; margin-top:11px; background:url("../img/bullets/white_bullet_right.png") no-repeat center center; 
float:left; margin:13px 0 0 -5px;}

/* Button */
.button {background:transparent; border:3px solid #F0F0F0; color:#F0F0F0; text-transform:uppercase; margin:10px auto 0;
font-size:16px; font-family:'Montserrat',sans-serif; font-size:20px; padding:5px 30px; cursor:pointer; display:table;}

.button:hover {background:#F0F0F0; -webkit-transition:background-color 0.2s linear; -moz-transition:background-color 0.2s linear; -ms-transition:background-color 0.2s linear;
-o-transition:background-color 0.2s linear; transition:background-color 0.2s linear;}

#wrapper {width:100%; overflow:hidden;}

/*--------------------------------------------------------------------- */
/* 3. Header */
/*--------------------------------------------------------------------- */

#header {width:100%; height:780px; background:url("../img/header_bg.jpg") no-repeat fixed center top #3E3E3E; }

/* Name Area */
.name-area {
	position:absolute;
	right:0;
	width:573px;
	top:420px;
}

.name-area h1 { color:#F0F0F0; padding:22px 57px 22px 57px; display:table; margin-bottom:10px; line-height:40px;}

.name-area p {color:#F0F0F0;}

/* Navigation */
#navbar {width:100%; background:url("../img/navbar_bg.png") repeat-x center bottom; padding-top:600px; }

.menu li {width:20%; float:left; height:180px; }

.menu li a {display:block; width:100%; height:180px; text-align:center; border-left:1px solid #5b5a5a; }

.menu li a:hover i {color:#F0F0F0; border-top:2px solid #C9C9C9; padding-top:63px;}

.menu span {display:block; text-transform:uppercase; font-size:14px; font-family:'Open Sans', sans-serif; margin-top:20px; line-height:12px; }

.menu i {color:#9e9b96; font-size:50px; padding-top:65px; display:block !important; }
.menu .ioc01{background-image:url("../img/tub01.png"); padding-top:65px; }

.menu .last {border-right:1px solid #5b5a5a;}

.menu .active { position:relative; box-shadow:0 0 6px rgba(0, 0, 0, 0.6) inset;}

.menu .active i {color:#F0F0F0; padding-top:63px;}

.menu .active .bullet {background-repeat:no-repeat; height:20px; left:0; position:absolute; top:152px; width:33px; margin-left:42%;}

/* Mobile Menu */
.mobile-menu {display:none; cursor:pointer; width:100%; height:70px; position:absolute; right:0; top:0;}

.sticky-wrapper {height:0px !important;}

.mobile-menu i {line-height:68px; font-size:33px; color:#9B9B9B;}

/*--------------------------------------------------------------------- */
/* 4. My Profile */
/*--------------------------------------------------------------------- */

#profile {width:100%; height:auto; padding-bottom:50px; background-image:url("../img/map_pattern.png"); background-repeat:no-repeat; background-position:center 43px;}

.profile-navbar {width:100%; height:53px; background:#9E9B96; position:absolute;}

/* Profile Image */
.profile-image {margin:-33px 0 0 60px; }

.profile-image img {border:10px solid #F0F0F0;}

/* Profile Info */
.profile-info {margin:0 0 0 60px; }

.profile-info span {width:50%; float:left; color:#F0F0F0; font-size:12px; text-transform:uppercase;}

.profile-info .bold {font-weight:800;}

.profile-info p {line-height:32px; opacity:0;}

/* Profile Tabs */
.profile-tabs {width:100%; height:53px; margin-left:30px;}

.profile-tabs li {float:left; padding:14px 30px; cursor:pointer;}

.profile-tabs i {color:#b6b5b2; font-size:23px;}

.profile-tabs li:hover i {color:#cecdca;}

.profile-tabs .active {height:46px; margin-top:-11px;}

.profile-tabs .active i {margin-top:11px; display:block !important; color:#F0F0F0;}

/* Profile Tabs Content */
.profile-tabs-content {width:88%; margin-left:30px;}

.profile-tabs-content h2 {font-size:27px; color:#F0F0F0; margin:65px 0 31px;}

.profile-tabs-content p {color:#F0F0F0; font-size:12px; line-height:29px;}

/* Twitter Feed */
#twitter-feed {width:100%; height:auto; background:url("../img/twitter_feed_bg.jpg") no-repeat fixed center bottom; padding:95px 0; z-index:200;}

.twitter-sign {width:100px; height:100px; background:rgba(240,240,240,0.6); margin-left:60px;}

.twitter-sign i {font-size:57px; display:block !important; text-align:center; line-height:100px;}

.tweet {text-transform:uppercase; font-size:16px; color:#F0F0F0; line-height:32px; margin-top:16px;}

.tweet span {font-weight:800;}

.tweet a {color:#F0F0F0;}

/*--------------------------------------------------------------------- */
/* 5. Services */
/*--------------------------------------------------------------------- */
#process {padding-bottom:40px;}

/* Process Parts */
.process-part {opacity:0;}

.process-part p {
	text-align:left;
	font-size:12px;
	line-height:23px;
	margin:0 auto 60px;
	width:90%;
}

.process-part .icon-box { display:table; margin:0 auto; width:120px; height:115px; /*border:1px solid #CCCCCC*/}

.process-part .icon-box i {font-size:57px; line-height:115px; text-align:center; display:block;}

.process-part h2 {font-size:22px; color:#575757; text-align:center; margin:10px 0 0;}

.process-divider {background:url("../img/process_divider.png") no-repeat center center; position:absolute; width:100%; height:114px;}

/* Testimonials */
#testimonials {padding:70px 0; background-image:url("../img/map_pattern.png"); background-repeat:no-repeat; background-position:center top;}

.avatar {float:left; border:8px solid #F0F0F0;}

.quote {width:825px; height:auto; float:left; margin-left:4%;}

.quote blockquote {float:left; width:660px; margin-left:25px; color:#F0F0F0; font-size:14px; line-height:30px;}

.quote h2 {color:#F0F0F0; margin-bottom:0; font-size:22px; font-weight:600; }

.quote h2 span{font-size:18px; color:#D9D9D9; font-weight:normal;}

/* Slider Controls */
.prev i, .next i {font-size:39px; color:#F0F0F0; line-height:330%; cursor:pointer; opacity:0.5;}

.prev:hover i, .next:hover i {opacity:1;}

.prev {float:left; width:3%;} .next {float:right; text-align:right; width:3%;}

#quote-slider {width:94%; float:left;}

/*--------------------------------------------------------------------- */
/* 6. Portfolio */
/*--------------------------------------------------------------------- */

#portfolio {width:100%; height:auto; padding-bottom:40px;}

#portfolio p{ margin:0;}

#portfolio-wrapper {width:100%; height:auto; opacity:0; overflow:hidden;}

/* Filters */
#filters {margin-bottom:70px;}
#filters ul{ padding:0; overflow:hidden;}
.filter {float:left; width:20%; }

.filter a {margin:0 auto; display:table;}

.filter i { background-color:#e7e6e5; background-position:center; background-repeat:no-repeat; width:65px; height:65px; display:block !important; line-height:65px; text-align:center; font-size:36px; color:#9e9b96;}

.filter span {color:#575757; text-transform:uppercase; font-size:14px; display:table; margin:5px auto;}

/* Portfolio Item */
.picture {width:auto; height:210px; overflow:hidden; position:relative;}

.picture img {width:100%; height:auto; -webkit-transition:all 0.2s ease-in-out; -moz-transition:all 0.2s ease-in-out; -ms-transition:all 0.2s ease-in-out; 
-o-transition:all 0.2s ease-in-out; transition:all 0.2s ease-in-out;}

.portfolio-item {background:#e7e6e5; margin:0 auto 45px; text-align:center; width:255px; border:1px solid #EAEAEA}

.portfolio-item figcaption {color:#888; font-size:12px; padding:17px 0;}

.portfolio-item .pictitle{ width:90%; margin:0 auto; text-align:left;}

.portfolio-item span {font-family:"微软雅黑", 'Montserrat', sans-serif; font-size:14px; text-transform:uppercase; display:block;}

/* Portfolio Item Hover - Overlay */
.overlay {width:100%; height:100%; position:absolute; background:rgba(0,0,0,0.7); opacity:0; z-index:500;}

.overlay .bullet {width:26px; height:12px; background-repeat:no-repeat; position:absolute; bottom:0; left:45%;}

/* Zoom Icon */
.zoom {width:45px; height:45px; border:3px solid rgba(255,255,255,0.4); display:block; margin:30% auto; -webkit-transition:all 0.2s ease-in-out; -moz-transition:all 0.2s ease-in-out; -ms-transition:all 0.2s ease-in-out; -o-transition:all 0.2s ease-in-out; transition:all 0.2s ease-in-out; -webkit-transform:scale(2.0); -moz-transform:scale(2.0); -ms-transform:scale(2.0); -o-transform:scale(2.0); transform:scale(2.0);}

.zoom i {color:rgba(255,255,255,0.4); font-size:18px; line-height:45px; text-align:center;}

.zoom:hover {border-color:#F0F0F0;}

.zoom:hover i {color:#F0F0F0; -webkit-transition:color 0.2s ease-in-out; -moz-transition:color 0.2s ease-in-out; -ms-transition:color 0.2s ease-in-out; 
-o-transition:color 0.2s ease-in-out; transition:color 0.2s ease-in-out;}

/* Portfolio Item Hover Effects */
.portfolio-item:hover figcaption, .portfolio-item:hover span, .portfolio-item:hover strong {color:#F0F0F0 !important;}

.portfolio-item:hover .zoom {-webkit-transform:scale(1.0); -moz-transform:scale(1.0); -ms-transform:scale(1.0); -o-transform:scale(1.0); transform:scale(1.0);}

.portfolio-item:hover .picture img {-webkit-transform:scale(1.3); -moz-transform:scale(1.3); -ms-transform:scale(1.3); -o-transform:scale(1.3); transform:scale(1.3);}

.portfolio-item:hover .overlay {opacity:1; -webkit-transition:opacity 0.3s ease-in-out; -moz-transition:opacity 0.3s ease-in-out; -ms-transition:opacity 0.3s ease-in-out;
-o-transition:opacity 0.3s ease-in-out; transition:opacity 0.3s ease-in-out;}

/* Isotope Filtering */
.isotope-item {z-index:2;}

.isotope-hidden.isotope-item {z-index:1;}

.isotope, .isotope .isotope-item {-webkit-transition-duration:0.8s; -moz-transition-duration:0.8s; -ms-transition-duration:0.8s; -o-transition-duration:0.8s; transition-duration:0.8s;}

.isotope {-webkit-transition-property:height, width; -moz-transition-property:height, width; -ms-transition-property:height, width; -o-transition-property:height, width; transition-property:height, width;}

.isotope .isotope-item {-webkit-transition-property:-webkit-transform, opacity; -moz-transition-property:-moz-transform, opacity; -ms-transition-property:-ms-transform, opacity; -o-transition-property:-o-transform, opacity; transition-property:transform, opacity;}

.isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition {-webkit-transition-duration:0s; -moz-transition-duration:0s; -ms-transition-duration:0s; -o-transition-duration:0s; transition-duration:0s;}

html, body {height:100%;}

/*--------------------------------------------------------------------- */
/* 7. Resume */
/*--------------------------------------------------------------------- */

/*---*/
#s2 { height:150px;}
.scrollDiv{height:25px;/* 必要元素 */line-height:25px;overflow:hidden;/* 必要元素 */}
.scrollDiv li{height:25px;padding-left:10px; color:#C9C9C9;}
.scrollDiv li a{ color:#DDD;}
.scrollDiv li span{ float:right;}
/*---*/

#resume {width:100%; height:auto; padding-bottom:115px;}

#resume .eight.columns {position:relative;}

/* Titles */
.resume-title {background:url("../img/title_line_bg.jpg") repeat-x 0 50%; margin-bottom:30px;}

.resume-title span {background:#DAD8D4; padding-right:5px; font-size:25px;}

/* Icon Box Dividers */
.resume-divider-01 {width:2px; height:346px; position:absolute; background:url("../img/resume_divider.png") no-repeat; top:148px; left:31px;}

.resume-divider-02 {width:2px; height:346px; position:absolute; background:url("../img/resume_divider_small.png") no-repeat; top:148px; left:31px;}

/* Content Box Sections */
.resume-section {display:block; float:left; margin-bottom:20px; width:100%;}

/* Icon Box */
.resume-icon-box {width:80px; height:110px; float:left;}

.resume-icon-box i {font-size:28px; color:#F0F0F0; line-height:110px; text-align:center; display:block;}

.resume-bullet-right {width:6px; height:110px; float:left; background:url("../img/bullets/resume_bullet_right_red.png") no-repeat; background-position:0 50%;}

/* Grey Content Box */
.resume-content-box {width:74%; height:80px; background:#e7e6e5; padding:15px; float:right;}

.resume-content-box h3 {
	font-size:16px;
	margin:0;
}

.resume-content-box p {font-size:12px; margin:0;}

/* Skill Bars */
.skill {
	width:100%;
	height:auto;
	float:left;
	margin-bottom:20px;
}

.skill-bar {width:inherit; max-width:350px; background:#e7e6e5; padding-left:25px; padding-right:10px; margin-right:8px; float:left;}

.skill-bar p {
	margin:0;
	font-size:14px;
	line-height:45px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}

.skill-tip {width:60px; height:45px; font-family:'Montserrat', sans-serif; color:#F0F0F0; text-align:center; line-height:45px; font-size:17px; float:left;}

.resume-bullet-left {width:6px; height:45px; float:left; background-repeat:no-repeat; background-position:0 50%;}

/* Awards */
.award-header {width:100%; height:23px; padding:10px 0; text-align:center;}

.award-header h3 {font-size:17px; color:#F0F0F0; margin:0; line-height:24px;}

.resume-bullet-bottom {width:100%; height:6px; background-repeat:no-repeat; background-position:50% 0; display:block; }

.award.resume-content-box {width:auto; float:left; margin-top:8px;}

/* Button Bar */
.button-bar {width:100%; height:auto; background-image:url("../img/map_pattern.png"); background-repeat:no-repeat; background-position:0 top;}

.button-bar .button {margin:45px auto;}

/*--------------------------------------------------------------------- */
/* 8. Contact */
/*--------------------------------------------------------------------- */

#contact {width:100%; padding:0; background-image:url("../img/map_pattern.png"); background-repeat:no-repeat; background-position:0 top; background-size:100%;}

/* Form Elements */
#contact-form {width:87%; float:right; padding:25px 0;}

.text {height:46px; padding:10px; margin-bottom:20px;}

.textarea {height:112px; padding:10px; margin-bottom:20px;}

.text, .textarea {width:90%; border-radius:5px; border:0; font-family:'Open Sans', sans-serif; font-size:16px; color:#444;}
.text:focus, .textarea:focus {color:#888;} 
.text::-webkit-input-placeholder, .textarea::-webkit-input-placeholder {color:#888;}
.text:-moz-placeholder, .textarea:-moz-placeholder {color:#888;}
.text::-moz-placeholder, .textarea::-moz-placeholder {color:#888;}
.text:-ms-input-placeholder, .textarea:-ms-input-placeholder {color:#888;}

/* Contact Details */
.contact-details {background:#FFF; height:460px; position:absolute; width:100%; padding-left:40px;}

.contact-details i {width:45px; height:45px; line-height:45px; text-align:center; float:left; display:block; font-size:30px; background:#E7E6E4;}

.contact-details span {float:left; line-height:45px; padding-left:20px; padding-right:20px; margin-left:15px; background:#E7E6E4;}

.contact-details li {clear:both; display:table; float:none; margin-bottom:20px; position:relative; width:100%; opacity:0;}

/* Map */
#map1 {width:100%; height:500px;}

/*--------------------------------------------------------------------- */
/* 9. Footer */
/*--------------------------------------------------------------------- */

#footer {width:100%; height:160px; background:#3D3C3C;}

.social-networks {width:auto; display:table; margin:0 auto;}

.social-networks li {width:auto; padding:0 20px; float:left;	position:relative;}

.social-networks i {color:#7A7A7A; font-size:27px; padding-top:30px; line-height:40px; text-align:center; display:block !important;}

.social-networks a {display:block;	}

.social-networks li em {
	background:url('../img/qipao.png') no-repeat;
	width:140px;
	height:150px;
	position:absolute;
	top:-160px;
	left:-41px;
	text-align:center;
	padding:6px 6px 6px 6px;
	font-style:normal;
	z-index:200;
	display:none;
	color:#FFF;
}
.social-networks li em a{ line-height:35px; height:35px;}
.dibu{ margin-top:10px;}
.dibu p{ text-align:center; font-size:12px; color:#5D5D5D; margin:0;}
.dibu a{ color:#5D5D5D}
/*--------------------------------------------------------------------- */
/* 10. Media Queries */
/*--------------------------------------------------------------------- */

/*  News  */
.subnav{ width:100%; text-align:center; font-size:16px; margin-top:40px;}
.subnav a{ padding:0 25px; height:50px; background:#F0f0f0; line-height:50px; display:inline-block; color:#404040; letter-spacing:0; margin:0 4px;}
.subnav a:hover{ background:#f8f8f8; color:#000;}

.newslist{ width:100%; clear:both; overflow:hidden; margin-top:20px; padding-bottom:20px;}
.newslist img.NewsPic{ height:100px; width:100px; border:1px solid #ccc; padding:4px; background:#f1f1f1;}
.newslist .name{ overflow:hidden;}
.newslist .name a{ line-height:34px; font-size:16px; color:#404141; float:left;}
.newslist .name .addTime{ line-height:34px; font-size:12px; text-align:left; float:right; color:#E33421;}
.newslist .newsText{ font-size:12px; line-height:22px;}
.newslist .resume-icon-box i{ height:60px; line-height:80px;}
.newslist .resume-icon-box p{ text-align:center; color:#f0f0f0;}

.Page{ margin-top:20px; text-align:center;}
.Page a{ width:40px; height:40px; line-height:40px; background:#FFF; color:#a0a0a0; display:inline-block; margin:2px; border:1px solid #CCCCCC; text-align:center; font-size:12px;}
.Page a:hover{ border:1px solid #b2b2b2; color:#000000;}
.Page a.selected{ background:#f55e25; color:#F0f0f0; cursor:pointer;}

.NewsView{ margin-bottom:20px;}
.NewsView a{ color:#575757;}
.NewsViewHead{ margin:15px 0 10px; overflow:hidden;}
.NewsPic{float:left; margin-right:10px;}
.NewsPic img{ display:block; width:90px; height:90px;}
.NewsViewR{float:left; margin-left:10px;}
.NewsViewTitle{font-size:26px; color:#000; font-weight:bold; line-height:40px; margin-bottom:20px;}
.NewsViewInfo{font-size:14px; line-height:30px;}
.NewsViewInfo span{ color:#666;}
.NewsContent{ min-height:400px; margin:10px 0 20px;}
.NewsContent p{ margin:0;}
.PrevNews{ float:left;}
.NextNews{ float:right;}

/*  News  */
.newsline{ width:100%; height:2px; background:url(../img/xwbg.png) repeat-x;}
.line{ width:100%; height:2px; background:url(../img/linebg.png) repeat-x;}

/*CaseView*/
#CaseTop{ width:100%; margin:0 auto 20px; border-bottom:1px #E3E2E0 solid; overflow:hidden; padding-bottom:20px;}
.CaseLeft{ float:left;}
.CaseLeft img{ height:120px; border:1px solid #ccc; padding:4px; background:#f1f1f1;}
.CaseRight{ width:60%; float:left;}
.CaseRight ul{ margin:0 auto;}
.CaseRight li{ width:100%; float:left; min-height:30px; line-height:30px;}
.CaseRight li span{ color:#f55e25;}

.CaseCont{}

.CuPlayer{ width:100%; height:500px; padding-bottom:20px; border-bottom:1px solid #ccc; margin-bottom:20px;}
#a1 {height: 500px;}


.CuText{ line-height:30px; margin-bottom:20px;}
.CuText p, .CuCont p{ margin:0;}

.Download .DownDiv{ padding-bottom:30px; margin-bottom:30px; border-bottom:2px solid #ccc;}
.Download .PC_Text{ margin-bottom:10px; position:relative;}
.Download .PC_Text .l{ width:700px; float:left;}
.Download .PC_Text .r{ float:right; width:289px; height:173px; position:relative;}
.Download .PC_Text .r img{ position:absolute;}
.Download .PC_Text .r img.PC{ width:100%; height:173px; top:0; left:0; z-index:10;}
.Download .PC_Text .r img.P1{ width:200px; height:112px; top:8px; left:8px;}
.Download .PC_Text .r img.P2{ width:123px; height:79px; right:19px; bottom:13px;}
.Download .PC_Text .l .name{ font-size:30px; font-weight:bold; line-height:50px; margin-bottom:10px;}
.Download .PC_Text .l .name img{ height:30px; vertical-align:middle;}
.Download .PC_Text .l .info{ line-height:25px; color:#9a9a9a; font-size:12px;}
.Download .PC_Text .l .Price{ color:#f55e25; font-size:20px;}
.Download .PC_Text .l .sm{ font-size:12px; color:#f55e25; line-height:20px;}
.Download .PC_Text .l p{ margin:0;}

.Download .PC_Text img{ display:inline-block; vertical-align:middle;}
.Download ul.Url{ overflow:hidden; display:block; margin:10px auto 0; padding:0;}
.Download ul.Url li{ display:block; float:left; list-style:none; margin:0 10px 10px 0;}
.Download ul.Url li a{ background:url(../img/button.png); display:block; width:180px; height:50px; line-height:50px; font-size:18px; color:#fff; padding-left:20px; text-decoration:none;}
.Download .Cont{ font-size:12px; border-top:1px dashed #ddd; padding-top:20px;}
.Download .Cont p{ margin:0; padding:0; line-height:normal;}
.Download .Cont a{  color:#575757;}

/*浏览器窗口大于959px*/
@media only screen and (min-width:959px) {}
/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width:959px) {
.CaseLeft{ width:100%; float:none; text-align:center; margin-bottom:20px;}
.CaseRight{ width:100%; float:none; padding:20px;}

.skill-bar{ padding-right:9px; margin-right:0px;}

.menu .active .bullet  {margin-left:40%;}

.profile-image, .profile-info {margin-left:0;}

.twitter-sign {margin-left:0;}

.divider {display:none;}

.quote {width:690px;}

.quote blockquote {width:71%;}

/* Resume */
.resume-content-box {width:67%;}

.resume-content-box span {display:block;}

.resume-content-box h3 {line-height:24px; }

/* Portfolio */
.portfolio-item {width:215px;}

.picture {height:auto;}

.CuPlayer{ height:400px;}
}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width:768px) and (max-width:959px) {
.CaseRight{ float:none; border:0px;}
.CaseLeft img{ width:45%;}

.page-title {font-size:50px;}
.page-title span{ font-size:45px;}

#header {background-attachment:scroll;}

#twitter-feed {background-attachment:scroll;}	
.CuPlayer{ height:350px;}
}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width:767px) {
.CaseLeft{ height:auto;}
.CaseLeft img{ width:80%;}
.CaseLeft .Casebg{ display:none;}

.newslist .name a{ float:none;}
.newslist .name .addTime{ float:none; margin:0; display:block;}

.PrevNews, .NextNews{ width:100%;}
.subnav{ width:60%; margin:20px auto 0;}
.subnav a{ display:inline-block; margin:4px;}

.dibu p{ line-height:20px; padding:0 8px;}

#header {background-attachment:scroll;}

#header.video {background:url("../video/video_bg.jpg") no-repeat !important;}

#twitter-feed {background-attachment:scroll;}	

.menu {display:none; width:100%; height:auto; background:grey;  position:absolute; z-index:9999; top:65px; left:0;}

.menu li {width:100%; height:55px; border-top:1px solid #ccc; background:#5B5B5B;}

.menu li a {height:55px; border-left:0;}

.menu span  {display:inline; padding-left:15px;}

.menu .active .bullet {display:none;}

.menu .active i {border:0 !important; padding-top:9px;}

.menu li a:hover i {padding-top:9px; border:0;}

.menu i {padding-top:9px; border:0; font-size:27px; text-align:left; width:130px; margin:0 auto;}

.menu .last {border:0;}

.mobile-menu {display:block;}

#header { position:relative;}

#navbar {background-position:center top; float:none; height:65px; position:absolute; bottom:0; padding:0;}

#navbar.stuck {margin:0; position:fixed; z-index:9999; top:0; background:url("../img/navbar_bg.png") repeat-x center top #414141;}

.profile-image img {display:block; margin:0 auto;}

.profile-image .white-bullet {margin-top:0;}

.profile-info {margin:0 auto; width:50%;}

.profile-tabs {margin:50px 0 0 0;}

.profile-tabs-content {text-align:center;}

.profile-tabs .active {background:transparent;}

.twitter-sign {margin:0 auto 40px;}

.tweet {text-align:center;}

.social-networks li {padding:0 18px;}

.mobile-menu.stuck {position:fixed; z-index:9998; top:0; width:100%; background:url("../img/header_bg.jpg") no-repeat center bottom;}

.mobile-menu i {float:none; margin:0 auto; display:table;}

.name-area h1 {padding:22px 0; width:100%;}

.name-area {position:relative; margin:0 auto; text-align:center; width:92%;}

.quote {width:auto; margin:0;}

.quote blockquote {width:100%; display:block; float:none; text-align:center; margin:0;}

.avatar {float:none; margin:0 auto; display:table;}

.quote .white-bullet-right {display:none;}

.contact-details {position:relative; margin-left:-50%; padding:70px 0 0 50%; width:200%; height:850px;}

/*.contact-details li {width:420px;}*/

.contact-details i, .contact-details span {float:none; display:table; margin:0 auto;}

#contact-form {float:none; display:table; margin:0 auto;}

.text, .textarea {width:94%;}

.resume-content-box {width:71%;}

.award-header.last {margin-top:35px;}
#a1 {height: 300px;}

/* Portfolio */
.portfolio-item {width:100%;}

.zoom {margin:27% auto;}

.overlay .bullet {left:47%;}

}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width:480px) and (max-width:767px) {
	.CuPlayer{ height:300px;}
	.page-title {font-size:43px;}
	.page-title span{ font-size:40px;}
	}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width:479px) {
	.CuPlayer{ height:250px;}
	#sp_div{ display:none;}
#s2 span{ display:none;}
#navbar {margin-top:480px;}

.page-title {font-size:36px; margin:53px 0;}
.page-title span{ font-size:33px;}

.profile-info {width:73%;}

.profile-tabs li {padding:9px 18px;}

.profile-tabs-content {width:100%; margin:0;}

.social-networks li {padding:0px 9px;}

.name-area {min-width:320px;}

.contact-details li {width:300px;}
#a1 {height: 200px;}

/* Resume */
/*.resume-icon-box {float:none; display:block; margin:0 auto;}

.resume-bullet-right { background:url("../img/bullets/resume_bullet_bottom_red.png") no-repeat 50% 0; width:30px; height:6px; margin:0 auto 8px; float:none; display:block;}*/
.resume-bullet-right{ margin-right:5px;}
.resume-content-box {float:none; display:block; width:86%; text-align:center;}
.resume-content-box span{ display:none;}
.resume-content-box h3{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.resume-content-box p{ text-align:left;}
.resume-title {text-align:center;}

.resume-title span {padding:0 5px;}

/* Portfolio*/
.overlay .bullet {left:46%;}

/*.filter {width:19.5%;}*/
.filter i{ width:99%; margin:0 auto;}
.filter span{ font-size:12px;}
}