@charset "utf-8";
/* CSS Document */


body {
	background-image: url('images/title.jpg');
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: center 62px;
	font-family:"Street Corner Slab";
	font-size:16px;
	color: #FFFFFF;
}

@font-face {
    font-family: "Street Corner Slab";
    src: url(fonts/Street Corner Slab.ttf);
    font-weight:normal;
	font-style:normal;
}

@font-face {
    font-family: "Street Corner Slab";
    src: url(fonts/Street Corner Slab Bold.ttf);
    font-weight:bold;
	font-style:normal;
}

@font-face {
    font-family: "Street Corner Slab";
    src: url(fonts/Street Corner Slab Oblique.ttf);
    font-weight:normal;
	font-style:oblique;
}

@font-face {
    font-family: "Champignon";
    src: url(fonts/Champignon.otf);
    font-weight:normal;
	font-style:normal;
}

.title{
	font-family:"Champignon";
	color: #fc7572;
	font-size:64px;
	/*box-shadow: 5px 5px 5px #aaaaaa;*/
}

.navline {
	width:100%;
	height:25px;
	position:absolute;
	top:175px;
	background-color:#f6bac6;
	box-shadow: 0px 3px 5px #cccccc;
}

nav {
	width:960px;
	margin:auto;
	line-height:25px;
}
 
.lightpink {
	background-color:#f6bac6;
}

.darkpink {
	background-color:#f188a7;
}

.green {
	background-color:#a5d3b6;
}

.blue {
	background-color:#99b5dd;
}

.yellow {
	background-color:#f3ea81;
}

.purple {
	background-color:#c484a7;
}

.orange {
	background-color:#ffaf7c;
}

.red {
	background-color:#fc7572;
}

.lightpink,
.darkpink,
.green,
.blue,
.yellow,
.purple,
.orange,
.red,
.rounded
{
	border-radius:4px;
	box-shadow: 3px 3px 5px #cccccc;
}

.gamelistimage
{
	border-radius:4px;
	box-shadow: 2px 2px 4px #75a386;
}


a {
	font-family: "Street Corner Slab";
	font-size: 16px;
	color: #FFFFFF;
	font-weight: bold;
	border-width:0px;
	cursor:pointer;
	text-decoration: none;
}



a:visited {
	color: #FFFFFF;
	
}

a:active {
	color: #fc7572;

	border:0;
}
a:link {

}

.pinklink,
.pinklink:visited,
.pinklink:active {
	color:#f6bac6;
}


.blacklink,
.blacklink:visited,
.blacklink:active {
	color:#000000;
}


a:hover,
.pinklink:hover,
.blacklink:hover {
	color:#fc7572;
}

 
.fulljustify {
  text-align: justify;
}
.fulljustify:after {
  content: "";
  display: inline-block;
  width: 100%;
}


.fulljustify > a {
	font-weight:normal;
}


.searchbar {
	border-radius:4px;
	border:solid 1px #99b5dd;
	width:100px;
	height:14px;
	font-size:10px;
	display:inline-block;
	padding:0px;
	position:relative;
	top:-2px;
}

.searchbutton {
	border-radius:4px;
	background-color:#FFF;
	width:14px;
	height:14px;
	display:inline;
	color:#f6bac6;
	cursor:pointer;
}


.maincontainer {
	width:960px;
	margin:auto;
	position:relative;
}

.footer {
	width:100%;
	position:relative;
	top:20px;
	margin-top:20px;
	padding-top:20px;
	padding-bottom:20px;
	text-align:center;
	background-color:#f188a7;
}

.blanket {
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
	background-color:#000000;
	z-index:5;
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:500px;
}

.loginbutton {
	text-align:center;
	padding-top:5px;
	padding-bottom:5px;
	overflow:hidden;
	background-color:#a5d3b6;
	border-radius:4px;
}

.animatedgamescene {
	border:1px solid #FFFFFF;
	border-radius:5px;
	overflow:hidden;
	width:280px;
	height:280px;
	margin:auto;
	position:relative;
}

.gamescrollbutton,
.gamescrollbuttonred,
.gameholder {
	border-radius:5px;
	
	position:absolute;
	text-align:center;
	font-size:14px;
	cursor:pointer;
}

.gamescrollbuttonred {
	background-color:#fc7572;	
}

.gamescrollbutton,
.gameholder {
	background: rgba(255, 255, 255, 0.8);
}

.gameholder {
	width:270px;
	height:220px;
	top:5px;
	left:280px;
	transition:left 1s;
	transition-timing-function:ease-out;
}

.gamescrollbuttonred,
.gamescrollbutton {
	width:50px;
	height:20px;
	line-height:20px;
}

.gamescrollimage {
	display: block;
	position: absolute;
	top: -5px;
	left: 10px;
	width: 250px;
	height: 250px;
	clip: rect(35px,250px,215px,0px);
}

.flippedhorizontally {
	-moz-transform: scaleX(-1);
	-o-transform: scaleX(-1);
	-webkit-transform: scaleX(-1);
	transform: scaleX(-1);
	filter: FlipH;
	-ms-filter: "FlipH";
}

.formInput {
	border-radius: 3px;
	border: solid 1px #999;
}