/****************
	Main style
*****************/
/*http://colorschemedesigner.com/#3m22Pm6tZw0w0*/

header, nav, footer, section, article, aside, hgroup{display:block;}
body
{
	background-color: #EDEDED;
	background-position:left top;
	background-repeat:repeat;
    font-family:Arial, Helvetica, sans-serif;
	font-size: 14px;
    color: #181818;
}

header{
	position:relative;
	clear:both;
	width:922px;
	margin: auto;
	padding : 15px;
	background-color:#308393;
}

#main_wr
{
	background-color: white;
	border: 1px solid #308393; /*#DCDCDC;*/
    width: 900px;
    margin: auto;
	padding: 15px 25px 15px 25px;

}

#main_title {
    font-family:Arial, Helvetica, sans-serif;
	color:white;
	display:inline-block;
	width:28%;
}

#contents{
	display:inline-block;
	border: 1px solid black;
	text-transform:capitalize;
	padding:10px;
}

p{
	margin: 20px;
}

section article h2{
	display : inline-block;
	margin: 0;
	text-transform:capitalize;
	width:53%;
	color:#105360;
}


.example{
	border: 1px Solid black;
	font-family: monospace;
	font-size: 14px;
	text-align: center;
	padding: 10px;
}

.drawLine
{ 
	margin-top:10px;
	margin-bottom:10px; 
	border-bottom: solid 1px #63B9C9 /*D6D6D6*/; 
	width:100%; 
} 

/* Navigation Menu*/
nav{
	display:inline-block;
	width:67%;
	background:transparent;
}

nav ul li{
	list-style-type: none;
	float: left;
	line-height:normal;
}

nav ul li a{

	font-size: 17px;
	font-family:Arial, Helvetica, sans-serif;
	color: white;
	text-transform:capitalize;
	font-weight:normal;
	padding:10px;
	background-color:transparent;
    text-decoration:none;
}

nav ul li a:hover{
	color: #62b1c1;
}

nav ul li a#current{
	background-color:#62b1c1;
	color:white;
	-moz-border-radius: 8px;
	border-radius: 8px;
}

div.topLink{
		display: inline-block;
		text-align: right;
		width: 46%;
}

/* Footer */

footer{
	position:relative;
	height:90px;
	clear:both;
	width:952px;
	margin: auto;
	background-color:#308393;
}

#FooterRight{
	position: absolute;
	right: 20px;
	margin-top: 30px;
	color:white;
}

#FooterLeft{
	position: absolute;
	left:20px;
	margin-top: 30px;
	color:white;
}

/****************
	Index layout
*****************/

.intro{
	background-color: white;
	position: relative;
	height: 450px;
	padding:6px;
	border-radius:8px;
}

.intro h1{
	font-size: 50px;
	color:#62b1c1;
	text-transform:capitalize;
	text-align:left;	
	}

.group_bannner_left {
	display:inline;
	position: absolute;
	left:15px;
	width: 65%;
	top: 7%;
	}
	
.group_bannner_right{
	display:inline;
	position: absolute;
	left:68%;
	top: 17%;
	}
.group_bannner_right img{width:275px}

.overview h3{
	color:#105360;
}


.overview p{
	margin-right: 5px;
}

.completion  {width:700px; margin: 0 auto;}

.camText{display:inline-block; vertical-align:top; width:40%;}

/***************
	Tables
****************/

/*content*/

.contentTable table
{
    border-collapse: collapse; 
	width: 80%;
	margin : auto;
}
.contentTable td
{
    border: 1px solid black;
	padding: 5px;
}

/*Code*/
.comment { color: #008E00; font-style: italic; }
.pre { color: #663300; }
.string { color: #009900; }
.char { color: #660099; }
.float { color: #996600; }
.int { color: #FF6600; }
.bool { color: #000000; font-weight: bold; }
.type { color: #FF6633; }
.flow { color: #FF0000; }
.keyword { color: #990000; }
.operator { color: #000099; font-weight: bold; }
.syntaxtable .linenos {width: 30px;}

pre ol li{height:17px}
.trigger a{
	display: block;
	width: 305px;
	background: url(Pictures/arrow.png) top right no-repeat;	
}
.active a{
	background-position:right bottom;	
}


div.code2 {
	border:1px solid #308393; /*#DEE5F0;*/
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	background-color: #F6F8FC;
	padding: 8px;
	overflow: auto;
}
/****************
	Pictures
****************/

figure{text-align: center}
.series img{margin: 3px;}
.problem1 {width=900px;}
.cam{display:inline-block;}
.troubleshooting{display: inline-block;}



/****************
	Multimedia
*****************/
.video1{
	margin:0 auto;
	width:480px
}
.video2{
	margin:0 auto;
	width:640px
}


a{color:#308393; text-decoration:none;}
a:hover{color:#03bcdb}