@import url("/webfonts/GothamMedium/stylesheet.css");
@import url("/webfonts/GothamBook/stylesheet.css");
@import url("/webfonts/GothamBold/stylesheet.css");
html {
    -webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */
}
body {
	margin: 24px 0 0;
	background-color: #fff;
	color: #1b1464;
	font: 14px/22px GothamMedium, sans-serif;
	-webkit-font-smoothing: antialiased;
	position: relative;
}
.mobile {
display: none!important;
}
.donate {
display: none;
	overflow: hidden;
	position: fixed;
	width: 100%;
	z-index: 100;
	height: 50px;
	padding-top: 6px;
	top: 0px;
	background-color: #1b1464;
	-webkit-box-shadow: 0px 3px 10px #656565;
	box-shadow: 0px 3px 10px #333;
}
.donate .button {
	width: 100%;
	max-width: 1170px;
	margin:0 auto;
	position:relative;
}
.donate .button a {
	font: 18px/24px GothamMedium,sans-serif;
	text-decoration: none;
	text-transform: uppercase;
	display: inline-block;
	position: absolute;
	right: 60px;
	top: 9px;
	color: #000;
	padding: 2px 20px 0;
	margin: 0 0 0 30px;
	cursor: pointer;
	border:2px solid #000;
	background-color: #fff;
}

.wrapper {
	width: 100%;
	margin: 0 auto;
}
.header {
	background-color: #fff;
	margin: 0;
	background-image: url(/vision/images/masthead_brush.jpg);
	background-repeat: no-repeat;
	background-position: right top;
	background-size: auto;
	text-align: left;
	padding:0 0 0 30px;
}
.header h1 {
	font-size: 2.8em;
	line-height: 1em;
	font-family: BaskervilleBold, serif;
	font-weight: normal;
	color: #000;
	padding: 0;
	margin: 0 0 4px;
	text-transform: uppercase;
}
.header h2 {
	font-family: BaskervilleBold,sans-serif!important;
	font-size: 1.9em;
	line-height: 1.1em;
	padding-bottom: 20px;
	margin:0;
	text-transform: uppercase;
	font-weight: normal;
}
.header h3 {
	font: 1.4em/1.2em GothamMedium, sans-serif;
	font-weight: normal;
	margin: 0 0 4px;
	text-transform: uppercase;
	padding-top:24px;
}
.thankyou .header h1 {
	padding-bottom: 60px;
	}
.topnav {
	border-bottom: 3px solid #1b1464;
	padding-bottom: 20px;
	margin-bottom: 20px;
}
.topnav ul {
list-style: none;
margin:0;
padding:0;
text-align: center;
}
.topnav ul li {
	display: inline;
	font: 14px/22px GothamBook, sans-serif;
	text-transform: uppercase;
	letter-spacing: 1px;
}
.topnav ul li + li {
	margin-left: 50px;
}
.topnav ul li a {
	color:#1b1464;
	text-decoration: none;
}
.topnav ul li span {
	color:#ccc;
	text-decoration: none;
}
.topnav ul li a:hover {
	text-decoration: underline;
}
.topnav ul li a.active {
	font-family: GothamBold, sans-serif;
}
.nav-trigger {
	position: absolute;
	top: 18px;
	left: 15px;
	display: none;
	width: 30px;
	height: 26px;
	z-index: 100;
}
.nav-trigger span { position: absolute; display: block; height: 2px; width: 100%; background: #fff; transition: top .2s .25s, left .2s .25s, opacity .2s .25s, transform .2s 0s; }
.nav-trigger span:nth-child(1) { top: 0; }
.nav-trigger span:nth-child(2) { top: 9px; }
.nav-trigger span:nth-child(3) { top: 19px; }
.nav-trigger.active span { transition: background .2s, top .2s, left .2s, opacity .2s, transform .2s .25s; }
.nav-trigger.active span:nth-child(3),
.nav-trigger.active span:nth-child(1) { top: 9px; }
.nav-trigger.active span:nth-child(2) { opacity: 0; }
.nav-trigger.active span:nth-child(1) { transform: rotate(45deg); }
.nav-trigger.active span:nth-child(3) { transform: rotate(-45deg); }
.margin {
	padding: 2.92968%;
	max-width: 776px;
	margin: 0 auto;
}
.margin .headline  {
position: relative;
margin-bottom: 36px;
height:32px;
}
.margin .headline h2 {
	font-family: GothamBold, sans-serif;
	font-size:1.928em;
	font-weight: normal;
	text-align: center;
	text-transform: uppercase;
	position: absolute;
	width:100%;
	z-index: 10;
}
.margin .headline h2 span {
	display: inline-block;
	background-color: #fff;
	padding:0 12px;
}
.margin .headline div {
background-color: #1b1464;
height: 3px;
width: 100%;
position: absolute;
top: 9px;
left: 0px;
}
.margin p {
	margin:0 0 12px!important;
}
.margin p.nospace {
	margin-bottom:0!important;
}
.margin p.large {
	text-align: center;
	font-size: 1.28em;
	line-height: 1.6em;
	margin-top:30px!important;
}
.margin p a {
	text-decoration: underline;
	color:#1b1464;
}
.margin p.large strong {
	font-family: Gothambold, sans-serif;
	text-transform: uppercase;
}
.margin h3 {
	font-family: GothamMedium, sans-serif;
	font-size:1.6em;
	line-height: 1.5em;
	text-decoration: none;
	letter-spacing: 1px;
	padding: 0;
	font-weight: normal;
	width:100%;
	margin:0 0 30px;
	text-align: justify;
}
.margin .sub  {
position: relative;
margin: 40px 0 6px;
height:22px;
}
.margin .sub h4 {
	font-family: GothamBold, sans-serif;
	font-size:1.28em;
	font-weight: normal;
	text-align:left;
	position: absolute;
	width:100%;
	z-index: 10;
}
.margin .soldout {
	margin:0 0 50px;
	position: static;
	border-top:2px solid #1b1464;
	border-bottom:2px solid #1b1464;
	padding:20px 0 12px;
}
.margin .soldout p {
	/*font-family: GothamBold, sans-serif;*/
	font-size:1.28em;
	line-height: 1.6em;
	font-weight: normal;
	text-align:left;
	position: static;
	margin:0 0 50px
}
.margin .sub.sponsor  {
margin-bottom: 12px!important;
}
.margin .sub.sponsor h4 {
	text-align:center!important;
	text-transform: uppercase;
}
.margin .sub h4 span {
	display: inline-block;
	background-color: #fff;
	padding-right:12px;
}
.margin .sub div {
background-color: #1b1464;
height: 2px;
width: 100%;
position: absolute;
top: 9px;
left: 0px;
}
.tickets .margin  ul,
.support .margin  ul {
font-family: GothamMedium, sans-serif;
margin:12px 0;
padding:0 0 0 20px;
list-style: none;
text-indent: -20px;
line-height: 1.6em;
}
.tickets .margin  ul li::before,
.support .margin  ul li::before {
content: "•";
padding-right: 7px;
padding-top:0px;
font-size: 1.5em;
line-height: 1em;
}
.payment {
border: 1px solid #1b1464;
padding:15px;
}

.margin.bottom {
	font-family: GothamMedium, sans-serif;
	text-align: center;
}
.margin.bottom p {
	font-size: 1.2em;
}
.margin.bottom h4 {
	font-size: 1.7em;
	line-height: 1.2em;
	font-weight: normal;
	margin:0 0 36px;
}

.margin.bottom .links {
overflow: hidden;
margin:35px auto 45px;
}
.margin.bottom .btn {
	max-width: 475px;
	width: 100%;
	float: left;
	overflow: hidden;
	background-image: url(../images/home_brush.jpg);
	background-size: contain;
	padding: 20px 0;
	background-repeat: no-repeat;
font-size: 1.1em;
line-height: 1.3em!important;
}
.margin.bottom .btn a {
color: #000;
text-decoration: none;
}
.margin.bottom .btn a span {
font-size: 1.3em;
text-decoration: none;
}

.payment {
margin:40px 0;
}

.footer {
	padding: 20px;
	background-color: #fff;
	text-align: center;
	border-top:4px solid #1b1464;
}
.footer p {
font-size: 1em;
line-height: 1.2em;
color:#1b1464;
}
.footer .social {
display: inline-block;
padding-top:12px;
margin:0 auto 20px;
}
.footer .social img {
display: inline-block;
padding:0 30px;
}

.mobile-only { display: none !important; }

/**************MOBILE ****************/

@media only screen and (max-width : 768px) {
body {
	/*font: 18px/30px GothamBook, sans-serif;*/
padding-top:24px!important;
margin-top:55px!important;
}
.donate {
display: block!important;
}
.desktop { display: none !important; }
    .mobile-only { display: inline-block !important; }
    .nav-trigger { display: inline-block; }	
.donate .button a {
	right: 15px!important;
}
.topnav { 
	text-align: center; 
	opacity: 0; 
	visibility: hidden; 
	-webkit-transition: all .3s; 
	-o-transition: all .3s; 
	transition: all .3s; 
	top: 55px!important;
	border:none!important;
	border-top:1px solid #fff!important;
	padding:0!important;
	width:100%!important;
	position:fixed!important;
	left:0px!important;
	z-index: 500;
}
.topnav ul {
	border-bottom:28px solid #fff!important;

}
.topnav ul li {
	display: block!important;
	line-height:30px!important;
}
.topnav ul li + li {
margin-left:0px!important;
border-top:none!important;
}

.topnav ul li a,
.topnav ul li span {
display:block!important;
padding: 8px 0 0!important;
border-bottom: solid 1px #fff;
}
.topnav ul li span {
color:#e8e7ef!important;
}
.topnav ul li a.active,
.topnav ul li a:hover{
color:#fff!important;
background-color: #1b1464!important;
text-decoration: none!important;
}
.topnav.active { opacity: 1!important; visibility: visible;background-color: #d1d0e0!important;padding-bottom: 12px; }
.main {border-top:2px solid #F3A858;padding:20px 5%!important;}
.content {
font-size: 16px;
line-height: 22px;
padding:0!important;
}
.header {
	background-position: right top;
	background-size: 50%;
	padding:0 0 0 15px;
}
    
.margin {
	padding: 0 5%!important;
}
.home .margin.tint  {
padding-top: 30px!important;
padding-bottom: 30px!important;
}
.home .banner p br {
display: none;
}
.home .banner span {
display: block;
padding:0;
}
h3 {
	font-size: 28px;
	line-height: 34px;
	font-weight: normal;
}
h3 br {
	display: none;
}
h3 strong {
	display: block;
}
.header h1 {/*
	font-size: 2em!important;
	line-height: .8em;
	padding-top: 0px;
	margin: 0 0 10px!important;
}
.header h2 {
	font-size: 1.4em!important;
	line-height: 1em!important;
	padding-bottom: 45px;
	margin: 0;
}
.header h3 {
	font-size: 1.1em!important;
	line-height: 1.2em!important;
	margin: 0 0 8px!important;
	padding-top: 30px!important;*/
}
.footer {
	padding-top: 12px;
	margin: 0!important;
}
.footer p {
line-height: 24px;
float:none;
}
.tint {
padding-bottom:30px!important;
margin-bottom:30px!important;
}
.margin.bottom .btn {
	max-width: 550px;
	padding: 15px 0 20px;
	font-size: .9em;
	line-height: 1.2em!important;
}
}


@media only screen and (max-width : 550px) {
body {
	font-size: 14px!important;
	line-height: 20px!important;
}
.margin .headline {
	margin-bottom: 20px!important;
}
.margin .headline h2 {
	font-size: 1.4em!important;
}
.margin  h3 {
	font-size: 1.3em!important;
}
.margin  .sub {
position: static!important;
margin: 24px 0 6px!important;
height:auto!important;
border-top:2px solid #1b1464!important;
padding-top: 12px!important;
}
.margin  .sub h4 {
	position: static!important;
	font-size: 1.2em!important;
}
.margin  .sub div {
display: none!important;
}
.tickets .margin  ul {
	margin: 12px 0;
	padding: 0 0 0 20px;
	list-style: none;
	text-indent: -20px;
	line-height: 1.6em;
}
.tickets .margin  ul li::before {
	content: "•";
	padding-right: 7px;
	padding-top: 0px;
	font-size: 1.5em;
	line-height: 1em;
}





.margin.bottom {
padding-bottom:30px!important;
}
.margin.bottom p br,
.margin.bottom h4 br {
display:none!important;
}
.margin.bottom .btn {
	max-width: 550px!important;
	width: 100%!important;
	font-size: 1.1em!important;
	line-height: 1.3em!important;
}
.footer {
	margin-top: 30px!important;
}
.footer .social img {
	padding: 0 6px!important;
	width: auto!important;
	height:30px!important;
}

}
@media only screen and (max-width : 430px) {
.home .banner  {
height: 340px!important;
}
.home .banner h2 {
font-size: 1em!important;
}
.home .banner p {
font-size: .8em!important;
}
.margin.bottom .btn {
	font-size: .8em!important;
	line-height: 1.2em!important;
	margin-bottom: 12px!important;
	padding-top:18px!important;
}
.margin.bottom h4 {
	font-size: 1.3em!important;
	line-height: 1.2em!important;
}
.margin.bottom p {
	font-size: 1.1em!important;
	line-height: 1.2em!important;
}
.footer .social img {
padding: 0 10px!important;
}
.footer p {
	font-size: .6em!important;
}

}
@media only screen and (max-width : 320px) {
.header {
	margin-bottom: 20px;
}
.header h1 {
	font-size: 26px;
	line-height: 30px;
	padding-top: 20px;
}
.header h2 {
	font-size: 16px;
	line-height: 22px;
	color: #2e3192;
	text-align: center;
	padding: 0 20px 25px;
	margin: 0;
}
.margin p.name {
	font-size: 18px!important;
	line-height: 22px!important;
}
.footer p {
font-size: 14px;
line-height: 18px;

}
}
