﻿/* music.css */
html {
	scrollbar-light-color:#ececec;
	scrollbar-arrow-color:#333;
	scrollbar-base-color:#ececec;
	scrollbar-dark-shadow-color:#ffffff;
	scrollbar-highlight-color:#666;
	scrollbar-shadow-color:#FFF; /* arrow */
	scrollbar-face-color:#CCC;
	scrollbar-track-color:#ececec; } 

body { color: #444; font: 100%/1.35 "Trebuchet MS", Arial, Helvetica, sans-serif; margin: 0; background: #a8a8a8;}
	
a#site_follow_button, a#ctl00_site_share_button, a#ctl00_ctl47_site_share_button, a#ctl00_ctl47_SyncPromotedAction { display:none !important; } /* hiding FOLLOW and SHARE links on the ribbon */

/* = containers  === */

.s4-ca  { margin-left:0;}
div#s4-bodyContainer { margin: 20px auto; background:none; margin-bottom:15px; }
div.customWidth { width: 960px; margin: 0 auto; min-height:640px; font-size:0.825em; background: #fff; }

#pagebackground { width: 960px; position:relative;	 min-height: 720px; background: #fff url(../Images/music-bg_main.png) no-repeat top left; z-index:1; }

.centerimage { width:935px; height:200px; float:right; position:relative; }
.centerimage img { margin:0 0 0 0; position:absolute; top:0; left:0; } 

.saclogo    { position:absolute; top:80px; left:82px; width:37px; height:45px; z-index:2; }

div#columnwrapper { clear:both; }

.col1 { float: left; width: 210px; min-height:400px; padding-left: 40px; }
.col2 { float: right; padding:15px 20px; width: 670px; } 
.columnfull { clear:both; width:90%; min-height:520px; padding:0; margin:0 0 10px 5%; overflow:hidden; } 
.columnfull h1 { padding-top:25px; }
	
/* = top nav  === */
div#topnav { height:23px; text-align:right; padding:15px 20px 0 0; font:11px Verdana, Geneva, sans-serif; }
div#topnav ul { padding:0; margin:0; float:right;}
div#topnav li { display:inline; padding: 0 0 0 20px; color:#fff;}
div#topnav a, div#topnav a:visited { color:#efefef; text-decoration:none;}
div#topnav a:hover { color: #f84a08;}

/* = footer === */

#footer{ clear: both; height: 28px; font: 0.8em "Trebuchet MS", Arial, Helvetica, sans-serif; letter-spacing: 1px; color: #fff; text-align: center; padding-top: 10px; background: url(../Images/music-bg_footer.png) no-repeat bottom; }
#footer a, #footer a:visited { color:white; }
#footer a:hover { color:#f00; }
	
/* = headings ====================================================== */

h1, h1.ms-rteElement-H1 { font-size:1.5em; font-weight:bold; font-style:italic; color: #7878c0; margin:5px 0; padding:0; }
h2, h2.ms-rteElement-H2 { font-size:1.35em; font-weight:bold; color:#dc5c0c; margin:5px 0; padding:0; }
h3, h3.ms-rteElement-H3 { font-size:1.15em; color:#357bc2; font-weight:bold; margin:5px 0; padding:0; }	
h4, h4.ms-rteElement-H4 { font-size:1em; color:#111; font-weight:bold; margin:5px 0; padding:0; font-style:normal; }		

/* = links ======================================================= */
A:link    { color: #165ca2; text-decoration: none; }
A:visited { color: #06C; text-decoration: none }
A:hover   { color: #900; text-decoration: none; }

/* =FORM STYLES ========================================================= */

input    { border: 1px solid #bf9999; background-color:#f8f0f0; }
textarea { border: 1px solid #bf9999; background-color:#f8f0f0; overflow:hidden; font-family:Arial, Helvetica, sans-serif; } 

/* = common ======================================================= */

img  { border:none; }
p    { margin:10px 0; padding:0; }
p.indent   { text-indent:25px; }
p.top { text-align:right; padding-right:50px; font-size:10px; }
.bold15px  { font-size:15px; font-weight:bold; }
.center    { text-align:center;}
.pad25     { padding-left:25px;}

/* ==li arrow bullet === */

ul.arrow { list-style-type:none; margin:15px 0 0 0; padding:0;  }
ul.arrow li { display: block; padding: 3px 0 3px 20px; background:url(/Music/Style Library/Music/Images/music-arrow_bullet.gif) no-repeat 0 6px;}
ul.arrow li:hover{ background:url(/Music/Style Library/Music/Images/music-arrow_bullet_red.gif) no-repeat 0 6px; }

/* skipnav */
.skipnav { text-align: left; }
.skipnav a { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.skipnav a:focus, .skipnav a:active { left: 10px; background-color: #666; border: 1px solid #000; color: #fff; width: auto; height: auto; font-size: 0.825em; font-weight: bold; overflow: visible; text-decoration: underline; padding: 5px; z-index: 1000; }

/* =Faculty =========================== */

div.fac1 { float:left; width:40%; margin-right:10%; margin-left:5%; padding-top:10px; }
div.fac2 { float:left; width:40%; padding-top:10px; }
div.fac2 ul { margin:0; padding:0;}
div.fac2 ul li { list-style-type:none; padding:10px 0 5px 0; border-bottom:1px dotted #F90; }
div.faculty { padding: 0 20px 0 30px; }

div.facultycol1 { float:left; width:250px; margin-right:10px; padding-top: 20px;}	
div.facultycol2 { float:left; width:400px; padding: 20px 0px; }
	
div.elliotCol1 { float:left; width:450px; margin-right:20px; padding-bottom: 20px;}
div.elliotCol2 { float:left; width:200; clear:right; }

/* ==EVENTS PAGE === */

div.events h2  { margin-left:20px; margin-top:20px; font-size:1.1em; color:#357bc2; border-bottom:1px dotted #357bc2; }
div.events p   { margin-left:50px; }
div.events img { float:right; margin-right:25px; }

/* == Album === */

ul.album { list-style-type:none; margin-top:15px; }
ul.album li { display: block; padding: 3px 0 3px 20px; border-bottom:1px dotted #ccc; background:url(../Images/music-arrow_bullet.gif) no-repeat 0 6px; }
ul.album li:hover{ background:url(../Images/music-arrow_bullet_red.gif) no-repeat 0 6px; border-bottom:1px dotted #d6492a; }
ul.album li a { display:block; }

/* ======================================================================= 
	LEFT NAV 
 ======================================================================= */
.ms-core-listMenu-item:link, .ms-core-listMenu-item:visited { color: #000; }

.nav-menu { position:absolute; top: 238px; left:40px;  padding: 10px  0; width: 200px; }
.nav-menu ul { list-style-type:none; margin:0; padding:0; font-size:1.1em; }
.nav-menu ul li { display:block; }
.nav-menu ul li a, .nav-menu ul li a:visited { display: block; color:#000; border-bottom:1px dotted #999; padding: 5px 0 2px 5px; }
.nav-menu ul li a:hover    { color: #900; border-bottom:1px dotted #900; background:#efefef; }
.nav-menu ul li a.selected { color: #900; border-bottom:1px dotted #900; background:#efefef; }
.nav-menu ul li a.selected:hover { background:#efefef; }

.CurrentNav div.nav-menu { display: none; } 
.CurrentNav div.nav-menu.toggled-on, .menu-toggle { display: inline-block; clear:both; }
.CurrentNav h3.menu-toggle { padding:0; margin-top:15px; }

/* Buttons */
.menu-toggle {
	/* padding: 6px 10px;
	padding: 0.428571429rem 0.714285714rem; */
	width:40px;
	height:32px;
	font-size: 11px; font-size: 0.785714286rem;
	line-height: 1.428571429;
	font-weight: normal;
	margin-bottom: 15px;
	color: #7c7c7c;
	background-color: #e6e6e6;
	background-repeat: repeat-x;
	background-image: -moz-linear-gradient(top, #f4f4f4, #e6e6e6);
	background-image: -ms-linear-gradient(top, #f4f4f4, #e6e6e6);
	background-image: -webkit-linear-gradient(top, #f4f4f4, #e6e6e6);
	background-image: -o-linear-gradient(top, #f4f4f4, #e6e6e6);
	background-image: linear-gradient(top, #f4f4f4, #e6e6e6);
	background: url("../Images/toggle-menu.png") no-repeat center;
	border: 1px solid #d2d2d2;
	/*box-shadow: 0 1px 2px rgba(64, 64, 64, 0.1);*/
	box-shadow: inset 0 0 6px 2px #c6c6c6, 0 1px 0 0 #f4f4f4;
	text-indent: -9999px; }
.menu-toggle { cursor: pointer; }
.menu-toggle:hover {
	color: #5e5e5e;
	background-color: #ebebeb;
	background-repeat: repeat-x;
	background-image: -moz-linear-gradient(top, #f9f9f9, #ebebeb);
	background-image: -ms-linear-gradient(top, #f9f9f9, #ebebeb);
	background-image: -webkit-linear-gradient(top, #f9f9f9, #ebebeb);
	background-image: -o-linear-gradient(top, #f9f9f9, #ebebeb);
	background-image: linear-gradient(top, #f9f9f9, #ebebeb);
	background: url("../Images/toggle-menu-hover.png") no-repeat center; }
.menu-toggle:active {
	color: #757575;
	background-color: #e1e1e1;
	background-repeat: repeat-x;
	background-image: -moz-linear-gradient(top, #ebebeb, #e1e1e1);
	background-image: -ms-linear-gradient(top, #ebebeb, #e1e1e1);
	background-image: -webkit-linear-gradient(top, #ebebeb, #e1e1e1);
	background-image: -o-linear-gradient(top, #ebebeb, #e1e1e1);
	background-image: linear-gradient(top, #ebebeb, #e1e1e1);
	background: url("../Images/toggle-menu-hover.png") no-repeat center;
	box-shadow: inset 0 0 8px 2px #c6c6c6, 0 1px 0 0 #f4f4f4;
	border: none; }