/*
CSS for Bob Hooper site
*/

body {
  font-family: Verdana, Helvetica, Arial, sans-serif;
  line-height: 125%;
  padding: 0;
  margin: 0;
  border: none;
}



h1 /*Header - Spanish Guitarist*/ {
  font-size: 200%;
  font-family: Monotype Corsiva, Vivaldi, Verdana, Trebuchet MS, Helvetica, Arial, sans-serif;
  background-color: #a02820; /*brown*/
  color: white;
  letter-spacing: 0.10em;
  padding: 1.25em 0em .4em .7em;
  border-top: 2px solid maroon;
  margin: 0;  
  background: sienna url(images/headerguitar.jpg) no-repeat right;
}


h2  {
  color: #800000; /*maroon*/
  font-size: 150%;
  font-weight: normal;
  margin-top: 23px;
  background-color: #ffffff;
}



/*Heading titles before text*/

h3  {
  color: #3d3d3d;
  font-weight: bold;
  margin-bottom: 1em;
  background-color: #ffffff;
}

/*cd headings*/

h5 {
  color: #000080; /*navy*/
  font-weight: bold;
  font-size: 100%;
  margin-bottom: .6em; /*.5em too small*/
}

/*for markets titles*/
h6 {
  color: #363636; 
  font-family: Monotype Corsiva, Comic Sans MS, Verdana, Trebuchet MS, Helvetica, Arial, sans-serif;
  color: #2B3856;
  font-size: 160%;
  font-weight: normal;
}


#cdheading  {
  font-family: Verdana, Trebuchet MS, Helvetica, Arial, sans-serif;
  color: #800000;
  font-size: 130%;
  font-weight: normal;
  margin-top: 23px;
  background-color: silver;
}


p {
  font-size: small;
  color: black;
}


/*for - 'What they say' ... */

.font1 {
  font-family: Comic Sans MS, Times New Roman, Arial;
  font-size: 95%;
}

#tagline p {

  font-style: normal;
  font-weight: bold;
  font-family: Tahoma, Trebuchet MS, Helvetica, Arial, sans-serif;
  letter-spacing: 0.05em;
  color: #800000; /*maroon*/ 
  border-top: 2px solid brown;
  border-bottom: 2px solid brown;
  padding: .2em 1.8em;
  margin: 0;
  background:  #ef8861;
}


.button { 

  font-family: Tahoma, Trebuchet MS, Helvetica, Arial, sans-serif; 
  font-style: normal;  
  font-weight: bold;
  font-size: small;
  letter-spacing: 0.05em;
  text-align: left;
  color: #800000; /*maroon*/
  padding: .5em .7em;
  border: outset #FAAFBE; /*pink;*/ 4px;
  width: 102px;
  background: #ef8861;
  filter:progid:DXImageTransform.Microsoft.Gradient
  (endColorstr='#f8c473', startColorstr='#ef8861', gradientType='0');
}




#navigationbar {
	position: absolute;
	width: 180px;
	height: 660px;
	background-color: #F8D888;
      }



#navigation {
	position: absolute;
	top: 62px;
	left: 29px;
	font-size: smaller;
	line-height: 190%;
	width: 139px;
	padding-top: .4em;
}



a  {font-weight: bold;}

a:link {
  color: #a02820; /*brown*/
  text-decoration: none;
  font-weight: bold;
}
a:visited {
  color: #363636;
  text-decoration: none;
  font-weight: bold;
}
a:hover {
  text-decoration: none;
  color: #ffffff; /*white*/
  background-color: #800000; /*maroon*/
  font-weight: bold;
}
a:active {
  color: #a02820; /*brown*/
  background-color: navy;
  font-weight: bold;
}



	.themenu a:link {
	  color: #800000; /*maroon*/
	  text-decoration: none;
	  font-weight: bold;
	}
	.themenu a:visited {
	  color: #000080; /*navy*/
	  text-decoration: none;
	  font-weight: bold;
	}
	.themenu a:hover      {
	  text-decoration: none;
	  color: #ffffff; /*white text*/
	  background-color: #800000; /*maroon*/
	  font-weight: bold;
	}
	.themenu a:active     {
	  color: #a02820; /*brown background*/
	  background-color: navy;
	  font-weight: bold;
	}


		.yout a:link {
		  color: #800000;
		  text-decoration: none;
		  font-weight: normal;
		}
		.yout a:visited {
		  color: #000080; 
		  text-decoration: none;
		  font-weight: normal;
		}
		.yout a:hover      {
		  text-decoration: none;
		  color: #ffffff; 
		  background-color: #800000; 
		  font-weight: normal;
		}
		.yout a:active     {
		  color: #a02820; 
		  background-color: navy;
		  font-weight: normal;
		}





/*cd clips button in nav*/
.borderpadding {
	padding: 1em;
	border: 4px inset pink
}




#front1 {
  position:relative;
  top:0px;
  left: 0px;
}

img.floatright { 
    float: right; 
    margin: 0 1em 1em 1em;
}

img.floatleft { 
    float: left; 
    margin: 0 2em 1em 0em;
}


/*
This section deals with the position of items on the screen.
*/

#roses, #bodycontent, #markets, #contactpage,
#contact, #flamencoclips, #popularclips, #classicallatinclips, #ragjazzcelticclips, 
#clips, #cd, #youtube, #partyglass,
#thesouthwindpic, #hotstuffpic, #georgiapic,
#repone, #reptwo, #repthree, #insidefooterreper,
#newpicindex, #newweddingpic, #lessontypes, #newlessonpic


{
	position: absolute;
	height: 53px;
}





#roses {
  top: 800px;
  left: 20px;
}

#bodycontent {
	left: 219px;
	width: 76%;
}


#footer {
   position: relative;
   bottom: 0px;
   padding-top: 15px;
   padding-bottom: 5px;
   width: 100%;
   height: 60px;   /* Height of the footer */
   font-style: italic;
   font-size: x-small; 
   font-weight: normal; 
}

#bottomcd {
	position:absolute;
	left:-3px;
	top:840px;
	width:780px;
	height:51px;
	z-index:50;
}

/*middle index*/
#markets {
	top: 85px;
	left: 285px;
	width: 160px;
	height: 221px;
	text-align: center;
}


/*middle top*/
#lessontypes {
	top: 80px;
	left: 218px;
	width: 180px;
	height: 195px;
	text-align: center;
	background-color:#ffffff;
}


/*top right*/
#newpicindex {
	top: 82px;
	left: 474px;
	width: 258px;
	height: 192px;
}


/*top right*/
#newlessonpic {
	top: 82px;
	left: 420px;
	width: 258px;
	height: 195px;
}



/*top right*/
#newweddingpic {
	top: 81px;
	left: 350px;
	
}


#partyglass {
  top: 90px;
  left: 380px;
}


  
#contact /*bottom left of every page*/{
  top: 360px;
  left: 30px;
  width: 110px;
  font-family: Verdana, Trebuchet MS, Helvetica, Arial, sans-serif;
  color: #800000; /*maroon*/
  font-weight: bold;
  font-size: smaller;
  line-height: 140%; 
}


#contactpage {
  top: 110px;
  left: 300px;
  width: 450px;
  text-align: left;
}

.contactpagedetails {
  font-weight: bold;
  font-size: 90%;
  color: #ff0000;} /*red*/


      /*position of buttons*/
#clips {
	top: 20px;
	left: 20px;
	width: 110px;
}

#cd {
	top: 310px;
	left: 20px;
	width: 110px;
}


#youtube {
  top: 551px;
  left: 27px;
  width: 100px;
  height: 45px;
  font-family: Tahoma, Trebuchet MS, Helvetica, Arial, sans-serif; 
  font-style: normal;  
  font-weight: normal;
  font-size: small;
  letter-spacing: 0.05em;
  text-align: center;
  color: #800000; 
  padding-top: 3px;
  background: #ef8861;
  filter:progid:DXImageTransform.Microsoft.Gradient
  (endColorstr='#f8c473', startColorstr='#ef8861', gradientType='0');
}







.cds /*feature*/ {
	width: 250px;
	margin-right: 2em;
	margin-bottom: .5em;
	float: left;
}


    /*Repertoire*/
#repone {
  width: 300px;
  font-size: small;
}

#reptwo {
  float: right;
  left: 375px;
  width: 250px;
  font-size: small;
}
#insidefooterreper {
	left:191px;
	top:1360px;
	width:660px;
	height:66px;
	z-index:10;
}
#footervideos {
	/*position:relative;*/
	left:216px;
	top: /* 2596px; */ 30px;
	width:660px;
	height:13px;
	z-index:1;
}

table {
	font-size: small;
}

th 	{
	background-color: #EFF3F8;
	color: #023a67
}

tr	{
	background-color: #F7F9FC;
	color: #023a67;

}

td	{
	padding-left: 6px;
	height: 25px;
}	

.cdheading {background-color: silver;}
