
@media all and (max-device-width: 780px) and (orientation:portrait) {

html{
	background: #000 url(graphics/bgport.jpg) no-repeat top center fixed;  
	-webkit-background-size: cover;  
	-moz-background-size: cover;  
	-o-background-size: cover;  
	background-size: cover; 
	overflow:hidden;
	height:100%; 
	}
	}

@media all and (min-device-width: 781px) and (max-device-width: 800px) and (orientation:portrait) {

html{
	background: #000 url(graphics/bgport1.jpg) no-repeat top center fixed;  
	-webkit-background-size: cover;  
	-moz-background-size: cover;  
	-o-background-size: cover;  
	background-size: cover; 
	overflow:hidden;
	height:100%; 
	}
	}

@media all and (min-device-width: 801px) and (max-device-width: 1250px) and (orientation:portrait) {

html{
	background: #000 url(graphics/bgport2.jpg) no-repeat top center fixed; 
	-webkit-background-size: cover;  
	-moz-background-size: cover;  
	-o-background-size: cover;  
	background-size: cover; 
	overflow:hidden;
	height:100%;   
	}
	}
	
@media all and (min-device-width: 1251px) and (orientation:portrait) {

html{
	background: #000 url(graphics/bgport3.jpg) no-repeat top center fixed; 
	-webkit-background-size: cover;  
	-moz-background-size: cover;  
	-o-background-size: cover;  
	background-size: cover; 
	overflow:hidden;
	height:100%;   
	}
	}

@media all and (max-device-height: 799px) and (orientation:landscape) {

html{
	background: #000 url(graphics/bg1.jpg) no-repeat top center fixed; 
	-webkit-background-size: cover;  
	-moz-background-size: cover;  
	-o-background-size: cover;  
	background-size: cover; 
	overflow:hidden;
	height:100%;   
	}
	}
	
@media all and (min-device-height: 800px) and (max-device-height: 875px) and (orientation:landscape) {

html{
	background: #000 url(graphics/bg3.jpg) no-repeat top center fixed;   
	-webkit-background-size: cover;  
	-moz-background-size: cover;  
	-o-background-size: cover;  
	background-size: cover; 
	overflow:hidden;
	height:100%; 
	}
	}
	
@media all and (min-device-height: 876px) and (max-device-height: 1023px) and (orientation:landscape) {

html{
	background: #000 url(graphics/bg3.jpg) no-repeat top center fixed; 
	-webkit-background-size: cover;  
	-moz-background-size: cover;  
	-o-background-size: cover;  
	background-size: cover; 
	overflow:hidden;
	height:100%;   
	}
	}
	
@media all and (min-device-height: 1024px)  and (max-device-height: 1026px) and (orientation:landscape) {

html{
	background: #000 url(graphics/bg4.jpg) no-repeat top center fixed;  
	-webkit-background-size: cover;  
	-moz-background-size: cover;  
	-o-background-size: cover;  
	background-size: cover; 
	overflow:hidden;
	height:100%;  
	}
	}
	
@media all and (min-device-height: 1027px)  and (max-device-height: 1400px) and (orientation:landscape) {

html{
	background: #000 url(graphics/bg5.jpg) no-repeat top center fixed; 
	-webkit-background-size: cover;  
	-moz-background-size: cover;  
	-o-background-size: cover;  
	background-size: cover; 
	overflow:hidden;
	height:100%;   
	}
	}
	
@media all and (min-device-height: 1401px) and (orientation:landscape)  {

html{
	background: #000 url(graphics/bg6.jpg) no-repeat top center fixed;   
	-webkit-background-size: cover;  
	-moz-background-size: cover;  
	-o-background-size: cover;  
	background-size: cover; 
	overflow:hidden;
	height:100%; 
	}
	}
	
body {
	color:#e1d9a6;
        font:.93em Georgia, serif;
        height:100%;
        overflow: scroll;
        -webkit-overflow-scrolling: touch;
        margin:0px;
	}

a {
	color:#fab959;
	text-decoration:none;
	}

a:hover {
	text-decoration:underline;
	}
	
img {
	border-color: #c1a45f;
	border-width:1px;
	margin: 10px 0 10px 0;
	}

img.noborder {
	border:0px;
	margin-left:10px; 
	float:right;
	}
	
img.noborder2 {
	border:0px;
	margin-right:10px; 
	float:right;
	}

img.margin {
	margin-left:10px; 
	float:right;
	}
	
img.center {
	display:block;
	margin: 25px auto 25px auto;
	}
	
p.center {
	text-align:center;
	}

table.center {
	margin: 0 auto 0 auto;
	padding:2px;
	border-collapse: collapse;
	border:1px solid;
	width:95%;
	}
	
table.center td {
	padding:2px;
	border:1px solid;
	}

table.center2 {
	padding:2px;
	border-collapse: collapse;
	border:1px solid;
	width:80%;
	}
	
table.center2 td {
	padding:2px;
	border:1px solid;
	}
	
	
table.center3 {
	padding:2px;
	border:1px solid;
	}
	
table.center3 td {
	padding:2px;
	border:1px solid;
	}	


.small {
	font-size: 0.7em;
	}
	
.center {
	text-align: center;
	}

h1 {
	font-size:2.2em;
	font-weight:bold;
	text-align:center;
	margin-bottom: 25px;
	}
	
h2 {
	font-size:1.8em;
	font-weight:bold;
	}
	
h3 {
	font-size:1.4em;
	font-weight:bold;
	}
	
h4 {
	font-size:1.1em;
	font-weight:bold;
	}


b {
	color:#e1d9a6;
	}


@media all and (min-device-width: 1px) and (max-device-width: 1024px) {
#header {
	width: 570px;
	height:280px;
	background:transparent url(graphics/bans.png) no-repeat 0 0;
}
}

@media all and (min-device-width: 1025px)  {
#header {
	width: 570px;
	height:280px;
	background:transparent url(graphics/ban.png) no-repeat 0 0;
}
}

#header h2 {
	display:none;
	}

/* This is the div that wraps the content div*/

#main {
        padding: 0 10% 2% 10%;
        margin-left:auto;
        margin-right:auto;
    	background:transparent;
	min-width:735px;
        max-width:1000px;
	}
	
/* Top menu*/
#menu {
	background:#282828;
  	background:rgba(0,0,0,0.75);
    	padding: 23px;
    	text-align: center;
    	font-weight:bold;
    	position: relative;
   	border:1px solid #c1a45f;
}

/* This div keeps the search icon from overlapping the menu text*/

#menutext {
	display:inline-block;
	}

#content {
	border:2px solid #c1a45f;
	margin: 10px 0 10px;
 	background:#282828;
  	background:rgba(0,0,0,0.75);
  	padding: 10px 20px 20px 20px;
  	overflow: auto;
        }
        

#separator {
	border-bottom:2px solid #dfc588;
	width: 50%;
	}
	

/* Bottom menu*/
        
#footer {
	background:#282828;
  	background:rgba(0,0,0,0.75);
    	padding-bottom: 20px;
    	text-align: center;
    	font-weight:bold;
   	border:1px solid #c1a45f;
}

	
hr     {
	color: #dfc588
	}

/* div for searchicon */

#searchd {
	display:inline-block;
	}
	
/* reset webkit search input browser style */
input {
	outline: none;
}
input[type=search] {
	-webkit-appearance: textfield;
	-webkit-box-sizing: content-box;
	font-family: inherit;
	font-size: 100%;
}
input::-webkit-search-decoration,
input::-webkit-search-cancel-button {
	display: none; /* remove the search and cancel icon */
}

/* search input field */
input[type=search] {
	background: transparent url(graphics/search.png) no-repeat 3px center;
	border: solid 1px transparent;
	padding: 3px 4px 6px 6px;
	width: 55px;
	
	-webkit-border-radius: 10em;
	-moz-border-radius: 10em;
	border-radius: 10em;
	
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s;
}
input[type=search]:focus {
	width: 130px;
	background-color: #fff;
	border-color: transparent;
	
	-webkit-box-shadow: 0 0 5px rgba(109,207,246,.5);
	-moz-box-shadow: 0 0 5px rgba(109,207,246,.5);
	box-shadow: 0 0 5px rgba(109,207,246,.5);
}

/* placeholder */
input:-moz-placeholder {
	color: #999;
}
input::-webkit-input-placeholder {
	color: #999;
}

/* Search Icon */
#searchicon input[type=search] {
	width: 33px;
	padding-left: 10px;
	color: transparent;
	cursor: pointer;
}
#searchicon input[type=search]:hover {
	background-color: #fff;
}
#searchicon input[type=search]:focus {
	width: 130px;
	padding-left: 40px;
	color: #000;
	background-color: #fff;
	cursor: auto;
}
#searchicon input:-moz-placeholder {
	color: transparent;
}
#searchicon input::-webkit-input-placeholder {
	color: transparent;
}

/* This formats the copyright text*/

.copy {
	font-size:0.7em;
	font-weight:normal;
	}

/* Donation box */

#donate {
	margin:-25px 10px 0 0;
	float:right;
	}
	
/* Twitter boxes */

#twitter {
	margin:-26px 0px 0 10px;
	float:left;
	}
	
#twitter2 {
	display:none;
	}
	
table.spell
{ 
text-align: left;
text-indent:6px;
font-size: 0.9em;
color: #010101;
width: auto;
background-color: #f9f4e1;
border: 1px #796a50 solid;
border-collapse: collapse;
border-spacing: 0px; } 

td.title
{ 
border-bottom: 2px solid #796a50;
border-left: 2px solid #796a50;
background-color: #fefefe;
font-weight: bold;
font-size: 1.2em;
}

td.c1
{  
border-bottom: 2px solid #796a50;
background-color: #c5c5c3; 
padding:2px 15px 2px 15px;
 }
 
td.c2
{  
border-bottom: 2px solid #796a50;
background-color: #f1f1f1;
padding:2px 15px 2px 15px;
 }
 

table.spell b
{ 
color:#000000;
} 

.divider {
	height: 2px;
    	border: 0;
    	margin: 0 0 0 0;
    	width:65%;
    	float:left;
    	background: -moz-linear-gradient(left,  rgba(223,197,136,1) 16%, rgba(223,197,136,0.99) 17%, rgba(255,255,255,0) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(16%,rgba(223,197,136,1)), color-stop(17%,rgba(223,197,136,0.99)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  rgba(223,197,136,1) 16%,rgba(223,197,136,0.99) 17%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  rgba(223,197,136,1) 16%,rgba(223,197,136,0.99) 17%,rgba(255,255,255,0) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  rgba(223,197,136,1) 16%,rgba(223,197,136,0.99) 17%,rgba(255,255,255,0) 100%); /* IE10+ */
	background: linear-gradient(to right,  rgba(223,197,136,1) 16%,rgba(223,197,136,0.99) 17%,rgba(255,255,255,0) 100%); /* W3C */
	} 
	
table.herb {
	margin: 0 auto 0 auto;
	border:1px solid;
	color: #010101;
	width:95%;
	}
	
td.title2
{ 
border-bottom: 2px solid #796a50;
border-left: 2px solid #796a50;
background-color: #a6a6a5;
padding:2px 5px 2px 5px;
font-weight: bold;
font-size: 1.2em;
}
	
td.d1 {
	padding:2px 5px 2px 5px;
	background-color: #c5c5c3; 
	}
	
td.d2 {
	padding:2px 5px 2px 5px;
	background-color: #f1f1f1; 
	}

table.herb b
{ 
color:#000000;
} 

table.herb a {
	color:#661102;
	text-decoration:none;
	}
