* { margin: 0; padding: 0; }
html { overflow-y: scroll;}
body { 
background:#FFF;
}
/*structure*/
#container {
	width: 100%;
	max-width: 1980px;
	margin: auto;
	padding: 0%;
	background:#FFF;
}

#banner {
	
	float: left;
	height: auto;
	margin-bottom: 0px;
	margin-top: 0px;
	margin-left: 0%;
	margin-right: 0%;
	width: 100%;
	background-color: #FFF;
}
#logo {
	
	float: left;
	height: auto;
	margin-bottom: 1px;
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	width: 20%;
	min-width:120px;
	background-color: #FFF;	
}


#buttonbar {
	
	float: left;
	height: auto;
	margin-bottom: 0px;
	margin-top: 0px;
	margin-left: 0%;
	margin-right: 0%;
	width: 100%;
}

ul#nav {
font-family: Verdana;
font-size:16px;
list-style:none;
margin:0 auto;
padding:0;
width:100%;
overflow: auto;
}

ul#nav li {
display:inline;
}

ul#nav li a {
text-decoration: none;
display: block;
background: #D76A09;
width: 12.5%;
color:#eee;
float:left;
text-align:center;
border-bottom:5px solid #D76A09;
border-top:5px solid #D76A09;
}


ul#nav li a:hover {
background: #F90;
color: #FFF;
border-bottom:5px solid #D76A09;
border-top:5px solid #D76A09;
}
#maincontent {
	float: left;
	height: auto;
	margin-bottom: 0px;
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	width: 100%;
	background-color: #FFF;
}

#topbar {
	float: left;
	float:top;
	height: 300px;
	margin-bottom: 0px;
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	width:100%;
	background-image:url(../images/shabe/topbarbg.png);
	background-repeat:repeat;
	
	}

#topbartext {
	
	height: 50px;
	margin-bottom: 0px;
	margin-top: 0px;
	margin-left: 40%;
	margin-right: 40%;
	width:20%;
	font:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
	color: #CCC;
	font-size:24px;
	text-align:center;
}


#article1 {
	
	float: left;
	height: auto;
	margin-bottom: 10px;
	margin-top: 40px;
	margin-left: 4%;
	margin-right: 10px;
	width:300px;
}
	#article1image {
	height:auto;
}

#article1caption {
	
	margin-bottom: 5px;
	margin-top: 5px;
	font: Roboto, "Roboto Condensed";
	font-size:32px;
	font-style:normal;
	color:#333;
}
#article {
	float:left;
	height: auto;
	font: Titillium, "Titillium Bd";
	font-size:19px;
	font-style:normal;
	color: #676767;

}

	
#footernote {
	float:left;
	height: 200px;
	width: 100%;
/*background-color:#D76A09;*/
background-image: url(../images/home/footerbg.jpg);
}
#footertextleft {
	float:left;
	height: auto;
	width: auto;
	max-width:600px;
	margin-top:1%;
	margin-left:10%;
	margin-right:5%;
		font: Roboto, "Roboto Condensed light";
	font-size:16px;
	font-style:normal;
	color: #676767;
	}
	
	#footertextright {
	float:right;
	height: auto;
	width: auto;
	max-width:450px;
	margin-top:1%;
	margin-left:1%;
	margin-right:10%;
		font: Roboto, "Roboto Condensed";
	font-size:16px;
	font-style:normal;
	color: #676767;
	}
	#footertextbottom {
	float:bottom;
	height: auto;
	width: 50%;
	max-width:450px;
	margin-top:11%;
	margin-left:30%;
	margin-right:25%;
		font: Roboto, "Roboto Condensed", "Roboto Condensed Light";
	font-size:16px;
	font-style:normal;
	color: #676767;
	}
/* Media Queries */

@media screen and (max-width: 1000px) {

ul#nav li a {
text-decoration:none;
display: block;
background: #D76A09;
width: 50%;
max-width:25%;
color:#eee;
float:left;
text-align:center;
border-bottom:5px solid #D76A09;
border-top:5px solid #D76A09;
}
	
}


@media screen and (max-width: 800px) {


ul#nav li a {
text-decoration:none;
display: block;
background: #D76A09;
width: 50%;
max-width:25%;
color:#eee;
float:left;
text-align:center;
border-bottom:5px solid #D76A09;
border-top:5px solid #D76A09;
}

}

@media screen and (max-width: 720px) {

ul#nav li a {
text-decoration:none;
display: block;
background: #D76A09;
width: 50%;
max-width:25%;
color:#eee;
float:left;
text-align:center;
border-bottom:5px solid #D76A09;
border-top:5px solid #D76A09;
}

#topbartext {
	
	height: 50px;
	margin-bottom: 0px;
	margin-top: 0px;
	margin-left: 25%;
	margin-right: 25%;
	width:50%;
	font-size:24px;
	text-align:center;
}
	#footertextleft {
	float:left;
	height: auto;
	width: auto;
	max-width:600px;
	margin-top:0%;
	margin-left:1%;
	margin-right:1%;
	}
	
	#footertextright {
	float:left;
	height: auto;
	width: auto;
	max-width:450px;
	margin-top:0%;
	margin-left:1%;
	margin-right:1%;
	}
	
}
@media screen and (max-width: 480px) {

ul#nav li a {
text-decoration:none;
display: block;
background: #D76A09;
width: 100%;
max-width:100%;
color:#eee;
float:left;
text-align:center;
border-bottom:5px solid #D76A09;
border-top:5px solid #D76A09;
}
#topbartext {
	
	height: 50px;
	margin-bottom: 0px;
	margin-top: 0px;
	margin-left: 0%;
	margin-right: 0%;
	width:100%;
	color: #CCC;
	font-size:24px;
	text-align:center;
}


	#footernote {
	float:left;
	height: auto;
	width: 100%;
}
	
}
/*slider part starts here*/


#sliderFrame, #sliderFrame div {
   /* box-sizing: content-box;*/
}
#sliderFrame 
{
    width:100%;
    margin:0 auto; /*center-aligned*/
}

#slider, #slider .sliderInner {
    width:100%;height:300px;/* Must be the same size as the slider images */
    border-radius:3px;
}

#slider {
    background-color:transparent;
   /* position:relative;*/
    margin:0 auto; /*center-aligned*/
    transform: translate3d(0,0,0);
    box-shadow: 0px 1px 5px #999999;
}

/* the link style (if an image is wrapped by a link) */
#slider a.imgLink, #slider .video {
    z-index:2;
    cursor:pointer;
    position:absolute;
    top:0px;left:0px;border:0;padding:0;margin:0;
    width:100%;height:100%;
}
#slider .video {
    background:transparent url(video.png) no-repeat 50% 50%;
}

/* Caption styles */
#slider .mc-caption {
    position:absolute;
    width:100%;
    height:auto;
    padding:10px 0;/* 10px will increase the height.*/
    left:0px;
    bottom:0px;top:auto;
    overflow:hidden;
    font: bold 14px/20px Arial;
    color:#EEE;
    text-align:center;
    background:rgba(0,0,0,0.3);
}
#slider .mc-caption a {
    color:#FB0;
}
#slider .mc-caption a:hover {
    color:#DA0;
}


/* ------ built-in navigation bullets wrapper ------*/
#slider .navBulletsWrapper  {
    top:320px;
    text-align:center;
    background:none;
    position:relative;
    z-index:3;
}

/* each bullet */
#slider .navBulletsWrapper div 
{
    width:11px; height:11px;
    font-size:0;color:White;/*hide the index number in the bullet element*/
    background:transparent url(bullet.png) no-repeat 0 0;
    display:inline-block; *display:inline; zoom:1;
    overflow:hidden;cursor:pointer;
    margin:0 6px;/* set distance between each bullet*/
}

#slider .navBulletsWrapper .active {background-position:0 -11px;}


/* --------- Others ------- */

#slider img, #slider>b, #slider a>b {
    position:absolute; border:none; display:none;
}

#slider .sliderInner {
    overflow:hidden;
    position:absolute; top:0; left:0;
}

#slider>a, #slider video, #slider audio {display:none;}
#slider div {-webkit-transform: translate3d(0,0,0);transform: translate3d(0,0,0);}

/* slider part ends here*/