@import url(http://fonts.googleapis.com/earlyaccess/alefhebrew.css);
html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}
html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}
article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}
audio,canvas,progress,video{display:inline-block}progress{vertical-align:baseline}
audio:not([controls]){display:none;height:0}[hidden],template{display:none}
a{background-color:transparent;-webkit-text-decoration-skip:objects}
a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}
dfn{font-style:italic}mark{background:#ff0;color:#000}
small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sub{bottom:-0.25em}sup{top:-0.5em}figure{margin:1em 40px}img{border-style:none}svg:not(:root){overflow:hidden}
code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}hr{box-sizing:content-box;height:0;overflow:visible}
button,input,select,textarea{font:inherit;margin:0}optgroup{font-weight:bold}
button,input{overflow:visible}button,select{text-transform:none}
button,html [type=button],[type=reset],[type=submit]{-webkit-appearance:button}
button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner{border-style:none;padding:0}
button:-moz-focusring, [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring{outline:1px dotted ButtonText}
fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}
legend{color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}
[type=checkbox],[type=radio]{padding:0}
[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}
[type=search]{-webkit-appearance:textfield;outline-offset:-2px}
[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}
::-webkit-input-placeholder{color:inherit;opacity:0.54}
::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}

body {
	font-family:"Alef Hebrew",“Helvetica Neue”,Helvetica,Arial,sans-serif;
	font-size: 14pt;
	padding:4em 0 0 0; margin:0;
	background: #474f52;
	color: white;
}

.navfix {
	position:fixed;
	top:0; right:0;
	width: 100%;
	background: #2f3537;
	box-shadow: 0 5px 10px #333;
}

.topnav {
  width:auto;
  position:relative;
  right: calc(50% - 420px);
}

.topnav a {
  float: right;
  display: block;
  color: #cdcdc0;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}

.topnav a:hover {
  background-color: #cdcdc0;
  color: #626d71;
}

.topnav a.active {
  background-color: #ddbc95;
  color: #626d71;
}

.topnav .icon {
  display: none;
}

article {
	width:43em;
	position: relative;
	right: calc(50% - 420px);
	padding: 0 2em 0 2em;
	border-bottom: solid transparent 7em;
}
article ul, article ol {margin:0; padding:0 1em;}
article li {padding: 0.4em 0;}

aside {
	font-size: 80%;
	position: fixed;
	top: 80px;
	right: calc(50% + 400px);
	text-align: center;
}
aside .tab {
	background: #171b1c;
	border-radius: 7px;
	padding: 4px;
}
.share a {
	background: #474f52;
	border-radius: 7px;
}
aside .arrow {
	background: #2f3537;
	margin-bottom: 4em;
	padding: 4px 2px 4px 3px;
}
aside a{
	text-decoration:none;
	color:#ddbc95;
	display: block;
	margin-bottom:5px;
	padding: 3px;
}
aside a:last-child {margin-bottom:0;}

footer {
	clear: both;
	text-align:center;
	position: fixed;
	width: 100%;
	bottom: 0px;
	right: 0px;
	padding: 1em;
	background: #0c0d0e;
	font-size: 80%;
}

form {width: 45%;}

h1{padding:0; margin:0 0 1em 0;}
h2{padding:0; margin:0; font-size:125%;}
h3{padding: 0; margin:0;}
h2[id], h3[id] {padding-top: 2em;}

p{padding: 0; margin:0 0 1em 0;}

footer a, article a {color:#ddbc95;}
article a:visited{color:#cdcdc0;}
footer a:visited {color:#ddbc95;}
footer img {margin: 0 0.5em;}
article img {
	float: right;
	margin: 0 0 1em 1em;
	border: solid white 1px;
	box-shadow: 10px 10px 10px #333;
}

h1 a, h1 a:visited {color: #ddbc95;}

.clips a{
	display: block;
	float: right;
	margin: 0 0 1em 1em;
	text-decoration: none;
}
.clips img{
	float: none;
	display: block;
	box-shadow: none;
	border: solid white 1px;
	border-bottom: none;
	margin: 0;
}
.clips span {
	display: block;
	background: #222;
	font-size: 80%;
	padding: 0.5em;
	vertical-align: middle;
	text-align: center;
	border: solid white 1px;
	border-top: none;
	width: 248px;
	height: 4em;
}

img.noframe {
	border:none;
	box-shadow:none;
}

strong {
	text-shadow: 2px 2px 0px #000;
}

.home article {
	padding: 0;
	margin: 0;
	width: 46.7em;
}

.home h1 {
	font-family: Assistant;
	font-weight: 600;
	text-shadow: 1px 1px 2px #000;
	font-size: 200%;
	width: 9em;
	float: right;
}
img.homeimage {float:left;margin: 0 1em 0 4.5em;}
.home h1 span::before {content: "";}
.home h1 {margin-top: -0.3em;}
span.part1 {
	letter-spacing: 3px;
}
span.part2 {
	font-weight: 800;
	font-size: 166%;
	color: #ddbc95;
	line-height: 120%;
}
span.part3 {
	display: block;
	font-weight: 800;
	font-size: 120%;
	text-align: left;
	line-height: 80%;
}
.home .arrow {display:none;}

blockquote {
	margin:0; padding:0;
	text-shadow: 1px 1px 4px #000;
	font-size: 120%;
}

div.thumb {
	width:246px;
	height:138px;
	text-align:left;
	border: solid white 1px;
	box-shadow: 10px 10px 10px #333;
	float: right;
	margin: 1.5em 0 6em 0;
}
div.lessons {background-image: url("images/Joseph-Aridan-with-a-student-during-lesson-small.jpg");margin-left: 3em;}
div.videos {background-image: url("images/voice-lesson-9.jpg");}
div.cd {background-image: url("images/cd-vocal-training-exercise-small.jpg");float:left;margin-left:1em;}
a.thumb {text-decoration: none;}
.thumb span {
	background-color: #000;
	padding: 0 0.5em;
}

.innernav {
	margin: 0 0 1em 1em;
	display: inline-block;
	font-weight: bold;
	font-size: 110%;
}

textarea, input[type="text"] {width: 20em;}

dt {
	font-weight: bold;
	font-size: 120%;
}
dd {
	margin: 0 0 1em 0;
}

@media screen and (max-width: 930px) {
	.topnav a:not(:first-child) {display: none;}
	.topnav a:first-child {text-decoration: underline;}
	.topnav a.icon {
		float: left;
		display: block;
	}
	.topnav.responsive {position: relative; right:auto;}
	.topnav.responsive .icon {
		position: absolute;
		left: 0;
		top: 0;
	}
	.topnav.responsive a {
		float: none;
		display: block;
		text-align: right;
	}
	.topnav{
		position:static;
		width:auto;
		margin: 0;
	}
	article, .home article {
		width: calc(100% - 40px);
		position: static;
		border-bottom: none;
		padding: 0 2em 0 2em;
	}
	article img {
		width:90%;
		height: auto;
		float: none;
	}
	aside,  .home aside {
		position: fixed;
		display: block;
		right: auto;
		left: 0;
	}
	aside .tab {border-radius: 0 7px 7px 0;}
	aside .arrow {margin-bottom: 2em;}
	.home .arrow {display: block;}
	footer {position: static; padding: 1em 2.5em;}
	footer span {
		display: block;
		margin-bottom: 1em;
	}
	form {
		width: auto;
		padding-bottom: 4em;
	}
	.clips span {width: 90%;}

	.home h1 {
		width: auto;
		float: none;
		clear: both;
	}

	div.thumb {
		float: none;
		clear: both;
		margin: 0 0 1em 0;
	}
	div.cd, div.lessons {
		float:none;
		clear:both;
		margin-left: 0;
	}
	div.cd {margin-bottom: 2em;}
	span.part1 {letter-spacing: 0px;}
	span.part2 {font-size: 150%;}
	span.part3 {display: inline;}
	blockquote {clear: both; padding-top: 1em;margin-bottom:1em;}
	img.homeimage {float:none;margin: 0;}
	
	textarea, input[type="text"] {width: auto;}
}

@media only screen and (max-height: 400px) {
	.topnav.responsive a {width:50%;float:right;}
	.topnav.responsive .icon {text-align:left;width:auto;}
}
