/* STRUCTURE */

body.page {
  margin-left: 0;
  margin-right: 0;
  margin-top: 0;    	
  width: 100%;
  background: linear-gradient(white, #eee);  
 }


header {
  height: auto;
  width: 100%;
  padding: 0;
  margin: 0;
 }
 

#slider {
  height: auto;
  width: 98%;
  padding: 0;
  margin: 1%;
 } 


#content {
  width: 65%;
  float: right;
  margin: auto;
  margin-top: 2%;
  margin-bottom: 5%;
  margin-right: 4%;
  padding: 3%;
  padding-top: 2%;
  background-color: #ffffff;
  min-height: 200px;
  box-shadow: 0 0 20px #777777;
 }
 
#content_home {
  width: 85%;
  margin: auto;
  margin-top: 3%;
  margin-bottom: 5%;
  padding: 3%;
  padding-top: 2%;
  background-color: #ffffff;
  min-height: 200px;
  box-shadow: 0 0 20px #777777;
  overflow: hidden;
 } 


#sidebar {
 width: 20%;
 margin-top: 2%; 
 margin-left: 1%;
 padding:0;
 min-width: 180px; 
 float: left;
 background: linear-gradient(#b1bcd4, #cfdcf7);
}

footer {
  clear: both;
  text-align: center;
  width: 96%;
  padding: 2%;
  line-height: 1.8;
  background-color: #5a75a5;
  background: linear-gradient(#8a9fc4, #5a75a5);  
 }


div.menubar {
position: fixed;
width: 100%;
z-index: 9999;
 }

div.header {
  width: 100%;
  height: auto;
  padding-top: 50px;
 }


div.header2 {
  float: right;
  font-size: 1.5em;
  color: #678dcf;
  line-height: 1.2;
  margin-top: 4.5%;
  margin-right: 3%;
  width: 48%;
 }

div.homeblocksheader {
  max-width: 1080px;
  width: 92%;
  padding: 1%;
  line-height: 1.3;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1%;
  border-top; 1px solid #ccc;
  border-left; 1px solid #ccc;
  box-shadow: 0 0 20px #777777;
  overflow: hidden;
  background-color: white;
 }

div.homeblocks3 {
  float: left;
  width: 28%;
  padding: 1%;
  line-height: 1.3;
  margin-left: 1%;
  margin-right: 2%;
  margin-bottom: 5%;
  border-top; 1px solid #ccc;
  border-left; 1px solid #ccc;
  box-shadow: 0 0 3px #ddd;
 }
 
div.homeblocks2 {
  float: left;
  width: 46%;
  padding: 1%;
  line-height: 1.3;
  margin-left: 1%;
  margin-right: 1%;
  margin-bottom: 5%;
  border-top; 1px solid #ccc;
  border-left; 1px solid #ccc;
  box-shadow: 0 0 3px #ddd;
 } 
 
 div.homeblocks1 {
  float: left;
  width: 96%;
  padding: 1%;
  line-height: 1.3;
  margin-left: 1%;
  margin-right: 3%;
  margin-bottom: 5%;
  border-top; 1px solid #ccc;
  border-left; 1px solid #ccc;
  box-shadow: 0 0 3px #ddd;
 } 
 
 div.homeblocks_wide {
  clear: left; 
  float: left;
  width: 62%;
  padding: 1%;
  line-height: 1.3;
  margin-left: 1%;
  margin-right: 2%;
  margin-bottom: 5%;
  border-top; 1px solid #ccc;
  border-left; 1px solid #ccc;
  box-shadow: 0 0 3px #ddd;
 }


/************************************************************************************
MEDIA QUERIES
*************************************************************************************/

/* for 1280px or less */
@media screen and (max-width: 1280px) {

div.header {
  padding-top: 75px;
 
 }
}



/* for 980px or less */
@media screen and (max-width: 980px) {


}

/* for 800px or less */
@media screen and (max-width: 800px) {

  #content {

   }


#content, #content_home {
  clear: both;
  width: 90%;
  margin-right: 3%;
  margin-top: 3%;
  margin-bottom: 1%;
  padding: 2%;
  padding-top: 2%;
  background-color: #ffffff;
  min-height: 200px;
  box-shadow: 0 0 10px #777777;
 }

#sidebar {
  clear: both;	
  width: 90%;
  padding: 2%;  
  margin-left: 3%;
  margin-right: 3%;
  margin-top: 4%;
  margin-bottom: 4%; 
}


div.header2 {
  margin-top: 3.5%;
  margin-right: 2%;
 }

div.homeblocks3 {
  float: left;
  width: 92%;
  padding: 1%;
  line-height: 1.3;
  margin-left: 2%;
  margin-right: 2%;
  margin-bottom: 6%;
 }

}



/* for 650px or less */
@media screen and (max-width: 700px) {

#content {

 }


div.header2 {
  margin-top: 3%;
  margin-right: 2%;
  font-size: 1.15em;  
 }


div.header {
  padding-top: 1%;
 }

div.homeblocks1, div.homeblocks2, div.homeblocks_wide {
  float: left;
  width: 92%;
  padding: 1%;
  line-height: 1.3;
  margin-left: 2%;
  margin-right: 2%;
  margin-bottom: 6%;
 }

}




/* for 480px or less */
@media screen and (max-width: 480px) {


 #pagewrap {
  width: 100%;
 }



div.header2 {
  font-size: 1.0em;
  width: 97%;
  margin:1%; 
  margin-left:0.3%;
 }
 
}