
/* ==========================================================================
LOGO
========================================================================== */

.app-logo-image {
	background-image: url("/img/prshsmusic/clef_icon_heart.png");
}


.logo-font{
	/* Customise logo font-family here */ 
}

.dark-background {
	background-color: #1e3923
}

/* ==========================================================================
HERO IMAGE
========================================================================== */


.hero {
	min-height: 600px;
	background-color: #444;
	background-image: url('/img/prshsmusic/music_home_banner4.png');
	background-position: center center;
	background-size: cover;
	position: relative;
	}
	
.hero__title {
		font-family: 'Merriweather', serif;
		color: #FFFFFF;
		text-shadow: 1px 1px 0px #000000;
		margin-bottom: 80px;
		display: block;
		}
		
.hero__text {
		color: #FFFFFF;
		font-size: 25px;
		font-weight: 400;
		margin-bottom: 80px; 
		/*text-shadow: 2px 2px 0px #FF0000;*/
		}
		
.hero__quote {
		font-family: 'Merriweather', serif;
		text-align: center;
		color: #C8B45B;
		font-size: 22px;
		font-weight: 300;
		font-style: italic;
		margin-top: 10px;
		}
		
.hero__content {
		padding-top: 80px;
		}

.mdl-layout-quote {
  align-items: center;
  justify-content: center;
  margin-right: 40px;
  margin-left: 40px; 
}
.mdl-layout-feature {
  align-items: center;
  justify-content: center;
  margin-right: 20px;
  margin-left: 20px; 
  margin-top: 10px;
}
.padded-section {
	padding: 40px 0;
	}
	
@media screen and (max-width:480px) {
		.hero {
			min-height: 380px;
		}
		.hero__content {
			padding-top: 60px;
		}

		.hero__text{
			margin-bottom: 10px;
		}


		.hero-small {
			min-height: 120px;
		}
		.hero-small .hero__content {
			padding-top: 20px;
		}

		.padded-section{
			padding: 20px 0;
		}
}
/* ==========================================================================
TEXT & BUTTON COLOURS
========================================================================== */



/* Tezxt selection */ 

::-moz-selection,
::selection {
	/*background-color: rgb(254, 71, 0);*/
	/*color: #fff;*/
}


/* Primary and secondary call to action colours */ 
.primary-text-color{
	/*color: rgb(254, 71, 0);*/
}
.secondary-text-color{
	/*color: rgb(70, 140, 176);*/
}


/* Primary button */ 
.primary-action {
	/*background-color: rgb(254, 71, 0);*/
}

/* Primary button active + hover */ 
.primary-action:active,
.primary-action:hover {
    /*background-color: rgba(254, 71, 0, 0.5) !important;*/
}

/* Secondary button */ 
.secondary-action{
	/*background-color: rgb(254, 71, 0);	*/
}

/* Secondary button active + hover */ 
.secondary-action:active,
.secondary-action:hover{
	/*background-color: rgba(254, 71, 0, 0.5) !important;	*/
}


/* ==========================================================================
HEADER
========================================================================== */

/* Header Tweaks */
.app-header {
	/*background-color: #ddd;*/
	/*color: #1C91FF;*/
}

.app-header a{ }


.app-navigation .mdl-navigation__link:hover {
	/*border-bottom: 4px solid rgb(254, 71, 0);*/
}

.app-link {
		text-decoration: none;
		color: #1e3923 !important;
	}

.app-drawer span.mdl-navigation__link.mdl-navigation__link {
		color: #1e3923;
	}
.app-drawer .mdl-layout-title {
		position: relative;
		background: #1e3923;
		height: 80px;
	}

.app-drawer .app-logo-image {
		position: absolute;
		bottom: 16px;
	}

/* ==========================================================================
FOOTER
========================================================================== */

.app-footer{
	background: #1e3923;
}

/* App footer hover colour */ 
.app-footer a:hover {
	/*color: rgb(254, 71, 0);*/
}
/*
.mdl-mega-footer {
    padding: 16px 40px;
    color: #9e9e9e;
    background-color: #424242;
}
*/

