@charset "UTF-8";

/* Global Content Formatting and Styles */

article{
	height: auto;
}

body {
	color: #000000;
	line-height: 1.5em;
	font-family: Arial;
	font-size: 14px;
	background: #000000 repeat-x 0px 0px;
}

.page {
	max-width: 980px;
	margin: 0px auto ;
	position: relative;
	background-color:#FFFFFF;
}

text_column {
	float:center;
	display:inline-block;
	padding-right: 100px;
}

#social-media-icons {float: right;}
#social-media-icons ul li { display: inline;}
#social-media-icons ul {padding-top: 10px; padding-right: 10px;}

#promo-remi {float:left; display:inline-block; }



#pay-links {
	float:left;
	display:inline-block;

}


h1 {
	font-size: 2em;
	font-weight: bold;
	color: #000000;
	margin: 0em 0em .5em 0em;
	line-height: 1em;
	padding: 10px 0px 0px 0px;
	}

H2 {font-size: 1.75em;
	font-weight: 300;
	margin: 1em 0em 1em 0em;
	color: #000000;
	text-decoration:none;
	}


h3 {
	font-size: 1.5em;
	margin: 0em 0em 1em 0em;
	color: #000000;
	text-align: left;

}

h4 {
	font-size: 1.5em;
	margin: 0em 0em 1em 0em;
	color: #000000;
	text-align: center;
	text-transform:uppercase;
}

p {margin: 0px 0px .75em 0px; }
a {color: #000000;
  font-weight: bold;
  }
a:hover {color: #1d1b1c; }

footer {
	font-size: small;
	color: #FFFFFF;
	background-color: #000000;
	padding: 10px 10px 10px 10px;
}


a.cta {
	text-transform: uppercase;
	font-size: .9em;
	font-weight: bold;
	text-decoration: none;
	margin: .5em 0 0 0;
	padding: 0px 12px 0px 0px;
	background: url(../images/cta_arrow.png) no-repeat right 0px;
}

a.cta:hover { background-position: right -50px;}

.promo h3 { font-size: 1.1em; margin: 0;}
.promo p { line-height: 1.2em; font-size: .9em; margin-bottom: 1.2em;}

.promo { background-repeat: no-repeat; background-size: 140px 140px; }
.promo.one {background-image: url(../images/promo_1.png); }
.promo.two {background-image: url(../images/promo_2.png); }
.promo.three {background-image: url(../images/promo_3.png); }
.promo.four {background-image: url(../images/promo_4.png); }
.promo.five {background-image: url(../images/promo_5.png); }
.promo.six {background-image: url(../images/promo_6.png); }
.promo.seven {background-image: url(../images/promo_7.png); }
.promo.eight {background-image: url(../images/promo_8.png); }
.promo.nine {background-image: url(../images/promo_9.png); }
.promo.eleven {background-image: url(../images/promo_11.png); }
.promo.twelve {background-image: url(../images/promo_12.png); }
.promo.thirteen {background-image: url(../images/promo_13.png); }
.promo.nineteen {background-image: url(../images/promo_19.png); }
.promo.seventeen {background-image: url(../images/promo_17.png); }
.promo.eighteen {background-image: url(../images/promo_18.png); }




nav a {
	color: #ffcc33;
	text-transform: uppercase;
	text-decoration: none;
	display: inline-block;
	font-weight: bold;
	font-size: .9em;
}

nav a:hover {color: #fff;}

.clear-fix { clear: both; line-height: 1px; }

dvdWrapper{
	padding: 0px 10px 0px 10px;
	float: left;
	width: 50% !important;
	height: auto !important;
}

videoWrapper{
	padding: 0px 10px 0px 10px;
	width: 100% !important;
	height: auto !important;
}

videoWrapper.iframe{
	width: 100% !important;
	height: auto !important;

}

/* Style inputs with type="text", select elements and textareas */
input[type=text], select, textarea {
 width: 100%; /* Full width */
 padding: 12px; /* Some padding */
 border: 1px solid #ccc; /* Gray border */
 border-radius: 4px; /* Rounded borders */
 box-sizing: border-box; /* Make sure that padding and width stays in place */
 margin-top: 6px; /* Add a top margin */
 margin-bottom: 16px; /* Bottom margin */
 resize: vertical /* Allow the user to vertically resize the textarea (not horizontally) */
}

/* Style the submit button with a specific background color etc */
input[type=submit] {
 background-color: #000000;
 color: white;
 padding: 12px 20px;
 border: none;
 border-radius: 4px;
 cursor: pointer;
}

/* When moving the mouse over the submit button, add a darker green color */
input[type=submit]:hover {
 background-color: #333333;
}

/* Add a background color and some padding around the form */
.container {
 border-radius: 5px;
 background-color: #f2f2f2;
 padding: 20px;
}


@media
	only screen and (-webkit-min-device-pixel-ratio: 2),
	only screen and (min--moz-device-pixel-ratio: 2),
	only screen and (-o-min-device-pixel-ratio: 2/1),
	only screen and (min-device-pixel-ratio: 2),
	only screen and (min-resolution: 192dpi),
	only screen and (min-resolution: 2dppx)
{

	.promo.one {background-image: url(../images/promo_1_2x.jpg); }
	.promo.two {background-image: url(../images/promo_2_2x.jpg); }
	.promo.three {background-image: url(../images/promo_3_2x.jpg); }


}