/*   
Theme Name: Bits
Theme URI: http://bits.simonwebdesign.com/
Description: Bits is a responsive time line theme licensed under the <a href="http://www.opensource.org/licenses/gpl-license.php">GPL</a>. Typography is also responsive based on flowtype.js. This theme is based on the Simon WP Framework. Bits theme comes with custom icons in jpg and svg. Theme menu displays only top level items. FlowType.JS by Simple Focus (http://simplefocus.com/) is licensed under the MIT License. Retina.js (http://retinajs.com/) is licensed under the MIT License.
Author: SWD
Author URI: http://simonwebdesign.com
License: GNU General Public License v2.0
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Version: 1.0.3
Tags: light, white, black, blue, fluid-layout, custom-background, post-formats
*/

/* Contents
 
 Global
 Header 
 Navigation
 Post
 Meta
 Footer
 Misc
 Forms
 Comments 
 Pagination
 Typography
 
*/

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

body {
		margin: 0px;
		padding: 0px;
}
html {
		padding: 0px;
		margin: 0px;
}
/* Flex Grid */
.outer_wrap {
}
.inner_wrap {
		margin: 0 auto;
		max-width: 960px;
		padding: 0px 10px 0px 10px;
}
.flex_10,
.flex_20,
.flex_25,
.flex_33,
.flex_40,
.flex_50,
.flex_60,
.flex_66,
.flex_75,
.flex_80,
.flex_90,
.flex_100 {
		display: inline;
		float: left;
		position: relative;
}
.push {
		margin: 1px 0px 0px 0px;
}
.flex_10 {
		width: 10%;
}
.flex_20 {
		width: 20%;
}
.flex_25 {
		width: 25%;
}
.flex_33 {
		width: 33%;
}
.flex_40 {
		width: 40%;
}
.flex_50 {
		width: 50%;
}
.flex_60 {
		width: 60%;
}
.flex_66 {
		width: 66%;
}
.flex_75 {
		width: 75%;
}
.flex_80 {
		width: 80%;
}
.flex_90 {
		width: 90%;
}
.flex_100 {
		width: 100%;
}
.flex_pad {
		padding: 28px;
}
.flex_vert_pad {
		padding: 10px 0px 10px 0px;
}
.clear {
		clear: both;
}
/* Header */
/* ---------------------------------------------------------- */
#header {
		padding: 0px 0px 0px 0px;
}
.outer_header_wrap {
		max-width: 960px;
		margin: 0 auto;
}
.inner_header_wrap {
		padding: 0px;
}
/* Navigation */
/* ---------------------------------------------------------- */
nav {
		border-bottom: 0;
		-webkit-border-radius: 8px 8px 8px 8px;
		border-radius: 8px 8px 8px 8px;
		overflow: hidden;
		margin: 0px;
}
nav a {
		text-decoration: none;
		color: #1B86D2;
}
nav a:hover {
		text-decoration: none;
		color: #f3f3f3;
}
nav a:visited {
		text-decoration: none;
		color: #fff;
}
nav ul {
		display: none;
		height: auto;
		padding: 0px;
		margin: 0px;
		list-style-type: none;
}
#navigation li li {
		display: none;
		height: auto;
}
nav #pull {
		padding: 0;
		width: 30px;
		height: 30px;
}
nav a#pull {
		display: block;
}
nav li {
		text-align: center;
		float: left;
		width: 50%;
		-webkit-box-shadow: inset 1px 1px 1px 2px #ffffff;
		box-shadow: inset 0px 0px 1px 0px #ffffff;
}
nav li a {
		color: #fff;
		padding: 15px 15px 15px 15px;
		display: block;
		height: auto;
		overflow: hidden;
}
#navigation {
		padding: 0px;
		margin: 10px 0px 0px 0px;
		background: #3983CA;
		overflow: hidden;
		-webkit-border-radius: 8px 8px 8px 8px;
		border-radius: 8px 8px 8px 8px;
}
/* Post */
/* ---------------------------------------------------------- */

.fadeIn {
		animation-name: fadeIn;
		-webkit-animation-name: fadeIn;
		animation-duration: 1.5s;
		-webkit-animation-duration: 1.5s;
		animation-timing-function: ease-in-out;
		-webkit-animation-timing-function: ease-in-out;
		visibility: visible !important;
}
 @keyframes fadeIn {
 0% {
 opacity: 0.0;
}
 60% {
}
 80% {
 opacity: 1;
}
 100% {
 opacity: 1;
}
}
 @-webkit-keyframes fadeIn {
 0% {
 opacity: 0.0;
}
 60% {
}
 80% {
 opacity: 1;
}
 100% {
 opacity: 1;
}
}
.home #header,
.home .top-line,
.home .postdate,
.home .entry-title,
.home .post,
.home .bread-crumb,
.home .meta,
.home .navigation,
.home #footer,
.archive #header,
.archive .top-line,
.archive .postdate,
.archive .entry-title,
.archive .post,
.archive .bread-crumb,
.archive .meta,
.archive .navigation,
.archive #footer {
		visibility: hidden;
}
.postmetadata {
		padding: 0px 0px 5px 0px;
		color: #777777;
		font-size: 12px;
		line-height: 18px;
		text-transform: capitalize;
		clear: both;
}
.meta {
		padding: 0px 0px 10px 0px;
}
object,
video {
		max-width: 100%;
		width: 100%;
}
img {
		max-width: 100%;
		height: auto;
}
.gallery-item {
		text-align: center;
		width: 100%;
}
.gallery-item img {
		border: 0px;
}
dd.gallery-caption {
		width: 100%;
		font-size: 12px;
}
.single dd.gallery-caption {
		width: 100%;
		font-size: 12px;
		color: grey;
}
.wp-caption {
		max-width: 100%;
		height: auto;
}
.wp-caption-text,.bypostauthor {}
.home .outer_wrap,
.category .outer_wrap {
}
.inner_wrap .content {
		padding: 0px;
}
.archive .post,
.blog .post,
.post,
.type-post,
.type-page {
		padding: 0px;
		-webkit-border-radius: 8px 8px 8px 8px;
		border-radius: 8px 8px 8px 8px;
}
.page .post,
.single .post {
		padding: 20px;
}
.single .post.odd,
.single .post.even {
		color: #000;
		background: #fff;
}
.search .content .post a,
.home .content .post a,
.archive .content .post a {
		color: #fff;
}
.search .content .post a:hover,
.home .content .post a:hover,
.archive .content .post a:hover {
		color: #f3f3f3;
		border-bottom: 0px;
}
.search .content .post,
.home .content .post,
.archive .content .post {
		color: white;
}
.post.even {
		background: #0099cc;
}
.post.odd {
		background: #72BEF3;
}
.post.sticky {
		color: white;
}
.post.sticky a {
		color: white;
}
.top-line {
		margin: 8px 0px 0px 0px;
		padding: 0px 0px 48px 0px;
		height: auto;
		background: url(http://simonwebdesign.com/wp-content/themes/bits/images/line.png) center center repeat-y;
}
.pointer-wrap {
		position: absolute;
		left: 0;
		right: 0;
}
.pointer {
		font-size: 48px;
		text-align: center;
		margin-top: -28px;
		margin-bottom: -28px;
		color: #f3f3f3;
}
.even .pointer {
		font-size: 48px;
		text-align: center;
		margin-top: -28px;
		margin-bottom: -28px;
		color: #0099cc;
}
.odd .pointer {
		font-size: 48px;
		text-align: center;
		margin-top: -28px;
		margin-bottom: -28px;
		color: #72BEF3;
}
.sticky .pointer {
		font-size: 48px;
		text-align: center;
		margin-top: -28px;
		margin-bottom: -28px;
}
.postdate {
		text-align: left;
		padding: 0px 0px 0px 0px;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 18px;
		margin-top: 4px;
		width: 200px;
		color: #0088c7;
		font-size: 34px;
		height: 48px;
}
.postdate ul {
		color: #0088c7;
		list-style-type: none;
		padding: 0px;
		margin: 0px;
		font-size: 28px;
}
.postdate li {
		float: left;
		width: 33%;
}
.post iframe {
		max-width: 100%;
		max-height: auto;
}
path {
		fill: #0088c7;
}
.post-status-icon {
		padding: 0px;
		-webkit-border-radius: 8px 8px 8px 8px;
		border-radius: 8px 8px 8px 8px;
}
.posttime {
		text-transform: uppercase;
		font-weight: regular;
		padding: 12px 0px 10px 0px;
		margin: 0px;
		text-align: center;
}
.postmonth {
		text-transform: uppercase;
		font-weight: regular;
		padding: 12px 0px 10px 0px;
		margin: 0px;
		text-align: center;
}
.postyear {
		color: #777;
		font-weight: bolder;
		font-size: 14px;
		padding: 0px;
}
.aligncenter {
		display: block;
		margin-left: auto;
		margin-right: auto;
}
.alignleft {
		float: left;
		margin: 0px 20px 20px 0px;
		clear: both;
}
.alignright {
		float: right;
		margin: 0px 0px 20px 20px;
		clear: both;
}
.attachment-post-thumbnail {
		float: left;
		min-width: inherit;
		overflow: hidden;
		margin: 0px 20px 0px 0px;
}
/* Meta */
/* ---------------------------------------------------------- */

.time {
		background: url(images/swpf_icons.png) no-repeat left -88px;
		margin: 0px;
		padding: 0px 0px 0px 23px;
}
.post-comments {
		background: url(images/swpf_icons.png) no-repeat left -66px;
		margin: 0px;
		padding: 0px 0px 0px 23px;
}
.categories {
		background: url(images/swpf_icons.png) no-repeat left -108px;
		margin: 0px;
		padding: 0px 0px 0px 23px;
}
.tags {
		background: url(images/swpf_icons.png) no-repeat left -24px;
		margin: 0px;
		padding: 0px 0px 0px 23px;
}
.meta_author {
		background: url(images/swpf_icons.png) no-repeat left -45px;
		margin: 0px;
		padding: 0px 0px 0px 25px;
}
.author {
		padding: 20px 20px 0px 0px;
		margin: 0px 0px 20px 0px;
}
.author img {
		float: left;
		margin: 0px 20px 10px 0px;
}
.authorinfo h3 {
		margin: 0px 0px 10px 0px;
		padding: 0px;
}
.authorinfo p {
		margin: 0px;
		padding: 0px 0px 20px 20px;
		font-size: 12px;
}
/* Footer */
/* ---------------------------------------------------------- */

#footer {
		font-size: 14px;
		margin: 0px 0px 0px 0px;
		padding: 20px;
		color: #848484;
}
.inner_footer_wrap {
		margin: 0 auto;
		max-width: 960px;
		padding: 0px 10px 0px 10px;
}
.footer-widgets {
		padding: 40px 0px 20px 0px;
		text-align: left;
}
.footer-credit {
		padding: 20px 0px 20px 0px;
		text-align: center;
}
/* Comments */
/* ---------------------------------------------------------- */
h3#reply-title {
		padding: 0px;
		margin: 0px;
}
.logged-in-as {
		padding: 0px;
		margin: 0px;
}
#comments-title:before {
		content: "Comments: ";
		color: #777;
}
#comments-title {
		padding: 30px 0px 0px 0px;
		margin: 0px;
		text-align: center!important;
}
.comment-author {
		font-weight: bolder;
		font-size: 14px;
		font-style: italic;
		text-transform: capitalize;
		margin: 0px 0px 0px 0px;
		padding: 40px 0px 0px 0px;
}
.comment-author .avatar {
		display: block;
		float: left;
		margin: -5px 12px 0px 0px;
		padding: 0px;
		-webkit-border-radius: 30px;
		-moz-border-radius: 30px;
		border-radius: 30px;
}
#comment-block {
		padding: 0px;
		overflow: hidden;
}
.comment-body p {
		margin: 10px 0px 10px 0px;
		padding: 10px 10px;
		background-color: #f3f3f3;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		border-radius: 3px;
}
#comment-block .children {
		margin: 0px 0px 0px 28px;
}
#comment-block ol,
#comment-block .children li {
		margin: 0px;
		padding: 0px;
		font-size: 14px;
		list-style-type: none;
}
#comment-block a {
		color: #006699;
}
.commentmetadata {
		font-size: 10px;
		padding: 0px;
		margin: 0px;
}
#respond {
		margin: 40px 0px 0px 0px;
}
a#cancel-comment-reply-link {
		background: #ccc;
		color: white;
		padding: 5px!important;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		border-radius: 3px;
}
/* Pagination */
/* ---------------------------------------------------------- */

.navigation {
		width: 100%;
		text-align: center;
		padding: 5px;
		margin: 30px 0px 50px 0px!important;
}
.navigation a {
		padding: 5px 6px 4px 6px;
		margin: 3px;
		font-weight: bold;
		color: #4280D6;
}
.navigation a:hover {
		color: #82BAF6;
		padding: 5px 6px 4px 6px;
		margin: 3px;
		font-weight: bold;
}
.navigation span.pages {
		padding: 5px 6px 4px 6px;
		margin: 3px;
		color: #333;
		font-weight: bold;
		background-color: inherit;
		display: none;
}
.navigation span.current {
		padding: 5px 6px 4px 6px;
		margin: 3px;
		font-weight: bold;
		color: #fff;
		background-color: #3983CA;
		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
		border-radius: 4px;
}
/* Typography Framework */
/* ---------------------------------------------------------- */


body {
		font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
#header h1 {
		font-weight: 300;
		margin: 0px;
		padding: 30px 0px 0px 0px;
}
#header h1 a {
		color: #3983CA;
		font-size: 36px;
		letter-spacing: -.5px;
		text-decoration: none;
}
#header h1 a:hover {
		color: grey;
		text-decoration: none;
}
.description {
		color: #777777;
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
}
.bread-crumb {
		color: #777777;
		font-size: 12px;
		margin: 0px 0px 0px 0px;
		padding: 5px 5px 5px 10px;
}
.content-format-aside .entry,
.content-format-gallery .entry,
.content-format-link .entry,
.content-format-image .entry,
.content-format-quote .entry,
.content-format-status .entry,
.content-format-video .entry,
.content-format-audio .entry,
.content-format-chat .entry {
		padding: 0px 0px 0px 0px;
}
.content-format-aside .entry {
		padding: 10px 0px 0px 0px;
}
.content-format-link p {
		font-size: 22px;
		padding: 0px 0px 0px 0px;
}
.content-format-link p:before {
		content: 'Link: ';
		margin: 0px;
		font-weight: 600;
}
.content-format-quote blockquote {
		font-size: 22px;
		padding: 20px 10px 20px 90px;
		margin: 0px;
		background: url("images/quotes.png") 10px 10px no-repeat;
}
.content-format-status p:before {
		content: 'Status: ';
		margin: 0px;
		font-weight: 600;
}
.content-format-status p {
		font-size: 26px;
		margin: 0px;
		line-height: 32px;
}
.content-format-status .entry p {
		margin: 0px;
		padding: 0px 0px 0px 20px;
		text-align: left;
}
.content-format-status .entry img {
		float: left;
		text-align: center;
}
a,
a:visited {
		text-decoration: underline;
		color: #1B86D2;
}
a:hover {
		text-decoration: none;
		color: #006699;
}
thead {
		display: table-header-group;
}
tr,
img {
		page-break-inside: avoid;
}
img {
		max-width: 100% !important;
}
h2,
h3 {
		page-break-after: avoid;
}
p,
h2,
h3 {
		orphans: 3;
		widows: 3;
}
p {
		margin: 0 0 10px;
		line-height: 20px;
		font-size: 16px;
}
small {
		font-size: 85%;
}
strong {
		font-weight: bold;
}
em {
		font-style: italic;
}
.left {
		text-align: left;
}
.right {
		text-align: right;
}
.center {
		text-align: center;
}
h1,
h2,
h3,
h4,
h5,
h6 {
		margin: 0px 0px 15px 0px;
		font-family: inherit;
		font-weight: 300;
		line-height: 20px;
		color: inherit;
		text-rendering: optimizelegibility;
}
h1,
h2,
h3 {
		line-height: 40px;
}
h1 {
		font-size: 42px;
}
h2 {
		font-size: 31.5px;
}
h3 {
		font-size: 24.5px;
}
h4 {
		font-size: 17.5px;
}
h5 {
		font-size: 14px;
}
h6 {
		font-size: 11.9px;
}
h1 small {
		font-size: 24.5px;
}
h2 small {
		font-size: 17.5px;
}
h3 small {
		font-size: 14px;
}
h4 small {
		font-size: 14px;
}
h1 a {
		text-decoration: none;
}
.headline {
		padding-bottom: 9px;
		margin: 20px 0 30px;
}
ul,
ol {
		font-size: 14px;
		color: #222222;
		padding: 0;
		margin: 0 0 10px 25px;
}
ul ul,
ul ol,
ol ol,
ol ul {
		margin-bottom: 0;
}
li {
		line-height: 20px;
}
dl {
		margin-bottom: 20px;
		font-size: 14px;
		line-height: 20px;
}
dt,
dd {
		line-height: 20px;
}
dt {
		font-weight: bold;
		margin-top: 0px;
}
dd {
		margin: 5px 20px 0px 20px;
}
hr {
		margin: 20px 0;
		border: 0;
		border-top: 1px solid #eeeeee;
		border-bottom: 1px solid #ffffff;
}
abbr[title],
abbr[data-original-title] {
		cursor: help;
		border-bottom: 1px dotted #999999;
}
blockquote {
		font-size: 14px;
		line-height: 22px;
		border-left: 10px solid #ccc;
		margin: 20px;
		quotes: "\201C""\201D""\2018""\2019";
		padding: 20px 10px 20px 90px;
		background: url("images/quotes.png") 10px 10px no-repeat;
}
address {
		display: block;
		margin-bottom: 0px;
		font-style: normal;
		line-height: 20px;
}
code,
pre {
		padding: 0 3px 2px;
		font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
		font-size: 12px;
		color: #333333;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		border-radius: 3px;
}
code {
		padding: 2px 4px;
		color: #d14;
		background-color: #f7f7f9;
		border: 1px solid #e1e1e8;
}
pre {
		display: block;
		padding: 9.5px;
		margin: 0 0 10px;
		font-size: 13px;
		line-height: 20px;
		word-break: break-all;
		word-wrap: break-word;
		white-space: pre-wrap;
		background-color: #f5f5f5;
		border: 1px solid #ccc;
		border: 1px solid rgba(0, 0, 0, 0.15);
		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
		border-radius: 4px;
}
pre.prettyprint {
		margin-bottom: 20px;
}
pre code {
		padding: 0;
		color: inherit;
		white-space: pre;
		white-space: pre-wrap;
		background-color: transparent;
		border: 0;
}
.pre-scrollable {
		max-height: 340px;
		overflow-y: scroll;
}
table {
		max-width: 100%;
		background-color: transparent;
		border-collapse: collapse;
		border-spacing: 0;
		border: 1px solid #ccc;
}
tr,
td {
		border: 1px solid #ccc;
		padding: 5px;
}
th {
		padding: 5px;
		background-color: #f3f3f3;
		border: 1px solid #ccc;
}
form {
		margin: 0 0 20px;
}
fieldset {
		padding: 0;
		margin: 0;
		border: 0;
}
legend {
		display: block;
		width: 100%;
		padding: 0;
		margin-bottom: 20px;
		font-size: 21px;
		line-height: 40px;
		color: #333333;
		border: 0;
		border-bottom: 1px solid #e5e5e5;
}
legend small {
		font-size: 15px;
		color: #999999;
}
label,
input,
button,
select,
textarea {
		font-size: 14px;
		font-weight: normal;
		line-height: 20px;
}
input,
button,
select,
textarea {
		font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
label {
		display: block;
		margin-bottom: 5px;
}
select,
textarea,
input[type="text"] {
		display: inline-block;
		height: 20px;
		padding: 4px 6px;
		margin-bottom: 10px;
		font-size: 14px;
		line-height: 20px;
		color: #555555;
		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
		border-radius: 4px;
		vertical-align: middle;
}
input[type="text"] {
		display: inline-block;
		height: 20px;
		padding: 6px;
		margin-bottom: 10px;
		margin-right: 8px;
		font-size: 14px;
		line-height: 20px;
		color: #555555;
		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
		border-radius: 4px;
		vertical-align: middle;
}
textarea {
		height: auto;
		width: 96%;
}
radio,
checkbox {
		min-height: 20px;
		padding-left: 20px;
}
radio input[type="radio"],
checkbox input[type="checkbox"] {
		float: left;
		margin-left: -20px;
}
textarea,
input[type="text"] {
		background-color: #ffffff;
		border: 1px solid #cccccc;
		-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
		-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
		box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
		-webkit-transition: border linear .2s, box-shadow linear .2s;
		-moz-transition: border linear .2s, box-shadow linear .2s;
		-o-transition: border linear .2s, box-shadow linear .2s;
		transition: border linear .2s, box-shadow linear .2s;
}
textarea:focus,
input[type="text"]:focus {
		border-color: rgba(82, 168, 236, 0.8);
		outline: 0;
		-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6);
		-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6);
		box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6);
}
input[type="radio"],
input[type="checkbox"] {
		margin: 4px 0 0;
		line-height: normal;
}
select {
		height: 30px;
		line-height: 30px;
		width: 220px;
		border: 1px solid #cccccc;
		background-color: #ffffff;
}
select:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus {
		outline: thin dotted #333;
		outline: 5px auto -webkit-focus-ring-color;
		outline-offset: -2px;
}
.button,
input[type="submit"] {
		display: inline-block;
		padding: 8px 10px 8px 10px;
		margin-bottom: 0;
		font-size: 14px;
		font-weight: 600;
		line-height: 20px;
		text-align: center;
		vertical-align: middle;
		cursor: pointer;
		color: #fff;
		background-color: #3B82D0;
		border: 0px;
		border-bottom-color: #b3b3b3;
		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
		border-radius: 4px;
		-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
		-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
		box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
}
.button:hover,
.button:focus,
.button:active,
.button.active,
.button.disabled,
.button[disabled] {
		color: #333333;
		background-color: #e6e6e6;
}
.button:hover,
.button:focus {
		color: #333333;
		text-decoration: none;
}
.button:focus {
		outline: thin dotted #333;
		outline: 5px auto -webkit-focus-ring-color;
		outline-offset: -2px;
}