/**
 * Title: MadeToPlay 
 * Author: Jamie TAylor
 * URI: http://percipio.me
 * Version: 1.0
 * Last Updated: 
 */



/** Link Styles
 * ---------------------------------------- 
 */

a:visited, a:active, a:focus, a:link {
    outline: none;
    text-decoration: none;
}
a:visited,  a:active,  a:focus,  a:link {
    -moz-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    -webkit-transition: all 0.6s ease-in-out;
    color: #009ade;
    transition: all 0.6s ease-in-out;
}
a.white:visited,  a.white:active,  a.white:focus,  a.white:link {
    -moz-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    -webkit-transition: all 0.6s ease-in-out;
    color: #ffffff;
    transition: all 0.6s ease-in-out;
}
a:hover, a.white:hover {
	color: #fff
}
a.twitter{
	margin-bottom:0.5em;
	float:left;
	width:100%;
	height:32px;
	text-indent:42px;
	line-height:32px;
	background: transparent url('/images/twitter.png') no-repeat 0px -2px;
}
a.facebook{
	margin-bottom:0.5em;
	float:left;
	width:100%;
	height:32px;
	text-indent:42px;
	line-height:32px;
	background: transparent url('/images/facebook.png') no-repeat 0px 0px;
}

a.file{
	float:left;
	padding:10px 12px;
	border:1px solid;
	border-radius:4px;
	background:url(/images/download-icon.png) no-repeat 10px -72px;
	text-indent:24px;
}
a.file:hover{
	background-position: 10px 12px;
}


/** Header
* ---------------------------------------- 
*/
	
.header {
	height: 140px;
	width: 100%;
	background: #0f0f0f;
	border-bottom:1px solid #000;
	margin-bottom: 20px;
}
.header h1 a{
	float: left;
	width: 208px;
	height: 117px;
	margin-top: 0px;
}

/** Box Styles
 * ---------------------------------------- 
 */

.block-3quarter .box {
	width:672px;
}
.block-quarter .box {
	width:202px;
}
.box {
	float:left;
	position:relative;
	background: #0f0f0f;
	border-radius: 18px;
	border-radius: 18px;
	-moz-border-radius: 18px;
	-webkit-border-radius: 18px;
	color: #fff;
	padding: 14px 14px 8px 14px;
	margin-bottom:20px;
}
.box.min-height {
min-height:520px;
}
.box img{
	border-radius: 14px;
	-webkit-border-radius: 14px;
	-moz-border-radius: 14px;
}

/** Frame Styles
 * ---------------------------------------- 
 */
.frame{
	float:left;
	width:120px;
	height:138px;
	padding:4px;
	margin:0px 7px 10px 0px;
	font-weight:normal;
	font-size:12px;
	line-height:18px;
  	border-radius: 14px;
  	-webkit-border-radius: 14px;
  	-moz-border-radius: 14px;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
.frame.video{
	width:154px;
	height:174px;
	margin:0px 7px 10px 0px;
}
.frame.first{
	clear:both;
}
.frame.fifth{
	margin-right:0;
}
.frame.video.fourth{
	margin-right:0;
}
.frame img{
	float:left;
	margin-bottom:2px;
	padding:0;
	line-height:0;
	width:120px;
	height:100px;
	border-radius: 12px;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
}
.frame.video img{
	width:154px;
	height:120px;
}
img.frame.packshot{
	width:212px;
	height:212px;
}
.frame h4{
	margin-left:2px;
	line-height:16px;
}
.frame.red{
	background: #e60013;
}
.frame.red:hover{
	background: #ff0024;
	box-shadow:0px 0px 5px #ff1327
}
.frame.yellow{
	background: #fac21e;
}
.frame.yellow:hover{
	background: #ffd800;
	box-shadow:0px 0px 5px #ffd800
}
.frame.green{
	background: #0f890f;
}
.frame.green:hover{
	background: #16ae16;
	box-shadow:0px 0px 5px #16ae16
}
.frame.blue{
	background: #418df9;
}
.frame.blue:hover{
	background: #00aeff;
	box-shadow:0px 0px 5px #00a2ff
}
/** KEy Styles
 * ---------------------------------------- 
 */

.key{
float:left;
width:60px;
margin-right:10px;
border-top:6px solid;
}
.key.red{
border-color:#e60013;
}
.key.yellow{
border-color:#fac21e;
}
.key.blue{
border-color:#418df9;
}
.key.green{
border-color:#0f890f;
}


/** Navigation
 * ---------------------------------------- 
 */

ul.navigation {
	display:inline;
	float: right;
	position: relative;
	top: 70px;
}

ul.navigation li {
	float:left;
	padding: 0px 0px 0px 28px;;
}

ul.navigation li a {
	color: #fff;
	font-size: 1.4em;
	text-transform:lowercase
}

ul.navigation li a:hover,
ul.navigation li a.active {
	color: #009ade;
}
/** Slider
 * ---------------------------------------- 
 */
#slider {
position:relative;
    margin-bottom:20px;
    width:740px;
    height:115px;
    overflow:hidden;
	background:url(/images/loading.gif) no-repeat 50% 50%;
}

#slider {
	position:relative;
    margin-bottom:20px;
    width:740px;
    height:115px;
    overflow:hidden;
	background:url(/images/loading.gif) no-repeat 50% 50%;
}
.nivoSlider {
	position:relative;
	height:115px;
	width:740px;
	overflow:hidden
}
	
.nivoSlider img {
	position:absolute;
	display:none;
	top:0px;
	height:115px;
	left:0px;
	width:740px;
}


.nivoSlider a.nivo-imageLink {
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	border:0;
	padding:0;
	margin:0;
	z-index: 100;

}

.nivo-slice {
	display:block;
	position:absolute;
	z-index:50;
	height:100%;
}
.nivo-html-caption, .nivo-html-caption a, .nivo-caption p,
.nivo-caption, .nivo-caption a, .nivo-caption p {
	position:absolute;
	top:20px;
	left:20px;
	width:0;
	height:0;
	border:0;
	padding:0;
	margin:0;
	display:none;
	color:#fff;
}

/** Footer
 * ---------------------------------------- 
 */

#footer {
	float:left;
	clear:both;
	padding-top:20px;
	height: 126px;
	width: 100%;
	background: #0f0f0f;
	border-top:1px solid #000;
}
#footer ul.links {
	float:right;
	display:inline;
	position:relative;
	margin-top:30px;
}

#footer ul.links li{
	float:left;
	display:inline;
	margin-left:10px;
}
/** Form
 * ---------------------------------------- 
 */
form {
	float:left;
	margin:20px 0;
}
form label {
	float: left;
	text-align: right;
	margin-right: 15px;
	width: 40px;
	padding-top: 10px;
	}
form input{
	float:left;
	padding: 5px;
	height:22px;
	width: 400px;
	margin: 0px;
	background:#f0f0f0;
	border: 1px solid #000;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}
form input:focus, form input:hover {
	border: 1px solid #009ade;
	box-shadow:0px 0px 5px #00a2ff
}
form input.submit-button {
	cursor:pointer;
	margin-left:10px;
	width: 180px;
	font-size: 1em;
	height:32px;
	float: left;
	border: 1px solid #009ade;
	background:#009ade;
	color:#fff;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}
form input.submit-button:hover {
	background: #00aeff;
	box-shadow:0px 0px 5px #00a2ff
}