/*---------------- body fonts----------------------*/
body
{
background:url(images/bg.gif) repeat #000000;
padding:0; font-family:arial, sans-serif; font-size:100%;
margin:0px auto auto auto;
color:#36322b;
}
p{
padding:0px;
padding-bottom: 8px;
text-align:justify;
margin:0px;
line-height:20px;
}
p.welcome{
padding:10px 5px 0 5px;
}

p.c{
text-align: center;
vertical-align: middle;
line-height:20px;
padding:0px;
margin:0px;
}

p.white{
padding:0px;
text-align:justify;
margin:0px;
line-height:20px;
color:#FFF;
}

p.tan{
padding:0px 0px 8px 0px;
text-align:justify;
margin:0px;
line-height:20px;
color:#E5D4C6;
}

p.brown{
padding:0px 0px 8px 0px;
text-align:justify;
margin:0px;
line-height:20px;
color:#5C3317;
}

.clear{
clear:both;
}

a{
text-decoration:underline;
}

.title{
width: auto;
display:block;
padding:2px 0 10px 0;
font-size:120%;
color:#2e2721;
font-weight:bold;
}
.title_page{
text-align: center;
vertical-align: middle;
width: auto;
padding:0 0 0 0;
font-size:150%;
color:#AC6F5F;
margin:0 0 .5% .5%;
}

.title_pagel{
text-align: center;
vertical-align: middle;
width: auto;
padding:0 0 0 0;
font-size:150%;
color:#E5BCA5;
margin:0 0 .5% .5%;
}
.title_index{
width: auto;
padding:0 0 0 0;
text-align: center;
vertical-align: middle;
font-size:200%;
color:#42A26F;
margin:0 0 1vw 0;
}


/*----------------------Sliding image box-------------------------*/

* {box-sizing: border-box;}

.img-comp-container {
  position: relative;
  height: 200px; /*should be the same height as the images*/
}

.img-comp-img {
  position: absolute;
  width: auto;
  height: auto;
  overflow:hidden;
}

.img-comp-img img {
  display:block;
  vertical-align:middle;
}

.img-comp-slider {
  position: absolute;
  z-index:9;
  cursor: ew-resize;
  /*set the appearance of the slider:*/
  width: 40px;
  height: 40px;
  background-color: #2196F3;
  opacity: 0.7;
  border-radius: 50%;
}



/*---------------- buttons----------------------*/

a.bluebutton{
display:inline;
height:auto;
text-align:center;
white-space: nowrap;
margin:0.5vw 0.75vw 0.5vw 0.75vw;
padding:0.5vw 0.75vw 0.5vw 0.75vw;
color: white;
text-decoration:none;
background:#1288E0; /*blue button color*/
border-radius: 2%;
line-height: 2vw;
}
a.bluebutton a:hover{
background:#0576C4; /*blue button color*/
}
a.greenbutton{
display:inline;
height:auto;
text-align:center;
white-space: nowrap;
margin:.5vw 0.5vw .5vw 0.5vw;
padding:0.5vw 0.75vw 0.5vw 0.75vw;
color: white;
text-decoration:none;
background:#42A26F; /*green button color*/
border-radius: 2%;
}
a.greenbutton a:hover{
background:#308E59; /*green button color*/
}
a.yellowbutton{
display:inline;
height:auto;
text-align:center;
white-space: nowrap;
margin:.5vw 0.5vw .5vw 0.5vw;
padding:0.5vw 0.75vw 0.5vw 0.75vw;
color: white;
text-decoration:none;
background:#EAB200; /*green button color*/
border-radius: 2%;
}
a.yellowbutton a:hover{
background:#DDA300; /*green button color*/
}
a.purplebutton{
display:inline;
height:auto;
text-align:center;
white-space: nowrap;
margin:.5vw 0.5vw .5vw 0.5vw;
padding:0.5vw 0.75vw 0.5vw 0.75vw;
color: white;
text-decoration:none;
background:#9E074C; /*purple button color*/
border-radius: 2%;
}
a.purplebutton a:hover{
background:#7A003D; /*purple button color*/
}
a.button{
display:block;
width:auto;
height:auto;
text-align:center;
margin:0 20px 0 20px;
padding:2px 2px 2px 2px;
text-decoration:none;
}
a:hover.read_more{
text-decoration:underline;
}

/*---------------- image stuff----------------------*/

img.left_img{
float:left;
padding:3px 25px 3px 3px;
}

/*---------------- cant remember?----------------------*/

#main_container{
min-width:device-width;
max-width:850px;
height:auto;
margin:auto;
padding:0px;
}
#header{
width:100%;
height:135px;
margin:0px;
padding:0px;
background:#514945;
}

/*---------------- cant remember?----------------------*/

.fixed-ratio-resize { /* basic responsive img */
	max-width: 100%;
	height: auto;
	width: auto\9; /* IE8 */
}

/*---------------- cant remember?----------------------*/

span.red{
font-weight:bold;
color:#da5b23;
}
span.orange{
font-weight:bold;
color:#da5b23;
}
span.green{
font-weight:bold;
color:#197C0B;
}

/*---------------- mobile stuff? ----------------------*/

@-ms-viewport{
  width: device-width;
}

/*---------------- menu tab----------------------*/
.menu{
width:100%;
height:42px;
margin:0px;
background:#514945;
}
.menu ul{
list-style:none;
padding:0 0 0 15px;
margin:0px;
}
.menu ul li{
display:inline;
}
.menu ul li a{
float:left;
height:42px;
border:none;
padding:0 2vw 0 2vw;
padding:0 2% 0 2%;
text-decoration:none;
color:#fff;
line-height:42px;
font-size:6vw;
}
@media screen and (min-width: 400px) {
  .menu ul li a{
  float:left;
  height:42px;
  border:none;
  padding:0 2vw 0 2vw;
  padding:0 2% 0 2%;
  text-decoration:none;
  color:#fff;
  line-height:42px;
  font-size:140%;
  }
}
.menu ul li.selected a{
float:left;
height:42px;
border:none;
padding:0 15px 0 15px;
text-decoration:none;
color:#fff;
line-height:42px;
font-size:140%;
background:url(images/menu_bullet.gif) no-repeat bottom center;
}
.menu ul li a:hover{
background:url(images/menu_bullet.gif) no-repeat bottom center;
}

/*---------------center_content-------*/
.center_content{
height:auto;
clear:both;
padding:1% 0 1% 0;
background-color:#F2F3F4;
}
.center_left{
float:left;
padding:0.5vw 0.5vw 0.5vw 0.5vw;
}
.center_right{
float:left;
padding:0.5vw 0.5vw 0.5vw 0.5vw;
}
.center_block{
float:left;
padding:0.5vw 0.5vw 0.5vw 0.5vw;
display:inline;
}
.center_center{
text-align: center;
vertical-align: middle;
padding:0.5vw 0.5vw 0.5vw 0.5vw;
}

/*----------------------indent box-------------------------*/

.indent{
padding:0.5vw 0 0 1vw;
}

/*-------------welcome_box------------*/
.update_box{
width:auto;
height:auto;
background: #E9E5E2;
padding:1% 1% 1% 1%;
}

/*----------------------shaded sand colored box-------------------------*/

.sand_box{
float:left;
width:auto;
padding:0.5vw 0.5vw 0.5vw 0.5vw;
background: #EAD5C7;
}
.notepad_icon{
width:30px;
height:33px;
float:left;
background:url(images/news_icon.gif) no-repeat center;
}
.sand_content{
width:auto;
float:left;
text-align:justify;
line-height:20px;
padding:0 0 0 10px;
}

/*----------------------list-------------------------*/
ul.list{
list-style:none;
padding:0px;
margin:0px; 
}
ul.list li{
list-style:none;
height: auto;
padding:0px;
margin:0 0 0 0;
}
ul.list li a{
display:block;
height:auto;
text-align:center;
margin:.5vw 1vw .5vw 1vw;
padding:2px 2px 2px 2px;
color: white;
text-decoration:none;
background:#1288E0; /*blue button color*/
border-radius: 2%;
}
ul.list li a:hover{
background:#0576C4; /*blue button color*/
}

ul.white li{
padding:0px;
text-align:justify;
margin:0px;
line-height:20px;
color:#FFF;
}

ol.list{
list-style:none;
padding:0px;
margin:0px; 
}
ol.list li{
display: block;
height: auto;
padding:0px;
margin:2vw 0 1vw 0;
}

/*-------------------footer------------------------*/
#footer{
text-align: center;
vertical-align: middle;
clear:both;
}
#footer a{
color:#837d7b;
padding:0 8px 0 8px;
text-decoration:none;
font-size:75%;
}
#footer b{
color:#837d7b;
padding:0 8px 0 8px;
text-decoration:none;
font-size:75%;
}