/*
	 CSS-Tricks Example
	 by Chris Coyier
	 http://css-tricks.com
*/

* { margin: 0; padding: 0; }
html { background: black; }
body { 
	font: 14px comic sans ms; 
	background-repeat: no-repeat;
	min-height: 350px;
	
}
#fullpage {
					min-height:100%;
					min-width:1070px;
					position:relative;
				}
#page-wrap { width: 950px; margin: -20px auto; height:680px;}

#wrapper1{
	width:76%;
	position:relative;
	height:auto;
	display:inline-table;
}

#wrapper2{
	width:20%;
	position:relative;
	height:auto;
	display:inline-table;
}

#welcome{
	background:silver;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	box-shadow:0px 0px 5px 4px dimgrey;
	-webkit-box-shadow:0px 0px 5px 4px dimgrey;
	-moz-box-shadow:0px 0px 5px 4px dimgrey;
	border-top:2px solid darkgrey;
	margin-top:100px;
	width:720px;
	height:380px;	
	color:rgb(80,80,80);
}

#contents  {
	font-family:comic sans ms;
	text-align:center;
	text-shadow:1px 1px 1px grey;
}

#contents h1 {
	font-size:50px;text-shadow:2px 2px 2px black;color:dimgrey;background:CornflowerBlue;border-top-left-radius:20px;border-top-right-radius:20px;
	box-shadow:0px 1px 1px black;
	-webkit-box-shadow:0px 1px 1px black;
	-moz-box-shadow:0px 1px 1px black;padding:2px;
}

#list{
	font-size:20px;
	text-align:left;
	margin-left:30px;
}
#list li{line-height:30px;}



#news-box{
	background:silver;
	height:320px;
	width:160px;
	top:-15px;
	position:relative;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	box-shadow:0px 0px 2px 2px dimgray;
	-webkit-box-shadow:0px 0px 2px 2px dimgray;
	-moz-box-shadow:0px 0px 2px 2px dimgray;
	padding:15px;
}

#news-head {
	color:darkred;
	font-size:24px;
	text-align:center;
	
}

#news-body{
	background:aliceblue;
	width:160px;
	height:270px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	margin:10px -5px;
	padding:5px;
}

#well {
	margin-top:60px;
	padding: 14px 20px 20px 20px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
	width:690px;
	background: -moz-linear-gradient(top, #010101, #181818);
	background: -webkit-gradient(linear,left top,left bottom,color-stop(0, #010101),color-stop(1, #181818));
	
	border: 2px solid #454545; 
	overflow: hidden; 
	
	-webkit-user-select: none;
}
.round-corners{border-radius: 30px;}
h2 {
  background: -moz-linear-gradient(left, #4d4d4d, 0.4, #4d4d4d, 0.5, white, 0.6, #4d4d4d, #4d4d4d); 
  background: -webkit-gradient(linear,left top,right top,color-stop(0, #4d4d4d),color-stop(0.4, #4d4d4d),color-stop(0.5, white),color-stop(0.6, #4d4d4d),color-stop(1, #4d4d4d)); 
  
  -moz-background-clip: text;
  -webkit-background-clip: text;
  
  -moz-text-fill-color: transparent;
  -webkit-text-fill-color: transparent;
  
  -webkit-animation: slidetounlock 5s infinite;
  
  font-size: 55px;
  font-family: comic sans ms;
  font-weight: 300;
  
  padding: 0;
  width: 120%;
  
  -webkit-text-size-adjust: none;
  color:grey;
  text-shadow:1px 1px 1px grey;
}

#counter{

	position:relative;
	top:530px;
	left:740px;
	width:220px;
}

#visitor{
	font-size:22px;
	color:silver;
	position:relative;
	top:-3px;
	left:-5px;
	text-shadow:2px 2px 2px darkred;
}



#slider {
	background: url(../images/arrow.png) no-repeat;
	width: 146px;
	height: 98px;
	display: inline-block;
	vertical-align: middle;
	line-height: 1;
	cursor:pointer;
}

@-webkit-keyframes slidetounlock {
	0% {
		background-position: -720px 0;
	}
	100%{
		background-position: 720px 0;
	}
}

#get-slider{
	height:70px;
	position:relative;
	top:-12px;
	width:70px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	background:grey;
	margin-left:600px;
	box-shadow:0px 0px 2px 2px black;
	-webkit-box-shadow:0px 0px 2px 2px black;
	-moz-box-shadow:0px 0px 2px 2px black;
	color:black;
	cursor:pointer;
	text-shadow:1px 1px 1px dimgrey;
	-moz-transition:all 0.2s ease;
	-webkit-transition:all 0.2s ease;
	font-family:comic sans ms;
}
#get-slider div{top:20px;text-align:center;position:relative;}
#get-slider:hover{color:blue;box-shadow:0px 0px 3px 3px black;-webkit-box-shadow:0px 0px 3px 3px black;-moz-box-shadow:0px 0px 3px 3px black;}
#footer {
				position:absolute;
				top:756px;
				width:100%;
				height:60px;
				border: 0px none;
				font-size:18px;
				text-shadow: 1px 1px 1px lightgrey;
				background:linear-gradient(lightgrey,ghostwhite);
				background:-moz-linear-gradient(lightgrey,ghostwhite);
				background:-webkit-linear-gradient(lightgrey,ghostwhite);
				background: -webkit-gradient(linear,left bottom,left top,color-stop(0,lightgrey),color-stop(1,ghostwhite));
				filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#D3D3D3', EndColorStr='#F8F8FF');
				box-shadow:0px 0px 4px 2px grey;
				-webkit-box-shadow:0px 0px 4px 2px grey;
				-moz-box-shadow:0px 0px 4px 2px grey;
				text-align:center;
			}
#footer-text {
				text-align:center;
				margin:10px;
			}
			
			#footer span {
				font-size:16px;
				text-shadow: 1px 1px 1px grey;
			}
			
			#footer span a {
				text-decoration:none;
				font-size:18px;
				text-shadow: 1px 1px 1px grey;
				color:rgb(80,80,80);
			}