@charset "UTF-8";
@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,400,300,700);
@import url(http://fonts.googleapis.com/css?family=Montserrat);
@import url(http://fonts.googleapis.com/css?family=Anonymous+Pro:400,700);
/* Colours */
/* Responsive sizes */
/* Globals */
html { height: 100%; overflow-x: hidden; }

body { font-family: 'Open Sans', sans-serif; font-weight: 300; background-color: #2D2D29; color: #FFFFFF; font-size: 16px; height: 100%; width: 100%; }

a, a:active { color: #3CA2A2; text-decoration: none; }

a:hover { color: #215A6D; text-decoration: none; }

ul { list-style-type: none; }

.navbar, .nav { background-color: #215A6D; }
.navbar .navbar-toggle, .nav .navbar-toggle { margin-top: 10px; padding-top: 0px; padding-bottom: 20px; }
.navbar li a, .navbar li a:active, .nav li a, .nav li a:active { color: #FFFFFF; }
.navbar li a:hover, .nav li a:hover { color: #215A6D; text-decoration: none; }

.clearfix:after { content: " "; display: block; height: 0; clear: both; }

.header { font-size: 32px; text-align: center; margin-top: 20px; margin-left: -0%; width: 100%; }
@media (min-width: 768px) { .header { font-size: 62px; margin-left: -10%; width: 120%; } }

.menu-button { color: #FFFFFF; font-size: 24px; position: fixed; top: 10px; left: 20px; cursor: pointer; line-height: 1em; padding: 10px; background-color: #2D2D29; z-index: 100; }
@media (min-width: 768px) { .menu-button { top: 20px; left: 40px; } }

.content-panel { background-color: #3B3B35; padding-top: 20px; padding-bottom: 20px; padding-left: 30px; padding-right: 30px; margin-top: 20px; box-shadow: 0px 0px 0px 0px, 0px 6px 12px rgba(0, 0, 0, 0.2); border-bottom: 5px solid #3CA2A2; }

#my-menu p { margin-bottom: 5px; }
#my-menu a, #my-menu a:active { color: #FFFFFF; }
#my-menu a:hover { color: #3CA2A2; }
#my-menu .pages .fa { margin-right: 10px; }

.links { margin-top: 50px; text-align: center; }
.links i { padding-left: 5px; padding-right: 5px; }
@media (min-width: 768px) { .links i { padding-left: 10px; padding-right: 10px; } }
.links .fa { -webkit-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; }
.links .fa-twitter:hover { color: #6dabda; }
.links .fa-linkedin:hover { color: #2b77b1; }
.links .fa-google-plus:hover { color: #c95644; }
.links .fa-github-alt:hover { color: #f6c2a4; }
.links .fa-stack-overflow:hover { color: #c98b3b; }
.links .fa-rss:hover { color: #eea33a; }

/* Index */
.index { height: 100%; max-height: 100%; width: 100%; padding: 0px; }
@media (min-width: 768px) { .index { width: 700px; max-width: 700px; } }
.index .header { margin-top: 10px; margin-left: 0%; margin-bottom: 0px; font-size: 32px; width: 100%; }
@media (min-width: 1200px) { .index .header { margin-left: -10%; width: 120%; } }
.index .content-panel:nth-of-type(1) { border-bottom: 10px solid #3CA2A2; }
.index .author-header { font-family: 'Montserrat', sans-serif; color: #3CA2A2; margin-top: 0px; padding-top: 15px; font-size: 30px; }
@media (min-width: 768px) { .index .author-header { font-size: 52px; margin-top: 0px; } }
@media (min-width: 992px) { .index .author-header { font-size: 60px; margin-top: -20px; } }
.index .row { height: 100%; max-height: 100%; margin-top: 60px; margin-left: 0px; margin-right: 0px; }
.index .gravatar { width: 100%; margin-top: -80px; text-align: center; }
.index .author-text { text-align: center; margin-top: 30px; }
.index .author-text b { font-size: 32px; }
.index .links { font-size: 2em; }
.index .articles { text-align: center; font-size: 20px; }
.index .articles h2 { margin-bottom: 30px; color: #3CA2A2; font-size: 26px; }
.index .articles ul { padding: 0px; }
.index .articles ul li { margin-bottom: 20px; font-size: 24px; }
.index .articles ul li a:hover { color: #969696; }
.index .articles ul li small { font-size: 14px; margin-top: -10px; padding-top: 0px; color: #969696; }
.index .articles ul li:nth-last-of-type(1) small { font-size: 16px; }
.index .articles a, .index .articles a:active { color: #FFFFFF; }
.index .articles a:hover { color: #3CA2A2; }
.index .copyright { margin-top: 50px; text-align: center; }
.index .links a, .index .links a:active { color: #FFFFFF; }
.index .menu { margin-top: 250px; margin-bottom: 20px; font-size: 20px; position: absolute; bottom: 0px; }
.index .menu a, .index .menu a:active { color: #FFFFFF; }
.index .menu a:hover { color: #3CA2A2; }
.index .menu ul { margin-bottom: 30px; padding-left: 10px; }
.index .menu ul ul { padding-left: 50px; list-style: none; margin-left: 0; text-indent: -0.6em; }

.all-posts { margin-left: 0px; margin-right: 0px; }
@media (min-width: 768px) { .all-posts #search-container { padding-top: 75px; padding-bottom: 150px; } }
@media (min-width: 992px) { .all-posts { margin-left: -15px; margin-right: -15px; }
  .all-posts #search-container { padding-bottom: 300px; } }
.all-posts #search-input { position: relative; width: 100%; padding: 6px 15px 6px 30px; margin: 2px; margin-top: 50px; color: #2D2D29; background-color: #FFFFFF; border: 1px solid #adc5cf; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px; }
.all-posts #search-input:focus { border: none; }
.all-posts .content-panel { padding-left: 10px; padding-right: 10px; }
@media (min-width: 992px) { .all-posts .content-panel { padding-left: 30px; padding-right: 30px; } }

.single { height: 100%; max-height: 100%; }
.single h1, .single h2, .single h3, .single h4, .single h5, .single h6 { font-family: 'Montserrat', sans-serif; margin-bottom: 10px; }
.single h2 { font-size: 36px; }
.single h3 { font-size: 28px; }
.single p { margin-bottom: 10px; }
@media (min-width: 768px) { .single p { margin-bottom: 40px; } }
.single .menu { background-color: #215A6D; }
.single .menu a, .single .menu a:active { color: #FFFFFF; }
.single .menu a:hover { color: #3CA2A2; }
.single .menu h4 { margin-top: 20px; }
.single .menu .share { margin-top: 20px; }
.single .menu .share h4 { margin-bottom: 10px; }
.single .menu .home { margin-top: 10px; font-size: 16px; }
.single .menu .home a { color: #FFFFFF; }
.single .menu .related ul { padding: 0px; }
.single .menu .related li { margin-bottom: 10px; }
.single .article { width: 100%; margin-left: 0%; padding: 0px; }
@media (min-width: 768px) { .single .article { width: 90%; margin-left: 5%; } }
@media (min-width: 992px) { .single .article { width: 70%; margin-left: 15%; } }
@media (min-width: 1200px) { .single .article { width: 50%; margin-left: 25%; } }
.single .article .thumb { margin-top: 20px; margin-bottom: 0px; text-align: center; }
.single .article .thumb img { height: 50px; }
@media (min-width: 768px) { .single .article .thumb img { height: 70px; } }
.single .article .author { font-size: 20px; text-align: center; margin-bottom: 0px; }
.single .article .read-time { font-size: 16px; text-align: center; margin-bottom: 10px; font-weight: 400; }
@media (min-width: 768px) { .single .article .read-time { margin-bottom: 40px; } }
.single .article .content { font-size: 18px; line-height: 170%; padding-left: 15px; padding-right: 15px; padding-top: 10px; padding-bottom: 10px; }
@media (min-width: 768px) { .single .article .content { font-size: 24px; padding-left: 30px; padding-right: 30px; padding-top: 40px; padding-bottom: 20px; } }
.single .article .content img { max-width: 100%; padding: 10px; display: block; margin-left: auto; margin-right: auto; }
.single .article .content li { list-style-type: disc; }
.single .article .content blockquote { position: relative; width: 100%; margin-left: -15px; padding-right: 45px; background-color: #21211E; color: white; box-sizing: content-box; border: none; font-size: 28px; }
@media (min-width: 768px) { .single .article .content blockquote { margin-left: -30px; padding-left: 45px; padding-right: 15px; } }
.single .article .content blockquote p { margin: 0; padding: 15px; z-index: 0; }
.single .article .content blockquote :before { font-family: "Times New Roman"; color: #969696; content: "“"; position: absolute; top: 15px; left: 15px; font-size: 65px; font-weight: bold; }
.single .article .content .alignright { float: right; }
.single .article .content .aligncenter { display: block; margin: 5px auto 5px auto; }
.single .article .content .highlight { width: 100%; margin-left: -15px; padding-right: 45px; box-sizing: content-box; }
@media (min-width: 768px) { .single .article .content .highlight { margin-left: -30px; padding-right: 60px; } }
.single .article .content .highlight pre { width: 100%; font-family: 'Anonymous Pro'; background-color: #21211E; color: #FFFFFF; font-size: 12px; border: none; padding-left: 15px; padding-top: 20px; padding-bottom: 20px; padding-right: 15px; box-sizing: content-box; border-radius: 0; margin-bottom: 10px; margin-top: 10px; }
@media (min-width: 768px) { .single .article .content .highlight pre { padding-left: 50px; padding-right: 10px; margin-bottom: 40px; font-size: 15px; } }
.single .article .content p code, .single .article .content ul code, .single .article .content ol code { font-family: 'Anonymous Pro'; font-size: 15px; background-color: #21211E; color: #FFFFFF; padding: 0.5em; vertical-align: middle; }
.single .article .content .tags { margin-top: 10px; margin-bottom: 10px; text-align: center; }
.single .article .content .tags a, .single .article .content .tags a:active { color: #FFFFFF; }
.single .article .content .tags a:hover { color: #3CA2A2; }
.single .article .content .share { margin-top: 20px; margin-bottom: 10px; text-align: center; }
.single .article .feedback { text-align: center; }
.single .article .feedback .fa-heart { color: #C04848; }

.related { margin-top: 50px; text-align: center; }
.related .related-header { margin-top: -30px; margin-bottom: 20px; }
.related .related-header a { color: #FFFFFF; font-size: 18px; width: auto; padding: 10px 20px; background-color: #21211E; box-shadow: 0px 0px 0px 0px, 0px 6px 12px rgba(0, 0, 0, 0.2); }
.related .related-header a:hover { color: #215A6D; }
.related .title { padding-top: 20px; font-size: 24px; margin-bottom: 20px; }
@media (min-width: 768px) { .related .title { font-size: 36px; } }
.related .title a { color: #FFFFFF; }
.related .title a:hover { color: #DFECE6; }
.related p { margin-bottom: 0px; }
.related .previous-next { width: 50%; }
.related .previous-next a { color: #FFFFFF; }
.related .previous-next a:hover { color: #DFECE6; }
.related .next { float: right; text-align: right; }
.related .previous { float: left; text-align: left; }
.related .date { color: #969696; }

.search-hr { width: 700px; border-color: #969696; }

.error .error-text { margin-top: 30px; }
.error .error-text a { color: #3CA2A2; }
.error .links { font-size: 1em; }

.footer { width: 100%; margin-left: 0%; }
.footer .fa-heart { color: #C04848; }
@media (min-width: 768px) { .footer { width: 90%; margin-left: 5%; } }
@media (min-width: 992px) { .footer { width: 80%; margin-left: 10%; } }
@media (min-width: 1200px) { .footer { width: 70%; margin-left: 15%; } }
.footer div { color: #969696; text-align: center; margin-top: 20px; margin-bottom: 20px; }
