@charset "utf-8";

/* CSS Document */

p {
	margin-bottom:12px;
	line-height:1.4em;
	font-size:18px;
}
h1 {
	font-size:42px;
	}
h3 { font-size:24px;}
h2 {font-size:34px;}
.red {color:#F00;}
.yellowbg {background:#FF0;}
#content-normal {
	width:700px;
	margin:0 auto;
}
#content-ext-normal {
	width:900px;
	margin:0 auto;
}
#content-over-normal {
	width:1000px;
	margin:0 auto;
}

html, body {
	Padding: 0;
	Margin: 0;
	Height: 100%;
	font-size:15px;
	font-family:Arial, Helvetica, sans-serif;
}

* {
	margin: 0;

}

.clearfix {
	clear:both;
	margin: 0;

}

.salespage {
	padding: 20px 100px 0;
	box-shadow: 0 3px 25px #000; 
	}

.salespage p {
	font-size:18px;
	margin:20px 0 20px;
	
	}
#MainWrap { 
	background-image: url(images/bg_eric.png);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: 86% 100%; 

	}	

#ContentWrap {
	position:relative;
	z-index:1;
	}

#Content {
	width:900px;
	margin:0 auto;
	}

#MBG { 
	height: 100%;
	position:fixed;
	width:1500px;
	z-index:1; 
	margin-left:-380px;
	}	
Body { 
	background:url(images/Background3.jpg) no-repeat top center fixed; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	font-family:Arial, Helvetica, sans-serif;
	font-size:15px;
	}
#HeaderWrap {
	background:url(images/TopBackground.jpg) repeat-x center top;
	}

#Header {

	background:url(images/HeaderImage.png) no-repeat right;

	height:196px;

	width:900px;

	margin:0 auto;

}







#FooterWrap {

	background:#000;

	position: relative;

}

#Footer {

	width:900px;

	margin:0 auto;

}

#FooterWrap, .push {

	height:70px;

	clear:both;

}

#TopNav {

	margin:0 auto;

	width:700px;

}

#TopNav ul{

	font-family:Arial, Helvetica, sans-serif;

	font-size:14px;

	letter-spacing:-.05em;

	margin-left:-42px;

}

#NavLinks li {

	padding:3px 31px;

	list-style: none;

	display: block;

	float: left;

}

#NavLinks li:hover {

	background:url(images/semi-transparent.png) repeat;

	text-decoration:none;

	color:#abbc00;

}

#NavLinks li a {

	text-decoration:none;

	color:#FFF;

}

#NavLinks li a:hover {

	text-decoration:none;

	color:#9e4d67;

}

input   {

	padding:8px 15px;

	border: solid #999 1px;

	-webkit-border-radius: 10px;

	border-radius: 10px;

	-moz-box-shadow: inset 0 0 15px #e2e2e2;

	-webkit-box-shadow: inset 0 0 15px #e2e2e2;

	box-shadow: inner 0 0 15px #e2e2e2;

	font-family:Arial, Helvetica, sans-serif;

	font-size:13px;

	color: #999;

	margin-right:0px;

	text-align:center;

	margin-bottom:10px;

}

input.button:hover	{

	background: #9e4d67;

	color:#FFF;

}

.checkbutton {

	width:20px;

}

input.button	{

	width:;

	padding: 10px 20px;

	background: #545454;

	color: #fff;

	font-weight: bold;

	text-transform: uppercase;

	float: right;

	border: none;

	font-family:Arial, Helvetica, sans-serif;

	font-size:14px;

	-moz-box-shadow: inset 0 0 0px #e2e2e2;

	-webkit-box-shadow: inset 0 0 0px #e2e2e2;

}

#Order-box-solid {

	background:#F5F5F5;

	border: 1px solid #C8D3DF;

	margin:30px 0px;

}

#Order-box-shadow {

	background:#FFF;

	border: solid #FFF thick;

	-webkit-border-radius: 10px;

	border-radius: 10px;

	-moz-box-shadow: inset 0 0 15px #e2e2e2;

	-webkit-box-shadow: inset 0 0 15px #e2e2e2;

	box-shadow: inner 0 0 15px #e2e2e2;

}




.uline-red { color:#FF0000; text-decoration: underline; font-family:'Open Sans Cond'} 

.big1 { font-family:'Open Sans Cond',cursive; font-size:30px; text-align:center; display:block; margin:25px 0  }



ul.checkmark { list-style:none; margin:10px 0 50px; padding:0; margin-left:50px;font-size:35px; color: #252525; background:url(images/sticky-note1.jpg) top left no-repeat; heigth:535px; width:550px; padding-top:20px; padding-left:50px; padding-bottom: 0px;}





ul.checkmark li {

font-family: 'Covered By Your Grace', cursive;

background: url(images/chk.png) no-repeat left 8px;

height: 76px;

padding:0px 160px 15px 33px;



line-height:38px; 

} 

ul.checkmark_sci_red { list-style:none; margin:0 0 50px; padding:0; margin-left:50px;font-size:15px; color: #252525;}

ul.checkmark_sci_red li {

background: url(images/chk_red.png) no-repeat left 8px;

height:30px;

padding:6px 0 45px 48px;font-size: 18px;

line-height:25px; 

} 

ul.checkmark_sci_red2 { list-style:none; margin:0 0 50px; padding:0; margin-left:10px;font-size:15px; color: #252525;}

ul.checkmark_sci_red2 li {

background: url(images/chk_red.png) no-repeat left 8px;

height:30px;

padding:6px 0 15px 48px;

line-height:16px; 

} 

ul.checkmark2 { list-style:none; margin:10px 0 50px; padding:0; margin-left:50px;font-size:18px; color: #252525; padding-top:10px; }



ul.checkmark2 li {

background: url(images/chk.png) no-repeat left 8px;

height: 40px;

padding:6px 149px 15px 48px;

line-height:18px; 

} 

ul.checkmark3 { list-style:none; margin:10px 0 50px; padding:0; margin-left:50px;font-size:18px; color: #252525; padding-top:10px; }





ul.checkmark3 li {



background: url(images/chk.png) no-repeat left 8px;

height: 40px;

padding:6px 149px 15px 50px;

line-height:18px; 

} 



.columns_green { background:url(images/columns.png) left top no-repeat; margin-left:-118px; width:938px }

.headers1{text-align:center;font-size:16px; font-family:'Open Sans', sans-serif; }

.headers_sci{text-align:center;font-size:16px; font-family:'Open Sans', sans-serif; padding-top:-60px }

.green_list {width:300px; text-align:left; margin-top:35px;}

ul.checkmark_green { list-style:none; margin:10px 0 50px; padding:0;}

ul.checkmark_green li {

	background: url(images/chk.png) no-repeat left 8px;

	height: 26px;

	padding-left: 33px;

	padding-top: 8px;

	padding-bottom:60px;

	line-height:18px;

	

}

.green_list2 { text-align:left; margin-top:5px; border:4px solid #360; padding:20px}

ol.checkmark_green2 { list-style:none; padding:0;}

ol.checkmark_green2 li {

	background: url(images/chk.png) no-repeat left 8px;

	padding-left: 33px;

	padding-top: 8px;

	line-height:18px; margin-bottom:20px

	

}

ol.checkmark_green3 {padding:0; margin-left:25px; list-style-type:bold; }

ol.checkmark_green3 li {

	/*background: url(images/chk.png) no-repeat left 8px;*/

	padding-left: 13px;

	padding-top: 8px; padding-bottom:5px;

	line-height:20px; margin-bottom:20px; font-size:17px;

	

}

.greenWhite_sci{font-size:26px; padding-top:0px; display:block; color:#3a542f; font-family:'Open Sans Cond'}

.greenWhite2{font-size:26px; padding-top:17px; display:block; color:#3a542f; font-family:'Open Sans Cond'}

.greenWhite {font-size:26px; padding-top:17px; display:block; color:#FFF; font-family:'Open Sans Cond'} 

.headers2{text-align:center;font-size:45px; font-family:'Open Sans Cond', sans-serif; color:#b51c16; }

.headers3{font-size:25px; font-family:'Open Sans Cond'; text-align:center;}

.yellow3 { background:url(images/sales_yellow3.png) top center no-repeat; height: 139px; width:938px; margin-left:-118px	}

.highlight-y { background-color:#FFFF33; display:inline}

.highlight-blue { background-color:#bcd4fd; display:inline;}

.warning1 { border:4px #000 solid}

.warn1 { color:#FF3; font-family:'Open Sans Cond'; text-align:center; font-size:35px; padding-top:8px}

.headers4{font-size:25px; text-align:center; line-height:34px; margin:0 auto 25px}

.green_prods { background: url(images/green_prods.png) left top no-repeat; margin-left:-118px; width:938px; HEIGHT:81PX; }

.greenWhiteprods {font-size:24px; padding-top:17px; display:block; color:#FFF; font-family:'Open Sans Cond'; margin-left:70PX;}

.stop1 { border: 4px dashed #F00; width:380px; float:right; padding:20px; font-size:20px;}



.salespage a, a img, img {

    outline: 0 none;

    text-decoration: none;

}

.order-button

{

    background: url("images/order-button.png") center top no-repeat;

    display: block;

    height: 154px;

    margin: 0 auto;

    overflow: hidden;

    text-indent: -9999px;

    width: 540px;

}

.order-button2

{

    background: url("images/order-button2.jpg") center top no-repeat;

    display: block;

    height: 167px;

    margin: 0 auto;

    overflow: hidden;

    text-indent: -9999px;

    width: 384px;

}

.superbonus {color:#FC3; font-size:35px; font-family:'Open Sans Bold', sans-serif; padding-top:33px; margin-left:100px;}

.columns_options { background:url(images/columns.png) left top no-repeat; margin-left:-118px; width:938px }

.certificate { background:url(images/men_certificate.png) top  left no-repeat; width:600px; height:460px; margin:0 auto; text-indent:-9999px;

				}

.email1 { background:url(images/email1.jpg) top left no-repeat; height:700px; width:600px; margin:0 auto;}

.email1 p { text-indent:-9999px}

.dotted_red { text-align:left; margin-top:5px; border: 8px dashed #F00; padding:0px 30px}



.dotted_red p { text-align:center}



.blue1 { color:#3961c7}

.green1 {color:#51861d}









    /*******FIRST CREATE THE BUBBLE - this is done in the same way as the examples above******/

    blockquote.quote {

    position:relative; /*see the support section below for more info*/

    width:400px; /*size of the bubble*/

    padding:20px;

    margin:20px 0 30px 40px;

    color:#f6edf6

    /**Give the corners a curve **/

    -webkit-border-radius:30px /60px;

    -moz-border-radius:30px /60px;

    border-radius:30px /60px; /* the second value, preceded by a / defines the vertical radius*/

    /**Add a gradient to the background of the bubble**/

    background:#c49bc4; /*required for browsers that don't support gradients*/

    background:-webkit-gradient(#7e527f, #c49bc4);

    background:-moz-linear-gradient(#7e527f, #c49bc4);

    background:-o-linear-gradient(#7e527f, #c49bc4);

    background:linear-gradient(#7e527f, #c49bc4);

    }



    /*****NOW CREATE THE TRIANGLE*****/

    /**because this is an obtuse triangle we'll create it in two sections**/

    /**First the coloured section that you see as the triangle**/

    blockquote.quote:before {

    content:"";

    position:absolute; /*see the support section below for more info*/

    bottom:-30px; /*height of the triangle*/

    right:80px; /*distance from the right edge of the bubble*/

    border-width:0 0 30px 60px; /*3rd value is height of the triangle and must be same as bottom*/

    border-style:solid;

    border-color:transparent #c49bc4; /*colour of the triangle*/

    }

    /**Now the transparent section that's the same colour as the container background**/

    blockquote.quote:after {

    content:"";

    position:absolute; /*see the support section below for more info*/

    bottom:-30px; /*height of the triangle, same as the bottom value in :before*/

    right:115px; /* = (right set above in :before) + (forth value of border-width) so here 80px + 35px */

    border-width:0 0 30px 35px; /*3rd value is height of the triangle and must be same as bottom*/

    border-style:solid;

    border-color:transparent #fffdf7; /*background colour of the container*/

    }



    /******FINALLY POSITION & SYTLE THE AUTHOR'S NAME TEXT*****/

    blockquote.quote + p {

    margin-top:-30px;

    padding-left:260px;

    font-style:italic;

    letter-spacing:-1px;

    }





.bubble1 {
	margin-top:20px;
	position:relative;
	padding:10px 40px;
	margin:0;
	color:#fff;
	background:#f7f7f7; /* default background for browsers without gradient support */

  /*

  background:-webkit-gradient(linear, 0 0, 0 100%, from(#b8db29), to(#5a8f00));

  background:-moz-linear-gradient(#b8db29, #5a8f00);

  background:-o-linear-gradient(#b8db29, #5a8f00);

  background:linear-gradient(#b8db29, #5a8f00);  css3 */

  -webkit-border-radius:10px;

  -moz-border-radius:10px;

  border-radius:10px; font-size:11px; 

}

.bubble1 p{ font-size:16px; color:#0b4577; font-style:italic}

/* display of quote author (alternatively use a class on the element following the blockquote) */

.bubble1 + p {margin:15px 0 2em 85px;font-size:14px ;margin-bottom:30px; }



/* creates the triangle */

.bubble1:after {

  content:"";

  position:absolute;

  bottom:-50px;

  left:50px;

  border-width:0 20px 50px 0px;

  border-style:solid;

  border-color:transparent #f7f7f7;

  /* reduce the damage in FF3.0 */

  display:block;

  width:0; 

}



.notepad_k {

    font-family: 'Handlee', cursive;

	

    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);

    transform: rotate(-4deg);

    -ms-transform: rotate(-4deg);

    -moz-transform: rotate(-4deg);

    -o-transform: rotate(-4deg);

    -webkit-transform: rotate(-4deg);

    background: #fcf59b;

	background:

		-webkit-gradient(

			linear,

			left top, left bottom,

			from(#81cbbc),

			color-stop(2%, #fcf59b)

		);

	background:

		-moz-repeating-linear-gradient(

			top,

			#fcf59b,

			#fcf59b 38px,

			#81cbbc 40px

		);

	background:

		repeating-linear-gradient(

			top,

			#fcf59b,

			#fcf59b 38px,

			#81cbbc 40px

		);		

	-webkit-background-size: 100% 40px;

}