

/* page top */				
div.header{ background-color: silver;  width: 100%; padding: 5px 0 5px 0; }
header { color: darkred; background-color: silver; font-family: garamond, serif; width: 100%; text-align: center; padding: 3px 0; font-size: 100%; width: 100%; display: inline; } 
h1.header { padding: 0; margin: 0; font-weight: 400; display: inline; }
label.menu-icon { float: left; display: inline; padding: 15px 0 0 20px; cursor: pointer; }
img.home { float: right; display: inline; padding: 8px 20px 0 0; }
div.slidenote { color: gray; background-color: #4d4d4d; font-family: calibri, sans-serif; font-size: 85%; padding: 5px 0; }

/* content */	
img.slides { float: left; display: inline; padding: 10px 0px 0 20px; }
img.home { float: right; display: inline; padding: 10px 20px 0 0; }	
label.menu-icon { float: left; display: inline; padding: 12px 0px 0 20px; cursor: pointer; }
ul.bxslider { margin: 0; padding: 0; text-align: center; font-size: .85em; }

div.people { background-color: gray; color: black;  font-family: garamond, serif; vertical-align: middle; text-align: center; margin: 0; }
article.people { max-width: 850px; display: inline-block; vertical-align: middle;  text-align: left; background-color: gray; padding: 20px 5%; font-family: calibri, sans-serif; font-size: 100%; }	
h5.people { padding: 0; margin: 0; }	

div.bonus { color: darkred; background-color: silver; font-family: garamond, serif; font-size: 175%; width: 100%; text-align: center; padding: 5px 0; }

div.special { padding: 2%; text-align: center; max-width: 100%; }
article.special { text-align: left; font-size: 90%; max-width: 100%; height: auto; display: inline-block; vertical-align: middle; }

img.logo { vertical-align: middle; }
div.link { font-family: garamond, serif; font-size: 140%; }						

/* breakpoint 550 */		
@media (max-width: 550px) 
{
    header { font-size: 85%;  }
    label.menu-icon { display: inline; padding: 12px 0 0 15px; } 
    img.home { padding: 7px 15px 0 0; }
    div.bonus { font-size: 150%; }
    img.slides{ padding: 8px 0 0 15px; }
    ul.bxslider { font-size: .75em}
    div.special { font-size: 90%; }    
    article.people { font-size: 90%; }    
    footer { font-size: 100%; }
    div.link { font-size: 120%; }	
}

/* breakpoint 375 */		
@media (max-width: 375px) 
{
    header { font-size: 70%; }
    label.menu-icon { padding: 8px 0 0 10px; }	 
	img.home { padding: 5px 10px 0 0; }
    div.bonus { font-size: 125%; }    
    img.slides{ padding: 5px 0 0 10px; }
	article.people { font-size: 80%; padding: 15px 20px; }      
    footer { font-size: 90%; }
    div.link { font-size: 100%; }	
}	
