/*
Theme Name: BRILLIANT COACHING
Author: Conrad Weise
Description: Wordpress theme for BRILLIANT COACHING
Version: 1.0.0
*/

/* Wordpress Styles */

div[role="form"] {
	display: flex;
	flex-flow: column nowrap;
	align-items: center;
}

div[role="form"] * {
	width: 100%;
	max-width: 600px;
}

div[role="form"] p {
	margin: 0 0 1em 0;
}

input, textarea {
	padding: 0.75em;
	font-family: 'Roboto', sans-serif;
	font-size: inherit;
	background: rgba(0, 0, 0, 0.05);
	border: 2px solid transparent;
	transition: all 300ms;
}

input:focus, textarea:focus {
	background: var(--yellow);
	border: 2px solid var(--yellow);
	outline: 0;
}

input[type="submit"]:hover {
	background: var(--yellow);
	cursor: pointer;
}

.wpcf7 form .wpcf7-response-output {
	margin: 0;
	padding: 0.75em;
	border-radius: 4px;
}

.wpcf7-spinner {
	display: none;
}

.yellow {
  color: var(--yellow);
}

.opacity {
  opacity: 0.6;
}

.space-below {
  margin: 0 0 1.5em 0;
}

.w-sub {
  margin: 0;
}

.page-id-11 main, .page-id-16 main {
  max-width: 1000px;
}

.has-large-font-size, .has-medium-font-size {
  line-height: 1.3;
}

.is-style-outline>.wp-block-button__link, .wp-block-button__link.is-style-outline {
  border: 2px solid var(--yellow);
}

.wp-block-button__link {
  background-color: var(--yellow);
  font-weight: 900;
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
}

/* General */

:root {
  --yellow: rgb(250, 201, 73);
}

::-webkit-scrollbar {
  width: 5px;
  background: transparent;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  font-family: 'Roboto', sans-serif;
  font-size: 14px;
  font-weight: 300;
  background: #fff;
}

a,
a:visited {
  color: #000;
  text-decoration: none;
}

.yellow a {
  color: var(--yellow);
}

p {
  margin: 0 0 1.3em 0;
  line-height: 1.6;
}

h1 {
  margin: 0 0 1em 0;
  text-transform: uppercase;
  font-size: 4.5em;
  font-weight: 900;
  opacity: 0.6;
}

h2 {
  margin: 0 0 0.5em 0;
  font-weight: 900;
  font-size: 3em;
}

h3 {
  font-size: 2em;
  font-weight: 900;
  margin: 0 0 0.5em 0;
}

ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

img {
  max-width: 100%;
  max-height: 100%;
  height: auto;
  -webkit-backface-visibility: hidden;
}

/* Header */

header {
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
}

header img {
  margin: 4em 0;
  max-width: 518px;
}

header a {
  border-bottom: 0;
}

/* Navigation */

#main-navigation {
  width: 100%;
  height: 100%;
  z-index: 1;
}

#main-navigation ul {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
}

#main-navigation li a {
  display: block;
  width: 100%;
  padding: 2.5em 5em;
  font-size: 0.85em;
  font-weight: 400;
  letter-spacing: 0.6em;
  text-transform: uppercase;
  text-decoration: none;
}

#show-main-navigation-mobile-button,
#hide-main-navigation-mobile-button {
  display: none;
  position: fixed;
  top: 0;
  right: 0;
  color: #fff;
  border-bottom: none;
  display: block;
  width: 100%;
  padding: 2.5em 0;
  background: var(--yellow);
  font-size: 0.85em;
  text-align: center;
  font-weight: 400;
  letter-spacing: 0.6em;
  text-transform: uppercase;
  text-decoration: none;
  z-index: 100;
}

#show-main-navigation-mobile-button {
  display: none;
}

#main-navigation li a:hover {
  color: white;
  background: var(--yellow);
}

#main-navigation li.current-menu-item a {
  color: white;
  background: var(--yellow);
}

#main-navigation li.current-menu-parent ul.sub-menu {
  display: block;
}

#main-navigation li.menu-item-58:hover ul.sub-menu {
  display: block;
}

#main-navigation ul.sub-menu {
  display: none;
}

#main-navigation ul.sub-menu :nth-last-child(2) {
  margin: 0;
}

#main-navigation ul.sub-menu :last-child {
  margin: 0 0 1.5em 0;
}

body.single-projekt #main-navigation ul.sub-menu {
  display: block;
}

/* Mobile Navigation */

#main-navigation-mobile {
  display: none;
  position: fixed;
  z-index: 2;
  background: var(--yellow);
}

#main-navigation-mobile ul.menu {
  display: flex;
  justify-content: center;
  flex-flow: column wrap;
  align-items: center;
  width: 100vw;
  height: 100vh;
}

#main-navigation-mobile ul li {
  text-align: center;
}

#main-navigation-mobile ul li a {
  display: block;
  margin: 0.75em;
  padding: 1em;
  font-size: 0.9em;
  color: black;
  text-transform: uppercase;
  border-bottom: none;
  letter-spacing: 0.6em;
}

#main-navigation-mobile li.current-menu-item a {
  font-weight: 900;
}

/* Content */

main {
  width: 100%;
  max-width: 1400px;
  padding: 4em;
}

main a {
  text-decoration: underline;
}

article ul {
  list-style-type: disc;
  margin: 0 0 2em 0;
  padding: 0 0 0 2em;
}

article ul li {
  margin: 0 0 1em 0;
}

.attachment-post-thumbnail {
  margin: 0 0 2em 0;
}

.own-embed img {
	border-radius: 5px !important;
	box-shadow: 0.25em 0.25em 0.4em rgba(50, 25, 0, 0.15);
	transition: all 300ms ease-in-out;
}

.own-embed .has-medium-font-size {
	transition: all 300ms ease-in-out;
	opacity: 0.6;
}

.own-embed:hover img {
	box-shadow: 0.25em 0.25em 1em rgba(50, 25, 0, 0.2);
}

.own-embed:hover .has-medium-font-size {
	opacity: 1;
}

/* Footer */

footer {
	display: flex;
	flex-flow: column nowrap;
	align-items: center;
	width: 100%;
}

footer .certs {
	display: flex;
	justify-content: center;
	align-items: center;
	max-width: 800px;
    width: 100%;
	margin: 0 0 4em 0;
}

footer .cert {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	flex: 1;
}

footer .cert img {
	max-width: 160px;
	padding: 1em;
	border-radius: 10px;
	box-shadow: 0 0.3em 0.6em 0 rgba(0, 0, 0, 0.075);
	transition: all 300ms ease-in-out;
}

footer .cert img:hover {
	transform: scale(1.02);
	box-shadow: 0 0.3em 0.6em 0 rgba(0, 0, 0, 0.1);
}

footer nav {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	padding: 1em;
	background: var(--yellow);
}

footer ul {
	display: flex;
}

footer li {
	margin: 0 0.5em 0 0;
}

footer li:last-of-type {
	margin: 0;
}

/* Responsive */

@media only screen and (max-width: 768px) {
  body {
    display: block;
  }

  header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20vw 5vw 5vw 5vw;
  }

  header img {
    width: 100%;
  }

  h1, h2, h3 {
    font-size: 2em;
    padding: 0 5vw;
  }

  h2 {
    font-size: 1.5em;
  }

  p, audio {
    padding: 0 5vw; 
  }

  .wp-block-buttons {
    display: flex;
    justify-content: center;
  }

  #main-navigation {
    margin: 0;
  }

  #main-navigation ul {
    display: flex;
  }

  #main-navigation li {
    padding: 1em;
  }

  main {
    padding: 0 0vw; 
  }
	
  footer .certs {
	flex-flow: column nowrap;
  }
  
	footer .cert {
		margin: 0 0 2em 0;
		justify-content: center !important;
	}
	
		footer .cert:last-of-type {
		margin: 0;
	}
}

@media only screen and (max-width: 768px) {
  #main-navigation {
    display: none;
  }

  #show-main-navigation-mobile-button {
    display: block;
  }
}