/* ==================================================== */
/* CSS FOR MUSIC PAGES:*/
/* ==================================================== */

* {
-ms-box-sizing:border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
-o-box-sizing:border-box;
box-sizing:border-box;
}

/* DEFAULT PAGE LINK COLORS:*/
a { text-decoration:none; }
a:link { color:#770000; }
a:visited { color:#90c; }
a:hover { color:#f90; }
a:active { color:#f00; }

body { 
margin:0px;
background-color:#faf4de; 
height:100%;
font-family:'Merriweather', 'Clarendon', serif; 
font-weight:300; 
font-size:18px;
line-height:22px;
}

/* ==================================================== */
/* CONTAINER DIV: */
/* ==================================================== */

#container_div {
border:0px solid green;
position:relative;
width:100%;
min-width:350px;
height:100%;
margin:0px;
-ms-transition-duration:0.4s;
-moz-transition-duration:0.4s;
-webkit-transition-duration:0.4s;
-o-transition-duration:0.4s;
transition-duration:0.4s;
}

/* ==================================================== */
/* IMAGE GRID CONTAINER:*/
/* ==================================================== */

#img_grid_container {
border:0px solid blue;
width:100%;
max-width:1600px;
min-width:350px;
overflow:visible;
text-align:center;
margin:auto;
display:block;
padding-top:100px;
padding-bottom:50px;
}

/* ==================================================== */
/* MUSIC INDEX PAGE ITEMS: */
/* ==================================================== */

#music_index_headline {
border:0px solid DeepPink;
width:100%;
height:30px;
margin-top:50px;
margin-bottom:-8px;
font-family: 'Merriweather', 'Clarendon', serif; 
font-weight: 300; 
font-size: 28px;
line-height:30px;
color:#595959;
text-align:center;
letter-spacing:0px;
  overflow:visible;
  animation-name:contract_big;
  animation-duration:1s;
  animation-delay:1s;
  animation-fill-mode:both;
}

@keyframes contract_big {
0% {opacity:0.0; letter-spacing:35px;}
100% {opacity:1.0; letter-spacing:0px;}
}

@keyframes contract_medium {
0% {opacity:0.0; letter-spacing:22px;}
100% {opacity:1.0; letter-spacing:0px;}
}

@keyframes contract_small {
0% {opacity:0.0; letter-spacing:11px;}
100% {opacity:1.0; letter-spacing:0px;}
}

#music_index_text_block_one {
border:0px solid limegreen;
width:100%;
max-width:1300px;
overflow:visible;
padding-top:0px;
padding-left:0px;
padding-right:0px;
text-align:center;
margin:auto;
}

.music_index_body_text {
font-family: 'Merriweather', 'Clarendon', serif; 
font-weight: 300; 
font-size: 18px;
line-height:22px;
color:#595959;
}

.image_group_square {
width:400px;
background-color:white;
display:inline-block;
margin:10px 10px;
-ms-box-shadow:0px 5px 12px 5px #888888;
-moz-box-shadow:0px 5px 12px 5px #888888;
-webkit-box-shadow:0px 5px 12px 5px #888888;
-o-box-shadow:0px 5px 12px 5px #888888;
box-shadow:0px 5px 12px 5px #888888;
}

.image_box_square {
width:400px;
height:400px;
}

.b1nk_1mg {
width:100%;
height:100%;
z-index:1;
}

.img_thumb_square {
width:400px;
height:400px;
z-index:1;
}

.image_group_horiz {
width:85%;
max-width:600px;
background-color:white;
display:inline-block;
margin:10px 10px;
-ms-box-shadow:0px 5px 12px 5px #888888;
-moz-box-shadow:0px 5px 12px 5px #888888;
-webkit-box-shadow:0px 5px 12px 5px #888888;
-o-box-shadow:0px 5px 12px 5px #888888;
box-shadow:0px 5px 12px 5px #888888;
}

.image_box_horiz {
width:100%;
}

.img_thumb_horiz {
width:100%;
z-index:1;
}

/* ==================================================== */
/* AUDIO PAGES ITEMS: */
/* ==================================================== */

.feature_image_group {
width:600px;
background-color:white;
display:inline-block;
margin:10px 10px;
-ms-box-shadow:0px 5px 12px 5px #888888;
-moz-box-shadow:0px 5px 12px 5px #888888;
-webkit-box-shadow:0px 5px 12px 5px #888888;
-o-box-shadow:0px 5px 12px 5px #888888;
box-shadow:0px 5px 12px 5px #888888;
}

.feature_image_box {
width:600px;
height:600px;
}

.feature_image {
width:100%;
z-index:1;
}

.music_sample_div {
width:260px;
height:140px;
margin:auto;
margin-top:10px;
}

.music_sample_iframe {
top:0px;
width:100%;
}

/* ==================================================== */
/* VIDEO PAGES ITEMS: */
/* ==================================================== */

.feature_video_group {
border:0px solid red;
width:960px;
background-color:white;
display:inline-block;
margin-top:10px;
-ms-box-shadow:0px 5px 12px 5px #888888;
-moz-box-shadow:0px 5px 12px 5px #888888;
-webkit-box-shadow:0px 5px 12px 5px #888888;
-o-box-shadow:0px 5px 12px 5px #888888;
box-shadow:0px 5px 12px 5px #888888;
}

.feature_video_box {
width:960px;
height:564px;
}

.feature_video_iframe {
width:960px;
height:564px;
z-index:1;
}

/* ==================================================== */
/* TOP BANNER:*/
/* ==================================================== */

#top_banner {
position:fixed; 
text-align:center;
left:0px;
top:0px;
width:100%;
min-width:350px;
height:80px;
    
background-color: #1b4a26;
background: -ms-linear-gradient(#002200, #1b4a26, #002200);
background: -webkit-linear-gradient(#002200, #1b4a26, #002200);
background: -o-linear-gradient(#002200, #1b4a26, #002200);
background: -moz-linear-gradient(#002200, #1b4a26, #002200);
background: linear-gradient(#002200, #1b4a26, #002200); 
    
-ms-box-shadow:0px 5px 5px rgba(0, 0, 0, 0.5);
-moz-box-shadow:0px 5px 5px rgba(0, 0, 0, 0.5);
-webkit-box-shadow:0px 5px 5px rgba(0, 0, 0, 0.5);
-o-box-shadow:0px 5px 5px rgba(0, 0, 0, 0.5);
box-shadow:-0px 5px 5px rgba(0, 0, 0, 0.5);
z-index:100;
display:block;
}

#dg_logo {
width:80px;
padding-top:12.5px;
padding-bottom:5px;
margin-right:5px;
}

#dg_name {
width:375px;
padding-bottom:13px;
}

#up_down_arrow {
position:fixed;
left:25px;
top:28px;
width:80px;
cursor:pointer;
z-index:205;
}

/* ==================================================== */
/* TOP LINKS PANEL:*/
/* ==================================================== */

#top_links_panel { 
position:fixed;
left:0px;
top:80px;
height:34px;
width:100%;
min-width:350px;
background-color:#af7804;
padding-top:4px;

text-align:center;
font-family:'Open Sans', 'Verdana Bold', sans-serif;
font-weight:600; 
font-size:18px;
line-height:26px;
color:#ffffff;

-ms-box-shadow:0px 15px 15px rgba(0, 0, 0, 0.7);
-moz-box-shadow:0px 15px 15px rgba(0, 0, 0, 0.7);
-webkit-box-shadow:0px 15px 15px rgba(0, 0, 0, 0.7);
-o-box-shadow:0px 15px 15px rgba(0, 0, 0, 0.7);
box-shadow:-0px 15px 15px rgba(0, 0, 0, 0.7);
-ms-transition-duration:0.4s;
-moz-transition-duration:0.4s;
-webkit-transition-duration:0.4s;
-o-transition-duration:0.4s;
transition-duration:0.4s;
display:block;
z-index:90;
}

a.top_links_colors:link { color:#ffff00; }
a.top_links_colors:visited { color:#ffcc00; }
a.top_links_colors:hover { color:#ffffff; }
a.top_links_colors:active { color:#ffff00; }


/* ==================================================== */
/* TEXT ITEMS: */
/* ==================================================== */

.chord_chart_text_block {
width:85%;
max-width:825px;
overflow:visible;
padding-top:10px;
text-align:left;
margin:auto;
}

#text_block_two {
width:600px;
overflow:hidden;
left:0px;
padding-top:0px;
text-align:center;
margin:auto;
padding-left:30px;
padding-right:30px;
}

#music_image_text_block_one {
width:600px;
overflow:visible;
padding-top:10px;
text-align:center;
margin:auto;
}

#video_text_block_one {
border:0px solid maroon;
width:960px;
overflow:visible;
padding-top:10px;
text-align:center;
margin:auto;
}

.image_info {
padding-left:15px;
padding-right:15px;
}

#footer_links_container {
border:0px solid red;
display:block;
width:100%;
min-width:350px;
overflow:hidden;
left:0px;
top:0px;
text-align:center;
margin-top:0px;
padding-top:30px;
padding-bottom:0px;
background-color:#e3ad6a;
}

.footer_links {
display:block;
text-align:center;
padding-left:0px;
padding-right:0px;
font-size:18px;
line-height:38px;
}

.copyright_text {
display:block;
text-align:center;
padding-left:0px;
padding-right:0px;
font-size:16px;
line-height:30px;
}

/* flc = footer link colors */
a.flc:link { text-decoration:none; color:#a00000; }
a.flc:visited { text-decoration:none; color:#bf00a0; }
a.flc:hover { text-decoration:none; color:#ffffff; }
a.flc:active { text-decoration:none; color:#ffff00; }

.subhead_text {
font-family:'Merriweather', 'Clarendon', serif; 
font-weight:300; 
font-size:28px;
line-height:48px;
color:#595959;
text-align:left;
}

.music_headline {
font-family:'Merriweather', 'Clarendon', serif; 
font-weight:300; 
font-size:28px;
line-height:38px;
margin-bottom:0px;
color:#595959;
text-align:center;
}

/* This is used on the music feature pages */
.music_body_text {
font-family:'Raleway', Arial, Verdana, sans-serif; 
font-weight:400; 
font-size:18px;
line-height:28px;
margin-top:0px;
color:#595959;
text-align:left;
}

/* This is used on the music feature pages */
.music_body_text_small {
font-family:'Merriweather', 'Clarendon', serif; 
font-weight:300; 
font-size:15px;
line-height:22px;
color:#595959;
}

.music_body_text_bold {
font-weight:400;
color:black;
}

/* This is used on the chord finder chart page */
.buy_button {
background-color:#77AA00;
border:none;
-ms-border-radius:8px;
-moz-border-radius:8px;
-webkit-border-radius:8px;
-o-border-radius:8px;
border-radius:8px;
color:white;
padding:7px 20px;
text-align:center;
text-decoration:none;
display:inline-block;
font-family:'Merriweather', 'Clarendon', serif; 
font-weight:400; 
font-size:16px;
margin:4px 2px;
-ms-transition-duration:0.4s;
-moz-transition-duration:0.4s;
-webkit-transition-duration:0.4s;
-o-transition-duration:0.4s;
transition-duration:0.4s;
cursor:pointer;
}

.buy_button:hover {
    background-color:#99CC00;
}

/* ==================================================== */
/* FEEDBACK WINDOW:*/
/* ==================================================== */

#feedback_window {
position:fixed;
display:none; /* Hidden by default */
width:50%;
height:50%;
top:25%;
left:25%;
text-align:center;
padding:20px 20px;
background-color:rgba(255,255,0,0.9); /* Black background with opacity */
z-index:50; /* Specify a stack order */
cursor:pointer; /* Add a pointer on hover */
}

/* ==================================================== */
/* MEDIA QUERIES:*/
/* ==================================================== */

@media screen and (max-width:1500px)
{
	#video_text_block_one { width:960px; }
	.feature_video_group { width:960px; }
	.feature_video_box { width:960px; height:564px; }
	.feature_video_iframe { width:960px; height:564px; }
}

@media screen and (max-width:1100px)
{
	#top_banner { height:80px; }
	#dg_name { width:375px; }
	#dg_logo { width:80px; }
	#up_down_arrow { top:28px; }
	#video_text_block_one { width:800px; }
	.feature_video_group { width:800px; }
	.feature_video_box { width:800px; height:450px; }
	.feature_video_iframe { width:800px; height:450px; }
}

@media screen and (max-width:900px)
{
	#top_banner { height:65px; }
	#dg_name { width:325px; padding-top:16px; }
	#dg_logo { width:65px; padding-top:0px; padding-bottom:9px; }
	#up_down_arrow { top:22px; width:75px; }
	#top_links_panel { top:65px; }
	.subhead_text { font-size:26px; line-height:48px; }
	.music_body_text { font-size:16px; line-height:26px; }
	#video_text_block_one { width:700px; }
	.feature_video_group { width:700px; }
	.feature_video_box { width:700px; height:394px; }
	.feature_video_iframe { width:700px; height:394px; }
}

@media screen and (max-width:844px)
{
	#music_index_text_block_one { width:400px; }
}

@media screen and (max-width:800px)
{
	#up_down_arrow { top:22px; width:70px; }
	#video_text_block_one { width:700px; }
	.feature_video_group { width:700px; }
	.feature_video_box { width:700px; height:394px; }
	.feature_video_iframe { width:700px; height:394px; }
}

@media screen and (max-width:790px)
{
	#video_text_block_one { width:600px; }
	.feature_video_group { width:600px; }
	.feature_video_box { width:600px; height:338px; }
	.feature_video_iframe { width:600px; height:338px; }
}

@media screen and (max-width:750px)
{
	#footer_links_container { padding-left:28%; padding-right:28%; }
	#copyright_line { text-align:left; }
	.big_image_group_horiz { width:550px; }
	#text_block_two { width:550px; }
	
	#music_image_text_block_one { width:580px; }
	.feature_image_group { width:580px; }
	.feature_image_box { width:580px; height:580px; }	
}

@media screen and (max-width:700px)
{
	#dg_logo { width:62px; padding-top:0px; padding-bottom:9px; margin-left:30px; }
}

@media screen and (max-width:670px)
{
	#music_index_headline { animation-name:contract_medium; }
}

@media screen and (max-width:650px)
{
	#footer_links_container { padding-left:25%; padding-right:25%; }
	.big_image_group_horiz { width:525px; }
	
	#music_image_text_block_one { width:510px; }
	.feature_image_group { width:510px; }
	.feature_image_box { width:510px; height:510px; }
	
	#video_text_block_one { width:560px; }
	.feature_video_group { width:560px; }
	.feature_video_box { width:560px; height:315px; }
	.feature_video_iframe { width:560px; height:315px; }
}

@media screen and (max-width:625px)
{
	#dg_name { width:300px; padding-top:18px; }
	#dg_logo { width:60px; padding-top:0px; padding-bottom:9px; margin-left:50px; }
}

@media screen and (max-width:600px)
{
	.subhead_text { font-size:22px; line-height:38px; }
	#footer_links_container { padding-left:22%; padding-right:22%; }
	.big_image_group_horiz { width:500px; }
	.music_headline { font-size:22px; line-height:30px; }
	
	#music_image_text_block_one { width:500px; }
	.feature_image_group { width:500px; }
	.feature_image_box { width:500px; height:500px; }
	
	#video_text_block_one { width:510px; }
	.feature_video_group { width:510px; }
	.feature_video_box { width:510px; height:287px; }
	.feature_video_iframe { width:510px; height:287px; }
}

@media screen and (max-width:550px)
{
	#dg_name { width:275px; padding-top:18px; }
	#dg_logo { width:57px; padding-bottom:8px; margin-left:60px; }
	#footer_links_container { padding-left:20%; padding-right:20%; }
	.big_image_group_horiz { width:450px; }
	
	#music_image_text_block_one { width:400px; }
	.feature_image_group { width:400px; }
	.feature_image_box { width:400px; height:400px; }
	
	#video_text_block_one { width:440px; }
	.feature_video_group { width:440px; }
	.feature_video_box { width:440px; height:248px; }
	.feature_video_iframe { width:440px; height:248px; }
}

@media screen and (max-width:525px)
{
	#top_links_panel { height:62px; }
	#dg_logo { padding-bottom:8px; margin-left:80px; }
}

@media screen and (max-width:500px)
{
	#dg_name { width:270px; padding-top:20px; }
	#dg_logo { margin-left:90px; }
	#footer_links_container { padding-left:17%; padding-right:17%; }
	.big_image_group_horiz { width:375px; }
	
	#music_image_text_block_one { width:400px; }
	.feature_image_group { width:400px; }
	.feature_image_box { width:400px; height:400px; }
	
	#video_text_block_one { width:410px; }
	.feature_video_group { width:410px; }
	.feature_video_box { width:410px; height:231px; }
	.feature_video_iframe { width:410px; height:231px; }

	#music_index_headline { animation-name:contract_small; }
}

@media screen and (max-width:480px)
{
	#dg_name { width:270px; margin-left:80px; }
	#dg_logo { display:none;; }
}

@media screen and (max-width:450px)
{
	#dg_name { width:270px; padding-top:20px; margin-left:85px; }
	.subhead_text { font-size:22px; line-height:38px; }
	.music_body_text { font-size:16px; line-height:26px; }
	.image_group_square { width:350px; }
	.image_box_square { width:350px; height:350px; }
	.img_thumb_square { width:350px; height:350px; }
	#footer_links_container { padding-left:15%; padding-right:15%; }
	
	#music_image_text_block_one { width:360px; }
	.feature_image_group { width:360px; }
	.feature_image_box { width:360px; height:360px; }
	
	#video_text_block_one { width:350px; }
	.feature_video_group { width:350px; }
	.feature_video_box { width:350px; height:197px; }
	.feature_video_iframe { width:350px; height:197px; }

	#music_index_text_block_one { width:78%; }
}

@media screen and (max-width:400px)
{
	#up_down_arrow { width:60px; top:24px; left:16px; }
	#dg_name { width:250px; padding-top:20px; margin-left:80px; }
	.image_group_square { width:300px; }
	.image_box_square { width:300px; height:300px; }
	.img_thumb_square { width:300px; height:300px; }
	#footer_links_container { padding-left:10%; padding-right:10%; }
	
	#music_image_text_block_one { width:300px; }
	.feature_image_group { width:300px; }
	.feature_image_box { width:300px; height:300px; }
	
	#video_text_block_one { width:330px; }
	.feature_video_group { width:330px; }
	.feature_video_box { width:330px; height:186px; }
	.feature_video_iframe { width:330px; height:186px; }
}

@media screen and (max-width:360px)
{
	#up_down_arrow { top:24px; width:55px; left:16px; }
	#dg_name { width:225px; padding-top:22px; margin-left:70px; }
	.image_group_square { width:260px; }
	.image_box_square { width:260px; height:260px; }
	.img_thumb_square { width:260px; height:260px; }
	.music_headline { font-size:20px; line-height:28px; }
	#footer_links_container { padding-left:6%; padding-right:6%; }
	
	#music_image_text_block_one { width:260px; }
	.feature_image_group { width:260px; }
	.feature_image_box { width:260px; height:260px; }
	.music_sample_div { width:220px; }	
	
	#video_text_block_one { width:300px; }
	.feature_video_group { width:300px; }
	.feature_video_box { width:300px; height:169px; }
	.feature_video_iframe { width:300px; height:169px; }
}

@media screen and (max-width:350px)
{
	#music_index_headline { animation-name:none; }
}