@charset "utf-8";
body {
	font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
	background-color: #FFF;
	margin: 0;
	padding: 0;
	color: #000;
}

.fontcolor-green {
	color: #090;
	font-size: small;
}

.fontcolor-yellow {
	color: #FF9900;
	font-size: small;
}

.fontcolor-black {
	color: #000;
	font-size: small;
	//text-align: center;
	
}

.fontcolor-white-kotak {
	color: #000;
	font-size: small;
	//text-align: center;
	border: 2px dashed #FFF;
}

.fontcolor-black-kotak {
	color: #000;
	font-size: small;
	//text-align: center;
	border: 2px dashed #000;
}

.fontcolor-black-bold {
	color: #000;
	font-size: small;
	font-weight: bold;
	//text-align: center;	
}

.fontcolor-white {
	color: #FFF;
	font-size: small;
}

.fontcolor-white-bold {
	color: #FFF;
	font-weight: bold;
	font-size: small;
}

.fontcolor-red-bold {
	color: #F00;
	font-weight: bold;
	font-size: small;
}

.fontcolor-red {
	color: #F00;
	//font-weight: bold;
	font-size: small;
}

ul, ol, dl { 
	padding: 0;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;	
	padding-right: 15px;
	padding-left: 15px; 
}
a img { 
	border: none;
}

a:link {
	color:#414958;
	text-decoration: none; 
}
a:visited {
	color: #4E5869;
	text-decoration: underline;
}
a:hover, a:active, a:focus { 
	text-decoration: none;
}
img {
	vertical-align: middle;
	color: #D6D6D6;
}  

.container {
	
	width: 80%;
	max-width: 1260px;
	min-width: 780px;
	background-color: #FFF;
	margin: 0px auto;
	
}

.header {
	
	padding: 10px 0;
	background-color: #386C94;
	width: 100%;
}

.header2 {
	position: relative;
	padding: 10px 0;
	background-color: #000;
	// background-color: #FFF;
	// background-color: #C10000;
	clear: both;
	text-align: center;
	width: 100%;	
}

.header3 {
	position: relative;
	padding: 10px 0;
	background-color: #000;
	clear: both;
	text-align: center;
	width: 100%;	
}

.content {
	position:relative;
	
	width: 100%;
	height: 245px;
	float: left;
	
}

.login {
	position: absolute;
	padding: 10px 0;
	width: 20%;
		
	left: 10%;
	top: 10%;
}

.cute {
	position: absolute;
	padding: 10px 0;
	width: 20%;
	//border: 2px dashed #000;
	left: 40%;
	top: 15%;

}

.register {
	position: absolute;
	padding: 10px 0;
	width: 20%;
	
	left: 70%;
	top: 10%;
}

.content img{
-webkit-transform:scale(0.8); /*Webkit: Scale down image to 0.8x original size*/
-moz-transform:scale(0.8); /*Mozilla scale version*/
-o-transform:scale(0.8); /*Opera scale version*/
-webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/
-moz-transition-duration: 0.5s; /*Mozilla duration version*/
-o-transition-duration: 0.5s; /*Opera duration version*/
opacity: 0.7; /*initial opacity of images*/
margin: 0 10px 5px 0; /*margin between images*/
}

.content img:hover{
-webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
-moz-transform:scale(1.1); /*Mozilla scale version*/
-o-transform:scale(1.1); /*Opera scale version*/

opacity: 1;
}

.content ul, .content ol { 
	padding: 0 15px 15px 40px; 
}

.content2 {
	position: relative;	
	float: left;

	width: 79.6%;
	height: 418px;
	border: 2px dashed #000;
	
}

.login2 {
	position: absolute;
	padding: 10px 0;
	width: 50%;
	height: 56%;
	border: 2px dashed #666666;
	left: 35%;
	top: 20%;
	text-align: right;
}

.register2 {
	position: absolute;
	//padding: 10px 0;
	width: 50%;
	//height: 50%;
	border: 2px dashed #666666;
	left: 35%;
	top: 25%;	
}

.content2 img{
-webkit-transform:scale(0.8); /*Webkit: Scale down image to 0.8x original size*/
-moz-transform:scale(0.8); /*Mozilla scale version*/
-o-transform:scale(0.8); /*Opera scale version*/
-webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/
-moz-transition-duration: 0.5s; /*Mozilla duration version*/
-o-transition-duration: 0.5s; /*Opera duration version*/
opacity: 0.7; /*initial opacity of images*/
margin: 0 10px 5px 0; /*margin between images*/
}

.content2 img:hover{
	-webkit-transform: scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
	-moz-transform: scale(1.1); /*Mozilla scale version*/
	-o-transform: scale(1.1); /*Opera scale version*/
	opacity: 1;
}

.back {
	position: absolute;
	width: 5%;
	left: 93%;
	top: 1%;
	//border: 2px dashed #666666;
}

.backprofile {
	position: absolute;
	width: 5%;
	left: 93%;
	top: 2%;
	border: 2px dashed #666666;
}

.backrenew {
	position: absolute;
	width: 5%;
	left: 93%;
	top: 1.5%;
	border: 2px dashed #666666;
}

.backrenew2 {
	position: absolute;
	width: 5%;
	left: 93%;
	top: 3%;
	border: 2px dashed #666666;
}

.backfaq {
	position: absolute;
	width: 5%;
	left: 93%;
	top: 5%;
	border: 2px dashed #666666;
}

.backfaq2 {
	position: absolute;
	width: 5%;
	left: 93%;
	top: 6%;
	border: 2px dashed #666666;
}

.backfaq3 {
	position: absolute;
	width: 5%;
	left: 93%;
	top: 1%;
	border: 2px dashed #666666;
}

.back2 {
	position: absolute;
	width: 5%;
	left: 91%;
	top: 42%;
}

.profile {
	position: absolute;
	padding: 10px 0;
	width: 20%;
	left: 25%;
	top: 30%;
}

.profile2 {
	position: absolute;
	padding: 10px 0;
	width: 20%;
	left: 25%;
	top: 30%;
}

.order {
	position: absolute;
	padding: 10px 0;
	width: 20%;
	
	left: 50%;
	top: 8%;
}

.order2 {
	position: absolute;
	padding: 10px 0;
	width: 20%;
	
	left: 50%;
	top: 8%;
}

.orderlist {
	position: absolute;
	padding: 10px 0;
	width: 20%;
	
	left: 50%;
	top: 52%;
}

.faq {
	position: absolute;
	padding: 10px 0;
	width: 20%;
	left: 25%;
	top: 52%;
}

.message {
	position: absolute;
	padding: 10px 0;
	width: 20%;
	
	left: 75%;
	top: 52%;
	
	//left: 50%;
	//top: 52%;
}

.message2 {
	position: absolute;
	padding: 10px 0;
	width: 20%;
	
	left: 50%;
	top: 52%;
	
	//left: 50%;
	//top: 52%;
}

.logout {
	position: absolute;
	padding: 10px 0;
	width: 20%;
	
	//left: 75%;
	//top: 52%;
	
	left: 75%;
	top: 30%;
}

.logout2 {
	position: absolute;
	padding: 10px 0;
	width: 20%;
	
	//left: 75%;
	//top: 52%;
	
	left: 75%;
	top: 30%;
}

.sidebar1 {
	position: relative;
	float: left;
	width: 20%;
	height: 422px;
	//height:	auto;
	
	background-color: #000;
	
}

.sidebar1box {
	position: absolute;
	padding: 10px 0;
	width: 80%;
	left: 9%;
	top: 30%;
	border: 2px dashed #666666;
}

.sidebar1home {
	position: absolute;
	//padding: 10px 0;
	width: 13%;
	left: 3%;
	top: 31%;
	border: 2px dashed #666666;
}

.sidebar1homebutton1 {
	position: absolute;
	//padding: 10px 0;
	width: 19.6%;
	left: 0%;
	top: 2%;
	border: 2px dashed #666666;
}

.sidebar1homebutton2 {
	position: absolute;
	//padding: 10px 0;
	width: 19.6%;
	left: 0%;
	top: 92%;
	border: 2px dashed #666666;
}

.sidebar1profile {
	position: absolute;
	//padding: 10px 0;
	width: 13%;
	left: 3%;
	top: 18%;
	border: 2px dashed #666666;
}

.sidebar1profilebutton1 {
	position: absolute;
	//padding: 10px 0;
	width: 19.6%;
	left: 0%;
	top: 1.1%;
	border: 2px dashed #666666;
}

.sidebar1profilebutton2 {
	position: absolute;
	//padding: 10px 0;
	width: 19.6%;
	left: 0%;
	top: 52.6%;
	border: 2px dashed #666666;
}

.sidebar1renew {
	position: absolute;
	//padding: 10px 0;
	width: 13%;
	left: 3%;
	top: 12%;
	border: 2px dashed #666666;
}

.sidebar1renewbutton1 {
	position: absolute;
	//padding: 10px 0;
	width: 19.6%;
	left: 0%;
	top: 0.7%;
	border: 2px dashed #666666;
}

.sidebar1renewbutton2 {
	position: absolute;
	//padding: 10px 0;
	width: 19.6%;
	left: 0%;
	top: 33.65%;
	border: 2px dashed #666666;
}

.sidebar1renew2 {
	position: absolute;
	//padding: 10px 0;
	width: 13%;
	left: 3%;
	top: 26.2%;
	border: 2px dashed #666666;
}

.sidebar1renew2button1 {
	position: absolute;
	//padding: 10px 0;
	width: 19.6%;
	left: 0%;
	top: 1.5%;
	border: 2px dashed #666666;
}

.sidebar1renew2button2 {
	position: absolute;
	//padding: 10px 0;
	width: 19.6%;
	left: 0%;
	top: 73.5%;
	border: 2px dashed #666666;
}

.sidebar1faq {
	position: absolute;
	//padding: 10px 0;
	width: 13%;
	left: 3%;
	top: 19%;
	border: 2px dashed #666666;
}

.sidebar1faqbutton1 {
	position: absolute;
	//padding: 10px 0;
	width: 19.6%;
	left: 0%;
	top: 1.1%;
	border: 2px dashed #666666;
}

.sidebar1faqbutton2 {
	position: absolute;
	//padding: 10px 0;
	width: 19.6%;
	left: 0%;
	top: 52.6%;
	border: 2px dashed #666666;
}

.sidebar1faq2 {
	position: absolute;
	//padding: 10px 0;
	width: 13%;
	left: 3%;
	top: 8%;
	border: 2px dashed #666666;
}

.sidebar1faq2button1 {
	position: absolute;
	//padding: 10px 0;
	width: 19.6%;
	left: 0%;
	top: 0.65%;
	border: 2px dashed #666666;
}

.sidebar1faq2button2 {
	position: absolute;
	//padding: 10px 0;
	width: 19.6%;
	left: 0%;
	top: 22.5%;
	border: 2px dashed #666666;
}

.sidebar1request {
	position: absolute;
	//padding: 10px 0;
	width: 13%;
	left: 3%;
	top: 7%;
	border: 2px dashed #666666;
}

.sidebar1requestbutton1 {
	position: absolute;
	//padding: 10px 0;
	width: 19.6%;
	left: 0%;
	top: 0.4%;
	border: 2px dashed #666666;
}

.sidebar1requestbutton2 {
	position: absolute;
	//padding: 10px 0;
	width: 19.6%;
	left: 0%;
	top: 18.7%;
	border: 2px dashed #666666;
}

.sidebar1request2 {
	position: absolute;
	//padding: 10px 0;
	width: 13%;
	left: 3%;
	top: 30%;
	border: 2px dashed #666666;
}

.sidebar1request2button1 {
	position: absolute;
	//padding: 10px 0;
	width: 19.6%;
	left: 0%;
	top: 2.2%;
	border: 2px dashed #666666;
}

.sidebar1request2button2 {
	position: absolute;
	//padding: 10px 0;
	width: 19.6%;
	left: 0%;
	top: 90%;
	border: 2px dashed #666666;
}

.sidebar1update {
	position: absolute;
	//padding: 10px 0;
	width: 13%;
	left: 3%;
	top: 31%;
	border: 2px dashed #666666;
}

.sidebar1updatebutton1 {
	position: absolute;
	//padding: 10px 0;
	width: 19.6%;
	left: 0%;
	top: 1.8%;
	border: 2px dashed #666666;
}

.sidebar1updatebutton2 {
	position: absolute;
	//padding: 10px 0;
	width: 19.6%;
	left: 0%;
	top: 91.8%;
	border: 2px dashed #666666;
}

.sidebar2 {
	float: right;
	width: 20%;
	background-color: #93A5C4;
	padding-bottom: 10px;
}

.content3 {
	position:relative;
	
	width: 99.6%;
	height: 241px;
	float: left;
	border: 2px dashed #000;
}

.content3 img{
-webkit-transform:scale(0.8); /*Webkit: Scale down image to 0.8x original size*/
-moz-transform:scale(0.8); /*Mozilla scale version*/
-o-transform:scale(0.8); /*Opera scale version*/
-webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/
-moz-transition-duration: 0.5s; /*Mozilla duration version*/
-o-transition-duration: 0.5s; /*Opera duration version*/
opacity: 0.7; /*initial opacity of images*/
margin: 0 10px 5px 0; /*margin between images*/
}

.content3 img:hover{
-webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
-moz-transform:scale(1.1); /*Mozilla scale version*/
-o-transform:scale(1.1); /*Opera scale version*/

opacity: 1;
}

.content4 {
	position:relative;
	//padding: 10px 0;
	clear: both;
	text-align: center;
	width: 99.6%;	
	float: left;
	border: 2px dashed #000;
}

.content4 img{
-webkit-transform:scale(0.8); /*Webkit: Scale down image to 0.8x original size*/
-moz-transform:scale(0.8); /*Mozilla scale version*/
-o-transform:scale(0.8); /*Opera scale version*/
-webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/
-moz-transition-duration: 0.5s; /*Mozilla duration version*/
-o-transition-duration: 0.5s; /*Opera duration version*/
opacity: 0.7; /*initial opacity of images*/
margin: 0 10px 5px 0; /*margin between images*/
}

.content4 img:hover{
-webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
-moz-transform:scale(1.1); /*Mozilla scale version*/
-o-transform:scale(1.1); /*Opera scale version*/

opacity: 1;
}

ul.nav {
	list-style: none; 
	border-top: 1px solid #666; 
	margin-bottom: 15px; 
}
ul.nav li {
	border-bottom: 1px solid #666; 
}
ul.nav a, ul.nav a:visited { 
	padding: 5px 5px 5px 15px;
	display: block; 
	text-decoration: none;
	background-color: #8090AB;
	color: #000;
}
ul.nav a:hover, ul.nav a:active, ul.nav a:focus { 
	background-color: #6F7D94;
	color: #FFF;
}

.footer {
	position: relative;
	padding: 10px 0;
	background-color: #000;
	clear: both;
	text-align: center;
	width: 100%;
	
}

.news {
	position: absolute;
	padding: 0 0;
	width: 80%;
	left: 10%;
	top: 60%;
	
}

.info {
	position: absolute;
	padding: 0 0;
	width: 80%;
	
	left: 10%;
	top: 15%;
}

.footer2 {
	padding: 10px 0;
	background-color: #386C94;
	position: relative;
	clear: both; 
	width: 100%;
}

.footer3 {
	position: relative;
	padding: 10px 0;
	background-color: #000;
	clear: both;
	text-align: center;
	width: 100%;
}

.fltrt {  
	float: right;
	margin-left: 8px;
}
.fltlft { 
	float: left;
	margin-right: 8px;
}
.clearfloat { 
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}