@import url(http://fonts.googleapis.com/css?family=Economica:400,700,400italic,700italic&subset=latin,latin-ext);
#left {font-family: 'Economica', sans-serif; padding:20px;  width:360px; position:fixed; left:0px; top:0px;  box-sizing:border-box; z-index:100; }
#right {font-family: 'Economica', sans-serif; padding:20px; padding-left:345px; width:100%; position:fixed; right:0px; top:0px;  box-sizing:border-box; max-height:100%; overflow:scroll; padding-top:154px; z-index:1; max-height:100%; }

#header {padding:20px; background-color:rgba(0,0,0,0.8); width:100%; box-sizing:border-box; margin-bottom:5px; }
#logo { display:block; background-image:url(../img/logo.png); width:100%; height:60px; background-position:center top; background-repeat:no-repeat; background-size:contain; }
#mainmenu { width:100%; border-top:solid 1px rgba(255,255,255,0.5); padding-top:10px; font-size:16px; text-align:center; color:#fff;}
#mainmenu a {display:inline-block; padding-left:5px; padding-right:5px; color:#fff; text-decoration:none; }
#mainmenu a:first-child {padding-left:0px;}
#mainmenu a:last-child {padding-right:0px;}

#facebook_button { background-color:rgba(0,0,0,0.8); width:100%; box-sizing:border-box; padding:10px; opacity:0.8; position:absolute; right:20px; top:20px; width:50px; height:50px; }
#facebook_button:hover { opacity:1; }
#facebook_button a { display:block; width:100%; height:100%; box-sizing:border-box;   color:#fff; background-repeat:no-repeat; background-position:center center; background-repeat:no-repeat; background-image:url(../img/facebook.png); background-size:contain; }

div.content {padding:20px; background-color:rgba(0,0,0,0.8);  box-sizing:border-box; margin-bottom:5px; width:auto; color:#fff;  }
div.content a { color:#fff; }
h1,h2 {font-size:36px; margin-bottom:20px; }

#facebook { width:400px; max-width:100%; float:right; padding:20px; padding-top:75px; padding-bottom:60px; height:100%; position:absolute; top:0px; right:0px; background:none; box-sizing:border-box; }
#facebook div.content { height:100%; overflow:scroll; width:100%; background-color:rgba(255,255,255,0.8);  }

#haljine, #haljine.open { display:none; padding:0px; height:1px; overflow:hidden; background:none; color:rgba(0,0,0,0); }

.hidden {display:none;}



/* Mobile Portrait to Mobile Landscape */ 
@media only screen and (max-width: 500px) { 
    
#left {padding:0px; width:100%; }
#right { padding:0px; padding-top:80px; }
#mainmenu { display:none;}
#logo {height:30px; }
#facebook_button { display:none; } 
#slide-list { display:none; opacity:0; } 
    }
	
/* Mobile Portrait to Mobile Landscape */
@media only screen and (max-width: 479px) { 
    
#mainmenu { display:block;}
#logo {height:40px; margin-bottom:10px; }
    
    }