@charset "UTF-8";
/* CSS Document */
img{max-width: 100%; height: auto;}
 body {
	margin:0;
	padding:0;
	width:100%;
	background:url(images/foggySea.png);
	background-repeat:repeat;
	text-align:center;
	position:relative;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 18px;
	font-style: normal;
	line-height: 130%;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
}

#container {
	background:#F99;
	background-repeat:repeat;
	width:98%;
	height:100%;
	margin-left:auto;
	margin-right:auto;
	margin-top:0;
	position:relative;
}
.transBox {background-color: transparent;background:transparent; height: 1px; }

.parallamb {

    background-image: url(images/KurlyLogo_02A.png);

    /* Full height */
    height: 100%; 

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: repeat;
    background-size: cover;
}
@media (max-width:780px) {.parallamb {background-image: url(images/KurlyLogo_02A.png);height: 100%;background-attachment: fixed;background-position:center;background-repeat: repeat;background-size: cover;}}
.parallContax {

    background:url(images/KurlyLogo_3inch.png) repeat;  

    /* Full height */
    height: 100%; 

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: repeat;
    background-size: cover;
}
#yourMenu {position: relative; margin: 20px auto auto 40px ; padding: 0; width: 52px; height: 206px; background:#666; float:left; clear:both;}
#yourMenu li {width: 50px; height: 50px; position: absolute; top: 2px; background: url(images/poetry.png) 0 0 no-repeat; display: block; list-style: none;}
#yourMenu a {width: 50px; height: 50px; display: block; border: solid 1px #fff;}
#yourMenu a:hover {border: solid 1px #000;}
#yourMenu #bijouIcon {top: 1px;}
#yourMenu #micIcon {top: 54px; background-position:0 -51px  ;}
#yourMenu #reeferIcon {top: 106px; background-position:0 -102px  ;}
#yourMenu #starIcon {top: 158px; background-position: 0 -153px  ;}

#yourMenu #bijouIcon a:hover {background: url(images/poetry.png)-52px -1px  no-repeat;}
#yourMenu #micIcon a:hover {background: url(images/poetry.png) -52px -52px no-repeat;}
#yourMenu #reeferIcon a:hover {background: url(images/poetry.png) -52px -103px  no-repeat;}
#yourMenu #starIcon a:hover {background: url(images/poetry.png) -52px -154px  no-repeat;}
#header {
/*	margin:15px 15px 0 auto;
	padding:0;
	width:216px;
	height:216px;
	position:relative;
	float:right;*/
}
#header a {
	width:216px;
	height:216px;
	text-decoration:none;
}
h1.logo {
	width:216px;
	height:216px;
	text-align:center;
	position:relative;
	margin-left:auto;
	margin-right:auto;
	margin-top:0;
	margin-bottom:0;
	padding:0;
	font-size:14px;
}
.logo span {
	background:url(images/KurlyLogo_3inch.png);
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	float:right;
}
#navBar input.biggy:hover {text-transform:uppercase;}
#navBar input.smaller:hover {text-transform:lowercase;}
#navBar ul {max-width: 100%;max-height: 8.5em;font-size: 1em;list-style-type: none;margin: 0; overflow:scroll;padding: 0; -webkit-padding-start: 0;}
/*#navBar ul li {width:100%; text-align:left; line-height:100%;overflow-x: scroll;}*/
@media (max-width:780px) {
	.dropHold {max-width:75%;}
	#navBar ul {max-width: 100%;max-height: 6.375em;font-size: .75em;list-style-type: none; overflow:scroll;padding: 0;}
    #navBar ul li {width:100%; text-align:left; line-height:100%;}
}
/*#navigation {
	width:738px;
	height:270px;
	padding:0 12px;
}*/
.somePoems {
	background:url(images/foggySea.png);
	background-repeat:repeat;
	width:732px;
	height:130px;
	color:#FF0;
	margin-top:10px;
	font-size:18px;
	font-weight:normal;
	border:#FF3 inset;
}
.somePoems li {
	width:400px;
	height:auto;
	margin:0;
	display:inline;
	float:left;
	clear:both;
}
.somePoems li a:link, .somePoems li a:link {
	display:block;
	width:auto;
	height:auto;
	color:#600;
	text-align:left;
	padding: 0;
	text-decoration:none;	
}
.somePoems li a:link {
	color:#FF0;
}
.somePoems li a:visited {
	color:#FC0;
}
.somePoems li a:hover {
	color:#0F0;
}
.somePoems li a:active {
	color:#F00;
}
.poLinkz  {
	width:732px;
	height:130px;
	margin-top:0;
	padding:0;
	float:left;
}
.poLinkz ul{
	list-style-type:none;
	margin:0 0 0 10px;
	padding:0;
	overflow:hidden;
}

.poLinkz li{
	width:90px;
	margin-right:8px;
	float:left;
}
.poLinkz a:link, .poLinkz a:visited {
	
	display:block;
	width:90px;
	height:30px;
	color:#036;
	text-align:center;
	padding: 0;
	text-decoration:none;
}

.poLinkz li a:link {
	color:#036;
	text-decoration:none;
}
.poLinkz li a:visited,.poLinkz li a:focus {
	background:url(images/bg_wordNav_current.png);
}
.poLinkz li a:hover, .poLinkz li a:active {
	background:url(images/bg_wordNav.png);
	text-transform:uppercase;
	color:#6FF;
	text-decoration:none;
}

.no-js #iambNav li:hover ul { display:block;}
#iambNav  li { position:relative; float:left; list-style-type:none; }  
#iambNav  ul:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }  
#iambNav  li { display:block; padding:0; /*border-left:1px solid #999; border-right:1px solid #222; color:#eee;*/ text-decoration:none; text-align:left;}  
#iambNav  li a:focus { outline:none; text-decoration:none; }  
#iambNav  li:first-child  { border-left:none; }  
#iambNav  li.last  { border-right:none; }  
/*#iambNav   span { display:block; float:rightright; margin-left:0; width:300px; } */ 
#iambNav  ul ul { display:none; width:100%; position:absolute; left:0; background:#6a6a6a; margin:0 6px; padding:0;}  
#iambNav  ul ul li { line-height:65%; width:100%; float:none; }
#iambNav  ul ul li {width: 260px; }
#iambNav  ul ul  { padding:0; border-left:none; border-right:none; font-size:14px; }  
#iambNav  ul ul  li:hover { background-color:#00F; color:#6F0; text-decoration:none }

#contentArea {
	/*background:;*/
	width:auto;
	height:auto;
	margin-left:0;
	text-align:left;
	padding:0;
	float:left;
	clear:both;
}

#contentArea p, #add p, #addMore p, #contentBox {
	font-size:14px;
}
#contentArea p, h2, #add p, #addMore p, contentBox {
	padding:0;
}
.contentBox {	
	width:auto;
	height:auto;
	margin:30px 0 20px 0;
	text-align:center;
	padding:0;
	position:relative;
	float:left;
}

.poem {
	background-color:#CCC;
	width:70%;
	height:auto;
	color:#006;
	font-weight:normal;
	margin:auto;
	border-top:#00C inset;
	border-bottom:#00C inset;
	border-left:#00C inset;
	border-right:#00C inset;

	position:relative;
}
@media (max-width:768px){ .poem {width: 100%;} }
.title {
	background-color:#CCC;
	width:58%;
	height:auto;
	color:#006;
	font-weight:normal;
	border-top:#00C inset;
	border-bottom:#00C inset;
	border-left:#00C inset;
	border-right:#00C inset;

}
.titleHolder {max-width:98%;margin-bottom: 16px;}
.poemBox p {
	
	font-size:18px;
	width:auto;
	margin-top:0;
	margin-left:0;
	text-align:center;
	padding:0;
	clear:both;
}
.poemBox {
	width:auto;
	margin:0;
	
	text-align:left;
	padding:0;
}
.linksMusic {
	background:url(images/Kurly_LogoBG_92px.png);
	background-repeat:repeat;
	width:910px;
	height:160px;
	color:#FF0;
	margin-left:15px;
	margin-top:0;
	margin-bottom:0;
	padding:0;
	text-align:left;
	float:left;
	overflow:hidden;
	clear:both;
	position:relative;
	font-size:14px;
	font-weight:normal;
	border:#FF3 inset;
}
.links {
	color:#FF0;
	width:930px;
	height:160px;
	font-size:14px;
	margin-left:0;
	margin-top:0;
	margin-bottom:0;
	text-align:left;
	float:left;
	overflow:hidden;
	clear:both;
	position:relative;
}
.links ul {
	background:none;
	width:280px;
	height:150px;
	margin:0 0 0 10px;
	padding:inherit;
	float:left;	
}
.links li {
	margin-top:0;
	padding:0 6px 6px 0;
	list-style:none;
	width:250px;
}
.links a:link {
	color:#FF0;
}
.links a:visited {
	color:#3F0;
}

.links a:link, .links a:visited  {
	display:inline;
	width:250px;
	height:auto;
	text-align:left;
	padding: 0;
	text-decoration:none;
}
.links a:hover {
	color:#0F0;
	text-decoration:underline;
}
.links a:active {
	color:#0FF;
}
h6 {
	text-align:center;
}
#footer {
	clear:both;
}
#footer, #footer a:link {
	font-size:12px;
	text-decoration: none;
}
#footer a:hover {
	font-size:12px;
	
}
/*.musLinkz li {
    color:#036;
    height: auto;
    width: 150px;
}*/


/*.musLinkz li a:link {
	color:#036;
	text-decoration:none;
}
.musLinkz li a:visited, .musLinkz li a:focus {
	color:#069;
}
.musLinkz li a:hover, .musLinkz li a:active {
	
	text-transform:uppercase;
	color:#6FF;
}*/

.km-theme-l5 {color:#006 !important; background-color:#fff9f9 !important}
.km-theme-l4 {color:#006 !important; background-color:#ffebeb !important}
.km-theme-l3 {color:#006 !important; background-color:#ffd6d6 !important}
.km-theme-l2 {color:#006 !important; background-color:#ffc2c2 !important}
.km-theme-l1 {color:#006 !important; background-color:#ffadad !important}
.km-theme-d1 {color:#ff9999 !important; background-color:#858585 !important}
.km-theme-d2 {color:#ff9999 !important; background-color:#5c5c5c !important}
.km-theme-d3 {color:#ff9999 !important; background-color:#525252 !important}
.km-theme-d4 {color:#ff9999 !important; background-color:#474747 !important}
.km-theme-d5 {color:#ff9999!important; background-color:#3d3d3d !important}

.km-theme-light {color:#006 !important; background-color:#fff9f9 !important}
.km-theme-dark {color:#ff9999 !important; background-color:#333333 !important}
.km-theme-action {color:#fff !important; background-color:#858585 !important}
.km-theme-link {color:#ff0 !important; background-color:#666666 !important}
.km-theme-link2 {color:#069 !important; background-color:#ff9999 !important}
.km-theme-link3 {color:#069 !important; background-color:transparent !important}
.kmL2-theme {color:#006 !important; background-color:#ffd6d6 !important}
.kmL2-hover-theme:hover, .kmL2-hover-theme:active {color:#6ff !important; background-color:transparent !important}
.km-theme {color:#006 !important; background-color:#ff9999 !important}
.km-text-theme {color:#006 !important}
.km-border-theme {border-color:#ff9999 !important}
.kmL2-border-theme{border-color:#069 !important}
.km-hover-theme:hover {color:#000 !important; background-color:#ff9999 !important}
.km-hover-text-theme {color:#ff9999 !important}
.km-hover-border-theme:hover {border-color:#ff9999 !important}


.km4-theme-l5 {color:#000033 !important; background-color:#f6f6f6 !important}
.km4-theme-l4 {color:#000033 !important; background-color:#ffebeb!important}
.km4-theme-l3 {color:#000033 !important; background-color:#c2c2c2 !important}
.km4-theme-l2 {color:#000033  !important; background-color:#a3a3a3 !important}
.km4-theme-l1 {color:#ff9999 !important; background-color:#858585 !important}
.km3-theme-l1 {color:#fff !important; background-color:#858585 !important}
.km4-theme-d1 {color:#fff !important; background-color:#5c5c5c !important}
.km4-theme-d2 {color:#fff !important; background-color:#525252 !important}
.km4-theme-d3 {color:#fff !important; background-color:#474747 !important}
.km4-theme-d4 {color:#fff !important; background-color:#3d3d3d !important}
.km4-theme-d5 {color:#fff !important; background-color:#333333 !important}

.km4-theme-light {color:#000 !important; background-color:#f6f6f6 !important}
.km4-theme-dark {color:#fff !important; background-color:#333333 !important}
.km4-theme-action {color:#0ff !important; background-color:#333333 !important}
.km4-theme-link {color:#ff0 !important; background-color:#666666 !important}

.km4-theme {color:#fff !important; background-color:#666666 !important}
.km4-text-theme {color:#ff9999 !important}
.km4-border-theme {border-color:#000033 !important;}
.kmBar-border-theme {border-color:#525252 !important;}

.km4-hover-theme:hover {color:#ff9999 !important; background-color:#666666 !important}
.km4-hover-text-theme {color:#666666 !important}
.km4-hover-border-theme:hover {border-color:#666666 !important}

.w3-theme-gradient {color: #fff !important;background:-webkit-linear-gradient(top,#a3a3a3 25%,#858585 75%)}
.w3-theme-gradient {color: #fff !important;background:-moz-linear-gradient(top,#a3a3a3 25%,#858585 75%)}
.w3-theme-gradient {color: #fff !important;background:-o-linear-gradient(top,#a3a3a3 25%,#858585 75%)}
.w3-theme-gradient {color: #fff !important;background:-ms-linear-gradient(top,#a3a3a3 25%,#858585 75%)}
.w3-theme-gradient {color: #fff !important;background: linear-gradient(top,#a3a3a3 25%,#858585 75%)}

.w3-theme-l5 {color:#000 !important; background-color:#f6f6f6 !important}
.w3-theme-l4 {color:#000 !important; background-color:#e0e0e0 !important}
.w3-theme-l3 {color:#000 !important; background-color:#c2c2c2 !important}
.w3-theme-l2 {color:#fff !important; background-color:#a3a3a3 !important}
.w3-theme-l1 {color:#fff !important; background-color:#858585 !important}
.w3-theme-d1 {color:#fff !important; background-color:#5c5c5c !important}
.w3-theme-d2 {color:#fff !important; background-color:#525252 !important}
.w3-theme-d3 {color:#fff !important; background-color:#474747 !important}
.w3-theme-d4 {color:#fff !important; background-color:#3d3d3d !important}
.w3-theme-d5 {color:#fff !important; background-color:#333333 !important}

.w3-theme-light {color:#000 !important; background-color:#f6f6f6 !important}
.w3-theme-dark {color:#fff !important; background-color:#333333 !important}
.w3-theme-action {color:#fff !important; background-color:#333333 !important}

.w3-theme {color:#fff !important; background-color:#666666 !important}
.w3-text-theme {color:#666666 !important}
.w3-border-theme {border-color:#666666 !important}

.w3-hover-theme:hover {color:#fff !important; background-color:#666666 !important}
.w3-hover-text-theme {color:#666666 !important}
.w3-hover-border-theme:hover {border-color:#666666 !important}

.no-js #topNav li:hover ul { display:block;}
.no-js #funNav li:hover ul  {display:block;}

  
/* base nav styles */  
#topNav  { display:block; margin:10px auto auto 20px; border:none; position:relative; background-color:#F99; font:20px; float:left;}  
#topNav  ul { padding:0; margin:0; }  
#topNav  li { position:relative; float:left; list-style-type:none; }
#topNav  ul ul #poemListerL {width:270px; height:auto; margin:0; padding:0; float:left;}
#topNav  ul ul #poemListerM {width:270px; height:auto; margin-left:0; margin-top:0; float:left;}
#topNav  ul:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }  
#topNav  li { display:block; padding:0; text-decoration:none; text-align:center;}  
#topNav  li a:focus { outline:none; text-decoration:none; }  
#topNav  li:first-child  { border-left:none; }  
#topNav  li.last  { border-right:none; }  
/*#topNav   span { display:block; float:rightright; margin-left:0; width:300px; } */ 
#topNav  ul ul { display:none; width:560px; height:200px; position:absolute; left:0; background:#6a6a6a; margin:0 6px 4px; padding:0;}  
#topNav  ul ul span li { line-height:85%; width:260px;  float:none; }

#topNav  ul ul#bookLister li { line-height:85%; width:260px; display:block; float:left; clear:left; }

#topNav  ul ul  { padding:0; border-left:none; border-right:none; font-size:14px; }  
#topNav  ul ul  li:hover { background-color:#00F; color:#6F0; text-decoration:none }
#songsList submit { background-color:#555; color:#6F0; text-decoration:underline; }
/*Save this file in the css directory as nav.css. The first rule is purely for when JavaScript is disabled, and allows the hidden submenu to be displayed on hover purely with CSS. The rest of the code defines a set of base styles that format the <nav> menu in the way that we want without adding anything too decorative. Note that we’re using the :after pseudo-selector to clear the floated list items; normally this would be added using a class name to that it could be applied to the containers of any floated elements on the page. At this point our page should look like this: