/*
Theme Name:         Basic Theme, Version 1.3.0
Theme URI:          
Description:        
Version:            1.0.0
Author:             Clemens & Viktor Nübel
Author URI:         http://lieberungewoehnlich.de/
*/


/*---------------- GLOBAL --------------- */

body { color: #222; font-family: 'Source Serif Pro', serif; font-size: 1.3rem; line-height: 1.6; letter-spacing: 0.01rem;
background: #efefef; }
h1, h2, h3, h4, h5, h6 { font-family: 'Playfair Display', serif; font-weight: 100; line-height: 1.2; margin: .2em 0 .4em 0; text-align: center; }
h1 { font-size: 4.8rem; letter-spacing: -0.08rem; }
h2 { font-size: 3rem; margin: 1.2em 0 .8em 0; }
h3 { font-size: 2.4rem; background: #fceb43; color: #222; padding: 10px 15px; margin: 1.6em 0 1em 0; }
h4 { font-size: 2rem; margin: 3rem 0 0.5rem 0; }
a { color: #fceb43; text-decoration: none; -webkit-transition: all 200ms ease-in 0s; -moz-transition: all 200ms ease-in 0s; -ms-transition: all 200ms ease-in 0s; -o-transition: all 200ms ease-in 0s; transition: all 200ms ease-in 0s; }
a:focus, a:hover { color: #666; }
a img:hover { opacity: 0.95; }
p { margin: 0 0 1.6em 0; }
ul, ol, dl { list-style: outside;  margin: 0 0 1.6em 0; }
hr { border-bottom: 1px solid #ccc; border-left: 0 none; border-top: 0 none; box-sizing: content-box; height: 0; margin: 2rem auto; max-width: 62.5rem; }
img.alignleft { float: left; margin: 5px 18px 18px 0; }
img.alignright { float: right; margin: 0 18px 18px 5px; }
img.algincenter { display: block; margin: 5px auto 5px auto; }
img.alignnone { margin: 5px 18px 18px 0; }
.divider { width: 100%; height: 0px; border-top: 1px solid #e3e3e3; }

.is-style-outline > .wp-block-button__link:not(.has-background):hover { background: #fceb43; border-color: #fceb43; color: #fff; }
.page article a.wp-block-button__link { padding: .667em 1.333em; }

/*---------------- HEADER --------------- */

.site-header { background-color: transparent; margin: 4rem 0 2rem 0; text-align: center; }
.site-logo a { max-width: 400px; display: block; margin: 0 auto 20px auto; }
.site-title::before { content: "\f0e7"; font: normal normal normal 6rem/1 FontAwesome; margin: 10px; display: inline-block; width: 100%; text-align: center; }
p.site-description { color: #4b153d; font-style: italic; font-size: 1.4rem; }

/*---------------- NAVIGATION--------------- */

.navOverlay { display: none; height: 100%; width: 100%; position: fixed; z-index: 1; left: 0; top: 0; background-color: rgb(0,0,0); background-color: rgba(0,0,0, 0.9); overflow-x: hidden; transition: 0.5s; }
.navOverlayContent { position: relative; top: 25%; width: 100%; text-align: center; margin-top: 30px; }
.navOverlay .closebtn { position: absolute; top: 20px; right: 45px; font-size: 60px; }
.navButton { cursor:pointer; position: absolute; top: 20px; right: 30px; font-weight: bold ; }
.header-primary-nav {  }
.header-primary-nav ul { font-size: 2.8rem; display: inline-block; list-style: none; font-weight: bold; }
.footer-utility-nav { text-align: center; }
.footer-utility-nav ul { font-size: 0.8rem; display: inline-block; list-style: none; text-align: center; }
.footer-utility-nav li { display:  inline-block; padding: 0 1rem 0 0; list-style: none; margin: 10px 0; }
.footer-utility-nav li a { font-size: 1.4rem; text-align: center; text-transform: uppercase; letter-spacing: 0.1rem; background: #fff; font-weight: bold; padding: 10px 15px; }
.footer-utility-nav li a:hover { border-bottom: 1px dotted #fff; }

/*---------------- CONTENT--------------- */

.home .entry-title { display: none; }
.container { margin: 25px auto; }
.page article { padding: 0 0 15px 0; margin: 0 0 15px 0; }
.page article p.intro { font-size: 1.6rem; line-height: 1.4; font-weight: 200; font-family: 'Saira Semi Condensed', sans-serif; text-align: center; }
.page article .thesis { display: block; color: #4b153d; text-transform: uppercase; font-weight: 500; font-size: 1.8rem; letter-spacing: 0.1rem; margin: 4rem 0 0 0; }
.page article dd { display: none; }
.page article a { background: #fceb43; color: #fff; padding: 3px 6px; }
.page article a:hover { background: #fff; color: #222; }
.page article a.toggleButton { border: none; display: inline-block; text-align: center; width: 100%; }
.page article a.toggleButton::after { content: "\f0a1"; font: normal normal normal 1.4rem/1 FontAwesome; margin: 10px; }
.page article .signedBy { font-size: 1.4rem; font-style: italic; text-align: center; width: 100%; display: inherit; }

.page-template-page-custom article a { background: transparent; color: #222; padding: 3px 6px; }
.page-template-page-custom article a:hover { background: transparent; color: #222; padding: 3px 6px; }

.post h1 { font-size: 2.8rem; text-align: left; }
.post a  { color: #222; border-bottom: 4px solid #fceb43; }
.post a:hover, .post a:focus  { color: #444; border-bottom: 4px dotted #fceb43; }

.post .entry-header .comment-count { display: none; }

/*---------------- FOOTER --------------- */

.site-footer { padding: 1.5em 0 1.8em 0; }
.site-footer-info { color: #4b153d; font-size: 0.8rem; text-align: center; }


/*---------------- Speak Out Petition --------------- */
.dk-speakout-petition-wrap { width: 80%; margin: 0 auto; }
.page article a.dk-speakout-facebook { background: #4d41d6; }
.page article a.dk-speakout-twitter { background: #21acff; }


/*---------------- RESPONSIVNESS --------------- */

@media only screen and ( max-width: 642px ) {
	body { font-size: 1rem; }
	h1 { font-size: 2.8rem; }
	h2 { font-size: 1.4rem; }
	h3 { font-size: 1.8rem; }
	.header-primary-nav ul { font-size: 2rem; }
}
