* {
     margin: 0;
 }
 
 html, body {
     height: 100%;
     overflow: auto;
 }
 .wrapper {
     position: relative;
     width: 100%;
    height: 100%;
     overflow: auto;
 }


body 
{
	background: url("images/background.jpg");

	margin: 0;
	line-height: 1.5;
	z-index: -1;
	
	}

#top 
{
	position:absolute;
	top: 0;
	width: 100%;
	height: 733px;
	margin: 0;
	
	background: url("images/gradient.jpg");
	
}


	

#container
{
	font-family:Arial;
	font-size: 12pt;
	position: absolute;
	width: 760px;
	direction: rtl;

	left: 50%;
	top: 0; /*50%;*/
	margin-left: -380px;

	background-color: #FFFFFF;
	z-index: 10;
	height: 8000px;
	padding-top: 0;
		}
		
#fade-grad-left 
{
	position: absolute;
	left: -18px;
	top: 0;
	width: 18px;
	height:  733px;
	
}

#fade-grad-right 
{
	position: absolute;
	left: 760px;
	top: 0;
	width: 18px;
	height:  733px;
	
}

#fade-left
{
	position:absolute;
	left: -15px;
	top: 733px;
	background: url("images/fade-left.jpg");
	background-repeat: repeat-y;
	width: 15px;
	height: 600px;
	
	
	}
	
#fade-right
{
	position:absolute;
	left: 760px;
	top: 733px;
	background: url("images/fade-right.jpg");
	background-repeat: repeat-y;
	width: 15px;
	height: 600px;
	
	
	}


#header {
	position:absolute;
	left:0px;
	top:0px;
	width:760px;
	height:241px;
	background: url("images/header.gif");
}

#byrne-quote 
{
	font-family:Times New Roman;
	
	background: url("images/byrne-quote.gif");
	position: relative;
	left:0px;
	top:-5px;
	width:760px;
	height:161px;
	line-height: 1.5;
	
}

.quote 
{
	font-family:Times New Roman;
	font-size: 18px;
	line-height: 1.4;
	position: relative;
	left:0px;
	top:20px;
	width:760px;
}



#order {
	position:absolute;
	left:280px;
	top:188px;
	width:258px;
	height:140px;
	z-index: 1000;
}



#order-back 
{
	background: url("images/order-back.jpg");

	position: relative;
	left:-40px;
	top: 0;
	width:682px;
	height:351px;
}

.sorder {
	position:absolute;
	left:130px;
	top: 50px;
	width:177px;
	height:73px;
	z-index: 1000;
}



.sorder-back 
{
	background: url("images/sorder-back.jpg");

	position: relative;
	left:0px;
	top: 50px;
	width:310px;
	height:155px;
	margin-bottom: 70px;
}

h3 
{
	position: relative;
	
	top: 20px;
	left: -100px;
	width: 550px;
	text-align: center;
	margin: 0;
	padding : 0
}

h2 
{
	position: relative;
	
	top: 0;
	left: -130px;
	width: 500px;
	text-align: center;
	margin: 0;
	padding : 0
}

h1 
{
	position: relative;
	
	top: 0;
	left: -95px;
	width: 550px;
	text-align: center;
	color: #960000;
	margin: 0;
	padding : 0;
}

#lessons 
{
	width: 230px;
	height: 230px;

}
	
p 
{
	
position: relative;

	padding-top: 10px;
	left: -100px;
	width: 560px;
	text-align: justify;
	line-height: 1.5;
    
	font-size: 16px;}
	
	
li p { left: 0; }
	
h4 {	
position: relative;
	
	top: 0;
	left: -100px;
	width: 560px;
	text-align: justify;
	line-height: 1.5;
    }
	
ul, ol 
{	
position: relative;
	
	top: 0;
	left: -100px;
	width: 500px;
	text-align: justify;
	line-height: 1.5;
 
  padding: 20px; 

	font-size: 16px;}
	
ul.tick {  list-style-image: url('images/tick.gif');
	left: -80px;
}

ul.gold {  list-style-image: url('images/gold.png');
	left: -80px; width: 500px;
}

ul.question {  list-style-image: url('images/questionmark.jpg');
	left: -80px; width: 500px;
}
ul.gold li { padding-bottom: 20px;}

ul.tick li, ul.gold li,  ul.question li{ padding-right: 20px; vertical-align: top; }
	
li { padding-bottom: 10px; margin-right: 20px; }

li.last { padding-bottom: 0; margin-bottom: 0;}