/*
Theme Name: Lost Saloon
Theme URI: http://www.lostsaloon.com
Author: BarKeep
Author URI: http://www.lostsaloon.com
Description: Custom Theme for Lost Saloon
Version: 1.1
License: GNU General Public License
License URI: license.txt
Text Domain: lostsaloon
Domain Path: /languages/
Tags:
This theme, like WordPress, is licensed under the GPL.
Lost Saloon is based on Underscores http://underscores.me/, (C) 2012-2013 Automattic, Inc.
*/


/* =Reset
-------------------------------------------------------------- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    border: 0;
    font-family:  'Roboto', 'Droid Serif', sans-serif;
    margin: 0;
    padding: 0;
    line-height: 1.5em; 
    vertical-align: baseline;
    color: #444;
}
html {
    font-size: 62.5%; /* Corrects text resizing oddly in IE6/7 when body font-size is set using em units http://clagnut.com/blog/348/#c790 */
    -webkit-text-size-adjust: 100%; /* Prevents iOS text size adjust after orientation change, without disabling user zoom */
    -ms-text-size-adjust:     100%; /* www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */
}
body {
    font-size: 14px; 
    margin: 0 auto;    
}
*,
*:before,
*:after { /* apply a natural box layout model to all elements; see http://www.paulirish.com/2012/box-sizing-border-box-ftw/ */
    -webkit-box-sizing: border-box; /* Not needed for modern webkit but still used by Blackberry Browser 7.0; see http://caniuse.com/#search=box-sizing */
    -moz-box-sizing:    border-box; /* Still needed for Firefox 28; see http://caniuse.com/#search=box-sizing */
    box-sizing:         border-box;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
nav,
section {
    display: block;
}
ol, ul {
    list-style: none;
}
li {
    line-height: 2em;
}
table { /* tables still need 'cellspacing="0"' in the markup */
    border-collapse: separate;
    border-spacing: 0;
}
caption, th, td {
    font-weight: 400;
    text-align: left;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: "";
}
blockquote, q {
    quotes: "" "";
}
a:focus {
    outline: thin dotted;
}
a:hover,
a:active {
    outline: 0;
}
a img {
    border: 0;
}


/* =Global
----------------------------------------------- */

button,
input,
select,
textarea {
    color: #404040;
    font-family: sans-serif;
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.5;
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
    clear: both;
}
hr {
    background-color: #ccc;
    border: 0;
    height: 1px;
    margin-bottom: 1.5em;
}

/* Text elements */
p {
    margin-bottom: 1.5em;
}
ul, ol {
    margin: 1em 0 1em 3em;
}
ul {
    list-style: disc;
}
ol {
    list-style: decimal;
}
li > ul,
li > ol {
    margin-bottom: 0;
    margin-left: 1.5em;
}
dt {
    font-weight: 700;
}
dd {
    margin: 0 1.5em 1.5em;
}
b, strong {
    font-weight: 700;
}
dfn, cite, em, i {
    font-style: italic;
}
blockquote {
    margin: 0 1.5em;
}
address {
    margin: 0 0 1.5em;
}

abbr, acronym {
    border-bottom: 1px dotted #666;
    cursor: help;
}
mark, ins {
    text-decoration: none;
}
sup,
sub {
    font-size: 75%;
    height: 0;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}
sup {
    bottom: 1ex;
}
sub {
    top: .5ex;
}
small {
    font-size: 75%;
}
big {
    font-size: 125%;
}
figure {
    margin: 0;
}
table {
    margin: 0 0 1.5em;
    width: 100%;
}
th {
    font-weight: 700;
}
img {
    height: auto; /* Make sure images are scaled correctly. */
    max-width: 100%; /* Adhere to container width. */
}

/* Links */
a {
    color: #4169E1;
}
a:visited {
    color: purple;
}
a:hover,
a:focus,
a:active {
    color: #191970;
}

h1 a, h2 a, h3 a, h4 a, h5 a {
    text-decoration: none;
}

/* Alignment */
.alignleft {
    float: left;
    margin-right: 1.5em;
}
.alignright {
    float: right;
    margin-left: 1.5em;
}
.aligncenter {
    clear: both;
    display: block;
    margin: 0 auto;
}

/* Clearing */
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
    content: '';
    display: table;
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
    clear: both;
}

/* Button */
.cat-button {
    -webkit-border-radius: 5;
    -moz-border-radius: 5;
    border-radius: 5px;
    -webkit-box-shadow: 0 1px 3px #666;
    -moz-box-shadow: 0 1px 3px #666;
    box-shadow: 0 1px 3px #666;
    font-family: Arial;
    color: #fff;
    font-size: 14px;
    background: #eee;
    padding: 5px 20px;
    text-decoration: none;
}

.cat-button:hover {
    background: #969696;
    text-decoration: none;
}


.navbtn a {
    text-decoration: none;
    color: #444;
    font-family: 'Quando','Droid Serif', sans-serif;
    padding: 1em;
    font-size: 1.3em;
    border: 2px solid #500000;
}
.navbtn a:hover {
    color: #500000;
}

.tag-button {
    background: #eee;
    border-radius: 3px 0 0 3px;
    color: #444;
    display: inline-block;
    height: 26px;
    line-height: 26px;
    padding: 0 20px 0 23px;
    position: relative;
    margin: 0 10px 10px 0;
    text-decoration: none;
    -webkit-transition: color .2s;
    -moz-transition: color .2s;
    -o-transition: color .2s;
}

.tag-button::before {
    background: #fff;
    border-radius: 10px;
    box-shadow: inset 0 1px rgba(0, 0, 0, 0.25);
    content: '';
    height: 6px;
    left: 10px;
    position: absolute;
    width: 6px;
    top: 10px;
}

.tag-button::after {
    background: #fff;
    border-bottom: 13px solid transparent;
    border-left: 10px solid #eee;
    border-top: 13px solid transparent;
    content: '';
    position: absolute;
    right: 0;
    top: 0;
}

.tag-button:hover {
    background-color: #500000;
    color: #fff;
}

.tag-button:hover::after {
    border-left-color: #500000; 
}

.cat-button a, .tag-button a {
    text-decoration: none;
    color: #444;
    font-family: 'Quando','Droid Serif', sans-serif;
    font-style: italic;
}

.single-thumb img, .wp-post-image, .entry-content img {
    padding: 0;
    border: solid 1px #A1A1A1;

    -moz-box-shadow: 0 0 5px #A1A1A1;
    -webkit-box-shadow: 0 0 5px #A1A1A1;
    box-shadow: 0 0 5px #A1A1A1;
    border-radius: 5px;
}

/* =Header
-----------------------------------------------*/
.site-header {
    height: 10%;
    box-shadow: 5px 2px 3px 5px rgba(80,0,0,0.75);
    background-color: #fafafa;
}
.site-branding {
    margin: 0em 0;    
}
h1.site-title {
    float: left;
    padding: 0 3em 0 1em;
}
#logo {
    width: 500px;
}

/* =Menu
----------------------------------------------- */

.main-navigation {
    clear: none;
    display: block;
    float: left;
    margin-top: 30px;
}

.main-navigation ul {
    margin: 0;
}

.main-navigation ul li {
    float: left;
    position: relative;
    list-style: none;
    padding: 0 0 5px 2em;
    border-left: 2px #000;
}
.main-navigation a {
    display: block;
    text-decoration: none;
    font-size: 1.6em;
    text-transform: lowercase;
    font-weight: 700;
    font-family: 'Quando','Droid Serif', sans-serif;
    color: #646464;
    text-shadow: #000 1px 1px 0;
}

.main-navigation li:hover > a {
    color: #500000;
}

.main-navigation .current-cat a {
    text-shadow: #500000 1px 1px 0;
    color: #000;
}

/* Small menu */
.menu-toggle {
    cursor: pointer;
    display: none;
}

@media screen and (max-width: 600px) {
    .menu-toggle,
    .main-navigation.toggled .nav-menu {
        display: block;
    }
}


/* =Content
----------------------------------------------- */
.page-title {
    font-family: 'Quando','Droid Serif', sans-serif;
    margin: 1em 0;
    color: #500000;
    text-transform: lowercase;
}
.page-title .subheading {
    font-family: 'Quando','Droid Serif', sans-serif;
    color: #444;
}

.site-content {
    max-width: 1920px;
    margin: 0 auto;
    background-color: #fff;
}
.hentry {
    margin: 0 .5em 1.5em;
}
.byline,
.updated {
    display: none;
}
.single .byline,
.group-blog .byline {
    display: none;
}
.page-content,
.entry-content,
.entry-summary {
    margin: 1.5em 0 0;    
}

.entry-meta {
    text-transform: lowercase;
}
.entry-meta a, .related-posts a {
    text-decoration: none;
}
.page-links {
    clear: both;
    margin: 0 0 1.5em;
}

.home article.post,  .archive article.post {
    margin: 1.3em;
    padding: 1em;
    box-shadow: 3px 6px 7px 1px rgba(0,0,0,0.2);    
    border: solid #c8c8c8 1px;
    border: solid rgba(200,200,200,0.5) 1px;
    /** Clear Fix */
    overflow: hidden;
    zoom: 1;
    display: block;
}

article header.entry-header, article header.entry-contentheader {
    padding-bottom: 2em;
    border-bottom: 2px dotted #500000;    
}
article header.entry-header .entry-title {
    font-size: 1.75em;
    text-transform: lowercase;
    font-weight: 700;
    font-family: 'Quando','Droid Serif', sans-serif;
    padding-bottom: .5em;
    line-height: 1.5;
    color: #444;    
}
article header.entry-contentheader .entry-title {
    font-size: 1.5em;
    text-transform: lowercase;
    font-weight: 700;
    font-family: 'Quando','Droid Serif', sans-serif;
    padding-bottom: .5em;
    line-height: 1.5;
    color: #444;    
}
article header.entry-header .entry-title a, article header.entry-contentheader .entry-title a {
    text-decoration: none;       
    font-family: 'Quando','Droid Serif', sans-serif;
    color: #444;    
}

article div.entry-summary img {
    float:left;
    margin-right: 2em;
    border-radius: 5px;
}

.single article.post {
    box-shadow: 5px 5px 3px 5px rgba(0,0,0,0.1);    
    padding: 1.5em;
}

.entry-content h2, .entry-content h3, .entry-content h4, .entry-content h5 {
    margin-bottom: .5em;
}

.content-area {
    width: 73%;
    float: left;
    margin-top: 2em;
}

.site-main {
    overflow: hidden;    
}
.lsinfopanel, .lsleftpanel {
    float: left;
    width: 34%;
    min-width: 128px;
    margin: 0.2em;
}

/* =Asides
----------------------------------------------- */

.blog .format-aside .entry-title,
.archive .format-aside .entry-title {
    display: none;
}

.entry-meta .cat-links {
    margin: 1em;
    float: right;
}

.entry-meta .tags-links {
    margin: 1em;
    float: left;    
}

.tags-links {
    margin: 1em 0;
    float: right;
    clear: right;
}
.comments-link {
    float:right;
}
.edit-link {
    margin: 1em 1em;
    float: right;
    clear: none;
}

/* Make sure embeds and iframes fit their containers */
embed,
iframe,
object {
    max-width: 100%;
}


/* =Navigation
----------------------------------------------- */

.site-main [class*="navigation"] {
    margin: 0 0 1.5em;
    overflow: hidden;
}
[class*="navigation"] .nav-previous {
    float: left;
    width: 50%;
}
[class*="navigation"] .nav-next {
    float: right;
    text-align: right;
    width: 50%;
}

/** Thumbnails **/
.single-thumb { 
    float: right; 
    border-radius: 4px;
}
.single-thumb img {
    max-height:200px; 
    max-width:200px;
    width: auto;
    height: auto;
    border-radius: 0 0 5px 5px;
}
.single-thumb .category {
    background: #500000;
    border-radius: 5px 5px 0 0;
}
.single-thumb .category ul { 
    list-style: none;        
    margin: 0;
    padding: .4em 0;    
}
.single-thumb .category ul li a {
    font-size: 1.6em;
    text-transform: lowercase;
    font-family: 'Droid Serif', sans-serif;
    text-decoration: none;
    color: #fff;
    padding-left: 1em;
}

/* =Widgets
----------------------------------------------- */

.widget {
    margin: 1em;
    padding: 1em;
    overflow: auto;
    box-shadow: 3px 6px 7px 1px rgba(0,0,0,0.2);  
    border: solid #c8c8c8 1px;
    border: solid rgba(200,200,200,0.5) 1px;
}

.widget .related-posts {
    margin: 2.5em 0 1em 3em;
}
.widget li {
    list-style-type: square;    
    line-height: 1.6;        
    text-transform: lowercase;
}
/* Make sure select elements fit in widgets */
.widget select {
    max-width: 100%;    
}
.widget .infotitle {
    width: 100%;
}

.tagcloud {
    line-height: 2.1;
    text-transform: lowercase;   
}

.widget .widgettitle, .infotitle {
    font-size: 1.4em;
    font-weight: 500;
    text-transform: lowercase;    
    font-family: 'Quando','Droid Serif', sans-serif;
    color: #500000;
    border-bottom: 1px dotted #500000;
}
.widget a {
    text-decoration: none;
    color: #7a7575;
}

.site-content .widget-area {
    float: left;
    overflow: hidden;
    width:27%;
    margin: 4em 0;
}
.site-footer {
    clear: both;
    width: 100%;
}
.footer-meta {
    margin-top: 1em;
}

#site-follow {
    float: right;
    margin: 30px 30px 0 0;
}

#site-follow #social {
    float: right;
}

#site-follow .followbtn {
    margin: 30px .25em;
    width: 32px;
    height: 32px;
}

#site-follow .followbtn img {
    width: 32px;
    height: 32px;
}

#cse-search-form {
    float: right; 
    clear: both;
    width: 16em; 
    height: 36px; 
    margin: 3px 30px 0px 15px;
}
#cse-search-form input[type="text"] {
    background-image: url('images/search-btn.png');
    background-repeat: no-repeat;
    background-position: 8% 50%;
    background-color: #fff;
    float: left;
    border: 1px solid #c8c8c8;
    font: 400 12px Roboto, Serif;
    color: #444;
    width: 16em;
    padding: 6px 15px 6px 35px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
    -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;    
}

pre {
    background: #f7f7f9;
    font-size: 14px;
    line-height: 1.6;
    padding: 0.6em;
    margin-bottom: 1.6em;
    max-width: 100%;
    overflow: auto;
}

code{
    display:inline-block;
    *display:inline;
    zoom:1;
    background-color:#f7f7f9;
    border:1px solid #e1e1e8;
    padding:2px 8px;
    margin:8px 0;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    border-radius:4px
}

/** Table **/
.table {
    display: table;
    margin:2em 1em;
    border-collapse: collapse;
}
.row, .header-row {
    display: table-row;
}
.cell, .header-cell  {
    display: table-cell;
    padding: 0.5em 1em;
    border-bottom:1px solid black;    
}
.header-cell {
    font-weight: bold;    
    border-bottom: 2px solid black;
}

/** Adsense **/
.aff-slot {
    float: left;
    clear: both;
    min-height: 80px;
    width: 100%;
    padding: 2em 1em;
}

.disclaimer {
    padding: 1.0em;
    margin-bottom: 1em;
    font-weight: 500; 
    font-style: italic;
    float: right;
    clear: right;
}

@media screen and (max-width: 639px) {
    #logo {
        width: 100%;        
    }
    .site-branding{
        margin: 1em auto;
    }
    h1.site-title {
        padding: 0 0.3em;
    }
    .page-title, .entry-title { 
        font-size: 1.1em;
    }
    .lsinfopanel, .lsleftpanel {
        width: 100%;
        clear:both;        
    }    
    .main-navigation {
        margin: 1em auto;
    }
    .main-navigation a {
        font-size: 0.8em;
    }
    .main-navigation li {
        padding-left: 1em;
    }

    .site-main, .content-area {
        width: 100%;
        clear:both;
    }    
    #site-follow {
        clear:both;
        margin: 0.5em auto;
        padding: 0;
    }
    #cse-search-form {
        margin: 0;
        float:right;
    }        
    #site-follow #social {
        float:left;
    }
    #site-follow .followbtn {
        width: 24px;
        margin: 4px;
    }
    .site-content .widget-area {
        width: 100%;
    }
    .site-content .widget {
        float: left;
    }    
    #cse-search-form, #cse-search-form input[type="text"] {
        width: 8em;
    }
}

@media screen and (min-width: 640px) and (max-width: 767px) {
    .content-area {
        width: 100%;
    }
    .lsinfopanel, .lsleftpanel {
        width: 27%;
    }       
    .lsleftpanel {
        margin-top: 5em;
    }
    #site-follow {
        clear:both;
    }
    .site-content .widget-area {
        width: 100%;
        float:left;
    }
    .site-content .widget {
        float: left;
    }    
}
@media screen and (min-width: 768px) {
    .lsinfopanel, .lsleftpanel {
        width: 34%;
        max-width: 350px;
    }
    .lsleftpanel {
        margin-top: 5em;
    }
    .content-area {
        width: 73%;
    }
    .site-content .widget-area {
        width: 27%;
    }    
}


@media screen and (max-width: 639px) {
    .lsas_topbanner { width:100%;overflow: hidden;}
    .lsas_leftsidebar { width:100%;clear:both; overflow: hidden;}
    .lsas_rightsidebar { width: 310px;}
    .lsas_contenttop, .lsas_contentbottom { width: 100%;clear:both}
}
@media screen and (min-width: 640px) and (max-width: 767px) {
    .lsas_topbanner { width: 100%; }
    .lsas_leftsidebar { width: 100%; max-width: 170px;}
    .lsas_rightsidebar { width: 310px; }
    .lsas_contenttop, .lsas_contentbottom { width: 100%;clear:both}
}
@media screen and (min-width: 768px) {
    .lsas_topbanner { width: 100%; }
    .lsas_leftsidebar { width: 100%; float:right; }
    .lsas_rightsidebar { width: 100%; padding-left: 1em; }
    .lsas_contenttop, .lsas_contentbottom { width: 100%;clear:both}
}
