/***********************************

    CSS file for OilSpillCondoms.com
    (c) StarmenUSA 2010.
    http://www.starmenusa.com/

***********************************/


*    { margin: 0; padding: 0; }
html { font: 12px/18px Helvetica, 'MS Sans Serif', Arial, sans-serif; color: #333; background: #ededed; background: #ededed url(images/header-pattern.jpg) repeat-x 50% 0; }

a img, fieldset, button { border: 0; }

:active { outline: none; }

a { color: #009c32; outline: none; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; }
a:hover,
a:focus { color: #99b2cc; text-decoration: none; -webkit-transition: all .2s ease; -moz-transition: all .2s ease; }

button { cursor: pointer; }

.skipper { position: absolute; left: -9999px; top: -9999px; }

#sizer { min-width: 1060px; width: auto; overflow: hidden; }
#sizer:after  { content: " "; display: block; clear: both; height: 0; font-size: 0; visibility: hidden; }

.grid { width: 1040px; margin: 0 auto; }

.grid:after  { content: " "; display: block; clear: both; height: 0; font-size: 0; visibility: hidden; }


.header { float: left; width: 100%;  border-bottom: 5px solid #fff; }
.header .grid { height: 160px; padding-top: 17px; }

#logo { float: left; margin-left: 13px; background: url(images/logo.png) no-repeat 0 8px; }
#logo a { display: block; width: 351px; height: 145px; text-indent: -9999px; overflow: hidden; }
#main-content2 .order{ width:1040px; float:left; padding-left:0px;}
#main-content2 .order li{ float: left; list-style: none; display: block;}
 .5{
	position: absolute;
	width: 188px;
	margin-top: 40px;
	float:left;
	height: 412px;
	left: 30px;
	top: 200px;
}
 .12{position: absolute; margin-left:100px;}

#main-nav       { float: right; margin: 48px 30px 0 0; padding: 5px; text-shadow: 0 1px 2px #000; }
/*
#main-nav       { margin: 37px 0 0 0; border: 2px dashed #fff; border-radius: 30px; -webkit-border-radius: 30px; -moz-border-radius: 30px; -khtml-border-radius: 30px; }
#main-nav ul    { float: left; padding: 10px 20px; background: rgb(0,0,0); background: rgba(0,0,0, 0.5); border-radius: 30px; -webkit-border-radius: 30px; -moz-border-radius: 30px; -khtml-border-radius: 30px; }
*/
#main-nav li    { float: left; list-style: none; }
#main-nav li a  { display: block; padding: 0 15px; font: bold 24px/28px Georgia, serif; text-decoration: none; color: #f5f6f5; border-right: 3px solid #fff; margin-left: 8px; padding-left: 5px; }
#main-nav li a:hover { color: #fff; }
#main-nav li.current a { color: #fff; }

#mn-blog-link  { border-left: 3px solid #d6e0eb; margin-left: 8px; padding-left: 5px; }
#mn-blog-link a { color: #ccc; }

.content { float: left; clear: both; width: 100%; background: #ededed url(images/gradient.png) no-repeat center top; }
.content2 { float: left; clear: both; width: 100%; background: #ededed;}
.content2 .grid { position: relative; }
.content .grid { position: relative; }
.content p{ font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: #017e82; line-height:22px;}
.gray{color:#454545; font-weight:bold;}
.green{color:#009c32; font-size:17px;}
.leftbox{ width:500px; background-image: url(images/v_line.jpg); background-repeat: repeat-y; background-position: right; padding-right: 45px; text-align: justify;}
.leftbox2{ width:500px; background-image: url(images/v_line.jpg); background-repeat: repeat-y; background-position: right; padding-right: 45px; text-align: justify;
font-size:12px;}

.content p,
.content table,
.content ul { margin-bottom: 18px; }
.content li { margin-left: 20px; }

.content h1,
.content h2,
.content h4,
.content h5,
.content h6,
#supplementary-content h3{ font-family: Georgia, 'Times New Roman', Times, serif; }
.content h6 { font-size: 72px; line-height: 100px; margin-bottom: 90px; color: #009c32; padding: 5px; text-shadow: -5px 3px 2px#666;}
.content h2 { font-size: 30px; line-height: 36px; margin: 36px 0 9px; color: #009c32; text-shadow: -2px 1px 2px#333;}
.content h3 { font-size: 18px; line-height: 24px; margin-bottom: 9px; color: #99b2cc; }
.content h4 { font-size: 46px; line-height: 90px; margin-bottom: 90px; color: #009c32; padding: 2px; text-shadow: -2px 2px 2px#666;}
.content h5 { font-size: 30px; line-height: 36px; margin: 36px 0 9px; color: #009c32; text-shadow: -2px 1px 2px#333;}





.main-content           { float: left; width: 960px; min-height: 339px; margin: 54px 0 72px; padding: 0 20px 0 100px;  }
.main-content2           {float: left; width: 1040px; background-image: url(images/order_bg.png); background-repeat: repeat-x; background-position: center top;}



.footer { float: left; clear: both; width: 100%; font-size: 11px; color:#f5e93e; background: url(images/footer-pattern.jpg) repeat-x 50% 0; border-top: 5px solid #fff; }
.footer .grid { height: 140px; padding: 15px 0; }

.footer .box         { width:780px; height:130px; background-image: url(images/footer_box.png);}
.footer .box ul       {list-style: none; padding-right: 15px; min-height:123px;}
.footer .link_holder            {float: left; margin-left:35px; margin-top:5px; color:#f5e93e}
.footer .link_holder1            {float: left; margin-left:15px; margin-top:5px;}
.footer a               { text-decoration: none; color:#f5e93e}
.footer a:hover         { text-decoration: underline;}
.big { font-size:12px;line-height: 30px; color:#f5e93e}
.footer .pipe,
.footer .plus           { position: relative; bottom: -2px; display: inline-block; color: #99b2cc; padding: 0 3px; font-size: 14px; line-height: 18px; }
.footer .copyright  { float: left; padding-left: 10px; padding-top:10px; width: 1040px;}

.footer .bottom { float: right; padding-top: 20px; }
.footer .siteby a,
.footer .siteby span { float: left; bottom: 0; }
#sty-link       { padding: 0 2px; }
#cn-link        { float:right;}



/*** HOMEPAGE ***/

#model-main-content { float: left; width: 100%; padding: 36px 0 0 55px; background: #ededed;}

#product-view           { float: left; width: 710px; position: relative; }
#product-view li        { list-style: none; margin: 0; }
#product-view .features { position: relative; float: left; width: 100%; margin: 0; }

 .ilike       { position: absolute; top: 0; left: 0; width: 320px; padding: 15px 0; margin: 24px 0 36px 620px; border-bottom: 1px solid #8e8e8e; text-align:right;}
 .ilike2       { position: absolute; top: 0; left: 0; width: 320px; padding: 15px 0; margin: 24px 0 36px 640px; text-align:right;}
 .ilike3       { position: absolute; top: 0; left: 0; width: 320px; padding: 15px 0; margin: 24px 0 36px 670px; text-align:left;}
 .order_left       { position: absolute; top: 0px; left: 0; width: 320px; padding: 15px 0; margin: 24px 0 36px 20px; text-align:left;}
#product-view .tabnav       {
	position: absolute;
	top: 0;
	left: 0;
	width: 320px;
	padding: 15px 0;
	margin: 0 0 36px 10px;
	background-image: url(images/h_line.jpg);
	background-repeat: repeat-x;
	background-position: bottom;
}
#product-view .tabnav li    { list-style: none; float: left; display: inline; margin: 0 10px 0 0; }
#product-view .tabnav li a  { display: block; padding: 1px 10px; font-size: 12px; color:#009c32; font-weight:bold; text-transform: uppercase; text-decoration: none; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -khtml-border-radius: 5px;
    -webkit-transition: none; -moz-transition: none; text-shadow: -1px 1px 1px#333;}
#product-view .tabnav li a:hover    { background: #009c32; color: #fff;}
#product-view .tabnav li.current a  { color: #fff; background: #009c32;}

#product-view .tab-content    { float: left; position: relative; width: 710px; height: 470px; margin-top: 84px; }

#product-view .tab-content h2           { position: absolute; top: -84px; left: 10px; }
#product-view .tab-content h2.moveoff   { left: -9999px; top: -9999px; }


.feature-list       { }
.feature-list li    { float: left; clear: both; width: 180px; margin: 0; list-style: none; font-size: 12px; }
.feature-list li h3 { margin: 0; font-size: 13px; line-height: 18px; color: #000; }
.feature-list li p  { margin: 0; font-size: 12px; color: #555; }

.home #front-view       { background: url(images/front.jpg) no-repeat 0 0; margin-left:35px;}

#front-view .feature-list li    { position: absolute; }
#front-view .blowup             { position: absolute; left: -9999px; top: -9999px; }
#front-view .feature-list .item-01 { top: 10px; left: 50px;     }
#front-view .feature-list .item-02 { top: 225px; left: 50px;    }
#front-view .feature-list .item-03 { top: 15px; left: 620px;    }
#front-view .feature-list .item-04 { top: 325px; left: 670px;   }
#front-view .feature-list .item-05 { top: 135px; left: 660px;   }


.home #back-view                { background: url(images/back.jpg) no-repeat 0 0; margin-left:35px;}

#back-view .feature-list li     { position: absolute; }
#back-view .blowup              { position: absolute; left: -9999px; top: -9999px; }
#back-view .feature-list .item-01 { top: 10px; left: 50px;     }
#back-view .feature-list .item-02 { top: 225px; left: 50px;    }
#back-view .feature-list .item-03 { top: 15px; left: 620px;    }
#back-view .feature-list .item-04 { top: 325px; left: 670px;   }
#back-view .feature-list .item-05 { top: 135px; left: 660px;   }






/* Generic boxes */

.align-left     { float: left; clear: both; margin: 0 20px .2em 0; }
.align-right    { float: right; clear: right; margin: 0 0 .2em 20px; }

.col-left   { float: left; clear: both; width: 200px; margin: 0 40px 0 0; }
.col-right  { float: right; clear: right; width: 200px; }




/* Network footer */
#network-homepage_all {
	float: left;
	clear: both;
	width: 100%;
	background-image: url(images/grad_network.png);
	background-repeat: repeat-x;
	background-position: center bottom;
}
#network-homepage { float: left; clear: both; width: 960px; background: url(images/footer-buttons.png) no-repeat 0 -230px; margin-left:35px;}

#network-homepage li      { float: left; display: inline; list-style: none; margin: 0; }
#network-homepage a       { opacity: 1; display: block; width: 240px; height: 230px; text-indent: -9999px; overflow: hidden; background: url(images/footer-buttons.png); -webkit-transition: all .3s ease; }
#network-homepage a:hover { opacity: .1; }

#network-homepage #fb-link a      { background-position: 0 0; }
#network-homepage #tw-link a      { background-position: -240px 0; }
#network-homepage #yt-link a      { background-position: -480px 0; }
#network-homepage #blog-link a    { background-position: -720px 0; }


.blog{ width:650px; margin-bottom: 18px; font-family: Georgia,'Times New Roman',Times,serif; font-style: italic; font-variant: normal; font-weight: normal; font-size: 12px;
-height: 18px;
font-size-adjust: none;
-x-system-font: none; color: #999999; }

#supplementary-content h3 { line-height: 18px; }
#supplementary-content { float: right; width: 330px; padding: 69px 0 0 20px; }
#supplementary-content h3 { margin-bottom: 12px; }

/* Blog */


.post { margin-bottom: 18px; border-bottom: 1px dashed #99b2cc; }
.post h1 a { text-decoration: none; }

.post img {border:1px dashed #99b2cc;padding:4px;}

#comments dt,
.post-meta { margin-bottom: 18px; font: italic 12px/18px Georgia, 'Times New Roman', Times, serif; color: #999; } 

#comments dt a,
.post-meta a { text-decoration: none; } 

#comments li { list-style: none; margin: 0; padding: 18px 0; border-top: 1px dashed #99b2cc; }

#comment-form       { padding-bottom: 18px; }
#comment-form label { float: none; display: block; text-align: left; }
#comment-form textarea  { width: 430px; }
#comment-form .button-holder { width: 100%; padding: 0; text-align: center; }

.sidebox    { margin-bottom: 36px; overflow: auto; }
.sidebox h3 { margin-bottom: 9px !important; }
.sidebox ul { border-top: 1px dashed #99b2cc; }
.sidebox li { list-style: none; margin: 0; padding: 4px; font-size: 11px; color: #999; border-bottom: 1px dashed #eee; }
.sidebox li a { text-decoration: none; }

.tags {text-align:justify;}
.tags a:link, .tags a:visited {text-decoration:none;}
        
blockquote {border-left:3px dashed #ccc; padding:10px 0 3px 10px; margin:15px 0; font-family: Georgia, 'Times New Roman', Times, serif; color: #336699; line-height: 24px}

div.social_share {float:left; margin:0 10px 10px 0;}
ul.children {margin:0 0 0 30px;}

.search {padding: 0 0 10px 0;}
input#s {padding:5px 3px;font-size:18px; color:#99b2cc;width:270px;}
input.btn {padding:10px 0 0 10px;}
.clear {clear:both;}
p.parag-left img {float:left; margin:0 5px 5px 0;}




