/*-- Green page --*/

/*-- For large screens --*/
@media (min-width:997px){
	#banner{ min-height: 350px; margin-top: 12px; background: url(/images/banner/error.jpg) no-repeat #072888; background-size: 61%; background-position: top right; }
	#banner h2{ width: 30%; padding: 4% 0 6% 5%; font-size: 2.6rem; }
	.sectionTitle{ width: 80%; margin: 40px auto 20px; padding: 10px; }
	.sectionContent{ width: 80%; }
	#intro{ width: 90%; height: 210px; max-width: 1024px; margin: 30px auto 0; }
	#intro #introText{ display: block; float: left; width: 56%; margin: 0 1%; }
	#intro #introVideo{ display: block; float: right; width: 40%; margin: 0 1%; }
	img.contentImgLeft{ display: block; float: left; width: 35%; margin: 5px 20px 10px 0; }
	img.contentImgRight{ display: block; float: right; width: 35%; margin: 5px 1% 10px 20px; }
	#idc_schedule ul li{ width: 46%; }
}

/*-- For medium screens --*/
@media (max-width:996px){
	#banner{ min-height: 300px; margin-top: 12px; background: url(/images/banner/error.jpg) no-repeat #072888; background-size: 61%; background-position: right; }
	#banner h2{ width: 30%; padding: 2% 0 4% 4%; font-size: 2.1rem; }
	.sectionTitle{ width: 90%; margin: 40px auto 20px; padding: 10px; }
	.sectionContent{ width: 90%; }
	#intro{ width: 100%; margin: 30px auto 0; }
	#intro #introText{ display: block; width: 90%; margin: 0 auto; }
	#intro #introVideo{ display: block; width: 70%; margin: 30px auto; }
	img.contentImgLeft{ display: block; width: 80%; margin: 5px auto 30px; }
	img.contentImgRight{ display: block; width: 80%; margin: 5px auto 30px; }
	#idc_schedule ul li{ width: 43.5%; }
}

/*-- For small screens --*/
@media (max-width:568px){
	#banner{ min-height: 200px; margin-top: 12px; background: url(/images/banner/small/error.jpg) no-repeat; background-size: 100%; }
	#banner h2{ width: 80%; padding: 32% 0 6% 5%; font-size: 1.6rem; text-shadow: 1px 1px 1px grey;}
	.sectionTitle{ width: 90%; margin: 40px auto 20px; padding: 10px; }
	.sectionContent{ width: 90%; }
	#intro{ width: 100%; margin: 30px auto 0; }
	#intro #introText{ display: block; width: 90%; margin: 0 auto; }
	#intro #introVideo{ display: block; width: 90%; margin: 30px auto; }
	img.contentImgLeft{ display: block; width: 100%; margin: 5px auto 30px; }
	img.contentImgRight{ display: block; width: 100%; margin: 5px auto 30px; }
	#idc_schedule ul li{ width: 90%; }
}


/*== Page deisgn for course.php ==*/

p{
	font-size: 1.2rem;
	margin-bottom: 10px;	
}

.sectionTitle{
	display: block;
	position: relative;
	line-height: 24px;
	text-align: center; 
	overflow: hidden;
}

.sectionTitle .caption{
	position: relative;
	display: inline-block;
}

.sectionTitle .caption .line{
	position: absolute;
	top: 50%;
	width: 400%;
	height: 3px;
	background-color: #ddd;
}

.sectionTitle .caption .line-l{
	right: 100%;
	margin-right: 15px;
}

.sectionTitle .caption .line-r{
	left: 100%;
	margin-left: 15px;
}

h3{
	display: block;
	margin: 0 auto;
	text-align: center;	
}

.sectionContent{
	display: block;
	margin: 0 auto;
	/*--position: relative;--*/
}

#pageTitle{
	/*--background: #42a642--*/;
	background: #337ab7;
}

#banner{
	max-width: 1024px;
	width: 100%;
}

#banner h2{
	font-weight: bold;
	color: #fff;
}

#intro #introVideo video{
	width: 100%;
}

#setup ol{
	padding: 0 20px;
}

#setup ol li{
	font-size: 1.2rem;
	margin-bottom: 6px;
}

#cost ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
}

#cost ul li{
	font-size: 1.2rem;
	margin: 16px 0;
	padding-left: 30px;
	background: url(/images/dive_flag.jpg) no-repeat 0 5px;
	background-size: 20px;
}

#cost span{
	font-size: 1rem;
}

#cost .course_title{
	font-size: 1.4rem;
	font-weight: bold;
}

#discount ul,#prerequisites ul,#what2learn ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
}

#discount ul li,#prerequisites ul li,#what2learn ul li{
	font-size: 1.2rem;
	margin: 16px 0;
	padding-left: 30px;
	background: url(/images/bg/tick.png) no-repeat 0 2px;
	background-size: 20px;
}

p.subtitle{
    font-size: 1.3rem;
    margin-top: 30px;
    text-decoration: underline;
}

#idc_schedule ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
}

#idc_schedule ul li{
    display: inline-block;
	font-size: 1.2rem;
	margin: 16px 0;
	padding-left: 30px;
	background: url(/images/dive_flag.jpg) no-repeat 0 5px;
	background-size: 20px;
}

#idc_schedule span{
	font-size: 1rem;
}

#apply{
	text-align: center;	
}

.signUpButton{
	display: block;
	margin: 40px auto 10px;
	width: 260px;
	height: 40px;
	border: none;
	border-radius: 8px;
	box-shadow: 1px 1px 1px grey;
	background: #42a642;
	font-size: 1.2rem;
	color: #fff;
	cursor: pointer;
}

#faq ul, #setup ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
}

#faq ul li, #setup ul li{
	font-size: 1.2rem;
	margin: 16px 0;
	padding-left: 30px;
	background: url(/images/dive_flag.jpg) no-repeat 0 5px;
	background-size: 20px;
}