/*
 * Semi fluid layout. The style is inspired by  
 * http://www.dynamicdrive.com/style/layouts/item/css-liquid-layout-31-fixed-fluid-fixed/
 *
 * This style makes a three column layout fluid with in a certain range. 
 *
 * It is useful to maintain screen flexibility to some extend, but
 * also to keep some control over the visuals.
 *
 * A couple of things to consider.
 *
 * 1. The container class needs to have the same min- and max-width as
 *    the content wrapper (.wrap), otherwise the left column will move
 *    out of the screen if the viewport gets larger then the max-width
 *    of the wrapper.
 *
 * 2. The min- and max-width width of the fluid content container
 *    (.middle) needs to be the respective widths of its wrapper minus
 *    the left and right margins. Otherwise the right column may run
 *    into the content.
 *    (inner width = width - margin-left - margin-right) 
 *
 * 3. There is no way to avoid the 2 wrapper div. It is not possible
 *    to work with paddings instead of the wrapper.
 *
 * 4. the right column should float to the right rather then to the
 *    left (as in the original) in order to equally distribute the columns.
 *
 * The left margin of the left column is -100% to be positioned at the
 * same point as div.wrap, the left margin of the right column is
 * -200px to be positioned into the gap that is left by the middle
 * coloumn. If these margins are not used then the columns will get
 * positioned BELOW the content column.
 */ 

/* wipe out some bogus predefinitions in blog.css */
#alpha, #beta, #gamma {
    float: none;
    display: block;
    position: static;
}

a:link, a:visited {
    text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: bold;
}

/* the actual style */

body {
    font-family: Helvetica, sans-serif;
    font-size: 12pt;
    background-color: #ffffff;
    text-align: left;
}

/* specific styles for the index and sitemap */

#lfleft, #lfmiddle, #lfright {
    box-sizing: border-box;
    position: absolute;
    margin: 5px;
}

#lfmiddle {
    z-index: 99;
    left: 50%;
    margin-left: -60px;
    width: 120px;
}

#lfleft, #lfright {
    width: 50%;
}

#lfleft {
   left: 0px;
}

#lfright {
   right: 0px;
}

#lfleft .lofatname {
    box-sizing: border-box;
    width: 100%;
    padding-right: 75px;
}

#lfright .lofatname {
    box-sizing: border-box;
    width: 100%;
    padding-left: 65px;
}

#indexcontainer {
    width: 100%;
}

/* general structure */ 

#maincontainer {
    margin: 10px;
    margin-top: 20px;
    padding: 0px;
    min-width: 920px;
    max-width: 1240px;
}


#sitenavigation, #beta { 
    padding-left: 10px;
}

#lfwrap { 
    float: left;
    width: 100%;
    min-width: 920px;
    max-width: 1240px;
}

.layout-wt #alpha,.layout-wtt #alpha {
    /* text-align: center; */
    margin-left: 145px;
    margin-right: 325px;
    min-width: 445px;
    max-width: 840px;
    width: auto;
}

#sitenavigation {
    float: left;
    width: 110px;
    margin-left: -100%;
}

.layout-wt #beta {
    float: left;
    width: 280px;
    margin-left: -300px;
}

#lffooter {
margin-top: 10px;
clear: both;
font-size: 8pt;
color: #AAA;
text-align: right;
width: 100%;
}

/* lofat navigation */

a.lflnk { 
    text-decoration: none;
}

.lfnav {
    float: left;
    border: 3px solid #666;
    margin: 5px;
    width: 20px;
    height: 20px;
}

.lfnavmid {
    float: left;
    border: 3px solid #666;
    margin: 0px;
    width: 20px;
    height: 20px;
}

.lfnavlogo {
    float: left;
    margin: 5px;
    padding:0px;
    margin-right:-1px;
    width: 32px;
    height: 32px;
}

.lfnavlogoinfo {
    float: left;
    border: 3px solid #666;
    margin-bottom: 4px;
    width: 20px;
    height: 5px;
}

.lfnavlogomicro {
    float: left;
    border: 3px solid #666;
    margin-right:4px;
    margin-bottom:4px;
    width: 5px;
    height: 5px;
}


.lfdummy {
    float: left;
    border: 3px solid #666;
    background-color: #666;
    margin: 5px;
    width: 20px;
    height: 20px;
}

.lofatspacer { 
     clear: both;
    margin-top: 200px;
    width: 100px;
    height:1px;
}

#lfmiddle .lofatspacer {
    float: left; 
}


.lofatlogotext {
    clear: both;
    float: left;
    color: #666;
    font-size: 20pt;
   /* font-weight: bold; */
    font-family: sans-serif;
    margin: 2px;
    width:100%;
    margin-top: -1px;
    text-align: left;
}

.lofatname {
    box-sizing: border-box;
    height: 36px;
    line-height: 36px;
}

#lfright .lofatname {
    text-align: left;
}

#lfleft .lofatname {
    text-align: right;
}

.lofatnamespacer {
    box-sizing: border-box;
    height: 36px;
}

/* blog structure */

div.entry {
    margin-top: 0px;
    margin-bottom: 22px;
    padding-bottom: 14px;
   /*  border-bottom: 1px solid #AAA; */
}

div.entry.page {
    border-bottom: none;
}

div.entryinfo {
    padding-left: 15px;
    font-size: 10pt;
    margin-bottom: 14px; 
}


.entrymore {
    margin-top: 0px;
    text-align: right;
}

div.entrymore a:after {
    content: " >>"
}

.entrymeta {
    margin-top: 10px;
    font-size: 11pt;
    min-height: 14pt
}

div.entrybody, div.asset-body, .asset-more {
    clear: both;
    line-height: 1.3;
}

/* content */

a {
    color: #555;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

div.entrybody p, div.asset-body p, .asset-more p {
    margin: 0px;
    text-align: justify;
}

div.entrybody p + p, div.asset-body p + p, .asset-more p + p, div.entrybody div + div, .asset-more p + p  {
    margin-top: 0.5em;
}

div.entry h1, .entrytitleheader h1, div#alpha > h1 {
    margin-top: 0px;
    margin-bottom: 5px;
    font-size: 16pt;

}

div.entrybody h2 {
    margin-top: 14px;
}

h1#page-title {
    margin-top: 0px;
    margin-bottom: 5px;
    font-size: 16pt;    
}

div.entry h2 {
    margin-top: 0px;
    font-size: 14pt;
    font-style: oblique;
}

div.entry h3 {
    margin-top: 0px;
    font-size: 13pt;
}

div.entrybody h3 {
    margin-top: 13px;
    font-size: 13pt;
}

div.entry h4 {
    margin-top: 0px;
    font-size: 12pt;
    font-style: oblique;
}

pre { 
    margin: 1em;
    min-width: 450px;
    max-width: 690px;
    /* overflow: scroll; */
    overflow-y: hidden;
}

div.asset-body h2, div.asset-body h3, div.asset-body h4, div.asset-body h5, div.asset-body h6 {
	margin-top: 0.9em;
        margin-bottom: 0.4em;
}

/* sidebar */
.widget {
    border-left: 1px solid grey;
   /* border-top: 1px solid grey; */
    margin-bottom: 22px;
    padding-top: 5px;
    padding-left: 8px;
    padding-bottom: 5px;
    padding-right: 5px;
}

.widget h1 {
    margin: 0px;
    margin-bottom: 5px;
    font-size: 12pt;
}
 
.widget-syndication h1 {
    font-size: 16pt;
}

.widget h1 a {
    color: #000;
}

.widget ul {
    margin: 0px;
    padding: 0px;
    padding-left: 7px;
}

.widget-syndication ul {
    padding-left: 20px;
    list-style-image: url(/mt-static/images/status_icons/feed.gif); 
}

.widget-syndication ul.sitelinks {
    margin-bottom: 15px;
    list-style-image: none;
    padding-left: 10px;
}

.widget-syndication ul.sitelinks li {
    font-size: 12pt;
}

.widget ul li {
    display: block;
}

.widget-syndication ul li {
    display: list-item;
    font-size: 10pt;
}

.widget-archive ul {
    padding-left: 12px;
}

.widget-tag-cloud ul {
    text-align: justify;
}

input[type='text'] {
    padding: 3px;
    width: 55%;
    border: 1px solid black;
}

input[type='submit'] {
    border: 1px solid black;
    background-color: #CCC;
    font-weight: bold;
    padding-left: 5px;
    padding-right: 5px;
}


/* tag cloud */

ul.tagcloud li {
    display: inline;
}

li.rank-10 {
    font-size: 8pt;
}

li.rank-9 {
    font-size: 9pt;
}

li.rank-8 {
    font-size: 10pt;
}

li.rank-7 {
    font-size: 11pt;
}

li.rank-6 {
    font-size: 12pt;
}

li.rank-5 {
    font-size: 13pt;
}

li.rank-4 {
    font-size: 14pt;
}

li.rank-3 {
    font-size: 15pt;
}

li.rank-2 {
    font-size: 16pt;
}

li.rank-1 {
    font-size: 17pt;
}

/* special styles for dynamic content */

.hidden {
    display: none;
}

.entrydateblock {
margin-top: 3px;
float: left;
width: 54px;
height: 58px;
border-left:1px solid #666;
margin-right: 10px;
margin-bottom: 12px;
}

.entrytitleheader {
 float: left;
 width: 80%;
 display: inline-block;
 margin-bottom: 12px;
}

.entryyear {
    font-size: 10pt;
   background-color: #666; 
   color: #FFF;
   text-align: center;
padding-left: 3px;
padding-right: 3px;
}

.entryday {
font-size: 18pt;
font-weight: bold;
   text-align: center;
margin-bottom: -6px;
}

.entrymonth {
   font-size: 8pt;
   text-align: center;
}

.addthis_toolbox {
margin-left: 15px;
align: right;
float:right;
width: 140px;
}

.entrymeta .permalink {
margin-left: 15px;
float: right;
width: 60px;
border-left: 2px solid #666;
padding-left: 5px;
}

.entrymeta .tags {
text-align: left;
/* display: inline-block; */
margin-right: 250px;
}

.embedbutton, .embedform {
   text-align: right;
   color: #555;
   font-size: small; 
   margin-bottom: 12px;
}

.embedbutton { 
   cursor: pointer;
}