﻿/* AnythingSlider Themese demo */
body               {background: #000000; color: #adb3b3; font-family: Arial, Helvetica, sans-serif; font-size: 20px; text-align: center;}
a:link             { color: #042424; text-decoration: none; }
a:hover            { color: #456c6c; }

/* link colors */
.dark   { color: #ffffff;}
.dark a:link   { color: #15b3b3; }
.dark a:hover  { color: #456c6c; }

.dark2   { visibility: hidden;}

.dark3   { visibility: hidden;}

.dark4   { display: none;}

.dark5   { visibility: visible;}

.unhidden { visibility: visible; }

.dark6 {color: #042424; font-size: 16px;}

/* this is the nav circles */
#nav               { display: block; width: auto; margin: 10px auto; text-align: center; white-space: nowrap; line-height: 3em; }
#nav a             { text-align: center; background: black; color: white; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 10px; }
#nav a.git         { background: #006; }
#nav a.issue       { background: #600; }
#nav a:hover,
#nav a.current     { background: #666; }


/* text colors */
h1                 { text-align: center; font-family: 'Bowlby One SC', sans-serif; font-size: 100%; }
h2{ font:18px "Times New Roman", Times, serif; color:#000000;}
h3{ font:28px "Times New Roman", Times, serif; color:#ffffff; text-align: center;}
h4{ font:18px "Times New Roman", Times, serif; color:#ffffff; text-align: center;}
h5{ color:#456c6c; text-align: center;}

.theme-list        { text-align: center; margin: 30px auto; }
.theme-list div    { height: 35px; vertical-align: middle; } /* this silly css definition is needed for IE7 */
.theme-list select { margin-bottom: 30px; }

#wrap { margin-bottom: 195px; }


/* Define slider dimensions here */

#slider {
	width: 600px;
	height: 350px;
	list-style: none;
	/* Prevent FOUC (see FAQ page) and keep things readable if javascript is disabled */
	overflow-y: auto;
	overflow-x: hidden;
}
#slider li,
#slider img        {
	position: relative;
	font-family: Arial, Helvetica, sans-serif;
}

/* Top caption - padding is included in the width (680px here, 700px total width), same for height */
.caption-top       {
	background: #000;
	color: #95caec;
	padding: 10px;
	margin: 0;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 18px;
	position: relative;
	z-index: 10;
	left: 0;
	top: 0;
	width: 580px;
	height: 30px;
}


/* Caption close button */
.close             { font-size: 80%; cursor: pointer; float: right; display: inline-block; }

/* background color selector */
#bkgd              { margin: 20px auto; width: 320px; }
.block             { float: left; display: block; width: 20px; height: 20px; }


.box1{ background:url(../images/cemetary2.jpg) repeat; height: 520px;  position:relative; z-index: -3;}
.box2{ background:url(../images/black.jpg) repeat; height: 420px;  position:relative; overflow: hidden; z-index: -3;}
.box3{ background:url(../images/cemetary4.jpg) no-repeat; height: 420px;  position:relative; overflow: hidden; z-index: -3;}
.box4{ background:url(../images/cemetary4.jpg) no-repeat; height: 420px;  position:relative; overflow: hidden; z-index: -3;}
.box5{ background:url(../video/harbor.mp4) no-repeat; height: 420px;  position:relative; overflow: hidden; z-index: -3;}
.box6{ position:absolute; z-index: -8; top: 120px; left: 70%; margin-left: -960px; opacity:0.1;}
.box6b{ position:absolute; z-index: -8; top: 660px; left: 100%; margin-left: -960px; opacity:0.3;}
.box6c{ position:absolute;  z-index: 5; top: 580px; left: 110%; margin-left: -960px; opacity:0.3;}

.inset{position:absolute; z-index: 5; top: -175px; margin-left: 590px;  opacity:1.0;}
.inset2{position:absolute; z-index: -5; top: -330px; margin-left: 0px;  opacity:0.3;}
.inset2b{position:absolute; z-index: -5; top: -330px; margin-left: 0px;  opacity:0.7;}
.inset2c{position:absolute; z-index: -5; top: -330px; margin-left: 0px;  opacity:0.5;}
.inset2d{position:absolute; z-index: 5; top: -275px; margin-left: 590px;  opacity:.5;}
.inset5{position:absolute; z-index: 5; top: -85px; margin-left: 555px;  opacity:.4;}
.inset6{position:absolute; z-index: 5; top: -85px; margin-left: 555px;  opacity:.1;}
.inset7{position:absolute; z-index: 5; top: -85px; margin-left: 555px;  opacity:.2;}
.inset8{position:absolute; z-index: 5; top: -85px; margin-left: 555px;  opacity:.2;}
.inset9{position:absolute; z-index: 5; top: -85px; margin-left: 555px;  opacity:.07;}

.inset4{position:absolute; z-index: -5; top: -395px; margin-left: 0px;  opacity:1.0;}
.inset3{position:absolute; z-index: 25; top: -375px; margin-left: 570px;  opacity:1.0;}

.insetimage{position:absolute; z-index: 15; top: -170px; margin-left: 270px;  opacity:.08;}
.insetimage2{position:absolute; z-index: -15; top: -120px; margin-left: 55px;  opacity:.1;}

.insetend{position:absolute; z-index: 5; top: 15px; margin-left: 50px;  opacity:.5;}
.insetend2{position:absolute; z-index: 5; top: 15px; margin-left: 123px;  opacity:.5;}
.insetend3{position:absolute; z-index: 5; top: 15px; margin-left: 193px;  opacity:.5;}
.insetend4{position:absolute; z-index: 5; top: 15px; margin-left: 263px;  opacity:.5;}
.insetend5{position:absolute; z-index: 5; top: 15px; margin-left: 333px;  opacity:.5;}
.insetend6{position:absolute; z-index: 5; top: 15px; margin-left: 403px;  opacity:.5;}
.insetend7{position:absolute; z-index: 5; top: 15px; margin-left: 473px;  opacity:.5;}
.insetend8{position:absolute; z-index: 5; top: 15px; margin-left: 543px;  opacity:.5;}

.definition{position:absolute; z-index: 5; top: -65px; font-family: Arial, Helvetica, sans-serif; font-size: 11px; margin-left: 33px;  text-align: center; color: #95caec; opacity: .8;}

.textbackground{background: #000;  width: 540px; height: 128px; margin-left: 31px;  margin-bottom: 60px; margin-top: -130px; opacity:.6; 	z-index: -2;} /*margin-top go lower for lower in space*/

/* text font and color for bottom captions. This first part about ".caption" seems necessary for the next #current-caption, which provides the proper css*/

/*this is for first caption*/
.caption {
	display: none;
}

#current-caption { 
	position: absolute;
	width: 510px;
	/* up and down*/
	font-family: Arial, Helvetica, sans-serif;
	text-align: justify;
	margin-left: 145px;
	font-size: 16px;
	top: 300px; /*go higher for lower in space*/
	z-index: 3;
}

/*this is for second caption*/


/*this is for image in third caption*/
.caption3 { display: none;}

#current-caption3 {
	position: absolute;
	width: 700px;
	margin: 10px auto;
	padding-left:50px;
	z-index: 3;
	text-align: center; opacity:.5; z-index: 60; padding-left: 8px; padding-top: -55px;
}

.caption4 { display: none;}

#current-caption4 {
	position: absolute;
	width: 700px;
	margin: 10px auto;
	padding-left:50px;
	z-index: 2;
}

.caption5 { display: none;}

#current-caption5 {
	position: absolute;
	width: 700px;
	margin: 10px auto;
	padding-left:50px;
	z-index: 4;
}

.caption6 { display: none;}

#current-caption6 {
	position: absolute;
	width: 700px;
	margin: -350px auto;
	padding-left:50px;
	z-index: -1;
}

.caption7 { display: none;}

#current-caption7 {
	position: absolute;
	width: 700px;
	margin: -340px auto;
	padding-left:50px;
	z-index: -2;
}
.caption2 {
	display: none;
	font-size: 12px;
}

#current-caption2 {
	position: absolute;
	width: 640px;
	/* up and down*/
	margin: 10px auto;
	text-align: justify;
	padding-left:80px;
	font-size: 18px;
	z-index: 1;
}
 #text-wrapper {position: relative;}
 
 #slider, .inner {
	width: 600px; /* adjust width & height as desired */
	height: 350px;
	list-style: none;
	font-family: Arial, Helvetica, sans-serif;
}

.jiggle {
	color: #FFF;
	font-size: 18px;
	font-style: normal;
	font-family: Arial, Helvetica, sans-serif;
	z-index: 28;
}
