@import url("font-awesome.min.css");
@import url("https://fonts.googleapis.com/css?family=Oswald:400,300,700");

/**************** html definitions ****************/

* {font-family: 'Oswald', sans-serif;}
body {
    color:#666; 
/*    background-color:#231f20; */
    font-size:14pt; 
    font-weight: 300
}
p {font-size:1em}
a {color: #0C716C}
h1 {color: #7e918b; font-weight: 300;}
/**************** template definitions ****************/
#page {background-color:#231f20;}
#header {
    width:100%; 
/*    height: 100px; */
    position: fixed; z-index: 999; border-bottom:1px solid #FFF; top: 0;}
.menuUp {background: #231F20;}
.menuDown {background: #231F20;}

#sub-header {
    background-color: black;
/*	position: fixed;*/
    top: 0;
    bottom: 0;
    width: 100%;
    height: 35px;
}

#sub-header .sub-list {
	display: flex;
    justify-content: flex-end;
    padding: 2px 15px;
    margin: 0;

    color: white;
}

#sub-header li {
	padding: 0px 20px;
    list-style-type: none;
}

#sub-header li a {
	color: #fff;
}

#main {background-color: #fff;}
#logo {margin-left: 1rem;}
#logo a {background: url(../images/logo.png) no-repeat; color: #FFFFFF; font-size: 2em; display: block; width: 240px; height: 86px; line-height: 100px; overflow:hidden; text-indent:-9999px;}


#login {
/*    display: none; */
    position: absolute; width: 300px; padding-top:1em; background: #7A003B; top: 100%; right: 0;
}
#login iframe {width: 250px; height: 115px; margin: 0 1em;}
#login h2 {color: #FFF; margin: 0 1em 1em; font-size: 1.2em; line-height: 30px; }
#login .links {
	clear: both;
	color: #ccc;
	display: block;
	margin: 0 1em 1em;
	}

#login .links a {
	text-decoration: none;
	color: #FFF;
	font-size: .7em;
	}

#login .links a:hover {
	text-decoration: underline;
	}

#login-toggle {display: block; border: 0; border-radius:0;  margin: 0; padding: 0 1.5em; font-size:1em; line-height:100px; text-transform: uppercase; text-shadow: 1px 1px 1px #212121;}
#menu-toggle {background-color: #016A65; margin-right: auto;text-transform: uppercase;}
#menu-toggle:hover {background: #009999;}
#login-toggle {background-color: #70193d; right: 0;}
#login-toggle:hover{background-color: #9c2355} 

/*
#navigation {display: block; width: auto; float:right; position: relative; z-index: 99; white-space:nowrap}
#navigation ul {list-style: none; padding: 0; margin: 0;}
#navigation a {display: block; text-decoration: none;}
#navigation a span {vertical-align: middle;}
#navigation-inner > nav > ul > li {display: inline-block;}
*/
#navigation .nav-link {color: #FFF; padding: 0 1em; line-height: 100px; text-transform: uppercase; text-shadow: 1px 1px 1px #212121;}
#navigation .nav-link:hover, #navigation .nav-link:focus, #navigation .selected{color: #009999}
#navigation .navbar-nav .dropdown-menu{background-color: #7A003B; border-radius: 0; padding: 0;margin:0}
#navigation .navbar-nav .dropdown-menu a {font-size: .9rem; color: #FFF; font-weight: 300; padding: .5em 1em;}
#navigation .navbar-nav .dropdown-menu a:hover, #navigation .navbar-nav .dropdown-menu a:focus {color: #FFF; background-color:  #9C2355;}

/*
#navigation-inner > nav > ul > li:hover { background-color: none;}
#navigation-inner > nav > ul > li:hover > ul 
#navigation ul ul {display:none; position: absolute; width: 250px;}
#navigation-inner > nav > ul > li:hover ul {
	display: block;
	}*/

#banner { border-bottom:1px solid #D8D8D8; height:40px}
#banner ul {list-style: none; padding: 0; margin: 0;}
#banner ul li {display: inline-block; background: url(../images/arrow.svg) no-repeat scroll left top; padding: 0 2em; line-height: 40px; }

#carousel {background-color: #231F20;}
.slideshow {max-width: 100%; position: relative;}
.carousel, .slides-pagination {list-style: none; padding: 0; margin: 0; position: relative; z-index: 10;}
.carousel li {z-index:1; background-position: center; padding: 0; margin:0 !important;	width: 100%; height: 100%; min-height:600px; left: 0px; top: 0px; -webkit-background-size: cover; -moz-background-size: cover;  -o-background-size: cover; background-size: cover; }
.carousel img {width: 100%; height: auto;}
.carousel-content {
       background: rgb(0,0,0);
background: linear-gradient(0deg, rgba(0,0,0,0.9) 0%, rgba(255,255,255,0) 71%); 
/*    background: url(../images/slides/slide-gradient.png) bottom repeat-x; */
    width: 100%; height:600px; position:relative; z-index:100;
}
.carousel-message { color: #FFF; text-align:center; padding-top:450px;}
.carousel-message h1, .carousel-message h2 {color: white; font-size:2em; font-weight: 400; line-height:100%; text-shadow: 1px 1px 1px #212121;}
.carousel-message span {font-size: .7em; font-weight:300;}
.slides-pagination {text-align: center;position: absolute; z-index: 11; width: 100%; margin-top: -30px;}
.slides-pagination li {display: none;}
.slides-pagination li a {display: block; width: 24px; height: 24px; overflow: hidden; text-indent: -9999px; border-radius: 12px; border: 2px solid #FFF; margin: 0 6px;}
.slides-pagination li.selected a {background-color: rgba(255,255,255,.8);}
.slides-next, .slides-prev {position: absolute; z-index: 20; top: 50%; display: block; width: 30px; height: 30px; line-height: 30px; text-align: center; margin-top: -15px;}
a.slides-next , a.slides-prev {color: #FFF}
.slides-next {right: 0;}

.readmore{box-shadow: 1px 1px 2px #3d3d45; background: #7A003B; background-image: linear-gradient(90deg,  #9C2355, #7A003B); border:1px solid #D8D8D8; border-radius:5px; display:inline-block; color:#FFF; font-size:1em; font-weight:300; margin: 10px 0px; padding: .2em 1em; line-height: 1.6em; text-decoration:none;}
.readmore:hover { background: #7A003B; background-image: linear-gradient(90deg,  #7A003B, #9C2355); color:#FFF; text-decoration: none;}

#main-inner {padding: 135px 0 0;}

#main-section-1, #main-section-2, #main-section-1 a, #main-section-2 a{color: #FFF; font-size: 1.5em; text-align: center;}
#main-section-1, #main-section-2 {background-color:#7A003B; position: relative;}
.left-angle, .right-angle {position: relative;}
.left-angle:after, .left-angle:before {
	right: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	z-index:99;
}

.left-angle:after {
	border-color: rgba(136, 183, 213, 0);
	border-right-color: #7A003B;
	border-width: 150px;
	margin-top: -150px;
}
.left-angle:before {
	border-color: rgba(194, 225, 245, 0);
	border-right-color: #016A65;
	border-width: 156px;
	margin-top: -156px;
}
#picture-1{background: url(../images/Haskell.jpg) center; min-height:300px; left: 0px; top: 0px; -webkit-background-size: cover; -moz-background-size: cover;  -o-background-size: cover; background-size: cover; position: relative; z-index:10;}
.right-angle:after, .right-angle:before {
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	z-index:99;
}

.right-angle:after {
	border-color: rgba(156,35,85, 0);
	border-left-color:  #7A003B;
	border-width: 150px;
	margin-top: -150px;
}
.right-angle:before {
	border-color: rgba(194, 225, 245, 0);
	border-left-color: #016A65;
	border-width: 156px;
	margin-top: -156px;
}

#picture-2{background: url(../images/Abilene.jpg) center; min-height:300px; left: 0px; top: 0px; -webkit-background-size: cover; -moz-background-size: cover;  -o-background-size: cover; background-size: cover; position: relative; z-index:10;}




#content {padding:2rem 0;} 
#products {padding:4em} 
#products img{display: block; position: relative; z-index:10;}
#products h3 {position: relative; height: 0; color: #333; font-size:1.5em; font-weight: 400; top: 50px; z-index: 99}

#links {padding:2em 0}
#links h3{margin-bottom: 2em}
#links ul {list-style: outside none none; margin-left: 0; padding: 0}
#links li a{font-size: .8em;}

#links .col-sm-3 {border-right:1px solid #8f8d8d; padding: 0 1em 0 3em; height: 350px;}
.last {border-right: 0 !important;}

#chart{border-collapse: collapse;text-align: left; margin-bottom:1em;}
#chart th{background: #EFF0EB; font-weight: bold; color: #7A003B; padding: 10px 8px; border-bottom: 2px solid #CCCCCC; }
#chart td{ border-bottom: 1px solid #ccc; color: #666; padding: 6px 8px; vertical-align:text-top;}
#chart tbody tr:hover td{ color: #333; background:#eff0eb;}

#footer *, #links *{color: #FFF;}
#footer .disclosures{font-size:1.2em}
#footer {font-size: 90%; border-top: 1px solid #8f8d8d;}
#footer-inner {padding: 30px 0;}
#copyright, #fdic-ehl {margin-bottom: 1em;}
#copyright a, #fdic-ehl a{padding: 0 1em}
/**************** handheld definitions ****************/

@media (max-width: 767px) {
    #sub-header .sub-list {justify-content: center;}
    #sub-header li {padding: 0 .25rem;font-size: .9rem;}
	#header {position: relative; background: #231F20;}
	#header-inner, #navigation-inner {padding: 0;}
    #logo a {display: block; width: 200px; height: 40px; background-position: 50% 50%; background-size: contain;  margin: 0 auto;}
    #menu-toggle, #login-toggle {display: block; border: 0; border-radius:0;  margin: 0; padding: 0 .5em; height: 50px; font-size:.8em; line-height:50px; text-transform: uppercase; text-shadow: 1px 1px 1px #212121;}
    #navigation .nav-link {line-height: 40px;}
    #login, .carousel-content {float: none; width: 100%; right: 0;}
    #login iframe {width: 90%;}
/*	#navigation, #login {display: none; position: absolute; width: 100%; top: 51px;}*/
/*	*/
/*
	#logo {float: none; width: 200px; margin: 0 auto; text-align: center; top: .2em;}
*/
	#copyright, #fdic-ehl {float: none !important; text-align: center;}
	#fdic-ehl {padding: 15px 0;}
	
/*
	
	
	#navigation {float: none; background: #231F20;}
	#navigation-inner > nav > ul > li {display: block;}
	#navigation-inner > nav > ul > li > a {line-height: 40px;}
	#navigation ul ul {display:none; position: relative; width: 100%;}
	#navigation ul ul a {padding: .5em 1em .5em 2.5em;}
*/
	
	.carousel li, .carousel-content {height: 300px; min-height: 300px;}
	.carousel-message {padding-top: 200px; font-size: 50%}
	#main-inner {padding: 51px 0 0;}
	#main-section-1 img {width:100%; height: auot;}
	#links .col-sm-3 {height: auto;}
}

/**************** small tablet definitions ****************/

@media (min-width: 768px) and (max-width: 991px) {
	#header-inner, #navigation-inner {padding: 0;}
    #logo {margin: 0 1rem;}
/*	#navigation, #login {display: none;}*/
/*
	#logo {float: none; width: 200px; margin: 0 auto; text-align: center;}
	#logo a {display: block; width: 200px; height: 99px; background-size: contain; margin: 0 auto;}
*/
	#copyright, #fdic-ehl {float: none; text-align: center;}
	#fdic-ehl {padding: 15px 0;}
    
	#navigation .navbar-collapse {background: #231F20;}
    #navigation .nav-link {line-height: 40px;}
/*
	
	#navigation-inner > nav > ul > li {display: block;}
	#navigation-inner > nav > ul > li > a 
	#navigation ul ul {display:none; position: relative; width: 100%;}
	#navigation ul ul a {padding: .5em 1em .5em 2.5em;}
*/
    #login {right: 0;}
	#links .col-sm-3 {height: 500px;}
	
}

/**************** tablet definitions ****************/

@media (min-width: 992px) and (max-width: 1000px) { 
    #navigation .nav-link {
      padding: 0 .5rem;
    }
}

@media (max-width: 640px ) /* 640 */ {
	
}

@media (min-width: 992px) {
    #navigation .dropdown-toggle::after {display: none;}
}