﻿body {

  font-family: verdana, arial, times, sans-serif; 
  margin: 0;
  padding: 0;
}

#extra_wrap {

    background: url(background_shadow.gif) repeat-y ;
    width: 930px;
    margin: 0 auto;
    min-height: 895px;
}


#wrapper {
   position: relative;
   top: 0;
   left: 0;
   margin-left:  auto;
   margin-right: auto;
   height: 700px;
   width: 900px;
}

/* this is header section*/

#header {
   position:absolute;
   left: 0px;
   top: 0px;
   height: 146px;
   width: 893px;
   background: black url(head.gif) no-repeat right;
   border: 1px solid #fffccc;
   padding: 0;
   margin: 0;
}




#header h1 {
   color: #fffccc;
   font: 2.7em impact;
   width: 280px;
   position: relative;
   top: 42px;
   padding-left:30px;
	text-shadow: 2px 2px 2px #666;
  
}

/* this is for nav sction */

#nav {
   
   font: 1.1em verdana;
   height: 40px;
   width: 893px;
   background-color: #cccccc;
   border: 1px solid #fffccc;
   position: absolute;
   top:151px;
   left: 0px;
   background: black url(shoulder.gif) no-repeat right;
   padding: 0;
   margin: 0;
}

#nav ul {
    margin: 0;
    padding: 8px 0 0 20px;
}

#nav li {
  
  color: #00688B;
  background-color:black;
  display:inline;
}


#nav a:link, #nav a:visited {
  padding: 0 0.5em 0 0.5em;
  color:  #fffccc;
  text-decoration: none;

}
#nav a:hover{
  
  color: #999999;
  text-decoration: underline overline;
  
}
#navfoot {
   position: absolute;
  top: 868px;
  left: 315px;
  padding: 0;
  margin: 0;
}
#navfoot ul {
  padding: 0;
  margin: 0;
}

#navfoot li {
   
   padding: 5px 5px 0px 5px;
   display:inline;
   color: #474747;
}

#navfoot a:link, #navfoot a:visited {
   font-size: 13px;
   padding:0;
   color:  #474747;
  text-decoration: underline;
}
#navfoot a:hover{
padding:0;
  font-size: 15px;
  color: #ededed;
  text-decoration: underline overline;
}
#contentL a:link, #contentL a:visited{
   color: #ffffff;
   text-decoration: underline;
}
  
#contentL a:hover {
   color: #999999;
  text-decoration: underline;
}
#player a:link, #player a:visited, #contentC a:link, #contentC a:visited{
   color: #ffffff;
   text-decoration: underline;
}
  
#player a:hover, #contentC a:hover {
   color: #999999;
  text-decoration: underline;
}

/* this is home page */

#contentL {
   position: absolute;
   left: 0px;
   top: 196px;
   width: 305px;
   height: 694px;
   background-color: black;
   border-left: 1px solid #ffffff;
   border-top: 1px solid #ffffff;
border-bottom: 1px solid #ffffff;
   border-right: 1px solid black;
   
}

#contentL h5 {
  font: 0.8em verdana, arial, helvetica;
  color:#fffccc;
  position: relative;
  top: 50px;
  left: 37px;
}

  
.mainpic {
  position: relative;
  top: 60px;
  left: 30px;
  border: 4px solid #ffffff;
}

.feature {
  position: relative;
  top: 80px;
  left: 30px;
  border: 1px solid white;
}
.write {
  width: 260px;
  position: relative;
  top: 62px;
  left: 30px;
  
}
  

#contentC {
   position: absolute;
   left: 300px;
   top: 196px;
   width: 410px;
   height: 694px;
   background-color: black;
   border: 1px solid #fffccc;
   border-left: 1px solid black;
   border-bottom: 1px solid #fffccc;
}

#contentC h3 {
  font: 1.2em arial, verdana, times;
  color: #fffccc;
  position: relative;
  top: 40px;
  left: 80px;
}
#contentC p {
  font: 0.8em verdana, arial, times;
  text-align: left;
  width: 375px;
  color: #fffccc;
  position: relative;
  top: 50px;
  left: 20px;
 
}
#contentR {
   position: absolute;
   left: 709px;
   top: 196px;
   width: 185px;
   height: 205px;
   background-color: black;
   border-top: 1px solid #fffccc;
   border-left: 1px solid black;
   border-right: 1px solid #fffccc;
   border-bottom: 1px solid #cccccc ;
}

.mailing {
  position: relative;
  top: 92px;
  left: 10px;
  border: 1px solid white;
}
#mid {
   position: absolute;
   left: 709px;
   top: 400px;
   width: 185px;
   height: 200px;
   background-color: black;
 
   border-left: 1px solid black;
   border-right: 1px solid #fffccc;
   border-bottom: 1px solid black;
} 
.shop {
  position: relative;
  top: 55px;
  left: 10px;
  border: 1px solid white;
}

#bottom {
   position: absolute;
   left: 709px;
   top: 598px;
   width: 186px;
   height: 293px;
   background-color: black;
  
   border-right: 1px solid #fffccc;
   border-bottom: 1px solid #fffccc;
} 
.back {
  position: relative;
  top: 18px;
  left: 10px;
  border: 1px solid white;
}

  
.vid {
  position: relative;
  top: 100px;
  left: 150px;

}

#footer {
  position: absolute;
  top: 853px;
  left: 10px;
  padding: 0;
  margin: 0;
}

#footer p {
  padding: 0;
  color: #474747;
}




/* this is for gallery page */

#gallery {
   position: absolute;
   left: 0px;
   top: 196px;
   width: 710px;
   height: 694px;
   background-color: black;
   border: 1px solid #fffccc;
   border-right: 1px solid #cccccc;
     
}


#gallery ul {
  list-style: none;
  padding: 0 0 0 20px;
  margin: 0px;
  width: 648px;
 
 float: left;
  
}

#gallery li {
  padding: 18px 8px 8px 8px;
  margin: 0px;
  position: relative;
 
}

#gallery span {
  display: block;
  position: absolute;
  bottom: 13px;
  left: 10px;
  width: 595px;
  background: #000000;
  color: #ffffff;
  padding: 8px;
  font-size: 1.0em;
  
  
}
#gallery img {
  border: 2px solid #333;
}
#gallery ul.small-images {
  padding: 0px 10px 0 0px;
  display: none;
}
#gallery ul.small-images li {
  padding: 10px 0 0 40px;
  float: left;
  clear: none;
}
#gallery ul.small-images a {
  display: block;
  float: left;
  padding: 8px;
}
#gallery ul.small-images a.selected {
  background: #333;
}
#gallery ul.small-images a:hover {
  padding: 6px;
}
#gallery ul.small-images a:hover img {
  border-width: 4px;
}

#gallery ul.controls {
	display: none;
  position: relative;
}

#gallery ul.controls li {
  position: absolute;
  display: block;
  width: 34px;
  height: 34px;
  z-index: 100;
  top: 200px;
  
 
}

#gallery ul.controls li.prev {
  left: 20px;
}

#gallery ul.controls li.next {
  right: 20px;
}

#gallery ul.controls a {
  display: block;
  width: 34px;
  height: 34px;
  text-decoration: none;
  border: none;
}

#gallery ul.controls a img {
  border: none;
}

.tinted {
	filter:alpha(opacity=70);
	-moz-opacity:0.7;
	-khtml-opacity: 0.7;
	opacity: 0.7;
}
.transparent {
	filter:alpha(opacity=0);
	-moz-opacity:0;
	-khtml-opacity: 0;
	opacity: 0;
}


/*this for the contact page */

#contact {
  
   position: absolute;
   left: 0px;
   top: 196px;;
   width: 710px;
   height: 694px;
   background-color: black;
   border: 1px solid #fffccc;
   border-right: 1px solid #cccccc;
}

#contact h4 {
   position: relative;
   top: 80px;
   left: 250px;
   font-size: 100%;
   color: #fffccc;
}

#contact p {
   font: 0.9em verdana;
   position: relative;
   color: white;
   top: 80px;
   left: 100px;
}


input.txt{
  color: #666666;
  background-color: #E3F2F7;
  border: 1px inset #00008B;
  width: 200px;
}

input.btn {
  color: #00008B;
  background-color: #ADD8E6;
  border: 1px outset #00008B;
}


/* this is for shop page */

#store {
   
   position: absolute;
  left: 0px;
   top: 196px;
   width: 710px;
   height: 694px;
   background-color:black;
   border: 1px solid #fffccc;
   border-right: 1px solid #cccccc;
}

#store p {
   font: 0.9em verdana;
   position: relative;
   top: 80px;
   left: 100px;
}

#store embed {

  border: 2px solid #fff;
}


  
/* this is for music page */

#music  {
   
   position: absolute;
   left: 0px;
   top: 196px;;
   width: 710px;
   height: 694px;
   background-color: black;
   border: 1px solid #fffccc;
   border-right: 1px solid #cccccc;
}

#music h3 {

color: white;
}


 

#player  {
  font: 0.8em verdana;
  color: #474747;
  width: 400px;
  height: 15px;
  position: absolute;
  left:150px;
  top: 80px;
}

#music p {
  color: white;
}



.indent {
  padding-left: 50px;
}

/* this is for news page */

#news{
  
   position: absolute;
  left: 0px;
   top: 196px;
   width: 710px;
   height: 694px;
   background-color: black;
   border: 1px solid #fffccc;
   border-right: 1px solid #cccccc;
}

#firstpara {
   font: 0.9em verdana;
   color: #ffffff;
   padding-top: 40px;
   padding-left: 60px;
   width: 600px;
   height: 150px;
}

#firstbox {
    position: absolute;
    width: 600px;
    height: 150px;
    border-bottom: 2px dotted #fffccc;
}

#secbox {
    position: absolute;
    width: 600px;
    height: 150px;
    border-bottom: 2px dotted #fffccc;
}
#thirdbox {
    position: absolute;
    width: 600px;
    height: 150px;
    border-bottom: 2px dotted #fffccc;
}
  



#secpara {
   font: 0.9em verdana;
   color: #fffccc;
   padding-top: 8px;
   padding-left: 60px;
   width: 600px;
   height: 150px;
  
}
#thirdpara {
   font: 0.9em verdana;
   color: #fffccc;
   padding-top: 8px;
   padding-left: 60px;
   width: 600px;
   height: 150px;
  

}

#store img {
  position: absolute;
  top: 75px;
  left: 75px;
  padding: 0;
}


#css {

position: absolute;
top: 835px;
left: 800px;

}


#rightsongs {

position: absolute;
top: 275px;
left: 300px;
width: 100%;

}

a:link {
  color: #ffffff;
  }

a:hover  {

color: #474747;
}

 










