body{
		padding:50px 0;
		background-color:#eee;
	}
	a{
		color:#333;
	}
	.navbar-fixed-top .xy-bar{
  	  text-align:center;
  	  font-size: 2rem;
  	}
  	.xy-bar>div,.xy-bar>a>div{padding-top:10px;}
  	.navbar-fixed-bottom .xy-bar{
  	  text-align: center;
  	  color: #666;
  	}
  	.navbar-fixed-bottom .glyphicon{
  	  font-size: 2rem;
  	  line-height: 2rem;
  	}
  	.navbar-fixed-bottom .title{
  	  font-size: 1rem;
  	}
  	
  	.xy-badge{
  		font-size: 2rem;
  		line-height: 4rem;
  		padding: 1rem;
  		border-radius: 50%;
  		background-color: #5bc0de;
  		margin: 10px auto;
  	}
	.xy-bar a{
		color:#666;
	}
	.xy-bar a:link,
	.xy-bar a:visited,
	.xy-bar a:hover,
	.xy-bar a:active{
		text-decoration:none;
	}

    .swiper-container {
        height: 104px;
        margin: 20px auto;
    }
    .swiper-slide {
        text-align: center;
        font-size: 18px;
        background: #fff;

        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
        overflow:hidden;
    }
    .swiper-slide img{
    	height: 100%;
    }
  div.bottom{
  	background-color: #666;
  	color: white;
  	padding: 25px 10px;
  	text-align: center;
  }

/* Custom Styles */
#myScrollspy    ul.nav-tabs{
        /* width: 140px; */
        width: 10rem;
        margin-top: 20px;
        border-radius: 4px;
        border: 1px solid #ddd;
        box-shadow: 0 1px 4px rgba(0, 0, 0, 0.067);
    }
#myScrollspy    ul.nav-tabs li{
        margin: 0;
        border-top: 1px solid #ddd;
    }
#myScrollspy    ul.nav-tabs li:first-child{
        border-top: none;
    }
#myScrollspy    ul.nav-tabs li a{
        margin: 0;
        padding: 8px 16px;
        border-radius: 0;
    }
#myScrollspy    ul.nav-tabs li.active a, ul.nav-tabs li.active a:hover{
        color: #fff;
        background: #0088cc;
        border: 1px solid #0088cc;
    }
#myScrollspy    ul.nav-tabs li:first-child a{
        border-radius: 4px 4px 0 0;
    }
#myScrollspy    ul.nav-tabs li:last-child a{
        border-radius: 0 0 4px 4px;
    }
#myScrollspy    ul.nav-tabs.affix{
        top: 40px; /* Set the top position of pinned element */
    }

.courselist .row { border-top:solid 1px #ddd; color: #333;}
.courselist a:first-child .row{ border-top:none;}
.courselist a>.row>div,
.orderlist .row>div,
.orderlist a>div{ line-height:2rem; padding:10px;}

.courselist .row .iconfont,.courselist .row .iconfont_live{ font-size: 2rem;color:#666;}
.courselist .row .icon-enter{ color:#ddd;}
.courselist .row div.small{padding:0 10px; color: #999;}
.courselist a.playing div{ color: #449d44; }
.navbar-fixed-top .iconfont{ font-size: 2rem;}

.col-xs-3{
	padding-left:0;
	padding-right:0;
}

.xy-bar a{
	display:block;
	position:relative;
	width:100%;
	height: 3rem;
}
.xy-bar div a span{
	position:absolute;
	display:block;
}
.xy-bar .iconfont,
.xy-bar .title{
	width:100%;
}
.xy-bar .title{
	top:2rem;
}
.xy-bar .badge{
	background-color:red;
	left:50%;
	margin-left:5px;
	top:-5px;
}

#myTab .active a{
	background-color: white;
	border: solid 1px #CCC;
	border-bottom: none;
	color: #333;
}


.xy-question label{
  display: block;
  width: 100%;
}

.xy-question .row{
  padding: 1rem;
  background-color: white;
}
.xy-question .selected{
  color: white;
  background-color: #31b0d5;
}
.courselist div.row div.row{
	padding:0;
	border-top:none;
	margin: 0 -10px;
}

#category-head{height:4rem;overflow:hidden;background-color:white;font-size:1.8rem;position: relative;}
#category-head ul{width:100%;display: inline;white-space: nowrap;overflow-x:scroll;float:left;overflow-y:hidden;margin-top:5px;}
#category-head ul li{display:inline-block;height:4rem;line-height:2rem;padding-left:10px;}
#category-head span{
	position: absolute;
	top: 10px;
	left: 0px;
	z-index: 5;
}

div.guide{
	margin-top:5px;
	line-height:2.5rem;
	height:3.5rem;
	overflow:hidden;
	background-color:white;
}

.guide>div{
	float: left;
}
.guide>div.pre,.guide>div.next{
	width: 5%;
	padding-top: 10px;
	color: #ccc;
}
.guide>div.pre{
	-webkit-transform: rotateY(135deg);
	        transform: rotateY(135deg);
	margin-left:4px;
}
.guide>div.next{
	-webkit-transform: rotateY(45deg);
	        transform: rotateY(45deg);
	margin-left:0px;
}
.guide>div#category-head{
	width: 88%;
}

div.cross{border-top: solid 1px #337ab7; height: 1.5em; color: #337ab7; margin-top: 1.5rem;}
div.cross div{width: 40%; text-align: center; background-color: white; margin: -.7em auto;}
div.crumbs{font-size: 1.5rem;padding-top: 10px;padding-bottom: 10px;}

/* white */
.xy_bg_0{background-color:white;}
/* yellow */
.xy_bg_1{background-color: #ffffee;}
/* pink */
.xy_bg_2{background-color: #fff3ff;}

.xy_btn{margin-top: 10px;}
.xy_title{min-height: 3.5em;}
.xy_more{text-align: right;color: #999;height: 2em;font-size: 1rem;}

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

#bottomBtn > div{
	height: 49px;
	line-height: 49px;
	text-align: center;
}
#bottomBtn > div + div{
	color: white;
}
.dropdown-menu>li>a{
	line-height:2em;
}
div.buttonPage{
	padding:20px;
}
.redText{
	color:red;
}
.memo{
	color:#999999;
}
.yearStatus {font-size:1.2em;font-weight:700;color:red;}
.yearPass {color:green;}
.jiaonang{
	padding:2px 5px;
	background-color:#007aff;
	color:white;
	border-radius:5px;
	margin-left:3px;
	display:inline-block;
}
.jiaonang.red{
	background-color:#d6363d;
}
.jiaonang.green{
	background-color:#0dbd47;
}
.jiaonang.blue{
	background-color:#007aff;
}
.jiaonang.orange{
	background-color:#f5940d;
}
.jiaonang.purple{
	background-color:#c32fed;
}