/*
 * Purpose: main css styles for goodroadmusic.com
 * DATE: 2017-08-31
 * AUTHOR: EJ
 * WEBSITE: iboulderdigital.com
 * EMAIL: ej@iboulderdigital.com
 * 
 *
 *
 *
 * COLOR PALETTE:
 *									#FFFFFF = top nav links and footer contact info
 *									#092431 = index background color
 *									#167A82 = Music letters in goodroad-music-greeting section
 *									#BCAB79 = about background color
 *									#9FC3CB = learn background color
 *									#B7C6D5 = play background color
 *									#E0BFBE = listen background color
 *									#215E57 = content text color
 *									#A7B4C2 = greetings wrapper bottom text
 *
 */





/*
 *
 * default starting point for all elements
 *
 */

*
{
	margin: 0;
	padding: 0;
	border: 0;
}




#index-wrapper
{
	width: 100%;
/*	width: 1090px;*/
	min-width: 1180px;
	height: 100%;
	margin: 0 auto;
	padding: 0;
	border: 0;
}


#wrapper
{
/*	width: 100%;*/
	width: 1090px;
	height: 100%;
	margin: 0 auto;
	padding: 0;
	border: 0;
}


#content-wrapper
{
/*	width: 85%;*/
/*	width: 1090px;*/
	margin: 0 auto;
	padding-top: 60px;
	color: #215E57;
	font-family: 'Ubuntu', sans-serif;
	font-size: 16px;
	letter-spacing: 2px;
	line-height: 20px;
	text-align: justify;
}


figcaption
{
	align: left;
	color: #FFFFFF;
	font-size: 12px;
}







/*
 *
 * link styles
 *
 */

/* unvisited link */
a:link
{
	color: #FFFFFF;
	text-decoration: none;
}

/* visited link */
a:visited
{
	color: #FFFFFF;
	text-decoration: none;
}

/* mouse over link */
a:hover
{
	color: #FFFFFF;
	text-decoration: none;
}

/* selected link */
a:active
{
	color: #FFFFFF;
	text-decoration: none;
}


/* unvisited link */
a.contact-email-link:link
{
  color: #FFFFFF;
  text-decoration: none;
}

/* visited link */
a.contact-email-link:visited
{
  color: #FFFFFF;
  text-decoration: none;
}

/* mouse over link */
a.contact-email-link:hover
{
  color: #FFFFFF;
  text-decoration: underline;
}

/* selected link */
a.contact-email-link:active
{
  color: #FFFFFF;
  text-decoration: none;
}




/*
 *
 * top nav links section
 *
 */
#top-nav-links-wrapper
{
/*	width: 100%;*/
	width: 1090px;
	height: 20px;
	margin: 0 auto;
	padding: 0;
	border: 0;
}



#top-nav-links-wrapper .index-page-top-nav
{
	width: 1090px;
	height: 20px;
	margin: 0 auto;
	padding: 0;
	border: 0;
}




#top-nav-links-content
{
	width: 100%;
	height: 100%;
}


#top-nav-links-content nav
{
/*	padding-top: 4px;*/
/*	padding-left: 20px;*/
	font-family: 'Montserrat', sans-serif;
	font-size: 10px;
	letter-spacing: 6px;
}


#top-nav-links-content nav li
{
	line-height: 20px;
	margin: 0 0 0 100px; /* space between each link */
	list-style: none;
	display: inline;
}


#top-nav-links-content nav li:first-child
{
	line-height: 20px;
	margin: 0 0 0 10px; /* space between each link */
	list-style: none;
	display: inline;
}





/*
 *
 * goodroad-music-banner section
 *
 */
#goodroad-music-banner
{
/*	width: 93%;*/
	width: 1090px;
	padding-top: 40px;
	font-family: 'Questrial', sans-serif;
	letter-spacing: 10px;
	color: #FFFFFF;
	font-size: 20px;
	text-align: right;
}


/*
 *
 * goodroad-music-banner-index-page section
 * using for mobile only
 *
 */
#goodroad-music-banner-mobile
{
	display: none;
	width: 1090px;
	padding-top: 40px;
	font-family: 'Questrial', sans-serif;
	letter-spacing: 10px;
	color: #FFFFFF;
	font-size: 20px;
	text-align: right;
}



/*
 *
 * index page
 *
 */
body.index-page
{
	background-color: #092431;
}


/*
 *
 * goodroad-music-greeting-wrapper section : default settings for grouping:
 * greeting-wrapper-left-half and greeting-wrapper-right-half
 *
 */
#goodroad-music-greeting-wrapper
{
	width: 92%;
	height: 720px;
	padding-left: 100px;

}


/*
 *
 * greeting-wrapper-left-half section : default settings for grouping:
 * greeting-wrapper-top-part and greeting-wrapper-bottom-part
 *
 */
#greeting-wrapper-left-half
{
	float: left;
	width: 600px;
	height: 650px;
/*	background-color: green;*/
}



/*
 *
 * greeting-wrapper-top-part section : default settings for grouping:
 * goodroad-letters and music-letters-image
 *
 */
#greeting-wrapper-top-part
{
	float: left;
	height: 450px;
	width: 600px;
/*	background-color: blue;*/
}


/*
 *
 * goodroad-letters section
 *
 */
#goodroad-letters
{
	float: left;
	width: 275px;
	height: 200px;
	vertical-align:top;
	padding-top: 220px;
	font-family: 'Questrial', sans-serif;
	letter-spacing: 10px;
	color: #FFFFFF;
	font-size: 34px;
/*	background-color: yellow;*/
}


/*
 *
 * goodroad-letters-mobile section
 *
 */
#goodroad-letters-mobile
{
	display: none;
}





/*
 *
 * music-letters-image section
 *
 */
#music-letters-image
{
	float: left;
	width: 301px;
	height: 320px;
	padding-top: 100px;
	padding-left: 10px;
/*	background-color: orange;*/
}



/*
 *
 * music-letters-image section
 *
 */
#music-letters-image-mobile
{
	display: none;
	float: left;
	width: 301px;
	height: 320px;
	padding-top: 100px;
	padding-left: 10px;
/*	background-color: orange;*/
}





/*
 *
 * greeting-wrapper-bottom-part section
 * text
 *
 */
#greeting-wrapper-bottom-part
{
	clear: both;
/*	background-color: purple;*/
}


#greeting-wrapper-bottom-part p
{
	width: 370px;
	padding-top: 20px;
	color: #A7B4C2;
	font-family: 'Questrial', sans-serif;
	letter-spacing: 1px;
	line-height: 20px;
	text-align: justify;
}



/*
 *
 * greeting-wrapper-right-half : default settings for grouping:
 * sarah-image
 *
 */
#greeting-wrapper-right-half
{
	float: right;
	width: 480px;
	height: 700px;
/*	background-color: green;*/
}



/*
 *
 * sarah-image section
 *
 */
#sarah-image
{
	float: right;
	padding-right: 4%;
}

#sarah-image img
{
	width: 457px;
	height: 700px;
	opacity: 0.1;
  filter: alpha(opacity=10); /* For IE8 and earlier */
}





/*
 *
 * about page
 *
 */
body.about-page
{
	background-color: #BCAB79;
}


#about-wrapper
{
	width: 100%;
	height: 600px;
}


/*
 * first column in the about page
 */
#about-image
{
	float: left;
	width: 370px;
	padding-right: 60px;
}


#about-image img
{
 width: 365px;
 height: 400px;
}



#about-image-mobile
{
	display: none;
}



/*
 * second column in the about page
 */
#about-first-text-column
{
	float: left;
	width: 310px;
	padding-right: 40px;
}


/*
 * third column in the about page
 */
#about-second-text-column
{
	float: left;
	width: 310px;
}





/*
 *
 * learn page
 *
 */
body.learn-page
{
	background-color: #9FC3CB;
}


#learn-wrapper
{
	width: 100%;
	height: 1620px;
}


p#learn-paragraphs
{
	padding-bottom: 20px;
}


p#learn-paragraphs.learn-paragraphs-intermediate
{
/*	padding-top: 60px;*/
	padding-bottom: 100px;
}


h3#padding-for-intermediate
{
	padding-top: 60px;
}



#sarah-teaching-private-lessons-image-mobile
{
	display: none;
}


img.sarah-teaching-private-lessons
{
	width: 320px;
	height: 400px;
	padding-bottom: 10px;
	padding-left: 20px;
}


img.sarah-presenting-workshop
{
	width: 400px;
	height: 300px;
	padding-left: 20px;
}



img.sarah-presenting-uke-workshop
{
	width: 400px;
	height: 300px;
	padding-right: 20px;
}



#sarah-presenting-workshop-image-mobile
{
	display: none;
}





/*
 *
 * play page
 *
 */
body.play-page
{
	background-color: #B7C6D5;
}


#play-wrapper
{
	width: 100%;
	height: 800px;
}


#boulder-ukulele-group-part
{
	height: 300px;
}


img.boulder-ukulele-group-outdoors
{
	width: 500px;
	height: 281px;
	padding-right: 20px;
}


#boulder-ukulele-group-outdoors-image-mobile
{
	width: 325px;
	height: 183px;
	display: none;
	margin: 0 auto;
	padding-top: 0.9em;
	padding-bottom: 0.9em;
	border: 0;
}


#boulder-ukulele-group-outdoors-image-mobile img.boulder-ukulele-group-outdoors
{
	width: 325px;
	height: 183px;
	display: none;
	padding: 0;
}


#john-testimonial
{
	color: #FFFFFF;
}



#BUG-at-MT-Studio-part
{
	width: 800px;
	margin: 0 auto;
	padding-top: 30px;
	border: 0;
}


img.BUG-at-MT-Studio
{
	width: 800px;
	height: 321px;
	padding-right: 20px;
}




/*
 *
 * listen page
 *
 */
body.listen-page
{
	background-color: #E0BFBE;
}


#listen-wrapper
{
	width: 100%;
	height: 895px;
}


#listen-description-text
{
	width: 870px;	
	padding-left: 105px;
}


p.listen-right-tab-text
{
	padding-top: 10px;
	padding-left: 260px;
}




#collage-listen-image
{
	width: 880px;
	margin: 0 auto;
	padding-top: 20px;
	border: 0;
}


#collage-listen-image img
{
	width: 872px;
/*	width: 80%;*/
/*	padding-left: 50px;*/
}


#center-listen-image
{
	width: 470px;
	margin: 0 auto;
	padding-top: 40px;
	border: 0;
}


/*
 * Uke Social Club at Chautauqua image
 */
#center-listen-image img
{
	width: 467px;
	height: 350px;
}


#second-line-listen-images
{
	width: 1000px;
	margin: 0 auto;
	padding: 0;
	border: 0;
}


#second-line-first-listen-images
{
	float: left;
	width: 470px;
	margin: 0 auto;
	padding-right: 60px;
	border: 0;
}



/*
 * Uke Social Club playing in Lafayette image
 */
#second-line-first-listen-images img
{
	width: 467px;
	height:350px;
}

#second-line-second-listen-images
{
	float: left;
	width: 470px;
	margin: 0 auto;
	padding: 0;
	border: 0;
}



/*
 * Uke Social Club playing RTD bus line opening
 */
#second-line-second-listen-images img
{
	width: 467px;
	height:350px;
}




/*
 *
 * footer section
 *
 */
#footer
{
	width: 100%;
	height: 20px;
	font-family: 'Montserrat', sans-serif;
	font-size: 12px;
	letter-spacing: 6px;
	text-align: center;
	color: #FFFFFF;
}


#footer li
{
	line-height: 20px;
	margin: 0 0 0 40px; /* space between each link */
	list-style: none;
	display: inline;
}


#footer li:first-child
{
	line-height: 20px;
	margin: 0 0 0 10px; /* space between each link */
	list-style: none;
	display: inline;
}