/* CSS Document */

div#container {width: 100%;} 

div#header, div.header{
    height:116px;
    background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 0%, #ededed 50%, #f6f6f6 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, #ffffff), color-stop(50%, #ededed), color-stop(100%, #f6f6f6));
    background: -webkit-linear-gradient(top, #ffffff 0%, #ededed 50%, #f6f6f6 100%);
    background: -o-linear-gradient(top, #ffffff 0%, #ededed 50%, #f6f6f6 100%);
    background: -ms-linear-gradient(top, #ffffff 0%, #ededed 50%, #f6f6f6 100%);
    background: linear-gradient(to bottom, #ffffff 0%, #ededed 50%, #f6f6f6 100%);
    padding: 0; 
}
 
/*#nameplate {
background:url(../assets/main/nameplate.png) top left no-repeat;
width: 665px;
height: 75px;
text-indent: -9999px;
margin: 0;}*/

.mainlink {background:none !important;}
.mainlink ul li a {background:none !important; color:#660000;font-size:1rem;line-height:1.1 !important; padding-top:8px !important; padding-bottom:8px !important; font-size:1.05rem;}
.mainlink ul li:hover a {background:#600 !important; color:#660000;/* font-size:1em;*/}
.mainnav {
position:relative;
z-index:100;
background: #ffffff;
background: -moz-linear-gradient(top, #ffffff 0%, #ededed 50%, #f6f6f6 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, #ffffff), color-stop(50%, #ededed), color-stop(100%, #f6f6f6));
background: -webkit-linear-gradient(top, #ffffff 0%, #ededed 50%, #f6f6f6 100%);
background: -o-linear-gradient(top, #ffffff 0%, #ededed 50%, #f6f6f6 100%);
background: -ms-linear-gradient(top, #ffffff 0%, #ededed 50%, #f6f6f6 100%);
background: linear-gradient(to bottom, #ffffff 0%, #ededed 50%, #f6f6f6 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6', GradientType=0 );
 padding: 0;
-webkit-box-shadow: 0px 0px 5px 0px rgba(51,51,51,0.39);
-moz-box-shadow: 0px 0px 5px 0px rgba(51,51,51,0.39);
box-shadow: 0px 0px 5px 0px rgba(51,51,51,0.39);
min-height:35px;
}

#mainnav table {
	color: #FFF;
}

.social{height:35px;
position:relative;
z-index:100;
background: #660000;
 padding-top: 5px;
 -webkit-box-shadow: 0px 0px 5px 0px rgba(51,51,51,0.39);
-moz-box-shadow: 0px 0px 5px 0px rgba(51,51,51,0.39);
box-shadow: 0px 0px 5px 0px rgba(51,51,51,0.39); 
z-index:2000;}

.footer {background-color:#440000; color:white;}
.smalllinks{font-size:.7rem;font-weight:lighter; opacity:.8; text-align:left; line-height:1rem;}
.smalllinks a{color:white; text-decoration:none;}
.smalllinks a:hover{text-decoration:underline;}
.bottom {
	height: 160px;
	/*background-image:url(../assets/footer/btmbkgd.jpg);
	background-repeat:repeat-x;*/
	color: white;
	background-color:#440000;
}
h3 {
  font-family: 'Open Sans', sans-serif;
  color: #fff !important;
}
@media only screen and (min-width: 641px) {
  .dropdown-wrapper {
    background-color: #660000 !important;
    padding: 10px 0;
  }
}

.top-bar-section ul li > a {
	font-size:1rem;
}
	
.has-dropdown {z-index:200;}

.small_main a {
	background-color:white !important;
	color:#660000 !important;
	font-size:105%;
	}
.fi-magnifying-glass {
	font-size:21px;
	color:white;
	padding-left:25px;
	}
 
.fi-home {
	font-size:12px;
	}

.fi-social-facebook {font-size:21px;color:white;}
.fi-social-twitter {font-size:21px;color:white;}
.fi-social-instagram {font-size:21px;color:white;}
.fi-social-youtube {font-size:21px;color:white;}

.footer  ul li {
	padding: 0 0 0.4375rem .7rem;
	list-style-type: none;
	list-style-position: outside;
  font-size:.8rem;	border-left-width: 2px;
	border-left-style: groove;
	border-left-color: #660000;
}
  
 .footer  ul li a{
	color:white;
	text-decoration:none;
  font-weight:normal;
  }
  
  .footerlinklist {opacity:.7;}
  
  .footer  ul li a:hover {
  text-decoration:underline;
  }

 .btmapplybutton {
	font-size: 1rem;
	font-weight: bold;
	background-color: white;
	color: #660000;
	border: 1px solid white;
	padding: 1px;
}
.footercol1 {
	margin-left:-1em;
}
.left {font-size:110%;}
.searchbutton {background:transparent; left:-35px; top:5px;}
.searchbutton input#submit {
    background:url(/Assets/uploads/images/mag_glass.png) no-repeat;
    cursor: pointer;
    height: 40px;
    width: 35px;
    border: 0;
    text-indent: -9999px;
}
.postfix {border-width:0px !important;}

#bottom-slider-wrapper span.slick-next.slick-arrow { right: 10px; }
#bottom-slider-wrapper span.slick-prev.slick-arrow { left: 10px; }
#bottom-slider-wrapper, #bottom-slider-wrapper .banner-full-width, #bottom-slider-wrapper .banner-inner-width {
    height: auto;
}
#bottom-slider-wrapper span.slick-arrow {
    position: absolute;
    top: 45%;
    font-size: 50px;
    font-weight: bold;
    color: #660000;
    z-index: 9999999;
}

@media screen and (min-width: 1131px) {
    #topImageSliderWrapper {
        width: 100% !important;
        display: block;
    }
    #topImageSlider span.slick-arrow {
        position: absolute;
        top: 45%;
        font-size: 70px;
        font-weight: bold;
        color: #660000;
        z-index: 9999999;
    }
    #topImageSlider .slick-dots button {
        display: none;
    }
    #topImageSlider .slick-dots {
        margin: 0px auto !important;
        width: 100%;
        padding: 5px 0px;
        position: relative !important;
        text-align: center;
        display: block !important;
    }
    .newsevents {
        margin-top: 60px;
    }
    #topImageSlider .slick-dots li:before {
        content: "\f10c";
        font-family: fontawesome;
        margin-left: 20px;
        font-size: 30px;
        color: #660000;
    }
    #topImageSlider .slick-dots li.slick-active:before {
        content: "\f192";
        font-family: fontawesome;
        margin-left: 20px;
        font-size: 30px;
        color: #660000;
    }
    #topImageSlider .slick-dots li { display: inline; }
    #topImageSlider span.slick-next.slick-arrow { right: 20px; }
    #topImageSlider span.slick-prev.slick-arrow { left: 20px; }
}

@media screen and (max-width: 1130px) {
    #topImageSlider, #topImageSlider .banner-full-width, #topImageSlider .banner-inner-width {
        height: 67vh;
    }
    .mainnav {
        min-height: 55px !important;
    }
    #topImageSlider .slick-arrow {
        display: none !important;
    }
    #topImageSlider ul.slick-dots {
        display: none !important;
    }
}

@media screen and (max-width: 800px) {
    .top-bar-section ul li > a {
        font-size: 0.7125rem !important;
    }
}

.hpnews li {display:inline; width:30%; font-size:0px; padding:.2em 1em;}

.hpnews img {	border: 1px solid #CCC;
	padding: 1px;}

}

.perc-list-horizontal {
    min-height: 300px;
}

.perc-list-horizontal p{
    color:#555; font-size:14px;
}

.perc-list-horizontal p a{
    font-size:16px;
}
.perc-list-horizontal li
{
    float: left;
    position: relative;
    list-style-type: none;
    margin-right:26px;
}

.perc-file-auto-list.perc-list-horizontal li{
    margin-right:0px;
}

.perc-list-title
{
    font-family: Times New Roman;
    font-style: regular;
    font-size: 18px;
}

.perc-page-auto-list  .perc-list-main {
    margin-top: 0px;
    padding-left: 0px;
}

.perc-list-main-container {
    padding-top: 0px;
    margin-top: 0px;
    padding-left: 0px;
}

 .perc-tag-list .perc-list-main-container, .perc-tag-list .perc-list-main {
    padding-top: 0px;
    margin-top: 0px;
    padding-left: 0px;
}

#eventshp ul {display:inline; list-style-type:none;}
#eventshp {color:#555;}
.perc-list-element
{list-style-image: none;}
#eventshp p {
font-family: inherit;
font-weight: normal;
font-size: .9rem;
text-rendering: optimizeLegibility;
}
ul.perc-list-main {margin:0;}


/*
This is the visible area of you carousel.
Set a width here to define how much items are visible.
The width can be either fixed in px or flexible in %.
Position must be relative!

.jcarousel {
    position: relative;
    overflow: hidden;
}

This is the container of the carousel items.
You must ensure that the position is relative or absolute and
that the width is big enough to contain all items.
.jcarousel ul {
    width: 20000em;
    position: relative;
    list-style: none;
    margin: 0;
    padding: 0;
}

These are the item elements. jCarousel works best, if the items
have a fixed width and height (but it's not required).

.jcarousel li {
    float: left;
}*/



@media screen and (min-width: 1131px) and (max-width: 1200px) {
    #topImageSlider, #topImageSlider .banner-full-width, #topImageSlider .banner-inner-width {
        height: 390px;
    }
}

@media screen and (min-width: 1201px) and (max-width: 1300px) {
    #topImageSlider, #topImageSlider .banner-full-width, #topImageSlider .banner-inner-width {
        height: 430px;
    }
}

@media screen and (min-width: 1301px) and (max-width: 1400px) {
    #topImageSlider, #topImageSlider .banner-full-width, #topImageSlider .banner-inner-width {
        height: 460px;
    }
}

@media screen and (min-width: 1401px) and (max-width: 1500px) {
    #topImageSlider, #topImageSlider .banner-full-width, #topImageSlider .banner-inner-width {
        height: 500px;
    }
}

@media screen and (min-width: 1501px) and (max-width: 1600px) {
    #topImageSlider, #topImageSlider .banner-full-width, #topImageSlider .banner-inner-width {
        height: 544px;
    }
}

@media screen and (min-width: 1601px) and (max-width: 1700px) {
    #topImageSlider, #topImageSlider .banner-full-width, #topImageSlider .banner-inner-width {
        height: 570px;
    }
}

@media screen and (min-width: 1701px) and (max-width: 1800px) {
    #topImageSlider, #topImageSlider .banner-full-width, #topImageSlider .banner-inner-width {
        height: 600px;
    }
}

@media screen and (min-width: 1801px) {
    #topImageSlider, #topImageSlider .banner-full-width, #topImageSlider .banner-inner-width {
        height: 670px;
    }
}