/*
 *
 * The fonts included are copyrighted.
 *
 * @vendor: Liquitype
 * @vendorurl: http://www.liquitype.com/
 * The license for this font family can be found on the fontsquirrel.com website.
 *
 *
 */
 
 html
{
	min-height: 100.5%;
}
 
 body
{
	border: none;
	outline: none;
	margin: 0;
	padding: 0;
	cursor: default;
	background: #333 url(../_images/background-white.gif) no-repeat center top;
}

div.page
{
	display: block;
	width: 940px;
	margin: 0px auto 0px auto;
	background-color: #fff;
	padding: 0;
	border: none;
	outline: none;

}

a
{
	cursor: hand;	
}


a:hover
{
	border: none;
	outline: none;
	cursor: hand;	
}



a:click
{
	border: none;
	outline: none;
}


/* For IE */

@font-face {
	font-family: 'BPreplay';
	src: url(/_fonts/BPreplay.eot);
}

/* For IE */

@font-face {
	font-family: 'BPbold';
	src: url(/_fonts/BPreplayBold.eot);
}


@font-face {
	font-family: 'BPreplay';
	src: url(/_fonts/BPreplay.otf) format('opentype');
}


@font-face {
	font-family: 'BPbold';
	src: url(/_fonts/BPreplayBold.otf) format('opentype');
}


div.navigation
{
	position: fixed;
	display: block;
	height: 200px;
	width: 180px;
	margin: 40px 0 0 760px;
	padding: 0;
	font-weight: bold;
	text-transform: uppercase;
}

div.navigation ul
{
	list-style-type: none;
	margin: 0;
	padding: 0;
	
}

div.navigation li.magenta, div.navigation li.cyan, div.navigation li.green, div.navigation li.orange, div.navigation li.purple, div.navigation li.red
{
	list-style-type: none;
	display: block;
	width: 180px;
	height: 28px;
	margin: -2px 0 0 0;
	padding: 0;
	font-family: 'BPbold', Arial, Helvetica, Geneva, sans-serif;
	font-size: 17px;
	font-weight: normal;
	letter-spacing: 1px;

	
}

div.navigation li.magenta
{
	background-image: url(/_images/rollover-magenta.jpg);
	background-repeat: no-repeat;
}

div.navigation li.cyan
{
	background-image: url(/_images/rollover-cyan.jpg);
	background-repeat: no-repeat;
}

div.navigation li.green
{
	background-image: url(/_images/rollover-green.jpg);
	background-repeat: no-repeat;
}
div.navigation li.orange
{
	background-image: url(/_images/rollover-orange.jpg);
	background-repeat: no-repeat;
}

div.navigation li.purple
{
	background-image: url(/_images/rollover-purple.jpg);
	background-repeat: no-repeat;
}
div.navigation li.red
{
	background-image: url(/_images/rollover-red.jpg);
	background-repeat: no-repeat;
}




div.navigation li a
{
	margin: 0;
	padding: 4px 0 0 4px;
	color: #87888a;
	text-decoration: none;
	border: none;
	outline: none;
	
}

div.navigation li a:hover
{
	color: #fefefe;
	text-decoration: none;
	border: none;
	outline: none;
}

div.navigation li a.selected
{
	color: #fefefe;
	text-decoration: none;
}

div.navigation li.magenta a:hover, div.navigation li.magenta a.selected
{
	background-image: url(/_images/rollover-magenta.jpg);
	background-position: -2px 26px;

}

div.navigation li.cyan a:hover, div.navigation li.cyan a.selected
{
	background-image: url(/_images/rollover-cyan.jpg);
	background-position: -2px 26px;

}


div.navigation li.green a:hover, div.navigation li.green a.selected
{
	background-image: url(/_images/rollover-green.jpg);
	background-position: -2px 26px;

}

div.navigation li.orange a:hover, div.navigation li.orange a.selected
{
	background-image: url(/_images/rollover-orange.jpg);
	background-position: -2px 26px;

}

div.navigation li.purple a:hover, div.navigation li.purple a.selected
{
	background-image: url(/_images/rollover-purple.jpg);
	background-position: -2px 26px;

}

div.navigation li.red a:hover, div.navigation li.red a.selected
{
	background-image: url(/_images/rollover-red.jpg);
	background-position: -2px 26px;

}



div.logo-magenta, div.logo-cyan, div.logo-green, div.logo-orange, div.logo-purple, div.logo-red
{
	z-index: 6;
	display: block;
	position: fixed;
	width: 240px;
	height: 260px;
	margin: 300px 0 0 635px;
	padding: 0;
	
}



div.logo-magenta
{
	background-image: url(../_images/logo-condom-magenta.png);
	background-repeat: no-repeat;
}


div.logo-cyan
{
	background-image: url(../_images/logo-condom-cyan.png);
	background-repeat: no-repeat;	
}

div.logo-green
{
	background-image: url(../_images/logo-condom-green.png);
	background-repeat: no-repeat;	
}

div.logo-orange
{
	background-image: url(../_images/logo-condom-orange.png);
	background-repeat: no-repeat;	
}

div.logo-purple
{
	background-image: url(../_images/logo-condom-purple.png);
	background-repeat: no-repeat;	
}

div.logo-red
{
	background-image: url(../_images/logo-condom-red.png);
	background-repeat: no-repeat;	
}





div.body_container 
{
	width: 940px; 
	margin: 0px auto 0px auto; 
	padding: 0; 
	text-align:left; 
}


div.movie
{
	z-index: 1;
	float: left;
	display: block;
	width: 940px;
	height: 600px;
	margin: 0;
	padding: 0;
	background-color: #fff;
	
		
}


.storydiv 
{
	z-index: 1;	
    height:600px;
    margin: 0;
    padding: 0;

}

.storydiv h1
{
    display:block;
    color: #009ee0;
    font-size: 22px;
    line-height: 30px;
	font-family: 'BPreplay', Arial, Helvetica, Geneva, sans-serif;
	font-weight: normal;
   	letter-spacing: 1px;
	margin: 0 0 0 45px;
    padding: 435px 0 0 0;
    
}


.storydiv h2
{
    display:block;
    color: #000;
    font-size: 22px;
    line-height: 30px;
	font-family: 'BPreplay', Arial, Helvetica, Geneva, sans-serif;
	font-weight: normal;
   	letter-spacing: 1px;
	margin: 0 0 0 45px;
    padding: 0;
}

.storydiv h2 a
{
    color: #000;
    text-decoration: none;

}

.storydiv h2 a:hover
{
    color:  #87888a;
    text-decoration: none;


}




#nav 
{
	display: block;
	position: static;
	margin: -60px 0 0 45px;
	padding: 0;
	z-index: 7;
	outline: none;
	cursor: pointer;
	
	
}


#nav1, #nav2, #nav3
{
	margin: 0;
	padding: 7px 7px 3px 7px;
	-webkit-border-radius: 2px;    /* for Safari */
    -moz-border-radius: 2px;       /* for Firefox */
    -opera-border-radius: 2px;		 /* for Opera */
    -khtml-border-radius: 2px;    /* for Linux */
}

#nav a
{ 
	text-decoration: none;
	font-family: Arial, Helvetica, Geneva, sans-serif;
	font-weight: normal;
	font-size: 14px;
	text-transform: uppercase;
	margin: 0;
	padding: 0;
	color: #000;
	border: none;
	outline: none;
	
}

#nav a:hover
{ 
	color: #000;
	text-decoration: none;
	padding: 0;
	margin: 0;
	border: none;
	outline: none;
	
}


.selStory 
{
	background: #009ee0;
	padding: 0;
	margin: 0;
	
}



div.welcome
{
	float: left;
	display: block;
	width: 850px;
	margin: 0;
	padding: 0 45px 0 45px;
	background-color: #fff;


}
div.welcome h1
{
	float: left;
	width: 510px;
	font-family: Arial, Helvetica, Geneva, sans-serif;
	font-weight: normal;
	font-size: 20px;
	line-height: 26px;
	margin: 0 0 10px 0;
	padding: 0;
	color:#009ee0;
}


div.welcome p
{
	float: left;
	width: 460px;
	color: #323232;
	margin: 0 0 30px 0;
	padding: 0;
	font: normal 14px/22px Arial, Helvetica, Geneva, sans-serif;
}


div.page-heading
{
	float: left;
	display: block;
	width: 940px;
	height: 190px;
	margin: 0;
	padding: 0;
	background-color: #fff;

}

div.content
{
	float: left;
	display: block;
	width: 530px;
	margin: 0;
	padding: 0 45px 0 45px;
	background-color: #fff;
	

}

div.body_container
{
	background-color: #fff;
}


div.nav2-magenta, div.nav2-cyan, div.nav2-green, div.nav2-orange, div.nav2-purple, div.nav2-red
{
	float: left;
	display: block;
	width: 530px;
	margin: 0 0 8px 0;
	padding: 0 0 8px 0;
	border-bottom: solid 1px #87888a;
	
}


div.nav2-magenta ul, div.nav2-cyan ul, div.nav2-green ul, div.nav2-orange ul, div.nav2-purple ul, div.nav2-red ul
{

	list-style-type: none;
	margin: 0;
	padding: 0;
}


div.nav2-magenta li, div.nav2-cyan li, div.nav2-green li, div.nav2-orange li, div.nav2-purple li, div.nav2-red li
{
	float: left;
	list-style-type: none;
	margin: 0 20px 0 0;
	padding: 0;
	font-family: 'BPbold', Arial, Helvetica, Geneva, sans-serif;
	font-size: 18px;
	font-weight: normal;
	letter-spacing: 0px;
	font-weight: normal;

}

div.nav2-magenta li a, div.nav2-cyan li a, div.nav2-green li a, div.nav2-orange li a, div.nav2-purple li a, div.nav2-red li a
{

	margin: 0;
	padding: 0;
	font-weight: normal;
	color: #87888a;
	text-decoration: none;
	text-align: center;
	border: none;
	outline: none;
	
}

div.nav2-magenta li a:hover, div.nav2-cyan li a:hover, div.nav2-green li a:hover, div.nav2-orange li a:hover, div.nav2-purple li a:hover, div.nav2-red li a:hover
{
	font-weight: normal;
	color: #000;
	text-decoration: none;
	border: none;
	outline: none;



}

div.nav2-magenta li a.selected, div.nav2-magenta li a.selected:hover, div.nav2-cyan li a.selected, div.nav2-cyan li a.selected:hover, div.nav2-green li a.selected, div.nav2-green li a.selected:hover,div.nav2-orange li a.selected, div.nav2-orange li a.selected:hover, div.nav2-purple li a.selected, div.nav2-purple li a.selected:hover, div.nav2-red li a.selected, div.nav2-red li a.selected:hover

{
	font-weight: normal;
	text-decoration: none;
}




div.nav2-magenta li a.selected, div.nav2-magenta li a.selected:hover

{
	color: #e2007a;
}

div.nav2-cyan li a.selected, div.nav2-cyan li a.selected:hover

{
	color: #009ee0;
}

div.nav2-green li a.selected, div.nav2-green li a.selected:hover

{
	color: #97be0d;
}

div.nav2-orange li a.selected, div.nav2-orange li a.selected:hover

{
	color: #f29400;
}

div.nav2-purple li a.selected, div.nav2-purple li a.selected:hover

{
	color: #93117e;
}
div.nav2-red li a.selected, div.nav2-red li a.selected:hover

{
	color: #e5352d;
}



div.nav3-magenta, div.nav3-cyan, div.nav3-green, div.nav3-orange, div.nav3-purple, div.nav3-red
{
	float: left;
	display: block;
	width: 530px;
	margin: 0 0 8px 0;
	padding: 0 0 8px 0;
	border-bottom: solid 1px #87888a;

	
}


div.nav3-magenta ul, div.nav3-cyan ul, div.nav3-green ul, div.nav3-orange ul, div.nav3-purple ul, div.nav3-red ul
{

	list-style-type: none;
	margin: 0;
	padding: 0;
}


div.nav3-magenta li, div.nav3-cyan li, div.nav3-green li, div.nav3-orange li, div.nav3-purple li, div.nav3-red li
{
	float: left;
	list-style-type: none;
	margin: 0 15px 0 0;
	padding: 0;
	font-family: 'BPreplay', Arial, Helvetica, Geneva, sans-serif;
	font-size: 15px;
	font-weight: normal;
	letter-spacing: 0px;
	font-weight: normal;

}

div.nav3-magenta li a, div.nav3-cyan li a, div.nav3-green li a, div.nav3-orange li a, div.nav3-purple li a, div.nav3-red li a
{

	margin: 0;
	padding: 0;
	font-weight: normal;
	color: #87888a;
	text-decoration: none;
	text-align: center;
	border: none;
	outline: none;
	
}

div.nav3-magenta li a:hover, div.nav3-cyan li a:hover, div.nav3-green li a:hover, div.nav3-orange li a:hover, div.nav3-purple li a:hover, div.nav3-red li a:hover
{
	font-weight: normal;
	color: #000;
	text-decoration: none;
	border: none;
	outline: none;



}

div.nav3-magenta li a.selected, div.nav3-magenta li a.selected:hover, div.nav3-cyan li a.selected, div.nav3-cyan li a.selected:hover, div.nav3-green li a.selected, div.nav3-green li a.selected:hover,div.nav3-orange li a.selected, div.nav3-orange li a.selected:hover, div.nav3-purple li a.selected, div.nav3-purple li a.selected:hover, div.nav3-red li a.selected, div.nav3-red li a.selected:hover

{
	font-weight: normal;
	text-decoration: none;
}

div.nav3-magenta li a.selected, div.nav3-magenta li a.selected:hover

{
	color: #e2007a;
}

div.nav3-cyan li a.selected, div.nav3-cyan li a.selected:hover

{
	color: #009ee0;
}

div.nav3-green li a.selected, div.nav3-green li a.selected:hover

{
	color: #97be0d;
}

div.nav3-orange li a.selected, div.nav3-orange li a.selected:hover

{
	color: #f29400;
}


div.nav3-purple li a.selected, div.nav3-purple li a.selected:hover

{
	color: #93117e;
}

div.nav3-red li a.selected, div.nav3-red li a.selected:hover

{
	color: #e5352d;
}

div.content h1
{
	float: left;
	width: 530px;
	font-family: Arial, Helvetica, Geneva, sans-serif;
	font-weight: normal;
	font-size: 20px;
	line-height: 26px;
	margin: 0 0 10px 0;
	padding: 0;
	color: #e2007a;
}



div.content p.heading
{
	float: left;
	width: 530px;
	color: #4d4d4d;
	margin: 10px 0 5px 0;
	padding: 0;
	font: bold 15px/20px Arial, Helvetica, Geneva, sans-serif;
}


div.content p.heading-orange
{
	float: left;
	width: 530px;
	color: #f29400;
	margin: 15px 0 5px 0;
	padding: 0;
	font: bold 15px/20px Arial, Helvetica, Geneva, sans-serif;
	text-transform: uppercase;
}

div.content img
{
	float: left;
	display: block;
	height: 150px;
	width: 150px;
	margin: 0 20px 10px 0;
	padding: 0;
	background-color: #fff;
	border: none;
	outline: none;
}




div.content img.posters
{
	float: left;
	display: block;
	height: 566px;
	width: 400px;
	margin: 0 20px 10px 0;
	padding: 0;
	background-color: #fff;
	border: none;
	outline: none;
}

div.content p.textwrap
{
	float: left;
	width: 300px;
	height: 180px;
	color: #4d4d4d;
	margin: 0 0 10px 0;
	padding: 0;
	font: normal 14px/20px Arial, Helvetica, Geneva, sans-serif;
}



div.content p.textwrap2
{
	float: left;
	width: 460px;
	color: #4d4d4d;
	margin: 0 0 10px 0;
	padding: 0;
	font: normal 14px/20px Arial, Helvetica, Geneva, sans-serif;
}

div.content p.textwrap3
{
	float: left;
	width: 350px;
	color: #4d4d4d;
	margin: 0 0 10px 0;
	padding: 0;
	font: normal 14px/20px Arial, Helvetica, Geneva, sans-serif;
}


div.content p
{
	float: left;
	width: 530px;
	color: #4d4d4d;
	margin: 0 0 10px 0;
	padding: 0;
	font: normal 14px/20px Arial, Helvetica, Geneva, sans-serif;
}

div.content p a
{
	color: #4d4d4d;
	text-decoration: underline;
}

div.content p a:hover
{
	color: #000;
	text-decoration: underline;
}

div.content p.website
{
	float: left;
	color: #4d4d4d;
	margin: 0 0 15px 0;
	padding: 0;
	font: normal 14px/20px Arial, Helvetica, Geneva, sans-serif;
	text-decoration: none;
}

div.content p.website a
{
	color: #4d4d4d;
	margin: 0;
	padding: 0;
	font: normal 14px/20px Arial, Helvetica, Geneva, sans-serif;
	text-decoration: none;
}

div.content p.website a:hover
{
	color: #000;
	margin: 0;
	padding: 0;
	text-decoration: underline;
}





div.back-to-top

{
	display: block;
	float: left;
	width: 620px;
	height: 80px;
	background-color: #fff;
}












div.footer
{
	float: left;
	display: block;
	width: 850px;
	height: 80px;
	margin: 0;
	padding: 0 45px 0 45px;
	background: url(../_images/footer-logos.jpg) no-repeat 0 10px;
	background-color: #fff;

}

div.footer p
{
	float: left;
	color: #87888a;
	font-family: 'BPbold', Arial, Helvetica, Geneva, sans-serif;
	font-size: 14px;
	font-weight: normal;
	letter-spacing: 1px;
	text-decoration: none;
	margin: 45px 0 0 0;
	padding: 0;
	border: none;
	outline: none;
	text-transform: uppercase;
	
}


div.footer p a
{
	color: #87888a;
	text-decoration: none;
	margin: 0;
	padding: 0;
	border: none;
	outline: none;
	
}


div.footer p a:hover
{
	text-decoration: none;
	margin: 0;
	padding: 0;
	color: #fff;
	border: none;
	outline: none;
	
}