@import url(http://yui.yahooapis.com/3.18.1/build/cssreset/cssreset-min.css); 
@import url(../style/var.css);
@import url(../style/slidebars_n.css);

@font-face{font-family:idsans_font; src:local(idsans_font), url('../style/IdealistSans.otf') format('opentype');}
*{font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;}

html, body{height:100%;}
html#index{background:url(../i/bgFrontShot.jpg) no-repeat center center fixed; background-size:cover;}
html#music, html#bio, html#composing{background:url(../i/bgDesktop.jpg) no-repeat center center fixed; background-size:cover;}
html#session{background:url(../i/bgSession.jpg) no-repeat center center fixed; background-size:cover;}
html#teaching{background:url(../i/bgTeaching.jpg) no-repeat center center fixed; background-size:cover;}
#PageHeader, .PageHeader{font-family:idsans_font; font-size:6vw; margin:0 auto 45px auto; padding:5px 0 10px 0; text-align:center; color:#fff; background-color:var(--main-bg); border-radius:0px 0px 20px 20px; width:40vw; min-width:300px; border-left: solid 10px #b92727;}
#PageSubHeader{
	text-align: center;
font-size:2.5vw;
color: #f1f2f2;
left: 0;
right: 0;
padding: 10px;
margin-left: auto;
margin-right: auto;
letter-spacing: 2px;
font-weight: 600;
font-family: "Trebuchet MS", Helvetica, sans-serif;
background-color: rgb(185, 39, 39);
}

nav{display:none;}

#PageWrap{background:none !important;}
#PageHeaderBox{height:auto !important;}
#nav-n{text-align:center;}
#nav-nButton{ padding:2.5vw;background: url(../i/ico-ham.png); text-align:center; cursor:pointer; background-size:contain; background-repeat:no-repeat; float:left;}
#nom{color:#fff; font-family:idsans_font; font-size:21px; padding-left:10px; padding-right:10px; padding-top:4px;  background-color:#0e0d0d!important;}
#nav-n li{text-align: center;
padding-top: 10px;
padding-bottom: 14px;}
#nav-n li a{padding: 10px 107px; text-decoration:none; color:#f1f2f2;}
#nav-n li a:hover{background-color:#f1f2f2; color:#0e0d0d;}

p{background: rgb(14, 13, 13);
color: rgb(241, 242, 242);
padding: 20px;
border-radius: 20px; border-left: #f1f2f2 solid 5px; margin-bottom:10px;}

[off-canvas]{background-color:#0e0d0d;}

[canvas="container"]{background:none;}
.grid{width:auto !important;}
.grid li{width:50vw !important; float:none !important;}
/* index */
ul a{text-decoration:none; color:#fff;}
figure h3{
	text-align:center;
color: #fff;
text-decoration: underline;
font-weight: bold;}
figcaption{
position:relative;
display:block !important;
top:195px;
margin-left:-40px;
padding-top:5px;
padding-bottom:5px;
width: 400px;
text-align: center;
background-color:var(--main-bg);
border-bottom-left-radius: 17px;
border-bottom-right-radius: 17px;}
.insert{width: 80vw;;height:180px;margin-bottom:40px; font-size:20px; background-color:var(--main-bg); padding:10px; line-height:1.7; color:#fff;border-radius: 14px; ; padding-left: 25px; padding-right: 25px; margin-top:230px; display:block !important;}
#teachingInsert{border-left:10px solid var(--teaching-stripe)!important;}
#composingInsert{top:517px;border-left:10px solid var(--composing-stripe)!important;}
figure ul{list-style-type:square !important;}
figure li{padding-bottom:0px; padding-left:5px;}
img{position:absolute; clip: rect(0px,400px,200px,0px); margin-left:-40px;}
.insert ul{padding-left:20px;}
li.fig{position:absolute; margin-left:auto; margin-right:auto; left:0; right:0;}
li.fig a{width:100vw;}
#composing{top:400px}