/*---------------------------------
	IMPORTS
-----------------------------------*/
/* @import url(https://fonts.googleapis.com/css?family=Arimo:400,700); */




@font-face {
 font-family: Callibri;
 src: url("css/fonts/calibri.eot") /* EOT file for IE */
}
@font-face {
 font-family: Callibri;
 src: url("css/fonts/calibri.TTF") /* TTF file for CSS3 browsers */
}





@font-face {
 font-family: OldCentury;
 src: url("css/fonts/Oldcentu.eot") /* EOT file for IE */
}
@font-face {
 font-family: OldCentury;
 src: url("css/fonts/Oldcentu.TTF") /* TTF file for CSS3 browsers */
}





@font-face {
 font-family: Shouldve;
 src: url("css/fonts/SHOULDVE.eot") /* EOT file for IE */
}
@font-face {
 font-family: Shouldve;
 src: url("css/fonts/SHOULDVE.TTF") /* TTF file for CSS3 browsers */
}




/*---------------------------------
	OVERRIDES
-----------------------------------*/
h1,h2,h3,h4{
font-family:'Droid Serif', serif;
font-weight:normal;
color:#1F3F6B;
line-height:100%;
}


h5,h6{
font-family: "Kreon", serif;
font-weight:normal;
line-height:100%;
color:#3165AD;
}

thead th,
tbody th{
font-family: "OldCentury", arial, verdana, sans-serif;
}

button,
a.btn,
input[type="submit"],
input[type="reset"],
input[type="button"]{
font-family: "Arimo", arial, verdana, sans-serif;
}

.menu{
font-family: "Arimo", arial, verdana, sans-serif;
}

blockquote{
font-family: "Arimo", arial, verdana, sans-serif;
}

a:link, a:visited {
    color: #00499E;

    text-decoration: none;

}

a:hover, a:active {
    color: #ED3034;

    text-decoration: none;
}

/*---------------------------------
	LAYOUT
-----------------------------------*/
body{
margin:0;
padding:0 0 0 0;
color:#282525;
background: #fff;

font:lighter 1.4em/108% 'Bree Serif', serif;


/* this prevents selecting text on website -- for top buttons */
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

}

strong { color:#1946B9; }

#wrap{
width:100%;
background:#fff;
margin:30px auto 30px auto;
padding:0 2%;
border:1px solid #ccc;
}

.story-box {

margin-left:5%; 
margin-right:5%; 
margin-top:20px; 
padding-bottom:20px;
background-color:#f7f5f3;
}



#footer{
text-align:center;
padding:20px;
margin:0;
border-top:1px solid #ddd;
color:#999;
font-size:0.8em;
text-shadow:0px 1px 1px #fff;
position: relative;
top:0;
left:0;
background:#fff;
}


video {
  max-width: 100%;
  min-width:100%;
  object-fit: cover;
height:500px;
}



.topPanelButtonNormal {
float:right;
padding-left:2,5%;
padding-right:3.5%;
padding-top:32px;
padding-bottom:15px;
color:#fff;
text-align:middle;
line-height:95%;
font-size:1.5vw;
font-family:arial;
font-weight:bold;
min-height:80px;
}


.topPanelButtonHighlighted {
float:right;
padding-left:2.5%;
padding-right:3.5%;
padding-top:32px;
padding-bottom:15px;
background-color:#44D9E6;
color:#fff; 
text-align:middle;
line-height:95%;
font-size:1.5vw;
font-family:arial;
font-weight:bold;
min-height:100px;

}


.topPanelButtonNormal:hover {
float:right;
padding-left:1.75%;
padding-right:1.75%;
padding-top:32px;
padding-bottom:15px;
background-color:#44D9E6;
color:#fff; 
text-align:middle;
line-height:95%;
font-size:1.5vw;
font-family:arial;
font-weight:bold;
min-height:100px;
}


.topPanelButtonHighlighted:hover {
float:right;
padding-left:2.5%;
padding-right:3.5%;
padding-top:32px;
padding-bottom:15px;
background-color:#A26224;
color:#fff; 
text-align:middle;
line-height:95%;
font-size:1.5vw;
font-family:arial;
opacity:0.8;
font-weight:bold;
min-height:100px;

}


.eventItems {
    width:60%;
margin-left:5%;
overflow:visible; !important;
 float:left;
}



.slickContainer {
 position:absolute;
  bottom:50px;
    width:80%;
   float:left;

}

.thisEventItem {
  width:90%;
  height:110px;
  background-color:#1866B8;
  color:#fff;
  border-radius:9px;
  text-align:center;
  padding:12% 1% 10% 1%;
  font-family:"Pathway Gothic One", "arial narrow";
  font-size:0.8em;
  line-height:110%;
}


/* top menu styles */



#topMenuStoryBox {
display:none;
position:absolute;
top:330px;
margin-bottom:100px;
width:96%; 
z-index:8888; 
background-color:#D9F2F9; 
border-radius:4px; 
border-color:#004582;
border-style:solid;
padding-left:10%;
padding-right:10%;
margin-left:2%;
margin-right:2%;
min-height:200px;
}


#topMenuStoryBox:after{
  display: inline-block;
  font-size:6vw;
  content: "\00d7"; /* This will render the 'X' */
  position:absolute;
  top:10px;
  right:10px;
  color:#00499E;
}


.accordion {
    background-color: #eee;
    color:#00499E;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 1.1em;
    font-weight:bold;
    transition: 0.4s;
}

.active, .accordion:hover {
    background-color: #AFE3FA; 
}

.panel {
    padding: 0 18px;
    display: none;
    background-color: #AFE3FA;
    overflow: hidden;


.mce-content-body {
background: #fff;
}