html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}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%;font: inherit;vertical-align: baseline;}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;}* {-moz-box-sizing: border-box;	-webkit-box-sizing: border-box;	box-sizing: border-box;}audio,canvas,img,video {vertical-align: middle;}hr {display: block;height: 1px;border: 0;border-top: 1px solid #ccc;margin: 1em 0;padding: 0;}fieldset {border: 0;margin: 0;padding: 0;}::-moz-selection {background: #b3d4fc;text-shadow: none;}::selection {background: #b3d4fc;text-shadow: none;}.browsehappy {margin: 0.5em;background: #ccc;color: #000;padding: 1em;}.hidden {display: none !important;visibility: hidden}.show {display: block !important;visibility: visible}.clear {clear:both}
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,600');
/* Font Awesome */
@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.eot?v=4.7.0');
  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}
.fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.fa-lg {
  font-size: 1.33333333em;
  line-height: 0.75em;
  vertical-align: -15%;
}

/* LAYOUT */
html, body {min-width:320px; padding:0; margin:0; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif}
body {background:#292929 url(../images/musohub-bg.png);}

.wrapper {margin:0 auto;  max-width:1980px; min-width:320px; border:0px #CCC dashed; }
.inner-wrapper {position:relative; max-width:1980px; min-width:320px; margin:0 auto;}


.v-menu {width:194px; vertical-align:top; background:#f1f1f1;  float:left; position:relative; border:1px #666666 dashed;}

header, .topbar, #info {z-index:50; position:relative}
header, footer, #content {margin:0 auto; }
/* HEADER */
.topbar {background:#990200; color:#FFF; font-size:90%;  position:relative; border-bottom:1px #860200 solid; min-height:30px}
.topbar p {padding:0.5em}

header {position:relative; 
background:#f5f5f5; color:#000;
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f5f5f5), to(#d5d5d5));  /* Safari 4-5, Chrome 1-9 */ 
background: -webkit-linear-gradient(top, #f5f5f5, #d5d5d5);  /* Safari 5.1, Chrome 10+ */  
background: -moz-linear-gradient(top, #f5f5f5, #d5d5d5); 	 /* Firefox 3.6+ */
background: -ms-linear-gradient(top, #f5f5f5, #d5d5d5);    /* IE 10 */ 
background: -o-linear-gradient(top, #f5f5f5, #d5d5d5);	 /* Opera 11.10+ */
height:125px; 
border:0px #999 solid;}


.h-logo {	position:absolute;	left:10px;	top:3px;	color:#333;	text-align:center;	border:0px #666 dashed;	font-size:140%;}
.h-strap {	position:absolute;	left:200px;	top:50px;	font-size:24px;	border:0px #333 dotted;	font-family: 'Montserrat', sans-serif; font-weight:400;letter-spacing:0.1em}

/* CONTENT */
.content-wrapper {background:#FFF; overflow:hidden;   }
.content { border:0px #999 dashed; padding:1em;

}

.content p {line-height:1.4em; font-size:105%; padding:0.5em 0 1.3em 0; font-family: 'Montserrat', sans-serif; font-weight:300;}

.fright {float:right;}
.fleft {float:left;}
.zmt {margin-top:0;}
.acenter {text-align:center;}
.aleft { text-align:left;}
.aright { text-align:right;}
.img {border:0;}
.med-text {font-size:90%!important;}
.small-text {font-size:70%!important;}
.clear {clear:both;}
.page-heading {font-size:2em;margin:0.5em 0 0.5em 0; color:#990200; font-family: 'Montserrat', sans-serif; font-weight:600;}
.blue-dark {color:#0A4066;}
.blue-light {color:#0B8CE5;}
.red-dark {color:#990200;}
.red-light {color:#B10D00; }

/* MENUS */
nav ul { list-style-type:none; margin:0; padding:0; overflow:hidden; }
.h-menu {border:0px #333333 dashed;background:#0A4066; position:relative;  font-family: 'Montserrat', sans-serif; font-weight:300;  transition:all 0.3s ease;}
.h-menu a{color:#FFFFFF; text-decoration:none; display:block; padding:0.8em 1.4em;}
.h-menu li{float:left; cursor:pointer; color:#FFFFFF;  width:11.11%; text-align:center; padding:0.8em 0.5em;  word-break: break-all; /* wrap extended text*/
 transition: background-color 0.3s ease;}
.h-menu li:hover{background:#1f5a84; }
.h-menu ul ul {visibility:hidden; position:absolute; left:0; top:98%; z-index:100; background:#378ac3; width:100%; border-radius:0 0 6px 6px; padding:1em;
 opacity:0;  transition:opacity 0.2s linear; }
.h-menu ul ul li{padding:0; width:auto;border-radius:6px; margin:auto;}
.h-menu ul ul li:hover{ background:#0A4066; border-radius:6px; }
.h-menu ul ul li a{ }


.h-menu li:after {content: "\f078"; font: normal normal normal 14px/1 FontAwesome;/*float:right;*/padding:0 0 0 0.35em}
.h-menu ul ul li:after {content: ""; padding:0}
/*.h-menu li:hover ul{visibility:visible; opacity:1;}*/

.menu-show ul{visibility:visible!important; opacity:1!important;}
.menu-show {background:#378ac3!important; border-radius:6px 6px 0 0;}

.topmenu { position:absolute; right:0; top:0; min-height:30px}
.topmenu li:hover { background:#B10D00;}
.topmenu li{float:left; border-left: 1px #cbbbba solid; text-align:center; margin:0; }
.topmenu li:first-child {border:none;}
.topmenu li a {display:block; color:#FFF; padding:0.5em 1em;  text-decoration:none; background:#990200;}
.topmenu li a:hover {background:#B10D00;}

.icon-email:before, .icon-login:before, .icon-speaker:before, .icon-home:before{ font: normal normal normal 14px/1 FontAwesome; padding-right:0.5em}

.icon-home:before {content: "\f015"; } 
.icon-email:before { content: "\f2b6";}
.icon-login:before { content: "\f2bd";}
.icon-speaker:before { content: "\f0a1";}

.mm-menu {display:none; border:4px #333333 solid; border-radius:50px; font-size:30px; text-align:center;padding:0.3em 0.4em; position:absolute; right:30px; top:20px; background:#FFFFFF;}
.mm-menu:hover {background:#f9f9f9;}

.mm-open:before { content: "\f0c9";}
.mm-close:before { content: "\f057"; color:#990200;}

/* GRIDS */
.grid-wrapper, .col-wrapper {margin:0 auto; overflow:hidden; clear:both; margin-bottom:10px; border:0px #999 dashed;}
.grid-1, .grid-2, .grid-3 {position:relative;width:99.8%; border:1px dashed #e1e1e1; float:left; margin: 0 0 0 1%; vertical-align:top; background:#fff; padding:1%;}

.col-2 {position:relative;width:45.8%; border:1px solid #e1e1e1; display:inline-table; margin: 4px 0.7% 4px 0.7%; vertical-align:top; background:#fff; padding:1%;}

.grid-1 {width:99.8%; margin-left:0; float:none;}
.grid-2 {width:49.4%;}
.grid-3 {width:32.6%;}
.grid-3:first-child, .grid-2:first-child {margin-left:0;}

.grid-content {background:#fff; padding:6px; border:1px #CCC solid; border-radius: 8px;}

.list-wrapper {border:1px #333 dashed; overflow:hidden;}

.box-blue, .box-white {border:1px #0A4066 solid; border-radius:6px}
.box-blue h1, .box-white h1{font-size:140%;}
.box-blue {background:#0A4066;color:#FFFFFF;}
.box-white {background:#fff; color:#000;}


/* EVENT DISPLAYS */
.event-display {border:1px #333333 dashed; margin:0.5em 0}
.event {border-bottom:1px #333333 solid;  padding:0 0 0.5em 0;}

.e-date {padding:0.5em; display:inline-block; width:15%; font-weight:bold}
.e-title {padding:0.5em; display:inline-block; font-weight:bold}
.e-details {padding:0.5em; display:block; }
.e-loc {padding:0.5em; display:block; }

.tbl-header .row {font-weight:bold;  font-size:1em; text-align:center; background:#666;  color:#FFF;}
.tbl-header .row, .tbl-data .row  {display: table-cell; padding:4px; border-right:1px #c1c1c1 solid;}
.tbl-header .row:last-child, .tbl-data .row:last-child {border-right:0;}

.tbl-data {background:#f8f8f8; position:relative; margin-bottom:6px}
.tbl-data a {display:block; text-decoration:none; border:0px #333 solid;}

.data-date {width:15%; min-width:100px;}
.data-details {width:60%; min-width:300px;}
.data-location {width:18%; min-width:180px;}

footer {display:block; clear:both; font-size:80%; overflow:hidden; color:#333; 
background:#690201; min-height:40px;
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#cd0603), to(#690201));  /* Safari 4-5, Chrome 1-9 */ 
background: -webkit-linear-gradient(top, #cd0603, #690201);  /* Safari 5.1, Chrome 10+ */  
background: -moz-linear-gradient(top, #cd0603, #690201); 	 /* Firefox 3.6+ */
background: -ms-linear-gradient(top, #cd0603, #690201);    /* IE 10 */ 
background: -o-linear-gradient(top, #cd0603, #690201);	 /* Opera 11.10+ */
border:1px #999 solid; 
}
footer a {text-decoration:none; color:#333;}
footer a:hover {text-decoration:underline;}

/* ADVERTS */

.headbanner {position:absolute; top:32px ;right:10px;  }

.spn468 {width:468px; height:60px;  border-radius:4px; overflow:hidden;}
.ad-banner, .ad-halfbanner {/*height:60px;  overflow:hidden*/}
.ad-banner {text-align:center; padding:0 }
.ad-banner img {border-radius: 6px; }
.ad-halfbanner {width:234px;}

/*  FORMS  */
.error {color:#c00200; font-weight:bold; border:2px #c00200 dashed; padding:1em!important; text-align:center; }
.login-form {border:0px #333333 dashed; margin:0.5em 0 0.5em 0; padding:1em}
.login-form label {display:inline-block; width:40%; border:0px #333333 dashed; padding:0.18em 0 0.18em 0;}
.login-form input {padding:0.25em 0.5em 0.25em 0.5em; font-size:100%; vertical-align:top; width:60%; border:1px #666666 solid; border-radius:4px}

.submitbtn {background:#0B8CE5; border:1px #0A4066 solid!important; color:#FFFFFF; width:100%!important; padding:0.8em!important; margin-top:1.5em; font-weight:bold; text-shadow:1px 1px #000; cursor:pointer;}
.submitbtn:hover {background:#499CFF; }

.sign-box {min-height:450px;}
.warning {text-align:center; padding:10px; border:3px #FF0000 solid; background:#FFFFFF; border-radius:10px; width:96%; margin:0 auto; margin-bottom:10px;}

/* Make it move */
@keyframes marquee {
    0%   { text-indent: 5em }
	25%   { text-indent: -14em }
	50%   { text-indent: 5em }
	75%   { text-indent: -14em }
    100% { text-indent: 5em }
}
@keyframes slide-in {
    100% { transform: translateX(0%); }
}

@-webkit-keyframes slide-in {
    100% { -webkit-transform: translateX(0%); }
}

@keyframes slide-down {
    100% { transform: translateY(0%); }
}

@-webkit-keyframes slide-down {
    100% { -webkit-transform: translateY(0%); }
}
/* Font Awesome */
.fa-spin {
  -webkit-animation: fa-spin 2s infinite linear;
  animation: fa-spin 2s infinite linear;
}

@-webkit-keyframes fa-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@keyframes fa-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
.fa-rotate-90 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}
.fa-rotate-180 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}
.fa-rotate-270 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
  -webkit-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  transform: rotate(270deg);
}
.fa-flip-horizontal {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";
  -webkit-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  transform: scale(-1, 1);
}
.fa-flip-vertical {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
  -webkit-transform: scale(1, -1);
  -ms-transform: scale(1, -1);
  transform: scale(1, -1);
}
:root .fa-rotate-90,
:root .fa-rotate-180,
:root .fa-rotate-270,
:root .fa-flip-horizontal,
:root .fa-flip-vertical {
  filter: none;
}
.fa-bars:before { content: "\f0c9";}
.fa-chevron-down :before { content: "\f078";}
.fa-chevron-up :before { content: "\f077";}

@media screen and (max-width: 1100px) {

 .h-menu li { flex-grow: 1; float:none; display: inline-block; flex: 0 1 auto; width:auto; }
 .h-menu  ul { display: flex;   flex-direction: row; justify-content: space-between; flex-wrap: wrap}
 

}

@media screen and (max-width: 980px) {
header {height:148px;}
.h-logo {left:22px;}
.h-strap {left:10px; top:125px; font-size:18px; font-weight:300;}
.h-menu li { font-size:88%;}

}
@media screen and (max-width: 930px) {


/*  FORMS  */
.login-form {padding:0.5em}
.login-form label {width:50%;}
.login-form input {font-size:100%; width:50%;}
}

@media screen and (max-width: 880px) {
.topbar p { animation: marquee 50s linear infinite; white-space: nowrap; overflow: hidden; width:60%}
.topbar p:hover {
    animation-play-state: paused
}

}


@media screen and (max-width: 768px) {
header {height:102px; border-bottom:3px #0A4066 solid;}
.h-logo {width:200px; border:0px #333333 dashed;left:0;}
.h-logo img{width:140px; height:auto;}

.h-strap { display:none; width:170px; left:0;  top:98px; font-size:16px;  border:0px #333333 dashed;text-align:center;  letter-spacing: normal}
.topbar p {display:none;}
.topmenu {width:100%; margin:auto; position:absolute;top:0; left:0; line-height:1.2em}
.topmenu li {width:33.3%; overflow:hidden; height:28px;}
.mm-menu {display:block; cursor:pointer;}

.h-menu {z-index:49; margin-top:-520px; position:absolute; top:120px;left:0; width:100%;}
.h-menu ul{display:block; /*display:none;*/ }
.h-menu li{float:none; display:block; width:100%; margin:0 auto; padding:0.4em 0.3em 0.4em 0.8em; line-height:1.5em; position:relative; height:40px; text-align:left; font-size:105%}
.h-menu ul ul {left:auto; top:2px; position:relative; transform: translateX(-100%);   -webkit-transform: translateX(-100%); padding:0 1em;  font-weight:normal;}
.h-menu ul ul li a{padding:0.3em 1em; font-size:100%!important;}

.h-menu li:after {float:none; position:absolute; right:25px; top:0; width:25px; height:20px; padding:0.3em 0.3em 0 0.3em;text-align:center; border:0px #fff solid; margin-top:0.3em }

 
.slide-down {margin-top:10px!important;
animation: slide-down 0.5s forwards!important;
-webkit-animation: slide-down 0.5s forwards!important;
} 
 
.menu-show ul{margin-left:0!important;
animation: slide-in 0.5s forwards!important;
-webkit-animation: slide-in 0.5s forwards!important;
}
.menu-show {border-radius:0;  height:auto!important; font-weight:600;}
.menu-show:after {border:0px #fff solid!important; content: "\f057"!important; font-size:22px!important; padding:0em 0.2em 0.1em  0.2em!important; margin-top:0.2em!important}

.headbanner {display:none;}
.grid-2 {margin:0 auto; float:none; width:100%; margin-bottom:1em; }
.box-blue h1, .box-white h1{font-size:120%;}
.sign-box {min-height: inherit;}
}

@media screen and (max-width: 600px) {

.login-form label {display:block; width:100%;}
.login-form input {width:100%; }

	}

@media screen and (max-width: 530px) {

}

@media screen and (max-width: 400px) {

}