/* CSS Document for TENA Men 2010 Campaign Page*/

/* generic styles*/
div#men {
	background:#fff url(../images/internal/bg_men_thin.jpg) 100% 0 no-repeat;
	color:#134183;
	width: 678px;
}

#rightcol {
	background-color:#289de9;
	background-image:url(../images/internal/bg_h2.gif);
	background-position: top left;}/*For CSSSprites to work properly*/
	
#rightcolend 
{
    background-image:url(../images/internal/bg_rightcol.gif);
    background-position: top left;}/*For CSSSprites to work properly*/

div#men div.inner {
	padding-bottom:8px;
}

#wrapper ul#breadcrumbs 
{
    background-color: #134183;
    background-image: url(../images/internal/bg_breadcrumbs.gif);
    background-position: 0 0;
}

a.mainbutton {
	float:left;
	display:block;
	width:172px;
	height:63px;
	background:url(/templates/Campaigns/TENAMen2010/images/external/button.gif) 0 0 no-repeat;
	color:#fff;
	overflow: hidden;
	font-weight:bold;
	padding-left: 65px;
	position: relative;
}

a.mainbutton span 
{
    display: table-cell;
    vertical-align: middle;
    #display: block;
    height: 63px;
    #position: absolute;
    #top: 50%;
    #margin-top: -15px;
    padding-left: 5px;
    padding-right: 5px;
}
a:hover.mainbutton {text-decoration:none;}

a.smallbutton {
    display: block;
    float: left;
    height: 59px;
    width: 85px;
    padding: 12px 25px 0px 10px;
    margin-left: 2px;
    font-weight: bold;
    text-align: center;
    background: url("/Templates/Campaigns/TenaMen2010/images/internal/button_small.gif") no-repeat scroll 0pt 0pt transparent;
}

a.minus 
{
    background: url("../images/internal/icon_minus.gif") no-repeat scroll 50% top transparent;
}

a.plus
{
    background: url("../images/internal/icon_plus.gif") no-repeat scroll 50% top transparent;
}

div#men #intro {
	width:384px;
}

div#men h2 {
	font:bold 2em/1.3em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	color:#134183;
}

div#men h2 span {
	color:#289de9;
}

div#men h3, div#men h4 {color:#134183; font-family:Verdana, Arial, Helvetica, sans-serif;}
div#men h3 {font-size:1.3em; line-height:1.4em; font-weight:bold; margin:0;}
div#men h4 {font-size:1.1em; margin:0 0 8px 0;}

div#men h5 {
	font:bold 1em/1.3em Verdana, Arial, Helvetica, sans-serif;
	margin-bottom:5px;
	color:#0f1c88;
}

div#men #info {
	width:678px;
	padding-top:8px;
}

div#men #info .inner {
	float:left;
	width:668px;
	background:#d1eafa;
	padding:12px 0 20px;
}

div#men #info div div.floatLeft
{
    float: left;
	width:314px;
	padding-left: 25px;
	padding-right: 10px;
}

div#men #info div.floatLeft h3, div#men #info div.floatLeft ul li,
div#men #info div.floatLeft p {margin-bottom:20px;}

div#men #info div.floatLeft ul {
    margin-left: 0;
    padding-left: 0;
}

div#men #info div.floatLeft ul li {
	display:list-item;
	background:url(../images/internal/bullet.gif) 0 10px no-repeat;
	padding-left:10px;
	margin-bottom:20px;
	list-style-type: none
}

div#men #info div.floatRight {
	width:297px;
	border-left: 2px solid #B8DBF2;
	padding-left: 10px;
	padding-right: 10px;
	float: left;
}

div#men #info div.floatRight h3 {
	margin-bottom:20px;
}

div#men #info div.floatRight h4,
div#men #info div.floatRight p {padding-left:8px;}

div#men #info div.floatRight p {margin:0;}

div#men #info div.floatRight ul li.left {
	float:left;
	width: 145px;
	border-right: 2px solid #B0D6EF;
}

div#men #info div.floatRight ul 
{
    margin-bottom:15px;
    padding-left: 0;
    list-style-type: none;
    float: left;
}

div#men #info div.floatRight ul li.right 
{
    float: left;
    width:145px;
    padding-left: 5px;
}

.button * {
	background-image:url(../images/internal/btn5.png); 
}

* html div#men #info div.floatRight ul {margin-bottom:0; display:inline;}
* html div#men #info .inner {float:none;}
* html div#men #info .inner .floatLeft {width:290px;}

.flash-products { margin-top: 50px; }
