@charset "utf-8";
/* CSS Document */
@font-face
{
font-family:myFont;
src:url(../font/SQR721N.ttf);
}
@font-face
{
font-family:helvatica;
src:url(../font/HelveticaWorld-Regular.ttf);
}
body{ font-family:'helvatica',Arial, Helvetica, sans-serif; font-size:12px; color:#333; margin:0px; padding:0px; background:url(../images/content-bg.jpg) top left; }

#header{ width:100%; float:left; position:relative; }
#menu{ width:100%; float:left; position:relative; z-index:1010; height:41px; }
#banner{ width:100%; float:left; position:relative; }
#content{ width:100%; float:left; position:relative; background:url(../images/shadow.png) no-repeat top center;  }
#latest{ width:100%; float:left; position:relative; background:#b7b7b7; padding:10px 0; }
#title{ width:100%; float:left; position:relative; padding:10px 0; }
#footer{ width:100%; float:left; position:relative; color:#EAEAEA; margin: 0 0 10px 0; }

.wrap{ width:1000px; margin:auto; position:relative; }
.wrap2{ width:797px; margin:auto; position:relative; }
.shadow{ position:relative; float:left; width:100%; z-index:199; }

.logo2{ position:relative; width:100%; text-align:center; }

.footer-boder-dv{border-right:2px solid #960226;border-left:2px solid #960226; width:976px; padding:10px; text-align:center; overflow:hidden; background:#960226; border-radius:0 0 10px 10px;  }
.content-border-dv{border-right:2px solid #960226;border-left:2px solid #960226; width:976px; overflow:hidden; padding:10px 10px;  }
.banner-border-dv{border-right:2px solid #960226;border-left:2px solid #960226; width:996px; overflow:hidden;  background:#CCC; }
.footer-menu-dv{border-right:2px solid #960226;border-left:2px solid #960226; width:996px; overflow:hidden;  background:#8a8889;}

ul.footer-menu{ margin:0px; padding:0px;}
ul.footer-menu li{ float:left; position:relative; list-style:none; padding:0px; margin:0px; }
ul.footer-menu li a{ padding:10px 10px; color:#FFF; text-decoration:none; text-transform:uppercase; border-right:1px solid #666; display:block;}

.imgpad{ margin:10px; float:left; position:relative; border:5px solid #8a8889; border-radius:10px; }

h1,h2{ font-weight:normal;}
h1.title{ font-size:15px; font-family:'myFont',arial; }
h1.title2{ font-size:15px; font-family:'myFont',arial; }
.logo{ width:293px; float:left; position:relative;}
.contact{ position:relative; float:right; width:50%; text-align:right; margin:10px 0;}
.top-menu{ position:relative; float:right; margin:10px 0;}

.top-menu ul,.top-menu li{ margin:0px; padding:0px; float:left; list-style:none;  }
.top-menu li{border-right:1px solid #333;}
.top-menu li:last-child{ border:0px;}
.top-menu li a{ margin:0 10px; float:left; display:block; color:#333; text-decoration:none; text-transform:uppercase;}


.menu-div{ width:1000px; position:relative; background:url(../images/menu.jpg) repeat-x top left; height:41px; 
border-radius: 10px 10px 0px 0px;
-moz-border-radius: 10px 10px 0px 0px;
-webkit-border-radius: 10px 10px 0px 0px;
border: 0px solid #000000;
 }

.menu-div input[type="text"]{ width:250px; border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
border: 0px solid #000000;
 margin:6px 10px;
 float:right;
 background:#d9d6d7;
 
 -webkit-box-shadow: inset 10px 10px 5px 0px rgba(71,71,71,1);
-moz-box-shadow: inset 10px 10px 5px 0px rgba(71,71,71,1);
box-shadow: inset 10px 10px 5px 0px rgba(71,71,71,1);
padding:5px;
}

.banner-div{ width:100%; position:relative; float:left; height:338px;}
.slogans{ width:100%; position:absolute; padding:8px 0 22px 0; 
font-size:13px; height:100px;
background:#333; opacity:0.7; filter:alpha(opacity=70); text-align:center; color:#FFF;
top:142px;
font-weight:bold;
}
#banners {
   width:996px; height:210px;
    position:relative;
	z-index:100;
    font-family:Arial, sans-serif;
	 
}
#banners .banner{
    position: absolute;
    top:0;
	left:0;
    display:block;
}


.banner.current{ z-index: 2; }
#controls{
    position: absolute;
    right: 48%;
    top: 165px;
    width: auto;
    z-index: 100;

}

#controls li{ float:left; margin:2px; list-style:none;}
#controls li a{
    display:-moz-inline-box; /* < = FF2 hack */
    display:inline-block;
    font-size:12px;
    padding:5px;
	border-radius:15px;
    text-decoration:none;
    color: #333;
   background: #CCC;

}
#controls li.active a{ 
    border-color:#FFF;
    color:#FFF;
    -webkit-box-shadow: inset 10px 10px 5px -6px rgba(0,0,0,0.75);
-moz-box-shadow: inset 10px 10px 5px -6px rgba(0,0,0,0.75);
box-shadow: inset 10px 10px 5px -6px rgba(0,0,0,0.75);
font-size:10px;

background: #960226;

}
#controls li a:hover{ 
    border-color:#FFF;
    color: #FFF;
    background:#333;
	
	-webkit-box-shadow: inset 10px 10px 5px -6px rgba(0,0,0,0.75);
-moz-box-shadow: inset 10px 10px 5px -6px rgba(0,0,0,0.75);
box-shadow: inset 10px 10px 5px -6px rgba(0,0,0,0.75);
font-size:10px;

background: rgba(76,76,76,1);
background: -moz-linear-gradient(top, rgba(76,76,76,1) 0%, rgba(19,19,19,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(76,76,76,1)), color-stop(100%, rgba(19,19,19,1)));
background: -webkit-linear-gradient(top, rgba(76,76,76,1) 0%, rgba(19,19,19,1) 100%);
background: -o-linear-gradient(top, rgba(76,76,76,1) 0%, rgba(19,19,19,1) 100%);
background: -ms-linear-gradient(top, rgba(76,76,76,1) 0%, rgba(19,19,19,1) 100%);
background: linear-gradient(to bottom, rgba(76,76,76,1) 0%, rgba(19,19,19,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313', GradientType=0 );
}
.welcome{ position:relative; width:100%; float:left;}
h2.title{ position:relative; float:left; width:314px; font-family:'myFont',arial; 
background: rgba(76,76,76,1);
background: -moz-linear-gradient(top, rgba(76,76,76,1) 0%, rgba(89,89,89,1) 12%, rgba(102,102,102,1) 25%, rgba(71,71,71,1) 39%, rgba(44,44,44,1) 50%, rgba(0,0,0,1) 51%, rgba(17,17,17,1) 60%, rgba(43,43,43,1) 76%, rgba(28,28,28,1) 91%, rgba(19,19,19,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(76,76,76,1)), color-stop(12%, rgba(89,89,89,1)), color-stop(25%, rgba(102,102,102,1)), color-stop(39%, rgba(71,71,71,1)), color-stop(50%, rgba(44,44,44,1)), color-stop(51%, rgba(0,0,0,1)), color-stop(60%, rgba(17,17,17,1)), color-stop(76%, rgba(43,43,43,1)), color-stop(91%, rgba(28,28,28,1)), color-stop(100%, rgba(19,19,19,1)));
background: -webkit-linear-gradient(top, rgba(76,76,76,1) 0%, rgba(89,89,89,1) 12%, rgba(102,102,102,1) 25%, rgba(71,71,71,1) 39%, rgba(44,44,44,1) 50%, rgba(0,0,0,1) 51%, rgba(17,17,17,1) 60%, rgba(43,43,43,1) 76%, rgba(28,28,28,1) 91%, rgba(19,19,19,1) 100%);
background: -o-linear-gradient(top, rgba(76,76,76,1) 0%, rgba(89,89,89,1) 12%, rgba(102,102,102,1) 25%, rgba(71,71,71,1) 39%, rgba(44,44,44,1) 50%, rgba(0,0,0,1) 51%, rgba(17,17,17,1) 60%, rgba(43,43,43,1) 76%, rgba(28,28,28,1) 91%, rgba(19,19,19,1) 100%);
background: -ms-linear-gradient(top, rgba(76,76,76,1) 0%, rgba(89,89,89,1) 12%, rgba(102,102,102,1) 25%, rgba(71,71,71,1) 39%, rgba(44,44,44,1) 50%, rgba(0,0,0,1) 51%, rgba(17,17,17,1) 60%, rgba(43,43,43,1) 76%, rgba(28,28,28,1) 91%, rgba(19,19,19,1) 100%);
background: linear-gradient(to bottom, rgba(76,76,76,1) 0%, rgba(89,89,89,1) 12%, rgba(102,102,102,1) 25%, rgba(71,71,71,1) 39%, rgba(44,44,44,1) 50%, rgba(0,0,0,1) 51%, rgba(17,17,17,1) 60%, rgba(43,43,43,1) 76%, rgba(28,28,28,1) 91%, rgba(19,19,19,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313', GradientType=0 );

padding:5px;

border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
border: 0px solid #000000;

color:#FFF;

font-size:14px;
}
.box{ width:303px; position:relative; float:left; margin:0 5px; background:#8c0022; padding:10px;
 border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
border: 0px solid #000000;
}
.mainbox{ width:333px; float:left;}
.mainbox2{ width:323px; float:left; margin:5px;}

.footer-menu ul ,.footer-menu ul li{ margin:0px; padding:0px; }
.footer-menu ul li a{ margin:0 10px; display:block; }

/* =Navigation
-------------------------------------------------------------- */
/* clip skip link for screen readers */
.skip-link {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
}
#access {
   
    overflow:visible;
    z-index:100;
}
/* style the main menu 8*/
.sf-menu{
 /*   border: 1px solid #000;*/
    border-top: none;
}
/* get rid of padding and margin off all ul's (not sure about using * here, could be better) */
.sf-menu, .sf-menu * {
    margin:0;
    padding:0;
    list-style:none;
}
/* position all dropdowns off screen */
.sf-menu ul {
    position:absolute;
    top:-999em;
}
/* style the main nav list items */
.sf-menu li {
   background: #8a8889;
    /* background-image: url('../img/menuBg.png'), linear-gradient(bottom, rgb(36,35,36) 0%, rgb(0,0,0) 100%);
    background-image: url('../img/menuBg.png'), -o-linear-gradient(bottom, rgb(36,35,36) 0%, rgb(0,0,0) 100%);
    background-image: url('../img/menuBg.png'), -moz-linear-gradient(bottom, rgb(36,35,36) 0%, rgb(0,0,0) 100%);
    background-image: url('../img/menuBg.png'), -webkit-linear-gradient(bottom, rgb(36,35,36) 0%, rgb(0,0,0) 100%);
    background-image: url('../img/menuBg.png'), -ms-linear-gradient(bottom, rgb(36,35,36) 0%, rgb(0,0,0) 100%);
    background-image: url('../img/menuBg.png'), -webkit-gradient( linear, left bottom, left top, color-stop(0, rgb(36,35,36)), color-stop(1, rgb(0,0,0)));
    background-repeat: repeat-x;
    border-top: 1px solid #242324;*/
    clear: left;
    float:left;
    position:relative;
    width: 100%;
}


/* change the main nav list items on hover */ 
.sf-menu li:hover {
    background:#8a8889 !important;
    visibility:inherit; /* fixes IE7 'sticky bug' */
}
/* style all the links */
.sf-menu a {
    font-size: .8em;
    color: #fff;
    display:block;
 /*   padding: 12px 0;*/
    text-decoration: none;
    text-indent: 12px;
	text-align:center;
	text-transform:uppercase;
}
/* style the first drop */
.sf-menu li li, .sf-menu li li:hover{
    background: none;
    background-image: none;
}
/* add a larger text indent for the first drop links */
.sf-menu li li a{
    text-indent: 24px;
}
/* add a larger text indent for the second drop links */
.sf-menu li li li a{
    text-indent: 36px;
}
/* add a larger text indent for the third drop links */
.sf-menu li li li li a{
    text-indent: 48px;
}
/* position first drop */
.sf-menu li:hover ul {
    top:auto; /* match top ul list item height */
    position:relative;
}
/* make sure second drop is still off screen */
ul.sf-menu li:hover li ul {
    position: absolute;
    top:-999em;
}
/* position second drop */
ul.sf-menu li li:hover ul {
    top:auto;
    position:relative;
}
/* make sure third drop is still off screen */
ul.sf-menu li li:hover li ul {
    position: absolute;
    top:-999em;
}
/* position third drop */
ul.sf-menu li li li:hover ul {
    top:auto;
    position:relative;
}
ul.sub-menu{ width:200px !important; background:#8a8889 !important; }
ul.sub-menu a{ text-align:left !important ;}
ul.sub-menu li{background-image:none !important; }
ul.sub-menu li a:hover{ background:#960226;}

@media only screen and (min-width: 480px) {
}
@media only screen and (min-width: 600px) {
    /* set height so content isn't pushed down */
    #access{
        float: left;
       /* height: 36px;*/
        width: 100%;
    }
    /* set height so content isn't pushed down add z-index to keep drops above content */
    .sf-menu{
        /*height: 36px;*/
        z-index: 100;
    }
    /* restyle so main links are horizontally aligned */
    .sf-menu li {

        clear: none;
        padding-right: 10px;
       /* min-width: 14%;*/
        width: auto; /* this will need to be adjusted for your needs */
	 background:url(../images/menu-bg.jpg) no-repeat top right !important;
    }
	 .sf-menu li:last-child{ background-image:none !important;}
    /* new style for drop list items */
    .sf-menu li li{
        background: #8a8889;
        clear: left;
        width: 95%;
    }
    /* reset text indent on all drop a tags and set the width to 100% */
    .sf-menu li li a, .sf-menu li li li a, .sf-menu li li li li a{
        text-indent: 12px;
        width: 200px;
    }
    /* reposision and style the first drop */
    .sf-menu li:hover ul{
        background: #000;
        left: auto;
        position: absolute;
        top: -1;
        width: 100%;
        z-index: 100;
    }
    /* reposision and style the second drop */
    ul.sf-menu li li:hover ul{
        background: #000;
        position: absolute;
        top: -1px;
        left:100%;
    }
    /* reposision and style the third drop */
    ul.sf-menu li li li:hover ul{
        background: #000;
        position: absolute;
        top: -1px;
        left:100%;
    }
}
@media only screen and (min-width: 768px) {
    header h1{
    font-size: 30px;
}
}
@media only screen and (min-width: 992px) {
    header h1{
        font-size: 36px;
    }
    /* bigger screen bigger nav */
    #access{
        /*height: 50px;*/
    }
    /* bigger screen bigger nav */
    .sf-menu{
        /*height: 50px;*/
    }
    /* bigger screen bigger font size and padding */
    .sf-menu a {
        font-size: 1em;
        padding: 9px 0;
    }
}


