/* mobile css */
/* mobiles with less that resolution */
@media all and (min-width: 0px) and (max-width: 800px){ 
body, html{ max-width: 800px; min-width: 240px;  padding: 0px; margin: 0px; }
#wrapper, div.conatiner { min-width: 100%; width: 100%; max-width:100%;  padding:0;  margin: 0px auto; height: auto; }
#container, #content { margin: 10px;  padding: 0px; }
.table { display: block; width: 98%; height: auto; box-shadow: none; border: 0px; margin: 50px 1% 1% 1%; }
.logo img { height: 100px; margin: auto; }
#container,.tablerow, #sidebar, .slider, .subnav   { display: block; width: 100%; margin:auto; box-shadow: none; border: 0; }
#sidebar {  width: 0%; }
#nav { position: absolute; top: 0; right:0; background: none; width: auto; }
.message { display: none; }
.navigate { display: block;  font-size: 1.2em;  float: right; position: absolute; right: 0; padding: 0px;}
.navigate a { display: block; color: #DDD; cursor: pointer;  }
.navigate a label.mbtn { cursor: pointer; display: inline-block; vertical-align: middle; line-height: 0; margin: 0; padding: 0 5px; width: 2.2em; height: 2em;  margin-right: 10px; }
.navigate a label.mbtn div { display: block; width: 100%; margin-top: 10%; }
.navigate a label.mbtn div label { display: inline-block; margin: 0; width: 15%; margin-right: 10%;  border-top: 5px solid #DDD; }
.navigate a label.mbtn div span { display: inline-block; margin: 0; border-top: 5px solid #DDD;  width: 70%;    }
.navigate a label.mbtn:hover div label, .masternav:hover label.mbtn div label { border-top: 5px solid #FFF; }
.navigate a label.mbtn:hover div  span, .masternav:hover label.mbtn div span { border-top: 5px solid #FFF; }
.masternav { float: right; position: relative;  }
.navigate a label.mbtn:hover { background: #6E2D00; }
.masternav:hover a label.mbtn  { background: #6E2D00;  }
.masternav ul { display: none;  z-index: 1;  }
.masternav:hover ul { display: block; z-index: 10202; }
#nav.masternav {  padding-top: 10px; margin: 0 2%;  }
#nav ul { padding: 0 5px; margin: 0px; width: 240px; position: relative; top: 3.4em; right: 0px;  min-width:18em; width: 100%; background-color: #6E2D00; list-style: none; font: normal 13px/35px Arial; font-weight: normal;   }
#nav ul li { display: block; width: 100%; background: #6E2D00;  text-align: left;   }
#nav ul li:last-child { border: 0px; }
#nav ul li a,#nav ul li span { color: #FFF; padding: 0.2em 1.5em;}
#nav ul li:hover, #nav ul li a:hover, #nav ul li:hover a {  font-weight: bold; color: #FFF;  }
#nav ul li:hover ul li a, #nav ul li ul li a,#nav ul li.currentitem ul li a, #nav ul li.currentbranch ul li a  { font-weight: normal; border: 0; color: #FFF;  padding: 0 1.8em; }
#nav ul li ul  { display: block; top: 0; margin: 0; padding: 0;}
#footer { border-top: 0px; position: relative; width: 96%;  margin: 1%; padding: 1%;  }
}
@media all and (min-width: 0px) and (max-width: 479px){
body, html{ max-width: 479px; min-width: 240px;  padding: 0px; margin: 0px;  }
.hometabs { margin: 0;  width: 96%; padding: 0px;  }
.hometabs article,.hometabs article.pagecontent,  .sociolinks, .footabout, #content, #rightside { float: none; width:96%; margin: 0 2%; height: auto;  }
.subnav { padding: 0;  }
.footnav, .masternav  ul, .message, .clearfoot,.sliderContent div.base div.caption { display: none; }
.sociolinks { text-align: center; }
.taoNav { margin-left: 30%;}
.hometabs article.pagecontent { margin-top: 20px;}
}


@media all and (min-width: 801px) and (max-width: 969px){
body, html{ max-width: 969px; min-width: 801px;  padding: 0px; margin: 0px;  }
#wrapper, .footcontent, .headerblc { min-width: 100%; width: 100%; }
.logo a { margin-left: 5%; }
.message { font-size: 1.3em; }
div.conatiner { min-width: 100%; width: 100%; margin: 0px; padding: 0; height: auto; }
#container{ width: 75%; padding: 1em 1%;  }
#content { width: 70%; padding: 0 1%;}
#rigthside { width: 18%; }
#sidebar { width: 21%; }
#footer { font-size: 0.89em;}
#nav { font-size: 0.89em;}
.table, .tablerow, .slider { display: block; width: 100%; height: auto;  }
 
}