html,body,div,ul.futurebox,ul.futurebox li { border: 0; padding: 0; margin: 0 }
html         { height: 100%; }
body         { font-family: "Helvetica Neue", "Lucida Grande", Helvetica, Arial, Verdana, sans-serif; font-size: 15px; color: #111; background: #111; height:100%; padding:0}
a            { color: #aa0000; border-bottom: 1px dotted #bb0000; text-decoration: none; }
a:hover      { color: #dd0000; border-bottom: 1px solid #dd0000; }
.box         { width: 860px; margin: 0 auto; background: #fff; min-height:120%; height:120%; }
.column      { padding: 15px 0px; position: absolute; width: 860px; background: #fff; height:120%; }
.column_redux { padding: 0 10px; }
h1 { font-size: 30px; margin: 15px 0; }
h2 { font-size: 20px; font-weight: normal; margin: 15px 0; font-family: Georgia,serif; }

.info {
    float: right;
    width: 414px;
    margin: 0 0 0 10px;
}
span.code { background: #efefef; border: solid 1px #ccc; font-family: Inconsolata, Consolas, monospace; display:inline-block; font-style:normal;}
ul.normal li { margin: 10px 0; }

p { padding-top: 0; margin-top: 0; }
.share { font-weight: bold; padding: 15px 0; }
.download { text-align: center; font-size: 15px; font-weight: bold; color: #000; }
.download-github { float: left; }
.download-vim { float: right; }
.download:hover { color: #b00; }
.note { font-style: oblique; font-size: 14px; padding-top: 15px; clear:both; }

/* Futurebox styles */
ul.futurebox { float: left; }
ul.futurebox li {
    display: inline-block;
    float: left;
    list-style: none;
    margin: 0 10px 0 0;
    border: 3px solid #ccc;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
ul.futurebox li:hover { border: 3px solid #1E528C; }

ul.futurebox li img, ul li label { 
    display: block; 
    cursor: pointer; 
}

ul.futurebox li input { display: none; }
ul.futurebox li input:checked + .overlay { display: table; }

.overlay {
	width: 100%;
	height: 100%;
	position: absolute; 
	top: 0; 
	left: 0; 
	display: none; 
	z-index: 999;
	background: rgb(0,0,0);
	background: rgba(0,0,0,0.7);
}
.overlay label {
    display: table-cell; 
    vertical-align: middle; 
    text-align: center;
}
.overlay img, .overlay iframe {
    display: inline;
    border: none;
    padding: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    background: #ffffff;
}
		
.theme01 .overlay {
	background: none;
}
.theme01 .overlay label > img,
.theme01 .overlay iframe,
.theme01 .content01 {
    border: 1px solid #ccc;
    -moz-box-shadow: 5px 5px 10px #000, -5px -5px 10px #000;
    -webkit-box-shadow: 5px 5px 10px #000, -5px -5px 10px #000;
    box-shadow: 5px 5px 10px #000, -5px -5px 10px #000;
}
		
.content01 {
	display: block;
	width: 460px;
	padding: 20px;
	background: #fff;
	color: #000;
	margin: 0 auto;
	text-align: left;
	cursor: auto;
	position: relative;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}
.content01 .inner_content {
    display: block;
    height: 500px;
    overflow-y: auto;
}
.content01 .inner_content span { display: block; margin-bottom: 12px; font-size: 12px; }
#futurebox07 + .overlay .inner_content { height: 265px; }
.content01 img:first-child { float: left; display: block; margin: 0 10px 0 0; }
.content01 img { float: right; margin: 0 10px; padding: 0; }
	
.content02 {
	width: 820px;
	padding: 0;
}

#close { display: none; }
.closebutton {
	background: #606061;
	color: #FFFFFF;
	cursor: pointer;
	height: 24px;
	line-height: 24px;
	overflow: hidden;
	position: absolute;
	right: -12px;
	text-align: center;
	top: -12px;
	width: 24px;
	
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
	
	-moz-box-shadow: 1px 1px 3px #000;
	-webkit-box-shadow: 1px 1px 3px #000;
	box-shadow: 1px 1px 3px #000;
}
.closebutton:hover {
	background: #318DF2;
	text-shadow: 1px 1px 1px #ccc;
}

.drop-shadow {
    position:relative;
    width:40%;    
    padding:10px; 
    margin:10px 10px 5px; 
    background:#fff;
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

.drop-shadow:before,
.drop-shadow:after {
    content:"";
    position:absolute; 
    z-index:-2;
}

.drop-shadow p {
    font-size:16px;
    font-weight:bold;
}

.curved:before {
    top:10px;
    bottom:10px;
    left:0;
    right:50%;
    -webkit-box-shadow:0 0 15px rgba(0,0,0,0.6);
    -moz-box-shadow:0 0 15px rgba(0,0,0,0.6);
    box-shadow:0 0 15px rgba(0,0,0,0.6);
    -moz-border-radius:10px / 100px;
    border-radius:10px / 100px;
}
.curved-hz-1:before {
    top:50%;
    bottom:0;
    left:10px;
    right:10px;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
}
div.quote {
    float:left;
    padding: 10px;
    font-family: Georgia,serif;
    width: 350px;
    padding: 22px;
    text-align: center;
}
div.quote-box {
    margin: 0 auto;
    width: 280px;
}
div.quote-signoff {
    text-align: right;
    padding-right: 18px;
}
div.quote-body {
    font-size: 22px;
    margin: 10px;
}
