/*----------------------------------------------------------------------------------------------------*/

/* Reset v1.0 | 20080212 - http://meyerweb.com/eric/tools/css/reset/
----------------------------------------------------------------------------------------------------*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
    	background: transparent;
}

body {
	line-height: 1;
	background: url('../images/bg-body.jpg');
	width: 960px;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}

del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* Reset for HTML 5 Elements
----------------------------------------------------------------------------------------------------*/

/* tells browsers that don't read html 5 tags to render like divs */
header, footer, aside, nav, article, section {
	display: block;
	margin: 0;
	padding: 0;
}

/* clears containers with floated elements, no need for extra markup! */
.clear:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

/* Layout
----------------------------------------------------------------------------------------------------*/
html {
	border: ;
	color: #333;
	margin: 0 auto;
	font: 14px/24px Helvetica, Arial, sans-serif;
	width: 960px;
    	background: rgb(169,3,41); /* Old browsers */
	/* IE9 SVG, needs conditional override of 'filter' to 'none' */
	background: -moz-linear-gradient(top, rgba(109,0,25,1) 33%, rgba(140,9,18,1) 55%, rgba(137,1,10,1) 56%, rgba(169,3,41,1) 84%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(33%,rgba(169,3,41,1)), color-stop(55%,rgba(140,9,18,1)), color-stop(56%,rgba(137,1,10,1)), color-stop(84%,rgba(109,0,25,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(169,3,41,1) 33%,rgba(140,9,18,1) 55%,rgba(137,1,10,1) 56%,rgba(109,0,25,1) 84%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(169,3,41,1) 33%,rgba(140,9,18,1) 55%,rgba(137,1,10,1) 56%,rgba(109,0,25,1) 84%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, rgba(169,3,41,1) 33%,rgba(140,9,18,1) 55%,rgba(137,1,10,1) 56%,rgba(109,0,25,1) 84%); /* IE10+ */
	background: linear-gradient(to bottom, rgba(169,3,41,1) 33%,rgba(140,9,18,1) 55%,rgba(137,1,10,1) 56%,rgba(109,0,25,1) 84%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=0 ); /* IE6-8 */
}

body {
	border: white;
	color: #333;
	margin: 0 auto;
	font: 14px/24px Helvetica, Arial, sans-serif;
	width: 960px;
    background-color:#FBE8DA;
    background-image:url('../images/pink48.jpg');
}

h6 {
	font: normal bold 34px/50px Arial, Helvetica, sans-serif;
	padding-top: 30px;
	width:50%;
}

h2 {
	font-size: 28px;
	line-height: 44px;
	padding: 5px 0;
}

h3 {
	font-size: 18px;
	line-height: 22px;
	padding: 11px 0;
    vertical-align:top;
}

h4 {
	font-size: 12px;
	line-height: 22px;
	padding: 1px 0;
    vertical-align:top;
}
.normal{
    font-family: Helvetica,Arial,Verdana,sans-serif; 
    font-size:14px/24px;
    color: rgb(51, 51, 51);
}

 }
p {
    font-family: 'Lucida Grande',Helvetica,Arial,Verdana,sans-serif;
	font-weight: normal;
    font-size:small;
	padding-bottom: 22px;
}

a {
	color: #CC6600;
	text-decoration: none;
     border-radius: 10px 10px 10px 10px;
  -ms-border-radius: 10px 10px 10px 10px;
  -moz-border-radius: 10px 10px 10px 10px;
  -webkit-border-radius: 10px 10px 10px 10px;
  -khtml-border-radius: 10px 10px 10px 10px;
}

a:visited {
	color: #CC6600;
	outline: none;
	text-decoration: none;
}

a:hover {
	color: #FF9900;
	text-decoration: underline;
    box-shadow: 10px 10px 15px #000;
   -webkit-box-shadow: 10px 10px 15px #000;
   -moz-box-shadow: 10px 10px 15px #000;
    border-radius: 10px 10px 10px 10px;
  -ms-border-radius: 10px 10px 10px 10px;
  -moz-border-radius: 10px 10px 10px 10px;
  -webkit-border-radius: 10px 10px 10px 10px;
  -khtml-border-radius: 10px 10px 10px 10px;
}

a:active {
	color: #CC6600;
	outline: none;
	text-decoration: none;
}

a:focus {
	outline: 1px dotted;
}

#mast {
    height:260px;
    background-repeat:no-repeat;
    background-position:center;
    alignment-baseline:central;
}

#mast h1 {
	padding: 30px 20px 20px 40px;
}

/* Nav  */

#nav{
	position:fixed;
	width: 960px;
	z-index:2000; 
	background: rgb(169,3,41); /* Old browsers */
	/* IE9 SVG, needs conditional override of 'filter' to 'none' */
	background: -moz-linear-gradient(top, rgba(169,3,41,1) 33%, rgba(140,9,18,1) 55%, rgba(137,1,10,1) 56%, rgba(109,0,25,1) 84%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(33%,rgba(169,3,41,1)), color-stop(55%,rgba(140,9,18,1)), color-stop(56%,rgba(137,1,10,1)), color-stop(84%,rgba(109,0,25,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(169,3,41,1) 33%,rgba(140,9,18,1) 55%,rgba(137,1,10,1) 56%,rgba(109,0,25,1) 84%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(169,3,41,1) 33%,rgba(140,9,18,1) 55%,rgba(137,1,10,1) 56%,rgba(109,0,25,1) 84%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, rgba(169,3,41,1) 33%,rgba(140,9,18,1) 55%,rgba(137,1,10,1) 56%,rgba(109,0,25,1) 84%); /* IE10+ */
	background: linear-gradient(to bottom, rgba(169,3,41,1) 33%,rgba(140,9,18,1) 55%,rgba(137,1,10,1) 56%,rgba(109,0,25,1) 84%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=0 ); /* IE6-8 */
	
	border-radius: 0px 0px 5px 5px ;
	-webkit-border-radius: 0px 0px 5px 5px ;
	-moz-border-radius: 0px 0px 5px 5px ;
	
	}
#nav .parent > a, #nav .parent > a:hover{
	background-image:url('../images/arrow.png');
	background-position:right;
	background-repeat:no-repeat
}
#nav ul ul .parent > a, #nav ul ul .parent:hover > a:hover, #nav ul ul li:hover ul .parent > a, #nav ul ul li:hover ul .parent > a:hover{
	background-image:url('../images/arrow-right.png');
	background-position:right;
	background-repeat:no-repeat;
}
#nav ul, #nav ul li{
	display:inline;
	list-style:none;
	padding:0;
	margin:0;}
#nav ul li a{
	display:inline-block;
	font-family:'Lucida Grande',Helvetica,Arial,Verdana,sans-serif;
	font-size:14px;
	color:#ffcccc;
	line-height:36px;
	text-decoration:none;
	text-shadow:1px 1px 1px #333;
	padding:0 13px;
	margin-left:-4px;
	border-right:#777 1px solid;
}
#nav ul li a:hover{
	box-shadow:inner 0 0 5px #000;
	-moz-box-shadow:inset 0 0 5px #000;
	-webkit-box-shadow:inset 0 0 5px#000;
	background: #555;
}
#nav .current-menu-item a{
	color:#ccc;
}
#nav .current-menu-item .sub-menu a{
	color:#fff;
	text-shadow:1px 1px 1px #333;
}
#nav .menu > li:first-child a:hover{
	border-radius:0;
}
#nav .menu .sub-menu li a:hover{
	border-radius:0;
}
#nav ul li{
	position:relative;
}
#nav li ul{
	display:none;
	position:absolute;
	top:27px;
	left:7px
	;z-index:2147483647;
}
#nav li ul a{
	background: rgb(169,3,41); /* Old browsers */
	/* IE9 SVG, needs conditional override of 'filter' to 'none' */
	background: -moz-linear-gradient(top, rgba(169,3,41,1) 33%, rgba(140,9,18,1) 55%, rgba(137,1,10,1) 56%, rgba(109,0,25,1) 84%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(33%,rgba(169,3,41,1)), color-stop(55%,rgba(140,9,18,1)), color-stop(56%,rgba(137,1,10,1)), color-stop(84%,rgba(109,0,25,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(169,3,41,1) 33%,rgba(140,9,18,1) 55%,rgba(137,1,10,1) 56%,rgba(109,0,25,1) 84%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(169,3,41,1) 33%,rgba(140,9,18,1) 55%,rgba(137,1,10,1) 56%,rgba(109,0,25,1) 84%); /* Opera 11.10+ */	
	background: -ms-linear-gradient(top, rgba(169,3,41,1) 33%,rgba(140,9,18,1) 55%,rgba(137,1,10,1) 56%,rgba(109,0,25,1) 84%); /* IE10+ */
	background: linear-gradient(to bottom, rgba(169,3,41,1) 33%,rgba(140,9,18,1) 55%,rgba(137,1,10,1) 56%,rgba(109,0,25,1) 84%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=0 ); /* IE6-8 */}
#nav ul ul li:hover ul, #nav ul ul ul li:hover ul{
	left:0;
	margin:-37px 0 11px 180px;
}
#nav ul li:hover ul{
	display:inline-block;
}
#nav ul ul, #nav ul li:hover ul ul, #nav ul ul li:hover ul ul{
	display:none;
}
#nav ul li:hover ul, #nav ul ul li:hover ul, #nav ul ul ul li:hover ul{
	display:block;
}
#nav ul li:hover ul li a, #nav ul ul li:hover ul li a, #nav ul ul ul li:hover ul li a{
	border:#777 1px solid;
	margin:-1px 0 0 -11px;
}
#nav ul li:hover ul li a{
	width:150px;
	padding:0 14px;
}
#nav ul ul li:hover ul li a{
	width:150px;
	padding:0 14px;
	background: #555;
}
#nav ul ul ul li:hover ul li a{
	width:150px;
	padding:0 14px;
	background: #555;
}


/* Home Button */


#home {float: left;border-right:#777 1px solid;margin-right:4px;margin-left:15px; height: 36px;}
#home a:hover{opacity: .5}
#nohome {float: left; margin-right:4px;margin-left:5px; height: 35px;}
#intro {
	background-color: #E2A9AD;
	margin-top: 0px;
	padding: 10px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
    height:270px;
}

#intro header {
    margin-top:0;
}

#intro header h2 {
	font-weight: normal;
	line-height: 30px;
	padding: 0 0 15px 0;
}

#intro p {
 	width: 600px;
}

#intro a {
	color: #fff;
	background-color: #333;
	font: normal bold 14px/44px Arial, Helvetica, sans-serif;
	padding: 10px;
	margin-right: 40px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	text-align: center;
}

#intro a:hover {
	color: #FF9900;
	background-color: #222;
	text-decoration: none;
}

#intro #photo {
    background: white;
	float: right;
	margin-top: -120px;
    margin-right: 5px;
    -moz-box-shadow: 0 1px 10px #333;
	-webkit-box-shadow: 0  1px 10px #333;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	width: 310px;
	height: 240px;
    box-shadow: 10px 10px 15px #000;
   -webkit-box-shadow: 10px 10px 15px #000;
   -moz-box-shadow: 10px 10px 15px #000;
    border-radius: 10px 10px 10px 10px;
  -ms-border-radius: 10px 10px 10px 10px;
  -moz-border-radius: 10px 10px 10px 10px;
  -webkit-border-radius: 10px 10px 10px 10px;
  -khtml-border-radius: 10px 10px 10px 10px;
}
#intro #photoalbum {
	background-color: #fff;
	float: left;
	margin-top: -25px;
    -moz-box-shadow: 0 1px 10px #333;
	-webkit-box-shadow: 0  1px 10px #333;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	width: 160px;
	height: 1200px;
}

#intro #photoalt {
	background-color: #fff;
	float: left;
	margin-top: -50px;
    margin-left:-50px;
	-moz-box-shadow: 0 1px 10px #333;
	-webkit-box-shadow: 0  1px 10px #333;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	width: 400px;
	height: 300px;
}

#photo div {
    background:transparent;
	margin: 10px auto 0 auto;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	width: 290px;
	height: 230px;
	text-align: center;
    vertical-align:middle;
}

#photo div h3 {
	color: #fff;
	font-size: 25px;
	line-height: 25px;
    padding-top:0px;
}
#framearea {
      width: 550px; 
      height: 310px;
      margin-bottom: 10px;
	  background-color: #fff;
      padding: 10px;

   box-shadow: 10px 10px 15px #000;
   -webkit-box-shadow: 10px 10px 15px #000;
   -moz-box-shadow: 10px 10px 15px #000;
    border-radius: 10px 10px 10px 10px;
  -ms-border-radius: 10px 10px 10px 10px;
  -moz-border-radius: 10px 10px 10px 10px;
  -webkit-border-radius: 10px 10px 10px 10px;
  -khtml-border-radius: 10px 10px 10px 10px;
      }

      .framebody {
      overflow: auto;
      width: 550px;
      height: 310px;
	  -moz-box-shadow: inset 0 0 1em gold;
   -webkit-box-shadow: inset 0 0 1em gold;
   box-shadow: inset 0 0 1em gold;
   }
#contents{
	
    
 }
#contents #smenu{
    float:left; 
    width: 20%;
    height:500px;
    background-color: #ccc;
	margin-top: 20px;
    margin-left:20px;
	padding: 10px;         
         }

#contents #mainContent{
    width: 80%;
    margin-top: 20px;
    margin-right:20px;
	padding: 10px;         
    }

div#main {
	border: none;
}

#main #articles {
	float: left;
	margin-left: 40px;
	width: 880px;
	border: none;
}

#main #groupphoto{
    margin-top: -400px;
 }
article {
	padding: 15px 0;
}

article td {
    padding:0px;
    vertical-align:top;
 }

article:last-child {
	border-bottom: none;
}

aside {
	float: right;
	margin-top: -860px;
}

aside section {
	margin-top: 20px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

aside h3 {
	padding: 0 0 11px 0;
}

nav#categories ul li, nav#archives ul li {
	list-style: none;
	margin: 5px 0;
}

footer {
	position: absolute;
	left: 0;
	width: 100%;
	background-color: #333;
}

footer div {
	margin: 0 auto;
	padding: 40px 0 20px 20px;
	width: 920px;
	border: none;
}

footer div section {
	color: #777;
	float: left;
	width: 306px;
	border: none;
}

footer div section h3 {
	color: #fff;
}

nav#blogRoll ul li, nav#siteMap ul li {
	color: #777;
	list-style: disc;
	margin-left: 15px;
}

footer #about {
	
}

#accordion div {
    font-size:small;
    padding-top:0px;
    text-align:center;
    background-image:url('images/CD Cover - Ujesu Yeza.jpg');
 }
 
 #accordion div p{
    font-style:italic;
 }
 
.ContentFlow .flow .item canvas.content{
	height:100%;
	width:100%
}

.ContentFlow .flow .item.active{
	cursor:pointer
}

.ContentFlow .flow .item .caption{
	font-size:100%;
	font-weight:700;
	text-align:center;
	color:#FFF;
	max-height:30%;
	bottom:10%;
	background:url(img/1x1_0.5_black.png);
	width:100%;
	position:absolute;
	display:none
}

* html .ContentFlow .flow .item .caption{
	background-image:none;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='img/1x1_0.5_black.png')
}

.ContentFlow .scrollbar{
	width:50%;
	height:16px;
	background:url(img/scrollbar_white.png) left center repeat-x;
	overflow:visible;
	position:relative;
	z-index:1;
	visibility:hidden;
	margin:10px auto 0
}

.ContentFlow .scrollbar .slider{
	width:16px;
	height:16px;
	background:url(img/slider_white.png) center center no-repeat;
	cursor:move;
	position:absolute
}

* html .ContentFlow .scrollbar .slider{
	background-image:none
}

* html .ContentFlow .scrollbar .slider .virtualSlider{
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='img/slider_white.png');
	height:100%
}

.ContentFlow .scrollbar .slider .position{
	top:120%;
	font-size:16px;
	font-weight:700;
	color:silver;
	position:absolute;
	text-align:center
}

.ContentFlow .globalCaption{
	text-align:center;
	font-weight:700;
	color:#FFF;
	font-size:14px;
	height:20px;
	position:relative;
	z-index:1;margin:2em auto
}

.ContentFlow .loadIndicator{
	width:100%;
	height:100%;
	top:0;
	left:0;
	background:#000;
	position:absolute;
	z-index:65000
}

.ContentFlow .loadIndicator .indicator{
	background:url(img/loader.gif) center center no-repeat;
	width:100%;
	height:100%
}

* html .ContentFlow .loadIndicator .indicator{
	height:100px
}

.ContentFlow{
	position:relative;
	overflow:hidden
}

.ContentFlow *{
	margin:0;
	padding:0
}

.ContentFlow img{
	-ms-interpolation-mode:bicubic
}

.ContentFlow .mouseoverCheckElement{
	position:absolute;
	width:0;
	height:0;
	left:0;
	visibility:hidden
}

.ContentFlow:hover .mouseoverCheckElement{
	left:1px
}

.ContentFlow .flow{
	position:relative;
	z-index:0;
	visibility:hidden;
	width:100%;
	margin:0 auto
}

.ContentFlow .flow.hidden{
	visibility:hidden
}

.ContentFlow .flow .item{
	position:absolute;
	visibility:hidden;
	top:0;
	left:0
}

.ContentFlow .flow .item div.content{
	width:100%;
	height:100%
}

.ContentFlow .flow .item .label{
	display:none
}

.ContentFlow .flow .item canvas.reflection{
	margin-top:-1px
}

.ContentFlow .flow .item img.content,.ContentFlow .flow .item img.reflection,.ContentFlow .flow .item canvas.reflection{
	width:100%
}

.ContentFlow .flow .item .caption a,.ContentFlow .flow .item .caption a:link,.ContentFlow .flow .item .caption a:visited,.ContentFlow .flow .item .caption a:active,.ContentFlow .flow .item .caption a:hover,.ContentFlow .globalCaption .caption a,.ContentFlow .globalCaption .caption a:link,.ContentFlow .globalCaption .caption a:visited,.ContentFlow .globalCaption .caption a:active,.ContentFlow .globalCaption .caption a:hover{
	color:#FFF;
	font-size:0.8em;
	font-style:italic;text-decoration:none
}

.ContentFlow .flow .item .caption a:hover,.ContentFlow .globalCaption .caption a:hover{
	text-decoration:underline
}

.ContentFlow .flow .item .content,.ContentFlow .flow .item .reflection{
	display:block
}
/*--------------------------------------------------------------------------------------------*/
/*                                          SlideShow                                         */
/*--------------------------------------------------------------------------------------------*/ 	


div#tmpSlideshow {
	margin: 0px;
	padding: 0 0 0 0;
	position: relative;

    	height: 395px;

    	width: 540px;    
	border: 1px solid rgb(200, 200, 200);
}
div#logo {

    	margin: 10px;

    	padding: 0 0 0 0;    position: relative;    height: 100px;

    	width: 585px;

    	border: 1px solid rgb(200, 200, 200);
}

div#intro {

    	margin: 10px;    
	padding: 0 0 0 0;    
	float:right;

    	position: relative;    
	height: 350px;

    	top: -120px;    
	width: 410px;

    	border: 1px solid rgb(200, 200, 200);

}

div.tmpSlide {
    	position: absolute;

    	top: 0;

    	left: 0;

    	width: 515px;    
	height: 332px;

    	display: none;}

div.tmpSlide img {

    	float: left;

    	margin: 30px 0 0 15px;

    	width: 250px;    
	border: 1px solid rgb(244, 244, 244);

}

div#tmpSlideshowControls {

    	position: absolute;

    	float:right;

    	bottom: 10px;

    	right: 11px;

    	width: 225px;
}

div.tmpSlideshowControl {

    	border: 1px solid #e1dece;

    	float: left;

    	margin: 0 5px 0 0;

    	background: url('/Template/Pictures/Buttons/Feature.png') no-repeat;

    	width: 38px;

    	height: 36px;

    	color: #554d31;    
	font: 14px Arial, sans-serif;    
	text-align: center;

    	cursor: pointer;

}

div.tmpSlideshowControl span {

    	line-height: 36px;
    	vertical-align: middle;
}

div.tmpSlideshowControlOn {
    	background-image: url('/Template/Pictures/Buttons/FeatureOver.png');

}

div.tmpSlideshowControlActive {
    	border: 1px solid rgb(161, 155, 137);
}
div.tmpSlideCopy {
    	position: absolute;

    	left: 300px;    top: 20px;

    	width: 245px;

}

div#tmpSlideshow h4 {

    	color: #b90f23;    text-transform: uppercase;

    	font: 14px Arial, sans-serif;

    	margin: 10px 0;
}

div.tmpSlideCopy p {    font: 11px Arial, sans-serif;

    	line-height: 1.75em;

}

div.tmpSlideCopy ul li{
    	font: 11px Arial, sans-serif;
    	line-height: 1.75em;
}