*{
	margin:0;
	padding:0;
	}

html{
	width:100%;
	height:100%;
	}

body{
	height:100%;
	width:100%;
	background-color:#FFF;
	}
a{
	outline:none;
	text-decoration:none;
	color:#000;
	}
a:hover{
	text-decoration:underline;
	}
img{
	border:none;
	}

pre {
	white-space: pre-wrap;
}
	
#wrapper{
	width:899px;
	margin:0 auto;
	}
	
#header{
	width:100%;
	height:176px;
	margin-bottom:5px;
	}
		
		#logo{
			width:708px;
			height:176px;
		}
		
		#name{
			height:42px;
			width:568px;
			position:absolute;
			margin-left:250px;
			margin-top:10px;
			}
	
#content{
	width:100%;
	height:auto;
	background-image:url(img/l-side.gif);
	background-position: left bottom;
	background-repeat: no-repeat;
	position:relative;
	white-space:normal;
	}
	
	#content a{float:left; margin-left:8px; color:#ac1010;}
	#content b{color:#ac1010;}
	#content h2{margin-left:-120px;}
	#content h1{margin-left:-200px; padding-bottom:50px;}
	
	#biography{
		width:auto;
		height:auto;
	}

		#biography p {
			margin: 10px 0;
		}

		#biography h1{
		padding-bottom:10px;
		padding-top:20px;
		margin-left:220px;
		}

		#biography a{
		float:none;
		margin-left:0;
		}

		#biography img{
		float:left;
		margin-left:10px;
		margin-right:10px;
		margin-bottom:20px;
		margin-top:15px;
		border:1px solid #990000;
		}
	
	#verses{
		width:auto;
		height:auto;
		margin-left:300px;
		margin-top:30px;
	}
	
	#verses a{color:#000;}
	
#footer{
	width:900px;
	height:26px;
	background-image:url(img/footer.gif);
	}
	
	#copy{
		color:#FFF;
		padding-top:2px;
		padding-left:330px;
		}
	#copy a{
		color:#FFF;
		}
		
#content .block a {
	float: none;
	margin-left: 0;
	text-decoration:underline;
	color: #000;
}

#verses {
	margin-left: 0;
	padding-left: 300px;
}

.down-adv {
	width: 468px;
	margin: 40px auto 200px;
}

.social-buttons {
	text-align: center; 
	margin-top: 25px;
}


@viewport {
   width: device-width;
}

@media screen and (max-width: 900px) {
	#footer {
		width: 100%;
	}

	#copy {
		text-align: center;
		padding: 3px 0 0 0;
	}
}

@media screen and (max-width: 899px) {
	body {
		min-width: 320px;
	}

	#wrapper {
		padding: 0 3%;
	    width: auto;
	}

	.m {
		width: auto;
	}

	.m img:nth-child(1) {
		float: none !important;
		margin: 0 0 10px;
	}

	.m img:nth-child(2) {
		display: none;
	}

	#content a {
		margin: 10px 10px 5px 0 !important;
	}

	#biography h1 {
		margin: 0;
		text-align: center;
	}

	#verses {
		margin: 30px 20px 0 20px;
		padding-left: 0;
	}

	#content h2 {
	    margin-left: 0;
	}

	#content h1 {
	    margin-left: 0;
	}

	#content #verses a {
		float: none;
		display: block;
		clear: both;
		white-space: normal;
	}

	#content #verses nobr {
		display: block;
	}

	#content #verses b {
	   display: block;
	   margin: 20px 0 0 0;
	}

	#content #verses br {
		display: none;
	}

	#content #verses pre {
		white-space: pre;
	}
	
	
}

@media screen and (max-width: 850px) {
	#wrapper {
		padding: 0 15px;
	    width: auto;
	}

	#name {
		margin-left: 200px;
	}
}

@media screen and (max-width: 800px) {
	#name {
		display: none;
	}

	#header {
	    overflow: hidden;
	}
}

@media screen and (max-width: 520px) {
	#content #verses a {
		display: block;
		float: none;
		width: auto;
	}

	.m {
		float: none;
		margin-left: 5 !important;
		white-space: normal;
	}
}

@media screen and (max-width: 468px) {
	.down-adv {
		width: auto;
	}
}

@media screen and (max-width: 430px) {
	#biography img {
		float: none;
		display: block;
		width: 160px;
		margin: 20px auto;
	}
}

pre {
    white-space: pre-wrap !important;
    overflow: hidden;
    display: block;
}

#content {
	overflow: hidden;
}

.ads-comp { display:block;}
.ads-mob { display:none;}

@media only screen and (max-width: 960px) {
.ads-comp { display:none;}
.ads-mob { display:block;}
}

nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
nav a {
  display: block;
  text-decoration: none;
  outline: none;
  transition: .4s ease-in-out;
}
.topmenu {
  backface-visibility: hidden;
  background: rgba(255,255,255,.8);
}
.topmenu > li {
  display: inline-block;
  position: relative;
}
.topmenu > li > a {
  font-family: 'Exo 2', sans-serif;
  height: 70px;
  line-height: 70px;
  padding: 0 30px;
  font-weight: bold;
  color: #003559;
  text-transform: uppercase;
}
.down:after {
  content: "\f107";
  margin-left: 8px;
  font-family: FontAwesome;
}
.topmenu li a:hover { color: #E6855F; }
.submenu {
  background: white;
  border: 2px solid #003559;
  position: absolute;
  left: 0;
  visibility: hidden;
  opacity: 0;
  z-index: 5;
  width: 15em;
  transform: perspective(600px) rotateX(-90deg);
  transform-origin: 0% 0%;
  transition: .6s ease-in-out;
}
.topmenu > li:hover .submenu{
  visibility: visible;
  opacity: 1;
  transform: perspective(600px) rotateX(0deg);
}
.submenu li a {
  color: #7f7f7f;
  font-size: 1em;
  line-height: 1em;
  padding: 0 25px;
  font-family: 'Kurale', serif;
}