@charset "UTF-8";
/* CSS Document */

@font-face {
	font-family: "lrs";
	src: url(../fonts/artisan12.otf) format("opentype");
}

html, body {
	margin: 0;
	padding: 0px;
	color:#000;
	background-color:white;
	font-family: lrs;
	overflow-x: hidden;
}

html {
	width:100%;
	height:100%;
	
}


body {
	background-image:url(../img/off_white_bg.jpg);
	background-position: center;
	background-size:cover;
	background-repeat:no-repeat;
	width:100%;
	height:100%;
}

.noselect {
	cursor: default;
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Opera and Firefox */
}



#menu_buttons {
	width:calc(100% - 350px);
	height:30px;
	font-family:lrs;
	cursor:pointer;
	display:inline-block;
	float:left;
	
}

#menu_button_news, #menu_button_archive, #menu_button_about {
	width:33%;
	height:30px;
	display:inline-block;
	float:left;
	text-align: center;
	margin-top:20px;
	font-size:18px;

}

#menu_button_news {
  opacity: 1.0;
  filter: alpha(opacity=100); /* For IE8 and earlier */
  transition: opacity .15s ease-out;
  -moz-transition: opacity .15s ease-out;
  -webkit-transition: opacity .15s ease-out;
  -o-transition: opacity .15s ease-out;
}

#menu_button_news:hover {
  opacity: 0.5;
  filter: alpha(opacity=50); /* For IE8 and earlier */
}

#menu_button_archive {
  opacity: 1.0;
  filter: alpha(opacity=100); /* For IE8 and earlier */
	transition: opacity .15s ease-out;
  -moz-transition: opacity .15s ease-out;
  -webkit-transition: opacity .15s ease-out;
  -o-transition: opacity .15s ease-out;
}

#menu_button_archive:hover {
  opacity: 0.5;
  filter: alpha(opacity=50); /* For IE8 and earlier */
}

#menu_button_about {
  opacity: 1.0;
  filter: alpha(opacity=100); /* For IE8 and earlier */
	transition: opacity .15s ease-out;
  -moz-transition: opacity .15s ease-out;
  -webkit-transition: opacity .15s ease-out;
  -o-transition: opacity .15s ease-out;
}

#menu_button_about:hover {
  opacity: 0.5;
  filter: alpha(opacity=50); /* For IE8 and earlier */
}

#toolbar {
	height:64px;
	width:100%;
	position: fixed;
	top: 0;
	width: 100%;
	background-image: url(../img/off_white_bg.jpg);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	border-bottom: 1px solid black;
}

#toolbar_title {
	height: 40px;
	width: 220px;
	margin-top: 16px;
	margin-left: 8px;
	font-family: lrs;
	display: inline-block;
	float: left;
	font-size: 12px;
}

#blog_post_top, #about_top, #archive_top {
	width:100%;
	height:32px;
	background-color:#333;
	color:#f2efec;
}

#blog_post_title {
	width:calc(70% - 16px);
	display:inline-block;
	float:left;
	font-weight:bold;
	text-align: left;
	padding-top:8px;
	padding-left:8px;
}

#about_title, #archive_title {
	width:calc(100%);
	display:inline-block;
	float:left;
	font-weight:bold;
	text-align: center;
	padding-top:8px;
}

.blog_post_subtop {
	width:100%;
	display:inline-block;
	float:left;
	font-weight:bold;
	text-align: center;
	padding:8px;
}

.blog_post_content, .about_content {
	width:calc(100% - 8px);
	display:inline-block;
	float:left;
	font-weight:normal;
	text-align: left;
	padding:8px;
	background-color: rgba(0,0,0,0.1);
}

#blog_post_date {
	width:calc(30% - 16px);
	display:inline-block;
	float:right;
	text-align: right;
	padding:8px;
}

@media screen and (max-width: 600px) {
    #toolbar_title{
        display : none;
    }
	
	#menu_buttons {
		width:calc(100% - 100px);
	}
	
}

#toolbar_icon {
	width:56px;
	height:100%;
	background-image:url(../img/lrs_icon.png);
	background-position: center;
	background-size:90%;
	background-repeat:no-repeat;
	display:inline-block;
	float:left;
}

#home_content, #about_content, #archive_content {
	margin-top:64px;
	width:100%;
	height:calc(100% - 100px);
}