<style type="text/css">

.dummyCSS{

}
/************************************************* NORMAL **********************************************/
  .ccjmusic-footer{
	  width: 100%;
	  text-align: center;
	  padding-top: 20px;
	  margin-left: auto;
	  margin-right: auto;
	  color: #cccccc;
  } 
  
  .ccjmusic-center-content{
	  width: 510px;
	  margin-left: auto !important;
	  margin-right: auto !important;
	  padding: 5px;
	  background-color: #000000;
  }
  
   .ccjmusic-center-home{
	  width: 810px;
	  margin-left: auto !important;
	  margin-right: auto !important;
	  padding: 5px;
	  background-color: #000000;
  }
  
  .ccjmusic-center-video{
	  width: 1280px;
	  margin-left: auto !important;
	  margin-right: auto !important;
  }
  
  .ccjmusic-cd-art{
	  width: 600px;
	  height: 600px;
  }
  
   .ccjmusic-home-art{
	  width: 800px;
	  height: 400px;	
  }
  
  .ccjmusic-carousel{
	 width: 500px;
	 height: 500px;
	 margin-left: auto !important;
	 margin-right: auto !important;	 
  }
  
  .moveDots{
	position: absolute;
	top: 520px !important;
   }
  
  .ccjmusic-background{
	  padding-top: 65px;
	  background-color: #222222;
	  background-image: url(http://www.ccjmusic.com/images/CCJmusicBG.jpg) !important;	  
  }
  
  .ccjmusic-content-bg{
	  background-color: #222222;
  }
  
  .ccjmusic-navbar{
	  background-color: #000000 !important;
	  color: #cccccc !important;
  }
  
  .ccjmusic-navbar > ul{
	  background-color: #000000 !important;
	  color: #cccccc !important;
  }
  
  .ccjmusic-navbar > ul:hover{
	  color: #ffffff !important;
  }
  
  .ccjmusic-video{
	 width: 1280px;
	 height: 720px;
	 margin-left: auto !important;
	 margin-right: auto !important;	 
  }
  
	div#mp3_player{ width:500px; height:40px; background:#000000; padding:0px; margin 5px auto; }
	div#mp3_player > div > audio{  width:500px; background:#000000; float:left;}
	div#mp3_player > canvas{ width:500px; height:130px; background:#000000; float:left; }

.body-color{
	background-color: #000000;
}

.pageTitle{
	width:500px;
	padding: 5px;
	font-size: 26px;
	font-weight: bold;
	font-style: italic;
	color: #ffffff;
}

.trackTitle{
	width:500px;
	padding: 5px;
	font-size: 24px;
	font-weight: bold;
	font-style: italic;
	background-color: #000000;
	color: #ffffff;
	margin-left: auto;
	margin-right: auto;
}

.videoTitle{
	width:1280px;
	position:relative;
	top:-5px;
	padding: 5px;
	font-size: 24px;
	font-weight: bold;
	font-style: italic;
	background-color: #000000;
	color: #ffffff;
	margin-left: auto;
	margin-right: auto;
}

.artwork{
	width:500px;
	height:500px;
	margin-left: auto;
	margin-right: auto;
}

.home-content-panel{
	 width: 760px;
	 padding: 10px;
	 //background-color: #000000;
	 color: #ffffff;
	 font-size: 16px;
	 margin-left: auto !important;
	 margin-right: auto !important;
	 position: relative;
	 top: 0px;
}

.home-content-header{
	font-size: 20px;
	font-weight: bold;
}

.text-content-panel{
	 width: 760px;
	 padding: 10px;
	 color: #ffffff;
	 font-size: 16px;
	 margin-left: auto !important;
	 margin-right: auto !important;
	 position: relative;
}

.text-content-subtext{
	 width: 760px;
	 padding: 10px;
	 color: #ffffff;
	 font-size: 12px;
	 margin-left: auto !important;
	 margin-right: auto !important;
	 position: relative;
}

.album-links{
	color: #ffffff;
	font-size: 16px;
}

.buy{
	color: #ffffff !important;
	font-size: 16px;
	//background-color: #1D7C70;
	background-color: #366080;
}

.ccjmusic-nowplaying{
	color:#366080;
	font-size: 16px;
	font-style: italic;
	text-align: center;
	margin-left: auto !important;
	margin-right: auto !important;
	//display: block;
	
}

.ccjmusic-note{
	color:#366080;
	font-size: 12px;
	font-style: italic;
	text-align: center;
	margin-left: auto !important;
	margin-right: auto !important;
}

.nextSample{
	color:#366080;
	font-size: 12px;
	font-style: italic;
	text-align: center;
	text-decoration: none;
	margin-left: auto !important;
	margin-right: auto !important;
}

/************************************************* 320 WIDE **********************************************/
@media (device-width: 320px) {
  .ccjmusic-center-content{
	  width: 310px;
	  margin-left: auto !important;
	  margin-right: auto !important;
  }
  
  .ccjmusic-center-home{
	  width: 310px;
	  margin-left: auto !important;
	  margin-right: auto !important;
	  padding: 5px;
	  background-color: #000000;
  }
  
   .ccjmusic-home-art{
	  width: 300px;
	  height: 150px;
	  margin-left: auto !important;
	  margin-right: auto !important;	
  }

  .ccjmusic-center-video{
	  width: 320px;
	  margin-left: auto !important;
	  margin-right: auto !important;
  }
  
  .ccjmusic-cd-art{
	  width: 300px;
	  height: 300px;
  }
  
  .ccjmusic-carousel{
	 width: 300px;
	 height: 300px;
	 margin-left: auto !important;
	 margin-right: auto !important;	 
  }
  
  .moveDots{
	position: absolute;
	top: 320px !important;
   }
   
	.pageTitle{
		width:300px;
		padding: 5px;
		font-size: 18px;
		font-weight: bold;
		font-style: italic;
		color: #ffffff;
		margin-left: auto;
		margin-right: auto;
	}  
	
   .trackTitle{
	   width:300px;
		padding: 5px;
		font-size: 16px;
		font-weight: bold;
		font-style: italic;
		background-color: #000000;
		color: #ffffff;
		margin-left: auto;
		margin-right: auto;
	}
   .artwork{
	width:300px;
	height:300px;
	margin-left: auto;
	margin-right: auto;
	}
	
	.ccjmusic-video{
		 width: 320px;
		 height: 180px;
		 margin-left: auto !important;
		 margin-right: auto !important;	 
	}
	
	.videoTitle{
		width:320px;
		position:relative;
		top:-5px;
		padding: 5px;
		font-size: 16px;
		font-weight: bold;
		font-style: italic;
		background-color: #000000;
		color: #ffffff;
		margin-left: auto;
		margin-right: auto;
	}

	div#mp3_player{ width:300px; height:30px; background:#000000; padding:0px; margin 0px auto; }
	div#mp3_player > div > audio{  width:300px; background:#000000; float:left;  }
	div#mp3_player > canvas{ width:300px; height:10px; background:#000000; float:left; }	

	.home-content-panel{
		 width: 300px;
		 padding: 10px;
		 //background-color: #000000;
		 color: #ffffff;
		 font-size: 12px;
		 margin-left: auto !important;
		 margin-right: auto !important;
		 position: relative;
		 top: 50px;
	}

	.home-content-header{
		font-size: 16px;
		font-weight: bold;
	}

	.text-content-panel{
		 width: 300px;
		 padding: 10px;
		 color: #ffffff;
		 font-size: 12px;
		 margin-left: auto !important;
		 margin-right: auto !important;
		 position: relative;
	}

	.ccjmusic-nowplaying{
		color:#366080;
		font-size: 16px;
		font-style: italic;
		text-align: center;
		margin-left: auto !important;
		margin-right: auto !important;
		//display: none;
		
	}	
	
}

/************************************************* 480 WIDE **********************************************/
@media (device-min-width: 480px) {
  .ccjmusic-center-content{
	  width: 310px;
	  margin-left: auto !important;
	  margin-right: auto !important;
  }
  
  .ccjmusic-center-home{
	  width: 310px;
	  margin-left: auto !important;
	  margin-right: auto !important;
	  padding: 5px;
	  background-color: #000000;
  }
  
   .ccjmusic-home-art{
	  width: 300px;
	  height: 150px;
	  margin-left: auto !important;
	  margin-right: auto !important;	
  }

   .ccjmusic-center-video{
	  width: 320px;
	  margin-left: auto !important;
	  margin-right: auto !important;
  } 

  .ccjmusic-cd-art{
	  width: 300px;
	  height: 300px;
  }

  

  .ccjmusic-carousel{
	 width: 300px;
	 height: 300px;
	 margin-left: auto !important;
	 margin-right: auto !important;	 
  }

  

  .moveDots{
	position: absolute;
	top: 320px !important;
   }

 	.pageTitle{
		width:300px;
		padding: 5px;
		font-size: 18px;
		font-weight: bold;
		font-style: italic;
		color: #ffffff;
		margin-left: auto;
		margin-right: auto;
	}   

   .trackTitle{
	   width:300px;
		padding: 5px;
		font-size: 16px;
		font-weight: bold;
		font-style: italic;
		background-color: #000000;
		color: #ffffff;
		margin-left: auto;
		margin-right: auto;
	}

   .artwork{
	width:300px;
	height:300px;
	margin-left: auto;
	margin-right: auto;
	}

	.ccjmusic-video{
		 width: 320px;
		 height: 180px;
		 margin-left: auto !important;
		 margin-right: auto !important;	 
	}
	
	.videoTitle{
		width:320px;
		position:relative;
		top:-5px;
		padding: 5px;
		font-size: 16px;
		font-weight: bold;
		font-style: italic;
		background-color: #000000;
		color: #ffffff;
		margin-left: auto;
		margin-right: auto;
	}

	div#mp3_player{ width:300px; height:30px; background:#000000; padding:0px; margin 0px auto; }
	div#mp3_player > div > audio{  width:300px; background:#000000; float:left;  }
	div#mp3_player > canvas{ width:300px; height:10px; background:#000000; float:left; }	



	.home-content-panel{
		 width: 300px;
		 padding: 10px;
		 //background-color: #000000;
		 color: #ffffff;
		 font-size: 12px;
		 margin-left: auto !important;
		 margin-right: auto !important;
		 position: relative;
		 top: 50px;
	}



	.home-content-header{
		font-size: 16px;
		font-weight: bold;
	}

	.text-content-panel{
		 width: 300px;
		 padding: 10px;
		 color: #ffffff;
		 font-size: 12px;
		 margin-left: auto !important;
		 margin-right: auto !important;
		 position: relative;
	}

	.ccjmusic-nowplaying{
		color:#366080;
		font-size: 16px;
		font-style: italic;
		text-align: center;
		margin-left: auto !important;
		margin-right: auto !important;
		//display: none;
		
	}	
	
}



/************************************************* 640 WIDE **********************************************/
@media (device-min-width: 640px) {
  .ccjmusic-center-content{
	  width: 410px;
	  margin-left: auto !important;
	  margin-right: auto !important;
  }
  
  .ccjmusic-center-home{
	  width: 410px;
	  margin-left: auto !important;
	  margin-right: auto !important;
	  padding: 5px;
	  background-color: #000000;
  }
  
   .ccjmusic-home-art{
	  width: 400px;
	  height: 200px;
	  margin-left: auto !important;
	  margin-right: auto !important;	
  }

   .ccjmusic-center-video{
	  width: 480px;
	  margin-left: auto !important;
	  margin-right: auto !important;
  } 

  .ccjmusic-cd-art{
	  width: 400px;
	  height: 400px;
  }

  

  .ccjmusic-carousel{
	 width: 400px;
	 height: 400px;
	 margin-left: auto !important;
	 margin-right: auto !important;	 
  }

  

  .moveDots{
	position: absolute;
	top: 420px !important;
   }

	.pageTitle{
		width:400px;
		padding: 5px;
		font-size: 20px;
		font-weight: bold;
		font-style: italic;
		color: #ffffff;
		margin-left: auto;
		margin-right: auto;
	}    

   .trackTitle{
	   width:400px;
		padding: 5px;
		font-size: 18px;
		font-weight: bold;
		font-style: italic;
		background-color: #000000;
		color: #ffffff;
		margin-left: auto;
		margin-right: auto;
	}

   .artwork{
	width:400px;
	height:400px;
	margin-left: auto;
	margin-right: auto;
	}

	.ccjmusic-video{
		 width: 480px;
		 height: 270px;
		 margin-left: auto !important;
		 margin-right: auto !important;	 
	}
	
	.videoTitle{
		width:480px;
		position:relative;
		top:-5px;
		padding: 5px;
		font-size: 16px;
		font-weight: bold;
		font-style: italic;
		background-color: #000000;
		color: #ffffff;
		margin-left: auto;
		margin-right: auto;
	}

	div#mp3_player{ width:400px; height:30px; background:#000000; padding:0px; margin 0px auto; }
	div#mp3_player > div > audio{  width:400px; background:#000000; float:left;  }
	div#mp3_player > canvas{ width:400px; height:10px; background:#000000; float:left; }	



	.home-content-panel{
		 width: 400px;
		 padding: 10px;
		 //background-color: #000000;
		 color: #ffffff;
		 font-size: 12px;
		 margin-left: auto !important;
		 margin-right: auto !important;
		 position: relative;
		 top: 50px;
	}



	.home-content-header{
		font-size: 16px;
		font-weight: bold;
	}

	.text-content-panel{
		 width: 400px;
		 padding: 10px;
		 color: #ffffff;
		 font-size: 12px;
		 margin-left: auto !important;
		 margin-right: auto !important;
		 position: relative;
	}

	.ccjmusic-nowplaying{
		color:#366080;
		font-size: 16px;
		font-style: italic;
		text-align: center;
		margin-left: auto !important;
		margin-right: auto !important;
		//display: none;
		
	}	
}



/************************************************* 768 WIDE **********************************************/
@media (device-min-width: 768px) {
  .ccjmusic-center-content{
	  width: 410px;
	  margin-left: auto !important;
	  margin-right: auto !important;
  }
  
  .ccjmusic-center-home{
	  width: 410px;
	  margin-left: auto !important;
	  margin-right: auto !important;
	  padding: 5px;
	  background-color: #000000;
  }
  
   .ccjmusic-home-art{
	  width: 400px;
	  height: 200px;
	  margin-left: auto !important;
	  margin-right: auto !important;	
  }

   .ccjmusic-center-video{
	  width: 480px;
	  margin-left: auto !important;
	  margin-right: auto !important;
  } 

  .ccjmusic-cd-art{
	  width: 400px;
	  height: 400px;
  }

  

  .ccjmusic-carousel{
	 width: 400px;
	 height: 400px;
	 margin-left: auto !important;
	 margin-right: auto !important;	 
  }

  

  .moveDots{
	position: absolute;
	top: 420px !important;
   }

	.pageTitle{
		width:400px;
		padding: 5px;
		font-size: 22px;
		font-weight: bold;
		font-style: italic;
		color: #ffffff;
		margin-left: auto;
		margin-right: auto;
	}    

   .trackTitle{
	   width:400px;
		padding: 5px;
		font-size: 20px;
		font-weight: bold;
		font-style: italic;
		background-color: #000000;
		color: #ffffff;
		margin-left: auto;
		margin-right: auto;
	}

   .artwork{
	width:400px;
	height:400px;
	margin-left: auto;
	margin-right: auto;
	}

	.ccjmusic-video{
		 width: 480px;
		 height: 270px;
		 margin-left: auto !important;
		 margin-right: auto !important;	 
	}
	
	.videoTitle{
		width:480px;
		position:relative;
		top:-5px;
		padding: 5px;
		font-size: 16px;
		font-weight: bold;
		font-style: italic;
		background-color: #000000;
		color: #ffffff;
		margin-left: auto;
		margin-right: auto;
	}

	div#mp3_player{ width:400px; height:30px; background:#000000; padding:0px; margin 0px auto; }
	div#mp3_player > div > audio{  width:400px; background:#000000; float:left;  }
	div#mp3_player > canvas{ width:400px; height:10px; background:#000000; float:left; }	



	.home-content-panel{
		 width: 400px;
		 padding: 10px;
		 //background-color: #000000;
		 color: #ffffff;
		 font-size: 12px;
		 margin-left: auto !important;
		 margin-right: auto !important;
		 position: relative;
		 top: 50px;
	}



	.home-content-header{
		font-size: 16px;
		font-weight: bold;
	}

	.text-content-panel{
		 width: 400px;
		 padding: 10px;
		 color: #ffffff;
		 font-size: 12px;
		 margin-left: auto !important;
		 margin-right: auto !important;
		 position: relative;
	}	
}














/************************************************* 1244 WIDE **********************************************/
@media only screen and (min-width : 1244px) {
    /* Make Navigation Toggle on Desktop Hover */
    .dropdown-menu:hover .dropdown-submenu {
        display: block;
    }
}



/************************************************* NavBar **********************************************/
.navbarBG {
	background-color: #ffffff !important;
	border-color: #3f3de9 !important;
	border-bottom-width: 5px !important;
}

a {
    color: #990000;	text-decoration: none;
}

a:hover {
    text-decoration: underline;
	color: #ffffff !important;
	background-color: #333333 !important;
}

a:active {
    text-decoration: underline;
	color: #ffffff !important;
	background-color: #666666 !important;
}

a:focus {
    text-decoration: underline;
	color: #ffffff !important;
	background-color: #666666 !important;
}

.navbar-inverse {
	background-color:#888888;
	/*border-color: none;*//*#e7e7e7;*/  /*border: none;*/
}

.navbar-inverse .navbar-nav > li > a {
    color: #CCC;
}

.navbar-inverse .navbar-nav > .active > a,.navbar-inverse .navbar-nav > .active > a:hover,.navbar-inverse .navbar-nav > .active > a:focus {
	color: #cc00cc;
	background-color:#449944 !important;
}

.navbar-inverse .navbar-nav > a:focus{
	background-color: #444444 !important;
	opacity: 1 !important;
}

.navbar-inverse .navbar-toggle .icon-bar {
	background-color: #4444ff !important;
}

.navBarSelected{
	background-color: #667484 !important;
}

.dropDowns{
	background-color: #4444ff !important;
	color: #cccccc !important;
	font-weight: normal;
	height: 30px;
}

.dropdown.hilite{
	background-color: #444444 !important;
}

.navbar-default > ul > li{
	background-color: #666666 !important;
}

/* dropdown menu css */
.dropdown-menu{
	background-color: #183040 !important;
}

.dropdown-menu > li{
	background-color: #183040 !important;
	color: #cccccc !important;
}

.dropdown-menu > li:hover{
	background-color: #333333 !important;
	color: #ffffff !important;
}

.dropdown-menu > li > a{
	background-color: #183040 !important;
	color: #cccccc !important;
}

.dropdown-menu > li > a:hover{
	background-color: #333333 !important;
	color: #ffffff !important;
}

.dropdown-submenu{
	background-color: #00ff00 !important;
	color: #cccccc !important;
}



.dropdown-submenu {
    position: relative;
}

.dropdown-submenu>.dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px;
    border-radius: 0 6px 6px 6px;
}

.dropdown-submenu:hover>.dropdown-menu {
    display: block;
}

.dropdown-submenu>a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #ccc;
    margin-top: 5px;
    margin-right: -10px;
}

.dropdown-submenu:hover>a:after {
    border-left-color: #fff;
}

.dropdown-submenu.pull-left {
    float: none;
}

.dropdown-submenu.pull-left>.dropdown-menu {
    left: -100%;
    margin-left: 10px;
    -webkit-border-radius: 6px 0 6px 6px;
    -moz-border-radius: 6px 0 6px 6px;
    border-radius: 6px 0 6px 6px;
}

</style>