/* RESET STYLES
---------------------------------------------------------------- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
	}

/* HTML5 display-role reset for older browsers */

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { display: block; }

body { line-height: 1; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }

table { border-collapse: collapse; border-spacing: 0; }


/* GLOBAL TEXT SIZING
--------------------------------------------------------- */

@media all {html {font-size: 19px;}}
@media all and (max-width:840px){html {font-size: 17px;}}
@media all and (max-width:800px){html {font-size: 16px;}}
@media all and (max-width:760px){html {font-size: 15px;}}
@media all and (max-width:720px){html {font-size: 15px;}}
@media all and (max-width:680px){html {font-size: 15px;}}
@media all and (max-width:640px){html {font-size: 15px;}}
@media all and (max-width:600px){html {font-size: 14px;}}


body { font-family: 'Roboto', sans-serif; color: rgb(34,34,34); background-color: rgba(0,0,0,0.1); 
	
	
background-color: rgba(150,170,186,0.35);	
background-color: rgba(118,154,174,0.5);
background-color: rgba(71,118,153,0.25);

	
}

.banner, header, nav, main, footer { float: left; width: 100%; }

footer { border-top: 2px solid rgba(0,0,0,0.1); padding: 2rem 0 2rem 0;}

a { text-decoration: none; color: rgba(60,111,147,1); border-bottom: 1px solid rgba(60,111,147,0.75); }

a:hover { color: rgba(60,111,147,0.8); border-bottom: 1px solid rgba(60,111,147,0.9); }

h1 { font-size: 1.35rem; padding: 0; margin: 0.5rem 0 2.25rem 0; font-weight: 500; text-align: left; letter-spacing: 1px; }

.banner { background-color: rgba(60,111,147,1); color: rgb(255,255,255); text-align: center; font-weight: 500; text-transform: uppercase; letter-spacing: 3px; padding: 1rem 0 1rem 0; margin; 0 0 2rem 0; font-size: 0.9rem; }

div.content { max-width: 1000px; margin: 0 auto; padding: 2rem; clear: both; }

div.portrait { padding: 2.15rem 2rem 2.25rem 2rem; background-color: rgba(255,255,255,1); float: left; }

@media screen and (max-width: 400px) { 
	div.content { padding: 1.5rem; }
	div.portrait { padding: 1rem; } 
	}

div.portrait img { max-width: 100%; }

div.landing { width: 100%; float: left; border-top: 2px solid rgba(0,0,0,0.1); padding-top: 2.15rem; }

div.landing p { font-size: 1.45rem; line-height: 2.5rem; margin: 0 0 1rem 0; font-weight: 500; text-align: center; }

div.landing p.follow { font-size: 1.25rem; }

div.landing p.platforms { margin: 3.25rem 0 2.5rem 0; }

div.landing p.contact { font-size: 1rem; }

a.music-platform { border: none; }
a.music-platform img { max-width: 64px; opacity: 0.85; padding: 0 0.4rem 0 0.4rem; }

@media screen and (max-width: 400px) { 
 	a.music-platform img { max-width: 54px; }
	}

a.music-platform img:hover { opacity: 0.5; 
	
	-webkit-transition: opacity 0.2s linear;
	-moz-transition: opacity 0.2s linear;
	-o-transition: opacity 0.2s linear;
	transition: opacity 0.2s linear;		
	
}

footer p { color: rgba(0,0,0,0.75); text-align: center; }