/* Fonts */

.CorbertCondensed-Thin { 
	font-family: CorbertCondensed-Thin;
	font-weight: normal;
	font-style: normal;
}

.CorbertCondensed-MediumItalic { 
	font-family: CorbertCondensed-MediumItalic;
	font-weight: normal;
	font-style: normal;
}

.CorbertCondensed-Medium { 
	font-family: CorbertCondensed-Medium;
	font-weight: normal;
	font-style: normal;
}

.CorbertCondensed-LightItalic { 
	font-family: CorbertCondensed-LightItalic;
	font-weight: normal;
	font-style: normal;
}

.CorbertCondensed-Light { 
	font-family: CorbertCondensed-Light;
	font-weight: normal;
	font-style: normal;
}

.CorbertCondensed-Black { 
	font-family: CorbertCondensed-Black;
	font-weight: normal;
	font-style: normal;
}

.CorbertCondensed-HeavyItalic { 
	font-family: CorbertCondensed-HeavyItalic;
	font-weight: normal;
	font-style: normal;
}

.CorbertCondensed-Heavy { 
	font-family: CorbertCondensed-Heavy;
	font-weight: normal;
	font-style: normal;
}

.CorbertCondensed-ExtraBoldItalic { 
	font-family: CorbertCondensed-ExtraBoldItalic;
	font-weight: normal;
	font-style: normal;
}

.CorbertCondensed-BlackItalic { 
	font-family: CorbertCondensed-BlackItalic;
	font-weight: normal;
	font-style: normal;
}

.CorbertCondensed-ExtraBold { 
	font-family: CorbertCondensed-ExtraBold;
	font-weight: normal;
	font-style: normal;
}

.CorbertCondensed-Bold { 
	font-family: CorbertCondensed-Bold;
	font-weight: normal;
	font-style: normal;
}

.CorbertCondensed-DemiBoldItalic { 
	font-family: CorbertCondensed-DemiBoldItalic;
	font-weight: normal;
	font-style: normal;
}

.CorbertCondensed-DemiBold { 
	font-family: CorbertCondensed-DemiBold;
	font-weight: normal;
	font-style: normal;
}

.CorbertCondensed-BoldItalic { 
	font-family: CorbertCondensed-BoldItalic;
	font-weight: normal;
	font-style: normal;
}

.CorbertCondensed-Italic { 
	font-family: CorbertCondensed-Italic;
	font-weight: normal;
	font-style: normal;
}

.CorbertCondensed-Regular { 
	font-family: CorbertCondensed-Regular;
	font-weight: normal;
	font-style: normal;
}

.CorbertCondensed-ThinItalic { 
	font-family: CorbertCondensed-ThinItalic;
	font-weight: normal;
	font-style: normal;
}

.Piano-Keys { 
	font-family: Piano-Keys;
	font-weight: normal;
	font-style: normal;
}

/* General */

body {margin: 0; font-size:100%;}
img {max-width:100%; border-radius:3px;}
img a, a img {border:none;}
a {font-family: CorbertCondensed-Italic; text-decoration:none; color:#929292; transition: color 0.35s; -webkit-transition: color 0.35s; /* Safari */}
a:hover {color:#eeb78c; transition: color 0.35s; -webkit-transition: color 0.35s; /* Safari */}
p {font-family: CorbertCondensed-Regular;}
h2 {font-family: CorbertCondensed-Heavy; padding-bottom: 10px; font-weight: normal;margin: 0 0 20px;}
h3 {font-family: CorbertCondensed-Bold; font-weight: normal;}
i {color:#929292; transition: color 0.35s; -webkit-transition: color 0.35s; /* Safari */}
a i:hover {color:#eeb78c; transition: color 0.35s; -webkit-transition: color 0.35s; /* Safari */}
#nav i {color:#555; font-size:1em; margin:0 !important;}
ul#nav li.active a {color:#000000;}
ul#nav li i.active {color:#EEB78C;}


/* Header css */
h2#repertoire_title {
    margin: 0 0 10px;
}
#logo h3 {
    margin: 0;
    padding: 20px;
}
ul#nav {
    margin: 0;
	padding: 0;
}
#navigation {width:auto; background:#fff; z-index: 100;}
#whole_top_nav {max-width:1200px; margin:0 auto; position:relative;display: inline-block;
    vertical-align: top;
    font-size: 16px;}

#main-nav {float:left; margin-top:7px;}
#nav {list-style-type:none; -webkit-margin-before:14px;}
#nav li {display:inline-block; margin:0;}
#nav li a:hover {color:#000000 !important;} 
#nav a { transition: color 0.1s; -webkit-transition: color 0.1s; /* Safari */ padding: 16px 10px;
    display: inline-block;
    vertical-align: top;
	font-family: CorbertCondensed-DemiBold;
    color: #929292;}
#nav li i {margin-right:15px;}

#logo {float:left;}

/* Contact form */ 

#edward_dye_contact {
	display: block;
    margin: 0 !important;
    background: #fff;
    z-index: 999;
    position: absolute;
	height: 100%;
    width: 350px;
    top: 0;
    left: 0;
    left: calc(50% - 175px);
	padding: 35px 20px 10px;
}
div#edward_dye_contact_inner {
    position: relative;
}
div#edward_dye_contact_inner.error, div#edward_dye_contact_inner.success {
	background: url('https://edward-dye.com/images/rep.png');
    background-position: bottom;
    background-size: auto;
    height: 100%;
    background-repeat: no-repeat;
}
#edward_dye_contact h3 {margin-top:0 !important; font-family: CorbertCondensed-Bold;}
#edc_name, #edc_email {
    width: 100%;
    height: auto;
    font-size: 15px;
    padding: 10px;
    outline: none;
    border: 1px solid #DDD;
    font-family: CorbertCondensed-Regular;
    display: block;
    box-sizing: border-box;
    margin: 0;
}
#edc_message {
	width: 100%;
    height: 150px;
    outline: none;
    border: 1px solid #DDD;
    font-family: CorbertCondensed-Regular;
    box-sizing: border-box;
    padding: 10px;
}
label {
	margin: 0 5px 10px;
    line-height: 1;
    font-family: CorbertCondensed-Regular;
    display: block;
}
#edc_submit {
font-family: CorbertCondensed-Bold;
height: 40px;
width: auto;
font-size: 15px;
padding: 5px 10px;
border: none;
outline: none;
margin-top: 20px;
color:#000;
background:#ddd;
transition: all 0.35s;
}
#edc_submit:hover {color:#fff; background:#E4A778; cursor:pointer; transition: all 0.35s;}
#error_paragraph {position:absolute; right:50px; bottom:130px; font-size:25px; color:#BD3838;
	white-space:nowrap;
	display:block;}
	
.open_form{
position:fixed;
bottom:0px;
right:20%;
z-index:999;
background:rgba(238, 183, 140, 0.96);
color:#fff;
padding: 5px 10px;
font-family: CorbertCondensed-DemiBold;
font-size:20px;
}
.open_form:hover {
background:#E4A778;
color:#fff;
padding-bottom: 8px;
}
.open_form i, .open_form:hover i {
color:#fff;
}


/* Font */



/* Content css */

ul {list-style-type:none;}
#wrapper {
	max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    clear: both;
    box-sizing: border-box;
	position: relative;
}
#music, #pictures, #links, #contact, #biog, #social, #teaching, #testimonials  {position:relative; margin-bottom: 50px;    padding: 0 20px;}

#mason_pics {margin:30px auto 0;font-size: 0;}

.mason {width: 33.33%;box-sizing: border-box; padding: 5px;}

#contact_details li i {font-size: 2em; color:#eeb78c;}
#contact_details {padding-left:0;}
#contact_details li > * {
    display: inline-block;
    vertical-align: middle;
    padding: 5px;
    line-height: 1em;
}
#social i {font-size: 3em; float:none; clear:both;}


/* Footer css */

#footer {width:95%; margin:0 auto;}

#footer #inner {max-width:900px; margin:0 auto;}

#credits {clear:both;}


#credits {padding-left:0; float: right; margin-bottom:30px;}
#credits li {display:block; margin-right: 20px;}


#navigation:after,#whole_top_nav:after, #wrapper:after, #rep_mason:after {
	content: ".";
	display:block;
	clear:both;
	visibility:hidden;
	line-height:0;
	height:0;
	}
	
blockquote {
border-left: 8px solid #eeb78c;
padding-left: 15px;
margin-bottom:30px;
font-family: CorbertCondensed-MediumItalic, sans;
}
span.sign {
font-family: CorbertCondensed-HeavyItalic, sans;
clear:both;
}

/* Slider repertoire */

.slider_vert {
position: absolute;
right: 0px;
top: 0px;
background: transparent !important;
border-radius:5px;
width: 10px;
height: 100%;
border: 0 !important;
z-index: 10;
}
.slider_vert .ui-widget-header {background:none !important;}
.slider_vert .ui-slider-handle { 
margin-left:0;
width: 10px;
height:10px;
outline:0;
border-radius: 5px;
cursor: pointer;
position: absolute;
border: 0 !important;
z-index: 12;
transition:none !important;
background:rgba(218, 218, 218, 0.49) !important;
left: 0;
}
.pl_wrap {
border-radius: 0px 0px 5px 5px;
position: absolute;
padding:0;
width:100%;
}
.pl_wrap p {margin:0; padding:10px; color: #a0a0a0; font-family: CorbertCondensed-Medium;}

.multiscroll {position: absolute; background: #eee; margin-top: 0 !important; list-style-type: none;}

#standards, #light, #ceremony {border: 0 !important; border-radius: 5px; margin-bottom:1px; width:auto;}
#standards h3, #light h3, #ceremony h3 {margin: 0 !important; padding: 15px; background: #f7d1b3;
    color: #505050;}

#rep_mason h3:hover {cursor:pointer; background:#cacaca; -webkit-transition:all 0.35s; -moz-transition:all 0.35s; -o-transition:all 0.35s;}
#rep_mason h3.active:hover {cursor:auto; background:#cacaca;}
#rep_mason h3.active {background:#cacaca; color:#000;   -webkit-transition:all 0.2s; -moz-transition:all 0.2s; -o-transition:all 0.2s;} 

.fa.fa-plus {float: right; font-size: 30px; color: #ffffff;}
div#biog img {
    max-width: 100%;
    border-radius: 3px;
    display: block;
    margin: 0 auto;
}
.img-container {
    float: left;
    width: 39%;
    padding: 0 10px 10px 0;
}	
	
	
@media screen and (min-width:0px) and (max-width:1000px) {

	#navigation {position:static; width: 100%;}
	
	
}

@media screen and (min-width:799px) and (max-width:9999px) {
	#navigation {position:fixed; width: 100%;font-size: 0; text-align: center;}
	#wrapper {font-size: 0;}
	div#rep_mason {
		position: fixed;
		font-size: 16px;
		width: 40%;
		max-width: 480px;
		padding: 0 20px;
		box-sizing: border-box;
		padding-top:85px; 
	}
	div#container {
		float: left;
		margin-left: 40%;
		font-size: 16px;
		padding-top:80px; 
	}
	#standards, #light, #ceremony {width:auto !important;}
}

@media screen and (min-width:0px) and (max-width:388px) {

	#logo h3 {font-size:0.9em; margin-right:15px; line-height: 1.2em;}
	ul#nav {padding-left:10px; margin-top:5px;}
	#nav li i {font-size:0.75em;}
	
}

@media screen and (min-width:0px) and (max-width:798px) {
	#navigation {border:0; position:static;}
	#nav li i:hover {color:#555 !important; transition: color 0.35s; -webkit-transition: color 0.35s; /* Safari */} 
	#main-nav {display: none;}
	.mason {
		width: 33.33%;
	}
	#rep_mason {margin-bottom:50px;padding: 20px;}
	#standards, #light, #ceremony {width:auto;}
	.fa.fa-hand-o-right, .fa.fa-hand-o-down {display:none !important;}
	#contact_details span#remove {display:none;}
	.slider_vert .ui-slider-handle { 
		width: 20px !important;
		left: -10px !important;
		border-radius:25px;
	}
	.pl_wrap p {padding-right:20px !important;}
}

@media screen and (min-width:0px) and (max-width:450px) {
	
	#edc_name, #edc_email, #edc_message {width:97%;}
}
@media screen and (min-width:601px) and (max-width:1000px) {
	.mason {
		width: 50%;
		box-sizing: border-box;
		padding: 5px;
	}
}
@media screen and (min-width:0px) and (max-width:600px) {
	#container {
		display: block;
		width: 100%;
		margin: 0;
		box-sizing: border-box;
		font-size: 16px;
	}
	#rep_mason {
		display: block;
		width: 100%;
		box-sizing: border-box;
		padding: 20px;
		font-size: 16px;
	}
	.mason {
		width: 50%;
	}
}