body {
    font-size: 16px;
    line-height:24px;
	font-family: 'Roboto Condensed', sans-serif;
	background:#000; 
	min-width:320px;
    overflow-X:hidden;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-tap-highlight-color: transparent;
	-webkit-touch-callout: none;
}

/* Default Styling */
h1 {font-family:'Big Shoulders Display', cursive;line-height:100px;font-size:38px;letter-spacing:2px;}
h2 {font-family:'Big Shoulders Display', cursive;line-height:40px;font-size:28px;letter-spacing:2px;}
h3 {font-family:'Big Shoulders Display', cursive;line-height:40px;font-size:28px;letter-spacing:2px;}
h4 {font-family:'Big Shoulders Display', cursive;line-height:40px;font-size:28px;letter-spacing:2px;}
h5 {font-family:'Big Shoulders Display', cursive;line-height:40px;font-size:28px;letter-spacing:2px;}
h6 {font-family:'Big Shoulders Display', cursive;line-height:40px;font-size:28px;letter-spacing:2px;}
p {margin-bottom:15px;}

/* Nav Styling*/
nav {
    font-size:20px;
    line-height:60px;
    text-align:center;
    letter-spacing:2px;
    text-transform:uppercase;
    font-family:'Big Shoulders Display', cursive;
	overflow:hidden;
    background:#000;
}

#menu-icon {
    color:#fff;
    font-size:40px;
    margin:0px auto;
    padding:10px 150px; /* Makes button wider for clickability */
}

nav ul li:hover {
    color:#00BFFF;
    transition:color 0.2s linear;
    cursor:pointer;
}

nav ul li a  {
    color:#fff;
    transition:color 0.2s linear;
}

nav ul li a:hover {
    color:#00BFFF;
    transition:color 0.2s linear;
    cursor:pointer;
}


@media screen and (min-width: 1200px) {
    nav ul {
        max-height:60px;
        overflow:hidden;
    }
    nav ul li {
        display:inline;
        margin:0px 12px;
        color:#fff;
    }
    #menu-icon {display:none;}
	#icon-close {display:none;}
}

@media screen and (max-width: 1200px){
    #menu-icon {
        display:block;
        cursor: pointer;
    }
	#icon-close {
		color:#fff;
		display:block;
		font-size:50px;
		margin:25px auto;
		line-height:50px;
		text-align:center;
	}
    nav ul {
        max-height:0px;
		height:100%;
        overflow:hidden;
        position:fixed;
        bottom:0px;left:0;right:0;
        transition:max-height 1s linear;
        background:#1D2C3B;
        font-size:30px;
        color:#000;
        cursor:default;
    }
    nav ul li {
        color:#fff;
        display:block;
        margin:0px 12px;
        transition:color 0.2s linear;
    }
    nav ul li:first-of-type {
        margin-top:20px;
    }
    nav ul li:hover {
    	color:#00BFFF;
    }
    .scroll-lock {
        width:100vw;
        height:100vh;
        overflow:hidden;
		touch-action:none;
    }
    .open {
        height:100%;
		max-height:100%;
        transition:max-height 1s linear;
    }
}

/* Main Splashscreen */
#splash {
    top:0px;
    left:0px;
    z-index: -1; /* Set video behind overlay and nav */
    position:fixed;
    object-fit:cover;
    min-width:100%;
    height:100%;
}

#overlay {
	display:flex;
	flex-direction:column;
	height:calc(100vh - 60px);
  	justify-content:center;
  	align-items:center;
	overflow:hidden;
}

#logo {
    width:275px;
    height:275px;
    background: url("static/logo.webp") no-repeat;
    background-position:center;
    background-size:100%;
}

@media screen and (max-height: 800px){
	#logo {
		width:150px;
		height:150px;
		background: url("static/logo.webp") no-repeat ;
		background-position:center;
		background-size: 100%;
	}
}

#social {
    text-align:center;
    margin:10vh 0px 0px;
}

@media screen and (max-height: 500px){
	#social {
		display:none;
	}
}

#donate {
	display:block;
    font-size:20px;
    width:240px;
    padding:5px;
    line-height:34px;
    margin:0px auto 5px;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    text-transform: uppercase;
    color:#fff;
    background-color:#000;
    transition:background-color 0.4s linear;
	font-family:'Big Shoulders Display', cursive;
	letter-spacing:2px;
}

#donate:hover {
    color:#fff;
    background-color:#00BFFF;
    transition:background-color 0.4s linear;
}

/* Social Icons */
.icon {
    padding:10px;
    color:#fff;
    font-size:30px;
    text-align:center;
    background-color:#000;
    border-radius: 40px;
    -moz-border-radius: 40px;
    -webkit-border-radius: 40px;
	transition:background-color 0.4s linear;
    margin:15px 2px;
}

.icon:hover {
    background-color:#00BFFF;
    transition:background-color 0.4s linear;
}

/* Page Fold Indicator */
.icon-down {
    width:100%;
    color:#000;
    display:block;
    font-size:50px;
    line-height:50px;
    text-align:center;
    animation-name:bounce;
    animation-duration:2s;
    animation-timing-function: cubic-bezier(0.280, 0.840, 0.420, 1);
    animation-iteration-count: infinite;
}

@keyframes bounce {
    0%   {transform: translateY(0);}
    10%  {transform: translateY(0);}
    30%  {transform: translateY(-10px);}
    50%  {transform: translateY(0);}
    57%  {transform: translateY(-5px);}
    64%  {transform: translateY(0);}
    100% {transform: translateY(0);}
}

/* Reusable Buttons (Used for Form, About Section) */
.button-white, #load_more {
    font-size:20px;
	width:220px;
    line-height:40px;
	padding:0px;
	text-align:center;
    letter-spacing:2px;
    text-transform:uppercase;
	font-weight:600;
    font-family: 'Big Shoulders Display', cursive;
    margin:25px auto 0px;
    overflow:hidden;
    color:#000;
    background:#fff;
	transition:color 0.4s linear;
	transition:background 0.4s linear;
	cursor:pointer;
}

.button-white:hover {
    color:#fff;
    background:#00BFFF;
	transition:color 0.4s linear;
	transition:background 0.4s linear;
}

/* Specific Styling for About Section */
#about {
    background: url("static/forest.webp") ;
    background-position:top;
    background-size:cover;
    padding:0px 10px;
    overflow:hidden;
}

#history_wrapper { /* Wrapper to allow vertical centering of history tab */
    background: url("static/about.webp") no-repeat ;
    background-position:center;
    margin:6vh auto;
} 

#history {
    width:320px;
    padding:20px;
    color:#fff;
    font-size:15px;
    margin:0px auto;
    line-height:20px;
    text-align:justify;
    text-align-last: center;
    background:#000;
}

#history h1 {
    display:block;
    font-size:23px;
    line-height:28px;
    border-bottom:1px dashed #fff;
    font-family: 'Big Shoulders Display', cursive;
    padding:0px 0px 10px;
    margin-bottom:10px;
    text-align:center;
    letter-spacing:1px;
}

#mission-title {
    width:240px;
    color:#fff;
    line-height:60px;
    background:#000;
    text-align:center;
    text-transform:uppercase;
    font-family:'Big Shoulders Display', cursive;
    margin:10px auto 30px;
    font-size:30px;
	letter-spacing:2px;
}

#mission {
    display:flex;
    flex-direction: row;
    justify-content: center;
    align-content: center;
    margin:0px auto 20px;
    max-width:800px;
    column-gap: 20px;
    flex-wrap: wrap;
    row-gap:30px;
    color:#fff;
    width:100%;
}

#mission #objective {
    font-family: 'Big Shoulders Display', cursive;
    background:#000;
    text-align:center;
    line-height:32px;
    min-width:250px;
    font-size:21px;
    letter-spacing:1px;
    flex: 1 1 0px;
    padding:20px;
}

#mission #objective strong {
    font-size:24px;
    width:50px;
    height:50px;
    display:block;
    line-height:50px;
    text-align:center;
    margin:-45px auto 10px auto;
    font-family: 'Big Shoulders Display', cursive;
    border-radius: 40px;
    -moz-border-radius: 40px;
    -webkit-border-radius: 40px;
    background:#fff;
    color:#000;
	font-weight:600;
}

/* Specific Styling: News Section */ 
#news {
    position:relative;
    background:#000;
    font-family: 'Big Shoulders Display', cursive;
    text-align:center;
}

#news:before, #news:after {
    left:0px;
    content:'';
    width:100%;
    height:50px;
    bottom:100%;
    position:absolute;
    background-position:0 0;
    background-size: 50px 100%;
    background-repeat:repeat-x;
    background-image: linear-gradient(135deg, transparent 67%, #000 67%), linear-gradient(45deg, #000 33%, transparent 33%);
}

#news:after {
    top:100%;
    bottom:auto;
    background-image: linear-gradient(135deg, #000 33%,  transparent 33%),linear-gradient(45deg, transparent 67%, #000 67%);    
}

#news_title {
    color:#fff;
    margin:0px auto;
    text-align:center;
    line-height:80px;
    font-weight:200;
    font-size:34px;
	text-transform:uppercase;
	letter-spacing:2px;
}


#latest_video {
    overflow:hidden;
    min-width:360px;
    max-width:800px;
    margin:0px auto 20px auto;
    padding:0px 10px;
}

#latest_video img {
    width:100%;
    height:56.25%;
    object-fit: cover;
    object-position: 50% 50%;
}

.videoContainer {
    position: relative;
    height: 0;
    padding-top: 56.25%;
    width:100%;
}
.videoContainer iframe {
	position: absolute;
    top: 0; left: 0;
    border: 0;
    width: 100%;
    height: 100%;
}

#video_title {
    font-size:26px;
    line-height:40px;
    font-family: 'Big Shoulders Display', cursive;
    overflow:hidden;
    color:#fff;
	letter-spacing:1px;
	margin:0px;
	font-weight:600;
	padding:5px 15px 0px 15px;
}

#video_title span {
    color:#00BFFF;
    letter-spacing:2px;
    text-transform:uppercase;
	display:block;
	margin-bottom:5px;
	line-height:30px;
	font-size:22px;

}



/* Flex first two feature elements */
#feature_flex {
    display:flex;
    justify-content:center;
    padding:0px 10px;
    align-items: stretch;
    flex-direction:row;
    max-width:800px;
    column-gap:20px;
    margin:0px auto;
    flex-wrap:wrap;
    row-gap:20px;
}

#minor_feature {
    flex: 1 1 25%;
    overflow:hidden;
    min-width:360px;
	max-height:300px;
	background-color: rgb(21, 32, 43);
	padding-bottom:10px;
}

#minor_feature img {
    width:100%;
    height:60%;
    object-fit: cover;
    object-position: 50% 50%;
}

#feature_title {
    font-size:22px;
    line-height:30px;
	max-height:85px;
    font-family: 'Big Shoulders Display', cursive;
    overflow:hidden;
    color:#fff;
	letter-spacing:1px;
	margin:0px;
	font-weight:600;
	padding:5px 15px 0px 15px;
}

#feature_title span {
    color:#00BFFF;
    letter-spacing:2px;
    text-transform:uppercase;
	display:block;
	margin-bottom:5px;
	line-height:25px;
	font-size:18px;

}

/* Contact form specific styling */
#contact {
    min-height:75vh;
    min-height:650px;
    background:url('static/mountain.webp') no-repeat;
    background-position: bottom center;
    background-size:cover;
    color:#000;
}
#form_wrapper {
    margin:0px auto;
    padding:100px 10px;
    max-width:440px; 
}
#contact form {
    text-align:center;
    background-color:rgba(0,0,0,0.50);
    backdrop-filter:blur(5px);
    padding:30px 20px 20px;
}
#contact fieldset {
    border:1px solid #fff;
    padding:20px 5%;
}
#contact legend {
    line-height:0px;
    padding:0px 20px;
    text-align:center;
    font-family: 'Big Shoulders Display', cursive;
    letter-spacing:2px;
    font-size:30px;
    color:#fff;
}
#contact form label {
    display:block;
    font-size:20px;
    margin-top:10px;
    line-height:40px;
    letter-spacing:2px;
    font-family: 'Big Shoulders Display', cursive;
    color:#fff;
}
#contact form input, 
#contact form textarea {
    border:none;
    outline:none;
    font-size:16px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    font-family: 'Roboto', sans-serif;
    padding:0px 10px;
    line-height:38px;
}
#contact form input:hover, 
#contact form textarea:hover {
    outline:none;
}
#contact form input {
    display:block;
    width:calc(100% - 20px);
    margin:0px auto;
}
#contact form textarea {
    resize:none;
    height:140px;
    display:block;
    width:calc(100% - 20px);
    overflow:scroll x;
}

/* Text Area Custom Scrollbar  */ 
textarea::-webkit-scrollbar       {
    background-color:#fff;width:20px
}
textarea::-webkit-scrollbar-track {
    background-color:#fff
}
textarea::-webkit-scrollbar-thumb {
    background-color:rgba(0,0,0,0.50);
    border:4px solid #fff;
    border-radius:16px;
}
#contact form button {
    border:none; /* Default styling applied by class, this removes outline from default button */
    outline:none;
}

/* Specific Styling: Footer */ 
footer {
    font-family: 'Big Shoulders Display', cursive;
    background: #000;
    position:relative;
    z-index:2;
}
footer:before {
    left:0;
    content:'';
    width:100%;
    height:50px;
    bottom:100%;
    position:absolute;
    background-position:0 0;
    background-size: 50px 100%;
    background-repeat:repeat-x;
    background-image: linear-gradient(135deg, transparent 66%, #000 67%), linear-gradient(45deg, #000 33%, transparent 33%);
}
footer #inner_wrapper {
    width:340px;
    color:#fff;
    font-size:24px;
    margin:0px auto;
    line-height:32px;
    text-align:center;
    padding:40px 0px 20px;
    text-transform:uppercase;
    letter-spacing:2px;
}
footer sub {
    display:block;
    font-size:14px;
    line-height:40px;
    text-transform:uppercase;
    letter-spacing:2px;
}
footer #inner_wrapper a {
    color:#fff;
    transition: color 0.4s linear;
}
footer #inner_wrapper a:hover {
    color:#00BFFF;
    transition: color 0.4s linear;
}
#love {
    margin:0px auto;
}
.love {
    display:block;
    color:#00BFFF;
    font-size:30px;
    line-height:40px;
    text-align:center;
    margin:0px auto 0px;
    animation-name:bounce;
    animation-duration:2s;
    animation-timing-function: cubic-bezier(0.280, 0.840, 0.420, 1);
    animation-iteration-count: infinite;
    cursor:pointer;
}
#love ul {
    height:0px;
    overflow:hidden;
    text-align:center;
    background:#000;
    margin:0px auto;
    color:#00BFFF;
    position:absolute;
    bottom:0px;
    left:0px;
    right:0px;
    width:340px;
    font-family: 'Big Shoulders Display', cursive;
    font-size:18px;
    line-height:28px;
    z-index:2;
    transition:height 1s ease-in-out;
}
#love:hover ul {
    height:240px;
    cursor:none;
    transition:height 1s ease-in-out;
}
#love ul li:first-of-type {
    margin:20px auto 5px;
    font-family: 'Big Shoulders Display', cursive;
    font-size:20px;
    line-height:30px;
    letter-spacing:2px;
}
#subscribe {
    border:none;
    outline:none;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    font-family: 'Big Shoulders Display', cursive;
    padding:5px 20px 5px 20px;
    background:#fff;
    margin:10px auto 20px;
    font-size:18px;
    display:block;
    height:40px;
	overflow:hidden;
}
#subscribe form input:hover {
    outline:none;
}
#subscribe button {
    color:#000;
    float:right;
	margin:5px 0px;
    height:30px;
    width:30px;
    font-size:30px;
    line-height:30px;
    outline:none;
    background:#fff;
    border:none;
    transition: color 0.4s linear;
	display:inline-block;
	padding:0px;
	cursor:pointer;
}
#subscribe button:hover {
    color:#00BFFF;
    transition: color 0.4s linear;
}
#subscribe input {
    width:calc(100% - 50px);
    height:38px;
    line-height:40px;
    overflow:hidden;
    border:none;
    outline:none;
    font-size:14px;
	-webkit-appearance: textfield;
	float:left;
	display:inline-block;
	padding:0px;
	margin:0px;
}

#blog {
    background:#000;
    text-align:center;
}

/* Simple Navbar for Blog/Shop */
#nav_special {
    text-align:left;
    margin:0px auto;
    max-width:800px;
    font-size:18px;
    line-height:60px;
    color:#fff;
}

@media screen and (min-width: 850px) {
	#nav_special {
		padding:0px;
	}
}


@media screen and (max-width: 850px) {
	#nav_special {
		padding:0px 10px;
	}
}


#home {
    float:left;
    color:#fff;
    font-size:40px;
    background:#000;
    padding:10px 10px 10px 0px;
    transition:color 0.4s linear;
}

#nav_special a label {
    color:#fff;
    cursor:pointer;
    transition:color 0.4s linear;
}

#nav_special a:hover label, 
#nav_special a:hover #home {
    color:#00BFFF;
    transition:color 0.4s linear;
}

/* Styling for static pages */
#blog_wrapper {
    max-width:800px;
    min-width:360px;
    margin:0px auto;
    padding:20px 10px 80px 10px;
}

/* Header for blog */
#page-title-super {
    color:#fff;
    line-height:90px;
    font-size:75px;
	margin-bottom:20px;
    letter-spacing:2px;
    font-family: 'Big Shoulders Display', cursive;
    text-transform:uppercase;
    text-align:center;
}

/* Header for blog */
#search_query {
    color:#fff;
    line-height:38px;
    font-size:24px;
    letter-spacing:2px;
    font-family: 'Big Shoulders Display', cursive;
    text-transform:uppercase;
    text-align:center;
}

 /* Category filter bar */
#cat_bar {
    padding:10px 20px 5px 20px;
    text-align:left;
    background:#1D2C3B;
    margin:10px 0px 20px;
    border:1px dashed #00BFFF;
    text-align:center;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

#cat_bar li {
    display:inline-block;
    color:#fff;
    line-height:30px;
    background:#15202b;
    font-size:18px;
    font-family: 'Big Shoulders Display', cursive;
    text-transform:uppercase;
    border-radius: 25px;
    -moz-border-radius: 25px;
    -webkit-border-radius: 25px;
    border:1px solid #00BFFF;
    padding:0px 15px;
    margin:0px 5px 10px 0px;
    letter-spacing:1px;
    transition:border 0.4s linear;
}

#cat_bar li a {
    color:#00BFFF;
    transition:color 0.4s linear;
}

#cat_bar li:hover {
    border:1px solid #fff;
    transition:border 0.4s linear;
}

#cat_bar li:hover a {
    color:#fff;
    transition:color 0.4s linear;
}

#cat_bar label {
    display:block;
    line-height:40px;
    font-family: 'Big Shoulders Display', cursive;
    text-transform:uppercase;
    letter-spacing:2px;
    font-size:26px;
    color:#00BFFF;
}


#cat_bar_search {
    border:1px solid #00BFFF;
    outline:none;
    border-radius: 25px;
    -moz-border-radius: 25px;
    -webkit-border-radius: 25px;
    font-family: 'Big Shoulders Display', cursive;
    padding:5px 20px 5px 20px;
    background:#15202b;
    margin:5px 10px 20px;
    font-size:18px;
    display:block;
    height:40px;
	overflow:hidden;
}


#cat_bar_search form input:hover {
    outline:none;
}
#cat_bar_search button {
    color:#00BFFF;
    float:right;
    height:36px;
    width:36px;
    font-size:36px;
    outline:none;
    background:#15202b;
    border:none;
    transition: color 0.4s linear;
	margin:0px;
	padding:0px;
}
#cat_bar_search button:hover {
    color:#00BFFF;
    transition: color 0.4s linear;
}
#cat_bar_search input {
    width:calc(100% - 50px);
    height:38px;
    line-height:40px;
    overflow:hidden;
    border:none;
    outline:none;
    font-size:16px;
    background:#15202b;
    color:#00BFFF;
	-webkit-appearance: textfield;
	margin:0px;
	padding:0px;
	float:left;
}

#cat_bar_search input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #00BFFF;
    opacity: 1; /* Firefox */
  }
  
#cat_bar_search input:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color:#00BFFF;
  }
  
#cat_bar_search input::-ms-input-placeholder { /* Microsoft Edge */
    color: #00BFFF;
  }

.cat_bar_inner {
	max-height:0px;
	overflow:hidden;
	transition: max-height 1s linear;
}

.search_down {
	display:inline-block;
}

.search_up {
	display:none;
}

.cat_bar_open_ad {
	display:none;
}
.cat_bar_open_au {
	display:inline-block;
}
.cat_bar_open {
	max-height:8000px;
	transition: max-height 0.8s linear;
}

.search_down, .search_up {
	width:30px;
	height:30px;
	color:#00BFFF;
	line-height:30px;
	margin:0px auto;
	animation-name:bounce-small;
    animation-duration:2s;
    animation-timing-function: cubic-bezier(0.280, 0.840, 0.420, 1);
    animation-iteration-count: infinite;
	cursor:pointer;
}


@keyframes bounce-small {
    0%   {transform: translateY(0);}
    10%  {transform: translateY(0);}
    30%  {transform: translateY(-5px);}
    50%  {transform: translateY(0);}
    57%  {transform: translateY(-5px);}
    64%  {transform: translateY(0);}
    100% {transform: translateY(0);}
}

#blog_wrapper article ::-moz-selection { background:#1D2C3B;color:#fff; }
#blog_wrapper article ::selection { background:#1D2C3B;color:#fff;}

#blog_wrapper article {
    padding:25px;
    background:#fff;
    position:relative;
    margin-bottom:20px;
    transition: background-color 0.4s linear;
    text-align:left;
}

#excerpt p {
    margin-top:10px;
    text-align:center;
}

#featured_image img  {
    width:100%;
    height:56.25%;
    object-fit:cover;
    margin-bottom:5px;
}

#cat_list ul {
	max-height:30px;
    text-align:center;
	overflow:hidden;
		font-weight:600;

}

#cat_list li {
	font-weight:600;
    color:#00BFFF;
    font-size:18px;
    letter-spacing:2px;
    line-height:30px;
    text-transform:uppercase;
    font-family: 'Big Shoulders Display', cursive;
    text-align:center;
    display:inline;
}

#cat_list li:after {content: "  -";}

#cat_list li:last-of-type:after {content: "";}


#cat_list  li a {
    color:#00BFFF;
	font-weight:600;
	    font-family: 'Big Shoulders Display', cursive;
}

#post_title {
    color:#000;
    font-size:24px;
    line-height:36px;
    overflow:hidden;
    text-align:center;
	font-weight:800;
}

#page-title {
    color:#000;
    font-size:34px;
    line-height:38px;
    overflow:hidden;
    text-align:center;
    border-bottom:1px dashed #000;
    padding-bottom:10px;
	font-weight:800;
	margin-bottom:12px;
}

#read_more_link {
    display:block;
    font-family: 'Big Shoulders Display', cursive;
    color:#000;
    text-align:center;
    margin:20px 0px 0px;
    font-size:18px;
	line-height:20px;
    letter-spacing:2px;
    text-transform:uppercase;
    font-weight:600;

}














@media screen and (min-width: 1140px) {
	/* Article card author, date meta */
	.article_meta {
		width:120px;
		color:#fff;
		display:block;
		position:absolute;
		top:0;left:-140px;
		text-align:center;
		margin-top:5%;
		font-size:18px;
		line-height:24px;
		letter-spacing:1px;
		transition: color 0.4s linear;
		font-family: 'Big Shoulders Display', cursive;
	}

	.article_meta img {
		height:75px;
		max-width:75px;
		object-fit:cover;
		border-radius: 50px;
		-moz-border-radius: 50px;
		-webkit-border-radius: 50px;
	}
}


@media screen and (max-width: 1140px) {
	.article_meta {
		display:none;
	}
}

/* Load more articles button */
.page-button {
    width:160px;
    color:#fff;
    line-height:62px;
    height:60px;
    text-transform:uppercase;
    font-family: 'Big Shoulders Display', cursive;
    margin:10px 10px 0px 10px;
    background:#000;
    text-align:center;
    font-size:26px;
    cursor:pointer;
    display:inline-block;
    overflow:hidden;
}


































/* Article Author */
#article-author {
	background:#fff;
	position:relative;
	margin:85px auto 0px;
	padding:65px 25px 25px;
}

#article-author img {
	height:125px;
	max-width:125px;
	object-fit:cover;
	border-radius: 100px;
	-moz-border-radius: 100px;
	-webkit-border-radius: 100px;
	position:absolute;
	top:-65px;left:0px;right:0px;
	margin:0px auto;
}

#article-author-name {
	font-size:1.8rem;
	line-height:3.4rem;
	font-family: 'Big Shoulders Display', cursive;
	border-bottom:1px dashed #000;
	letter-spacing:2px;
	font-weight:800;
}

#article-author-bio {
	padding:10px;
	text-align:justify;
	text-align-last:center;
	font-size:15px;
	line-height:20px;
}






































/* Article Share Icons  */
#post-social {
	margin-top:20px;
    text-align:center;
}

#post-social label {
    font-size:1.2rem;
    display:block;
    color:#000;
    font-family: 'Big Shoulders Display', cursive;
    letter-spacing:2px;
    line-height:2.2rem;
    border-bottom: 1px dashed #000;
    width:320px;
    margin:0px auto;
	font-weight:800;
}

.share-icon {
    padding:10px;
    color:#fff;
    font-size:25px;
    text-align:center;
    background-color:#000;
    border-radius: 50px;
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
	transition:background-color 0.4s linear;
    margin:10px 2px 0px;
}

.share-icon:hover {
    background-color:#00BFFF;
    transition:background-color 0.4s linear;
}

#date {
    display:block;
    font-size:18px;
    margin-top:12px;
    padding-bottom:10px;
    padding-top:12px;
    line-height:28px;
    text-align:center;
    letter-spacing:2px;
    border-top:1px dashed #000;
    border-bottom:1px dashed #000;
    font-family: 'Big Shoulders Display', cursive;
	margin-bottom:20px;
	font-weight:600;
}

#error {
    padding:25px;
    background:#fff;
    text-align:center;
}

#error h1 {
    font-size:30px;
    line-height:60px;
    text-align:center;
}

#error span {
    display:block;
    text-align:center;
    font-weight:bold;
}

#content p {font-size:16px;line-height:26px;text-align:left;}
#content a:link {color:#00BFFF;}
#content a:visited {color:#00BFFF;}
#content a:hover {text-decoration:underline;}
#content h1, #content h2, #content h3, #content h4, #content h5, #content h6 {
    text-align:left;
    margin:30px auto 5px;
}

#content small {font-size:75%;}
#content sup {font-size:75%;vertical-align:super !important;}



@media screen and (max-width: 600px) {
	#content .alignleft {margin:20px auto 20px auto;display:block;}
	#content .alignright {margin:20px auto 20px auto;display:block;}
	#content .aligncenter {margin:20px auto 20px auto;display:block;}
}

@media screen and (min-width: 600px) {
	#content .alignleft {float:left;margin:0px 20px 20px 0px;}
	#content .alignright {float:right;margin:0px 0px 20px 20px;}
	#content .aligncenter {margin:20px auto 20px auto;display:block;}
}

#content img {display:inline-block;max-width:100%;object-fit:cover;}

@media screen and (max-width: 600px) {
	.alignright, .alignleft, .aligncenter {min-width:100%;height:auto;text-align:center;}
}

.alignright, .alignleft, .aligncenter {text-align:center;}

.wp-caption {
	display:inline;
}



#content h1 {font-family: 'Big Shoulders Display', cursive;line-height:40px;font-size:40px;letter-spacing:2px;}
#content h2 {font-family: 'Big Shoulders Display', cursive;line-height:36px;font-size:36px;letter-spacing:2px;}
#content h3 {font-family: 'Big Shoulders Display', cursive;line-height:32px;font-size:32px;letter-spacing:2px;}
#content h4 {font-family: 'Big Shoulders Display', cursive;line-height:28px;font-size:28px;letter-spacing:2px;}
#content h5 {font-family: 'Big Shoulders Display', cursive;line-height:24px;font-size:24px;letter-spacing:2px;}
#content h6 {font-family: 'Big Shoulders Display', cursive;line-height:20px;font-size:20px;letter-spacing:2px;}
#content strong {font-weight:bold;}
#content em {font-style: italic;}

#content ol {
    list-style-type:decimal;
    margin:20px 0px 20px 40px;
  }

#content ul {
    list-style-type:circle;
    margin:20px 0px 20px 40px;
  }

  #content blockquote{
    width:75%;
    margin:25px auto;
    font-style:italic;
    color: #555555;
    padding:10px 20px 20px 75px;
    border-left:10px solid #364655 ;
    position: relative;
    background:#EDEDED;
  }
  
  #content blockquote::before{
    font-family:Arial;
    content: "\201C";
    color:#364655;
    font-size:4em;
    position: absolute;
    left: 10px;
    top:5px;
    line-height:100px;
    font-size: 100px;
  }
  
  #content blockquote::after{
    content: '';
  }
  
  #content blockquote span{
    display:block;
    font-weight: bold;
    margin-top:1em;
  }


#myCookieConsent {
    z-index: 999;
    min-height: 20px;
    padding: 10px 20px;
    background: rgba(0,0,0,0.6);
    overflow: hidden;
    position: fixed;
    color: #FFF;
    top: 0px;
    display: none;
    left: 0;
	right:0;
    text-align: left;
    font-size: 16px;
	font-family: 'Big Shoulders Display', cursive;
	letter-spacing:1px;
}
#myCookieConsent div {
    padding: 5px 0 0;
}
#myCookieConsent a {
    color: #fff;
    display: inline-block;
}
#myCookieConsent a:hover {
	color: #00BFFF;
}
#myCookieConsent #cookieButton {
    display: inline-block;
    color: #fff;
    font-size: 1.1em;
	background-color: #000;
	transition:background-color 0.4s linear;
    text-decoration: none;
    cursor: pointer;
    padding: 2px 20px;
    float: right;
    border-radius: 20px;
}
#myCookieConsent #cookieButton:hover {
    background-color: #00BFFF;
	transition:background-color 0.4s linear;
	color: #fff;
}

#books_wrapper {
	max-width:800px;
	margin:0px auto; 
}





.book {
	display:block;
	padding:20px 25px 20px 190px;
	margin-top:50px;
	margin-bottom:20px;
	background:#fff;
	position:relative;
	text-align:left;
}

.book-page {
	min-height:400px;	
}

.book_title {
	display:block;
	color:#000;
	font-size:28px;
	line-height:60px;
	font-family: 'Big Shoulders Display', cursive;
	letter-spacing:1px;
	margin-bottom:5px;
	font-weight:600;
	height:60px;
	overflow:hidden;
}

.book_author {
	font-size:16px;
	font-weight:600;
	color:#000;
	line-height:28px;
	text-transform:uppercase;
	font-family: 'Big Shoulders Display', cursive;
	letter-spacing:1px;
	display:block;
	border-bottom:1px solid #000;
	margin-bottom:5px;
}

.book_author span {
	float:right;
}

.book img {
	display:block;
	width:140px;
	height:224px;
	object-fit:cover;
	margin-bottom:10px;
	position:absolute;
	top:-30px;
	left:25px;
}




.book .excerpt {
	color:#000;
	line-height:20px;
	font-size:14px;
}

.buynow {
	position:absolute;
	top:200px;
	left:25px;
	width:140px;
	line-height:30px;
	text-align:center;
}

.buynow label {
	display:block;
	font-family: 'Big Shoulders Display', cursive;
	letter-spacing:1px;
	border-bottom:1px dashed #000;
	border-top:1px dashed #000;
	line-height:40px;
	font-size:18px;
	margin-bottom:5px;
	font-weight:600;
}

.buynow a {
	display:block;
	height:30px;
	line-height:40px;
	color:#ff0000;
}

.buynow a:hover {
	text-decoration:underline;
	color:#000;
} 
.book .content {
	font-size:17px;
	line-height:26px;
}

.isbn {
	font-size:18px;
	line-height:40px;
	font-family: 'Big Shoulders Display', cursive;
	letter-spacing:1px;
}


@media screen and (max-width: 600px) {
	.book_title {
		height:auto;
	}
	
	.book {
		display:block;
		padding:135px 25px 20px 25px;
		margin-top:130px;
		margin-bottom:20px;
		background:#fff;
		position:relative;
		text-align:left;
		min-height:170px;
		text-align:center;
	}

	.book img {
		display:block;
		width:140px;
		height:224px;
		object-fit:cover;
		margin-bottom:10px;
		position:absolute;
		top:-100px;
		left:0px;
		right:0px;
		margin:0px auto;
	}
	
	.book_author span {
	float:none;
	display:block;
	}
	
	.buynow {
	position:initial;
	width:100%;
	line-height:30px;
	text-align:center;
	}
}