/*
Theme Name: Azul Silver
Theme URI: http://www.benluwp.com/themes/azul-silver/
Author: Benjamin Lu
Author URI: http://www.benluwp.com
Description: Azul Silver is highly customizable, simple, and easy to navigate. Azul Silver also has the capability to change different sidebars within the theme. Users can also customize the header and the navigation and many other features.
License: Azul Silver is distributed under the terms of the GNU GPL.
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: custom-colors, custom-header, custom-background, custom-menu, editor-style, featured-images, fixed-layout, gray, one-column, post-formats, right-sidebar, sticky-post, translation-ready, threaded-comments, two-columns
Version: 0.1.5
Text Domain: azulsilver

This theme like WordPress is licensed under the GPL.
use it to make something cool, have fun, and share what you have learned with others.
*/ 

/************************* Nicolas Gallagher Micro Clearfixed Solution *************************/
/* 1. The space content is one way to avoid an Opera bug when the contenteditable attribute    */
/*    is included anywhere else in the document. Otherwise it causes space to appear at the    */
/*    top and the bottom of elements that are clearfixed.                                      */
/* 2. The use of the table rather than block is only necessary if using :before to contain the */
/*    top-margins of child element.                                                            */
/************************* Nicolas Gallagher Micro Clearfixed Solution *************************/
.cf:before,
.cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.cf:after {
    clear: both;
}

/************************* Azul Silver Main Basic Layout *************************/
body {
    background: #999999;
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS P Gothic", Arial, sans-serif;
    font-size: 16px;
  -webkit-touch-callout:none; //
}

a {
  color: #0000F0;
  text-decoration: underline;
}

a:hover {
    color: #999999;
}

#container {
    background: #FFFFFF;
    border: 1px solid #666666;
    border-radius: 8px 8px 8px 8px;
    box-shadow: 0 0 10px 0;
    margin: 0 auto;
    padding: 10px 10px 10px 10px;
    width: 980px;
}

img {
	margin: 0;
	margin-right: 16px;
	margin-bottom: 16px;
	max-width: 100%;
	padding: 0;
	border-style:none;
}

img.alignleft {
	margin-right: 16px;
	margin-top: 5px;
}

img.aligncenter {
    clear: both;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

img.alignright {
	margin-left: 16px;
	margin-top: 5px;
}

p {
margin-bottom:1em;
}


/************************* Azul Silver Header Navigation *************************/
.site-header {
	background: url(images/header-image.jpg) no-repeat;
	height: 160px;
}

hgroup {
    height: auto;
    line-height: 25px;
    margin: 10px 10px 10px 10px;
    padding: 10px 10px 10px 10px;
    position: absolute;
    text-align: center;
    width: auto;
}

.site-title {
    font-weight: normal;
    font-size: 37px;
    margin: 0;
    padding: 0;
}

.site-title a {
    color: #FFFFFF;
    text-decoration: none;
}

.site-description {
    color: #FFFFFF;
    font-weight: normal;
    font-size: 16px;
    margin: 0;
    padding: 48px;
}

#site-content {
    float: left;
    margin: 0;
    padding: 0;
    padding-bottom: 36px;
    width: 667px;
}

#site-sidebar {
    list-style: none;
    float: right;
    width: 300px;
}

.site-footer {
	margin: 10px auto;
	padding-bottom: 16px;
	text-align: center;
	width: 980px;
}

.site-footer a {
	color: #FFFFFF;
}

/************************* Azul Silver Primary Navigation *************************/
nav {
	margin-bottom: 10px;
}

.primary-navigation {
    background: #313131;
    float: left;
    display: block;
    height: 37px;
    position: relative;
    width: 100%;
}
.primary-navigation ul {
    list-style: none;
    margin: 0;
    padding-left: 0;
}
.primary-navigation li {
    float: left;
    position: relative;
    margin-bottom:8px;
}
.primary-navigation a {
    color: #FFFFFF;
    display: block;
    line-height: 1.3em;
    padding: 0.5em 1em;
    text-decoration: none;
}
.primary-navigation ul ul {
    background: #4D4D4D;    
    display: none;
    float: left;
    position: absolute;
    left: 0;
    padding: 0;
    z-index: 99999;
}

.primary-navigation ul ul ul {
    left: 100%;
    top: 0;
}

.primary-navigation ul ul a {
    width: 300px;
}

.primary-navigation ul ul li {
}

.primary-navigation li:hover > a {
    color: #FFFFFF;
    background: #4d4d4d;
}
.primary-navigation ul ul :hover > a {

}

.primary-navigation ul ul a:hover {
    background: #313131;
}
.primary-navigation ul li:hover > ul {
	display: block;
}
.primary-navigation .current_page_item > a,
.primary-navigation .current-menu-item > a,
.primary-navigation .current_page_item > a:hover,
.primary-navigation .current-menu-item > a:hover {
    background: #000000;
    color: #FFF;
}

.primary-navigation .current_page_ancestor {
    background: #4d4d4d;
    color: #FFFFFF;
}

.primary-navigation ul ul .current_page_parent,
.primary-navigation .current_page_parent .current_page_item > a {
    color: #FFFFFF;
    background: #313131;
} 

/************************* Azul Silver Main Content Navigation *************************/
.entry-title {
    border-top: 1px solid #444444;    
    border-bottom: 1px solid #444444;    
    font-size: 18px;
    margin: 0;
    padding: 5px 5px;
    padding-bottom: 0;
}

.entry-title a {
    color: #0000F0;
    text-decoration: none;
}

.metadata-posted-on {
    margin: 0 0 0 8px;
}

.metadata-posted-in {
    margin: 0 0 0 8px;
    padding-bottom: 10px;
}

.alignleft {
    float: left;
}

.aligncenter {
    text-align: center;
    clear: both;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.alignright {
    float: right;
}

#site-content table {
    margin-top: 8px;
}

.content-archive {
    padding: 4px;
    padding-bottom: 0;
    text-align: center;
}

.content-search {
    padding: 30px;
    padding-bottom: 0;
    text-align: center;
}

.wp-caption {
    background: #EEEEEE;
    border: 1px solid #CCCCCC;
    margin-top: 20px;
    max-width: 100%;
    padding: 8px;
    text-align: center;
}

.wp-caption-text {
    margin: 0;
    padding: 0;
}

.wp-caption.alignleft {
    margin-right: 10px;
    margin-top: 5px;
}

.wp-caption.alignright {
    margin-left: 10px;
    margin-top: 5px;
}


.gallery-caption {

}

.small-post-thumbnail {
    float: left;
    margin-top: 4px;
    margin-right: 15px;
    margin-bottom: 0;
    position: relative;
}

.small-post-thumbnail img {
    max-width: 100%;
}

.small-post-thumbnail.alignleft {
	margin-right: 16px;
	margin-top: 5px;
}

.small-post-thumbnail.aligncenter {
    clear: both;
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
}

.small-post-thumbnail.alignright {
	margin-left: 16px;
	margin-top: 5px;
}

.medium-post-thumbnail img {
    max-width: 100%;
}

.site-content-full {
    
}


/************************* Azul Silver Comments Content Navigation *************************/
.comments-title {
    border-bottom: 1px solid #CCCCCC;
    font-size: 20px;
    margin-bottom: 5px;
}

.comment-list {
    margin: 0;
    padding: 0;
}

.comment-body {
    margin-bottom: 20px;
    padding: 10px;
    border-bottom: 1px solid #CCCCCC;
}

.comments-area > ol  {
    list-style-type: none;
}

.comment-author .avatar {
    float: left; 
    display: block;
    margin-right: 10px;
}

.comment-author .fn {
    font-size: 16px;
    margin: 0;
    padding: 0;
}

.comment-meta {
    font-size: 14px;
}

.comments-area p {
    margin-top: 20px;
}

.reply {
    font-size: 12px;
    margin-bottom: 20px;
}

.comment-list ol {
    margin-top: 20px;
  margin-left: 20px;
}

ol.children {
    list-style-type: none;
}

.content-meta {
    margin-left: 70px;
}

.comment-navigation {
    border-top: 1px solid #999;
    border-bottom: 1px solid #999;
}

.comment-navigation i {
    padding: 10px;
}

.comment-previous {
    float: left;
}
.comment-next {
    float: right;
}

.bypostauthor > .comment-body {
   background: #F0F0F0; 
   border-bottom: none;
   padding: 10px;
   position: relative;
}

.comment-reply-title {
    border-top: 1px dotted #CCCCCC;
    font-size: 20px;
    margin: 0;
    margin-top: 10px;
    padding: 0;
    padding-top: 10px;
}
.comment-form label {
    display: block;
}

.required {
    color: #FF0000;
    font-size: 10px;
}

.comment-awaiting-moderation {
    background: #84BD68;
    font-size: 12px;
    padding: 3px 4px;
}

.form-allowed-tags {
    font-size: 13px;
    width: 600px;
}

.form-submit .submit {
    -moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
    -webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
    box-shadow:inset 0px 1px 0px 0px #ffffff;
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f9f9f9), color-stop(1, #e9e9e9));
    background:-moz-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
    background:-webkit-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
    background:-o-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
    background:-ms-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
    background:linear-gradient(to bottom, #f9f9f9 5%, #e9e9e9 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e9e9e9',GradientType=0);
    background-color:#f9f9f9;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    border-radius:6px;
    border:1px solid #dcdcdc;
    display:inline-block;
    cursor:pointer;
    color:#666666;
    font-size:14px;
    font-weight:bold;
    padding:6px 24px;
    text-decoration:none;
    text-shadow:0px 1px 0px #ffffff;
}

.form-submit .submit:hover {
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #e9e9e9), color-stop(1, #f9f9f9));
    background:-moz-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
    background:-webkit-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
    background:-o-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
    background:-ms-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
    background:linear-gradient(to bottom, #e9e9e9 5%, #f9f9f9 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e9e9e9', endColorstr='#f9f9f9',GradientType=0);
    background-color:#e9e9e9;
}

#respond textarea#comment{
    height: 200px;
    width: 600px;	
}

.post-navigation {
    position: relative; left:-20px;
    overflow: hidden;
    margin: 0 auto;
    width: 110%;
    /zoom : 1;
    margin-bottom: 1.5em;
}

.post-navigation span {
    display: inline-block;
    margin-bottom: 0.8em;
}

.post-navigation667 {
    position: relative; left:-27px;
    overflow: hidden;
    margin: 0 auto;
    width: 667px;
    /zoom : 1;
    margin-bottom: 1.5em;
}

.post-navigation667 span {
    display: inline-block;
    margin-bottom: 0.8em;
}

.paging-navigation ul {
    margin: 0;
    text-align: center;
}

.paging-navigation li { display: inline; }

a.page-numbers,
span.page-numbers {
     padding: 0 5px;
     color: #0000F0;
}

a:hover.page-numbers {
    color: #999999;
}

.paging-navigation .current {
    font-weight: bold;
    color: #000;
}

/************************* Azul Silver Sidebar Content Navigation *************************/

#site-sidebar ul {
    margin: 0;
    margin-bottom: 10px;
    padding: 5px 5px;
}

#site-sidebar li {
    list-style: none;
    margin: 0;
    padding-bottom: 12px;
}

.header-search {
    margin: 5px 0 0 740px;
    position: absolute;
}

div.header-search span.screen-reader-text {
  display: none;
}

div.header-search input.search-submit {
    background: #FFFFFF;
    border: none;
    color: #0000F0;
    margin-right: 10px;
    padding: 5px 14px;
    vertical-align: top;
}

div.header-search .search-field {
    vertical-align: top;
    padding: 3px;
}

.widget-title {
    border-bottom: 1px solid #CCCCCC;    
    color: #000000;
    font-size: 18px;
    margin: 0;
    padding: 5px 5px;
    padding-bottom: 0;
}

.tagcloud {
    margin-bottom: 10px;
}

.textwidget {
    margin-bottom: 0px;
}

#wp-calendar {
    margin-bottom: 8px;
    text-align: center;
    width: 100%;
}

#wp-calendar a {
    font-style: italic;
    text-decoration: underline;
}

#wp-calendar caption {
    font-weight: bold;
    margin-bottom: 4px;
}

#wp-calendar #today {
    font-weight: bold;
}

#wp-calendar #today a {
    color: #FF0000;
    font-weight: bold;
}

.sticky {
    background: #ffffff;
}

.sticky .entry-title {
    border-bottom: 1px solid #000000;
}

span.screen-reader-text {
    display: none;
}

input.search-field, input.search-submit {
    margin-top: 5px;
    margin-bottom: 20px;
}

#site-sidebar input.search-submit {
    display: none;
}

.fb_iframe_widget > span {
  vertical-align: baseline !important;
}

.side {
color:#000000;
border:solid 1px #444444;
font-size:16px;
font-weight:normal;
line-height:140%;
padding:8px 8px 8px 8px;
margin-bottom:10px;
}

.side2 {
color:#000000;
border:solid 1px #cccccc;
font-size:16px;
font-weight:normal;
line-height:140%;
padding:8px 8px 8px 8px;
margin-bottom:10px;
}

.cate_popular {
	overflow: auto;
}
.cate_popular .wpp-list {
	width: 640px;
	margin: 0 0 15px 0;
	padding: 0 1px 4px 0;
	border: 1px solid #bbb;
}
.cate_popular li {
	display: table-row-group;
	overflow: hidden;
	width: 640px;
	list-style: none;
	line-height: 1.3;
	vertical-align: top;
	margin: 4px 0 0 0;
	padding: 0 0 5px 0;
	border-bottom: 1px dashed #666;
	background-color: #ffffff;
	font-size: 16px;
}
.cate_popular .wpp-thumbnail {
	float: left;
	max-width: 90px;
	height: 90px;
	margin: 0 4px 0 0;
	-moz-box-shadow: 2px 2px 3px #ccc;
	-webkit-box-shadow: 2px 2px 3px #ccc;
	box-shadow: 2px 2px 3px #ccc;
}
.cate_popular p {
	float: right;
	max-width: 72px;
	margin: 0;
	padding: 0;
}

.fb_iframe_widget > span {
vertical-align: baseline !important;
}

ul.four-bottom{
 text-align: center;
 width:320px;
 margin: 0 auto;
 vertical-align: bottom;
}

ul.four-bottom li{
 display:inline;
 float: left;
}

/* democracy */
.democracy:after{ content:'';display:table; clear:both; }
.democracy ul li,
.democracy ul{ background:none; padding:0;margin:0; }
.democracy ul li:before{ display:none; } /* li reset */

.democracy input[type='radio'],
.democracy input[type='checkbox']{
	margin:0; vertical-align:middle;
}
.democracy input[type='radio']:focus,
.democracy input[type='checkbox']:focus{
	outline:none;
}
.democracy ul{ list-style:none !important; border:none !important; }
.democracy ul li{ list-style:none !important; }

input[type="submit"].dem-button,
a.dem-button,
.dem-button{
	position:relative; display:inline-block; text-decoration:none; line-height:1; border:0; margin:0; padding:0; cursor:pointer; white-space:nowrap;
	-webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none;
}
input[type="submit"].dem-button:focus,
a.dem-button:focus,
.dem-button:focus{
	outline:none;
}
input[type="submit"].dem-button:disabled,
a.dem-button:disabled,
.dem-button:disabled{
	opacity:.6;
	cursor:not-allowed;
}
a.dem-button:hover{ text-decoration:none !important; }


/* common presets ------------------------------------ */
.democracy{ position:relative; margin:0 auto; }

.democracy input[type='radio'],
.democracy input[type='checkbox']{ margin-right:.2em; }

.dem-screen{ position:relative; line-height:1.3; }

.democracy ul.dem-vote{ margin-bottom:1em; }
.democracy ul.dem-vote li{ padding-bottom:0; margin-bottom:0; }
.democracy ul.dem-vote li > *{ margin-bottom:.6em; } /* for comfort hover */
.democracy ul.dem-answers li{ padding-bottom:1em; }
.dem-answers .dem-label{ margin-bottom:.2em; line-height:1.2; }

/* result screen */
.dem-graph{ position:relative; color:#555; color:rgba(0,0,0,.6); box-sizing:content-box; width:100%; display:table; height:1.2em; line-height:1.2em; /* because display:table; */ }
.dem-fill{ position:absolute; top:0; left:0; height:100%; background-color:#7cb4dd; }
.dem-voted-this .dem-fill{ background-color:#FFC45A; }

.dem-votes-txt,
.dem-percent-txt{ position:relative; display:table-cell; padding-left:.3em; vertical-align:middle; font-size:90%; }

/* dem-result-bottom */
.dem-poll-info{ padding-bottom:1em; }
.dem-poll-info:after{ content:''; display:table; clear:both; }
.dem-poll-info > *{ font-size:85%; display:block; float:right; clear:both; text-align:right; opacity:0.7; line-height:1.3; }

/* vote screen */
.dem-vote label{ float:none; display:block; }
.dem-results-link{ display:inline-block; line-height:1; margin:.8em 1em; }
.dem-vote .dem-disabled{ opacity:.5; }

/* dem-bottom */
.democracy .dem-bottom{ padding-bottom:1em; } /* stronger property */
.dem-bottom{ text-align:center; }
.dem-bottom:after{ content:''; display:table; clear:both; }

/* typically don't change -- */
.dem-poll-title{ display:block; margin-bottom:1.5em; margin-top:1.2em; font-size:120%; }

.dem-notice{ z-index:10; position:absolute; top:0%; border-radius:2px; width:100%; padding:1.5em 2em; text-align:center; background:rgba(247, 241, 212, 0.8); color:#6D6214; }
.dem-notice-close{ position:absolute; top:0; right:0; padding:5px; cursor:pointer; line-height:.6; font-size:150%; }
.dem-notice-close:hover{ color:#D26616 }

.dem-star{ font-size:90%; vertical-align:baseline; padding-left:0.3em; color:#ff4e00; }

.dem-poll-note{ font-size:90%; padding:0.5em; opacity:0.8; line-height:1.3; }

.democracy .dem-copyright{ position:absolute; bottom:-1em; right:0; text-decoration:none; border-bottom:0; color:#b2b2b2; opacity:0.5; line-height:1; }
.democracy .dem-copyright:hover{ opacity:1; }

.dem-add-answer{ position:relative; }
.dem-add-answer > *{ display:block; }
.dem-add-answer a{ display:inline-block; }
input.dem-add-answer-txt{ width:100%; box-sizing:border-box; }
.dem-add-answer-close{ position:absolute; right:0; padding:0 .7em; cursor:pointer; color:#333; }
.dem-add-answer-close:hover{ color:#ff2700; }

.dem-edit-link{ display:block; position:absolute; top:0; right:0; line-height:1; text-decoration:none !important; border:none !important; }
.dem-edit-link svg{ width:1.2em!important; fill:#5a5a5a; fill:rgba(0,0,0,.6); }
.dem-edit-link:hover svg{ fill:#35A91D;  }

.dem-loader{ display:none; position:absolute; top:0; left:0; width:100%; height:100%; }
.dem-loader > *{ display:table-cell; vertical-align:middle; text-align:center; }
.dem-loader svg{ width:20%; max-width:100px; min-width:80px; margin-bottom:15%; }
.dem-loader [class^="dem-"]{ margin-bottom:15%!important; }

.dem__collapser{ display:block; cursor:pointer; text-align:center; font-size:150%; line-height:1; }
.dem__collapser:hover{ color:#FF3311; background:rgba(255, 255, 255, 0.3); }
.dem__collapser.expanded{ position:relative; height:1em; }
.dem__collapser.collapsed{ position:absolute; top:0; bottom:0; right:0; left:0; }
.dem__collapser .arr{ display:block; position:absolute; bottom:0; width:100%;  }
.dem__collapser.collapsed .arr:before{ content:"▼ ▼ ▼"; }
.dem__collapser.expanded  .arr:before{ content:"▲ ▲ ▲"; }

/* / typically do't change */

/* shortcode */
.dem-poll-shortcode{ margin-bottom:1.5em; }

/* archive page */
.dem-archives .dem-elem-wrap{ margin-bottom:2em; padding-bottom:20px; border-bottom:1px dashed #ccc; }
.dem-archives .dem-archive-link{ display:none; }

.dem-paging{ text-align:center; margin:1.5em auto; }
.dem-paging > *{ display:inline-block; padding:.2em .8em .4em; border-radius:.2em; background:#e2e2e2; color:#333; text-decoration:none; text-transform:lowercase; }
.dem-paging > a{ color:#333; }
.dem-paging > a:hover{ background:#ccc; color:#333; }
.dem-paging .current{ background:#656565; color:#fff; }
.dem-paging .dots{ background:none; }
.dem-paging .prev{  }
.dem-paging .next{  }

.democracy{ 
	border-color:#ccc; border: 1px solid rgba(0,0,0,.1); background-color:#eee; background-color:rgba(0,0,0,.1);
	background-image: -webkit-linear-gradient(bottom, rgba(0,0,0,.05), transparent);background-image: linear-gradient(to top, rgba(0,0,0,.05), transparent);
	padding:1em; padding-bottom:.5em; margin-bottom:1em;
}

.dem-poll-title{ margin:0; font-size:115%; margin:-.9em; margin-bottom:1em; text-align: center; padding:1em; border-bottom: 1px solid rgba(0,0,0,.1); }

.dem-percent-txt,
.dem-label-percent-txt{ display: none; }

.dem-votes-txt-percent:before{ content:'― '; display:inline; }

.dem-revote-button:before{ content:'◄ '; }

.dem-graph{ background-color: rgba(255,255,255,.8); }

.dem-results-link{ margin-bottom: 0; }

.dem__checkbox,
.dem__radio{ display:none !important; }

.dem__checkbox_label,
.dem__radio_label{ position: relative; box-sizing: content-box; }

.dem__checkbox_label .dem__spot,
.dem__radio_label .dem__spot {
	position: relative;
	display: inline-block;
	vertical-align: baseline;
	top: .1em;
	cursor: pointer;
	/*style*/
	width: 12px;
	height: 12px;
	margin-right: .3em;
	background:#fff;
	border: 1px solid #ccc;
}

.dem__checkbox_label,
.dem__radio_label{  }

.dem__checkbox_label .dem__spot { border-radius: 3px; }
.dem__radio_label .dem__spot { border-radius:50%; }

.dem__checkbox_label .dem__spot:after,
.dem__radio_label .dem__spot:after{
	content: '';
	position: absolute;
	opacity: 0;
}

.dem__checkbox_label .dem__spot:after {
	width: 11px;
    height: 4px;
    top: 0px;
    left: 2px;
	border:2px solid #333;
	border-top: none;
	border-right: none;
	background: transparent;
	-ms-transform: rotate(-45deg);-webkit-transform: rotate(-45deg);	transform: rotate(-45deg);
}
.dem__radio_label .dem__spot:after {
	width: 6px;
    height: 6px;
	border-radius:50%;
	top: 50%;
    left: 50%;
	background: #333;
	-ms-transform: translate(-50%, -50%);-webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);
}

.dem__checkbox_label:hover .dem__spot::after,
.dem__radio_label:hover .dem__spot::after {
	opacity: 0.2;
}

.dem__checkbox:checked + .dem__spot,
.dem__radio:checked + .dem__spot {
	border-color:#999;
}
.dem__checkbox:checked + .dem__spot:after,
.dem__radio:checked + .dem__spot:after {
	opacity: 1;
}
.dem__checkbox:disabled + .dem__spot,
.dem__radio:disabled + .dem__spot {
	opacity: .5;
}
.dem__checkbox:not(:checked):disabled + .dem__spot:after,
.dem__radio:not(:checked):disabled + .dem__spot:after {
	opacity:0;
}

input[type="submit"].dem-button,
a.dem-button,
.dem-button{
	padding:.5em 1em;
	vertical-align: middle;
	text-align: center;
	text-shadow: 0 -1px 1px #777;
	color: #fff;
	border: 2px solid #F64C2B;
	border-radius:3px;
	box-shadow: 0 0 0 60px rgba(0,0,0,0) inset, .1em .1em .2em #800;
	background: linear-gradient(#FB9575, #F45A38 48%, #EA1502 52%, #F02F17);
}

input[type="submit"].dem-button,
a.dem-button,
.dem-button:active {
	top: .1em;
	left: .1em;
	box-shadow: 0 0 0 60px rgba(0,0,0,.05) inset;
}

a.dem-button:visited{ color:#fff; }