/*
Theme Name: Justin Blog Theme
Theme URI: http://justinjackson.ca
Version: 1.3
Description: Text only theme.
Author: Justin Jackson
Author URI: http://justinjackson.ca

License: GNU General Public License
License URI: /license.txt

Tags: one-column, fixed-width, light, right-sidebar, flexible-width, custom-menu, featured-images, theme-options
*/

#ouibounce-modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#ouibounce-modal .underlay {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: #F6E8C5;
  cursor: pointer;
  -webkit-animation: fadein 0.6s;
  animation: fadein 0.6s;
}
#ouibounce-modal .modal {
  max-width: 600px;
	max-height: 450px;
  background-color: #fff;
  z-index: 1;
  position: absolute;
  margin: auto;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border-radius: 10px;
  -webkit-animation: popin 0.6s;
  animation: popin 0.6s;
}

#ouibounce-modal .modal-body {
  padding: 30px;
}

#ouibounce-modal p { font-size: 16px; margin-bottom: 20px; }
#ouibounce-modal button { padding: 10px; background-color: rgba(248, 89, 49, 1); color: #FFF; text-align:center; margin-top: 20px; border-radius: 10px; }
#ouibounce-modal form { background: none; padding: 0; margin: 0; }
#ouibounce-modal input { background: none; border: 2px solid #F1E2A2; padding: 8px; }
#ouibounce-modal .modal-footer { font-size: 13px; text-decoration: underline; margin-top: 20px; cursor: pointer; color: #000; }

/* = html5 ----------------------- */

::-moz-selection {
background: rgba(77, 77, 77, .15);
text-shadow: none;
}
::selection {
background: rgba(77, 77, 77, .15);
text-shadow: none;
}
/* = structure ----------------------- */

body {
	margin: 120px 0 0 25%;
	color: rgba(51, 51, 51, 1);
	font: 400 18px/1.68 'Merriweather', sans-serif;
}
header, article, footer {
	max-width: 600px;
}
article {
	margin: 47px 0;
}
.home article, .page article {
	max-width: 600px;
}
.single article {
}
footer {
	margin: 0 0 76px 0;
}
/* = typography ----------------------- */

h1, h2, h3, h4, h5, h1 a, h2 a, h3 a, h4 a, h5 a {
	color: rgba(26, 26, 26, 1);
	line-height: 1;
  font-family: 'Open Sans Condensed', sans-serif;
  text-transform: uppercase;
}
}
h2 {
}
.single h2 {
	padding-bottom: 23px;
	letter-spacing: -1px;
	font-weight: 700;
	font-size: 56px;
}
.page h2 {
	padding-bottom: 23px;
	letter-spacing: -1px;
	font-weight: 700;
	font-size: 56px;
}
#hometop {
  padding-bottom: 23px;
  letter-spacing: -1px;
  font-weight: 700;
  font-size: 56px;
  color: #990000;
}
.home h2 {
	padding-bottom: 23px;
	font-weight: 700;
	font-size: 23px;
	line-height: 1.34;
}
h3 {
	padding: 23px 0;
	font-weight: 700;
	font-size:20px;
	line-height: 1.34;
}
h4 {
	padding: 23px 0;
	font-weight: 700;
	font-size: 18px;
	line-height: 1.34;
}
p {
}
article p, article ul, article ol {
	padding-bottom: 23px;
}
footer p {
	font-size: 14px;
	padding-bottom: 14px;
}
strong {
	font-weight: 700;
}
small, .wp-caption-text {
	display: block;
	padding-bottom: 23px;
	font-size: 14px;
	opacity: .5;
}
ul, ol {
}
li {
}
article ul, article ol {
	margin-left: 47px;
	line-height: 1.34;
}
article ul li {
	padding-bottom: 14px;
	list-style: circle;
}
article ol li {
	padding-bottom: 14px;
	list-style: decimal;
}
img {
	max-width: 100%;
}
blockquote {
	margin: 0 0 23px -23px;
	padding-left: 23px;
	color: #990000;
	border-left: 2px solid #990000;
}
article blockquote p {
	padding-bottom: 0;
}
cite {
}
hr {
	margin: 23px auto 46px auto;
	width: 25%;
	border-top: 4px solid rgba(77, 77, 77, .15);
}
a {
	border-bottom: 1px solid rgba(77, 77, 77, .25);
	color: rgba(77, 77, 77, 1);
-webkit-transition: color .6s ease;
-moz-transition: color .6s ease;
-o-transition: color .6s ease;
transition: color .6s ease;
}
a:hover {
	color: rgba(77, 77, 77, .5);
}
small a {
	border-bottom: 1px solid rgba(51, 51, 51, .25) !important;
}
.red h2, a:hover {
  color: #990000;
}
.colorize {
}
.color3 h2, .color3 a:hover {
	color: rgba(163, 169, 72, .75);
}
.color5 h2, .color5 a:hover {
	color: rgba(237, 185, 46, .75);
}
.color7 h2, .color7 a:hover {
	color: rgba(248, 89, 49, .5);
}
.color11 h2, .color11 a:hover {
	color: rgba(0, 153, 137, 5);
}
.color13 h2, .color13 a:hover {
	color: rgba(206, 24, 54, .5);
}
.color3 a {
	border-bottom: 1px solid rgba(163, 169, 72, 1);
}
.color5 a {
	border-bottom: 1px solid rgba(237, 185, 46, 1);
}
.color7 a {
	border-bottom: 1px solid rgba(248, 89, 49, 1);
}
.color11 a {
	border-bottom: 1px solid rgba(0, 153, 137, 1);
}
.color13 a {
	border-bottom: 1px solid rgba(206, 24, 54, 1);
}
h2.color3 a {
	border-bottom: 2px solid rgba(163, 169, 72, 1);
}
h2.color5 a {
	border-bottom: 2px solid rgba(237, 185, 46, 1);
}
h2.color7 a {
	border-bottom: 2px solid rgba(248, 89, 49, 1);
}
h2.color11 a {
	border-bottom: 2px solid rgba(0, 153, 137, 1);
}
h2.color13 a {
	border-bottom: 2px solid rgba(206, 24, 54, 1);
}
.color3 blockquote {
	border-left: 2px solid rgba(163, 169, 72, 1);
}
.color5 blockquote {
	border-left: 2px solid rgba(237, 185, 46, 1);
}
.color7 blockquote {
	border-left: 2px solid rgba(248, 89, 49, 1);
}
.color11 blockquote {
	border-left: 2px solid rgba(0, 153, 137, 1);
}
.color13 blockquote {
	border-left: 2px solid rgba(206, 24, 54, 1);
}
a.button { padding: 10px; background-color: rgba(248, 89, 49, 1); color: #FFF; text-align:center; margin-top: 20px; border-radius: 10px; }
/* = menu ----------------------- */

.menu {
	display: block;
	padding-bottom: 23px;
	font-size: 18px;
	opacity: .5;
}
.menu ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	list-style-image: none;
}
.menu li {
	display: inline;
	padding: 5px 20px 5px 20px
}
.menu li:first-child {
	padding: 5px 20px 5px 0;
}
/* = forms ----------------------- */

form {
}
input, textarea {
	background: rgba(77, 77, 77, .05);
	font: 400 18px/1.68 'Merriweather', sans-serif;
	padding: 5px;
	border-radius: 5px;
}
input[type="submit"], button {
	background: rgba(77, 77, 77, 1);
	color: rgba(255, 255, 255, 1);
	padding: 5px 20px;
}

	::-webkit-input-placeholder {
color: rgba(77, 77, 77, .5);
}
	:-moz-placeholder {
color: rgba(77, 77, 77, .5);
}
	::-moz-placeholder {
color: rgba(77, 77, 77, .5);
}
	:-ms-input-placeholder {
color: rgba(77, 77, 77, .5);
}
/* = common ----------------------- */

.alignleft {
	position: relative;
	float: left;
	margin: 0;
	text-align: left;
}
.alignright {
	position: relative;
	float: right;
	margin: 0;
	text-align: right;
}
.aligncenter {
	clear: both;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}
.wp-caption {
	max-width: 100% !important;
}
.wp-caption img {
	padding-bottom: 14px;
}
.wp-caption-text {
}
.wp-post-image {
}
.sticky {
}
.gallery-caption {
}
.bypostauthor {
}










/* = media queries ----------------------- */

@media screen and (max-height: 700px) {
 body {
margin-top: 30px;
}
}
 @media screen and (max-width: 800px) {
 body {
margin: 20px;
}
 header, article, footer {
max-width: 100%;
}
#hometop {
  padding-bottom: 23px;
  font-weight: 700;
  font-size: 29px;
  color: #990000;
}
 .single h2, .page h2 {
padding-bottom: 23px;
font-weight: 700;
font-size: 29px;
}
 blockquote {
margin: 0 0 23px 23px;
}
 .menu {
font-size: 20px;
}
 .menu ul {
margin: 20px;
padding: 10px;
 list-style-type: none;
list-style-image: none;
}
 .menu li {
display: block;
padding: 0
}
 .menu li:first-child {
padding: 0
}
}
