/*
Theme Name: Sun Raising
Theme URI: http://sunraising.ch
Description: Custom Theme for Sun Raising
Author: Roger Burkhard
Author URI: http://www.rogerburkhard.com
*/

/*------------------------------------------------------
THE BIG FAT RESET
------------------------------------------------------*/

html,
body,
div,
span,
h1,
h2,
h3,
h4,
h5,
h6,
ul,
ol,
dl,
li,
dt,
dd,
p,
blockquote,
pre,
form,
fieldset,
table,
th,
td,
header,
footer {
  margin: 0;
  padding: 0;
}

/*------------------------------------------------------
IMPORT FONTS
------------------------------------------------------*/

@font-face {
  font-family: "Averta Std Semibold";
  src: url("styles/fonts/AvertaStd-Semibold.eot");
  src: url("styles/fonts/AvertaStd-Semibold.eot?#iefix")
      format("embedded-opentype"),
    url("styles/fonts/AvertaStd-Semibold.svg#raleway") format("svg"),
    url("styles/fonts/AvertaStd-Semibold.woff") format("woff"),
    url("styles/fonts/AvertaStd-Semibold.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Averta Std Semibold Italic";
  src: url("styles/fonts/AvertaStd-SemiboldItalic.eot");
  src: url("styles/fonts/AvertaStd-SemiboldItalic.eot?#iefix")
      format("embedded-opentype"),
    url("styles/fonts/AvertaStd-SemiboldItalic.svg#raleway") format("svg"),
    url("styles/fonts/AvertaStd-SemiboldItalic.woff") format("woff"),
    url("styles/fonts/AvertaStd-SemiboldItalic.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Averta Std Extrabold";
  src: url("styles/fonts/AvertaStd-ExtraBold.eot");
  src: url("styles/fonts/AvertaStd-ExtraBold.eot?#iefix")
      format("embedded-opentype"),
    url("styles/fonts/AvertaStd-ExtraBold.svg#raleway") format("svg"),
    url("styles/fonts/AvertaStd-ExtraBold.woff") format("woff"),
    url("styles/fonts/AvertaStd-ExtraBold.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Averta Std Regular";
  src: url("styles/fonts/AvertaStd-Regular.eot");
  src: url("styles/fonts/AvertaStd-Regular.eot?#iefix")
      format("embedded-opentype"),
    url("styles/fonts/AvertaStd-Regular.svg#raleway") format("svg"),
    url("styles/fonts/AvertaStd-Regular.woff") format("woff"),
    url("styles/fonts/AvertaStd-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Averta Std Regular Italic";
  src: url("styles/fonts/AvertaStd-RegularItalic.eot");
  src: url("styles/fonts/AvertaStd-RegularItalic.eot?#iefix")
      format("embedded-opentype"),
    url("styles/fonts/AvertaStd-RegularItalic.svg#raleway") format("svg"),
    url("styles/fonts/AvertaStd-RegularItalic.woff") format("woff"),
    url("styles/fonts/AvertaStd-RegularItalic.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

/*------------------------------------------------------
GENERAL
------------------------------------------------------*/

html {
  width: 100%;
  height: 100%;
  background: #f9bf4b;
  margin: 0 !important;
  -webkit-text-size-adjust: 100%;
}

body {
  width: 100%;
  height: 100%;
  font: normal 20px/32px "Averta Std Semibold", Helvetica, Arial, Verdana,
    sans-serif;
  color: #fff;
  overflow-x: hidden;
  min-width: 320px;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  font-smoothing: antialiased;
  -webkit-backface-visibility: hidden;
}

body.noscroll {
  overflow: hidden;
}

#wpadminbar {
  display: none !important;
}

/*------------------------------------------------------
TYPOGRAPHY
------------------------------------------------------*/

h1 {
  font: normal 99px/119px "Averta Std Extrabold", Helvetica, Arial, Verdana,
    sans-serif;
  letter-spacing: 0.5em;
  text-transform: uppercase;
}

h2 {
  font: normal 44px/53px "Averta Std Extrabold", Helvetica, Arial, Verdana,
    sans-serif;
  letter-spacing: 0.5em;
  text-transform: uppercase;
}

h3 {
  font: normal 30px/40px "Averta Std Semibold", Helvetica, Arial, Verdana,
    sans-serif;
  letter-spacing: 0em;
}

h4 {
  font: normal 24px/32px "Averta Std Extrabold", Helvetica, Arial, Verdana,
    sans-serif;
  letter-spacing: 0.4em;
  text-transform: uppercase;
}

p {
  margin-bottom: 48px;
}

b,
strong {
  font-family: "Averta Std Extrabold";
  font-weight: normal;
}

/*------------------------------------------------------
GENERAL LINKS
------------------------------------------------------*/

a {
  outline: none;
  text-decoration: none;
  cursor: pointer;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}

a:hover {
  opacity: 0.8;
}

/* Firefox Hack to elmininate that ugly dotted line */
:focus {
  -moz-outline-style: none;
}

a.rolling_button {
  overflow: hidden;
}

a.rolling_button span {
  position: relative;
  display: inline-block;
  -webkit-transition: -webkit-transform 0.3s;
  -moz-transition: -moz-transform 0.3s;
  transition: transform 0.3s;
}

a.rolling_button span::before {
  position: absolute;
  top: 100%;
  content: attr(data-hover);
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

a.rolling_button:hover span,
a.rolling_button a:focus span {
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  transform: translateY(-100%);
}

/*------------------------------------------------------
IMAGES
------------------------------------------------------*/

img {
  border: none 0;
}

/*------------------------------------------------------
VIDEO
------------------------------------------------------*/

video {
  outline: 0;
  -moz-outline-style: none;
}

/* Responsive iFrame */

.video_wrap {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  padding-top: 25px;
  height: 0;
}

.video_wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/*------------------------------------------------------
CLEAR
------------------------------------------------------*/

.clear {
  clear: both;
}

/*------------------------------------------------------
Focus Input & Textarea
------------------------------------------------------*/

input,
textarea {
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  resize: none;
  -webkit-appearance: none;
}

textarea:focus,
input:focus {
  outline: 0;
}

input[type="button"],
button {
  outline: none !important;
}
input[type="button"]::-moz-focus-inner,
button::-moz-focus-inner {
  border: 0 !important;
}

/*------------------------------------------------------
WRAPPER
------------------------------------------------------*/

#wrapper {
  display: block;
  position: relative;
  width: 100%;
  overflow: hidden;
  -webkit-overflow-scrolling: touch;
}

/*------------------------------------------------------
HEADER VIDEO / IMAGE
------------------------------------------------------*/

header .header_outside_wrap {
  height: 770px;
  overflow: hidden;
  position: relative;
  opacity: 0;
  min-height: 600px;
  margin-bottom: 60px;
  -webkit-transition: opacity 1.5s ease-out, height 0.3s ease-out;
  transition: opacity 1.5s ease-out, height 0.3s ease-out;
}

header .header_outside_wrap .video_box {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 25px;
  height: 0;
  margin-top: 0;
  z-index: 0;
  opacity: 1;
  pointer-events: none;
  -webkit-transition: opacity 1s ease-out;
  transition: opacity 1s ease-out;
}

header .header_outside_wrap iframe {
  opacity: 0;
  position: absolute;
  top: -16px;
  left: -25px;
  width: -moz-calc(100% + 50px);
  width: -webkit-calc(100% + 50px);
  width: -o-calc(100% + 50px);
  width: calc(100% + 50px);
  height: -moz-calc(100% + 20px);
  height: -webkit-calc(100% + 20px);
  height: -o-calc(100% + 20px);
  height: calc(100% + 20px);
  -webkit-transition: opacity 0.5s ease-out;
  transition: opacity 0.5s ease-out;
}

header .header_logo {
  display: block;
  width: 482px;
  height: 305px;
  background: url("images/logo_big.svg") no-repeat center center;
  background-size: 482px 305px;
  position: absolute;
  top: 120px;
  left: 50%;
  margin-left: -230px;
  opacity: 0;
  -webkit-transform: translateY(100px);
  transform: translateY(100px);
  -webkit-transition: opacity 0.5s ease-out, transform 1s ease-out;
  transition: opacity 0.5s ease-out, transform 1s ease-out;
}

header a.buy_solar {
  position: absolute;
  width: 350px;
  height: 60px;
  left: 50%;
  top: 450px;
  margin-left: -195px;
  display: inline-block;
  background: #e06642;
  text-align: center;
  height: 60px;
  line-height: 60px;
  font-size: 18px;
  padding: 0 17px;
  text-transform: uppercase;
  opacity: 0;
  -webkit-transform: translateY(100px);
  transform: translateY(100px);
  -webkit-transition: opacity 0.5s ease-out 0.4s, transform 1s ease-out 0.4s;
  transition: opacity 0.5s ease-out 0.4s, transform 1s ease-out 0.4s;
}

header a.buy_solar.show {
  opacity: 1;
  -webkit-transform: translateY(0);
  transform: translateY(0);
}

header .header_logo.show {
  opacity: 1;
  -webkit-transform: translateY(0);
  transform: translateY(0);
}

header .img_box {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  opacity: 1 !important;
}

/*------------------------------------------------------
NAVIGATION
------------------------------------------------------*/

nav {
  display: block;
  position: relative;
  width: 100%;
  height: 60px;
  background: #6ba3b8;
  margin-top: -60px;
  z-index: 100;
  text-align: center;
}

nav .hamburger {
  display: none;
}

nav .nav_logo {
  display: block;
  width: 92px;
  height: 92px;
  background: url("images/nav_logo.svg") no-repeat center center;
  background-size: 92px 92px;
  position: absolute;
  left: 58px;
  top: 15px;
  opacity: 1 !important;
  -webkit-transition: left 0.3s ease;
  transition: left 0.3s ease;
}

nav .nav_inside {
  display: inline-block;
  max-width: 1300px;
  margin: 0 auto;
  position: relative;
  text-align: center;
  height: 60px;
}

nav .nav_inside a {
  font-size: 18px;
}

/* Active Menus */

/* Challenge */

body.page-id-118 a.nav_challenge,
body.parent-pageid-118 a.nav_challenge,
body.page-id-120 a.subnav_anleitung,
body.page-id-122 a.subnav_daecher,
body.page-id-124 a.subnav_faqs {
  font-family: "Averta Std Extrabold";
}

/* Über uns */

body.page-id-128 a.nav_ueberuns,
body.parent-pageid-126 a.nav_ueberuns,
body.page-id-17 a.subnav_fakten,
body.page-id-128 a.subnav_partner,
body.page-id-315 a.subnav_ueber_uns {
  font-family: "Averta Std Extrabold";
}

/* Partner */

body.page-id-128 a.nav_neuigkeiten,
body.single-post a.nav_neuigkeiten {
  font-family: "Averta Std Extrabold";
}

/* Ajax */

.subnav a.inactive {
  font-family: "Averta Std Semibold" !important;
}

.subnav a.active {
  font-family: "Averta Std Extrabold" !important;
}

nav .nav_inside .nav_links {
  display: inline-block;
  width: auto;
}

nav .nav_inside .nav_links a,
.subnav a {
  font-size: 18px;
  line-height: 60px;
  color: #fff;
  margin: 0 50px;
  -webkit-transition: margin 0.3s ease;
  transition: margin 0.3s ease;
}

nav .nav_inside .nav_links a:first-child,
.subnav a:first-child {
  margin-left: 0;
}

nav .nav_inside .nav_links a:last-child,
.subnav a:last-child {
  margin-right: 0;
}

nav .nav_social {
  display: block;
  position: absolute;
  right: 60px;
  width: 72px;
  top: 0;
  -webkit-transition: margin 0.3s ease;
  transition: margin 0.3s ease;
}

nav .nav_social_mobile {
  display: none;
  float: left;
  width: 72px;
  margin-left: 70px;
  -webkit-transition: margin 0.3s ease;
  transition: margin 0.3s ease;
}

nav .nav_social a,
nav .nav_social_mobile a {
  text-indent: -10000px;
  display: inline-block;
  float: left;
}

nav .nav_social a.nav_fb,
nav .nav_social_mobile a.nav_fb {
  width: 13px;
  height: 60px;
  background: url("images/nav_fb.svg") no-repeat center center;
  background-size: 13px 24px;
  margin-right: 33px;
}

nav .nav_social a.nav_twitter,
nav .nav_social_mobile a.nav_twitter {
  width: 25px;
  height: 60px;
  background: url("images/nav_twitter.svg") no-repeat center center;
  background-size: 25px 20px;
}

nav a.show_form {
  display: block;
  width: 243px;
  height: 60px;
  background: #e06642;
  text-align: center;
  color: #fff;
  font-size: 18px;
  line-height: 60px;
  margin-left: 28px;
  position: absolute;
  right: 0;
  top: 0;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  opacity: 1 !important;
  -webkit-transition: width 0.3s ease;
  transition: width 0.3s ease;
}

a.show_form {
  color: #fff;
}

/*------------------------------------------------------
SUBNAVIGATION
------------------------------------------------------*/

.subnav {
  display: block;
  width: 100%;
  height: 63px;
  position: fixed;
  top: 60px;
  z-index: 500;
  text-align: center;
}

.subnav.subnav_challenge {
  background: #e06642;
}

.subnav.subnav_ueberuns {
  background: #528ba4;
}

/*------------------------------------------------------
FLYOUT
------------------------------------------------------*/

.flyout {
  display: block;
  width: 500px;
  position: absolute;
  right: 0;
  z-index: 100;
  background: #6aa2b7;
  padding: 64px;
  margin-right: -628px;
  -webkit-transition: margin 0.5s ease-out;
  transition: margin 0.5s ease-out;
}

.flyout.show {
  margin-right: 0;
}

.flyout a.close_flyout {
  display: block;
  width: 20px;
  height: 19px;
  background: url("images/icon_close.svg") no-repeat center center;
  background-size: 20px 19px;
  position: absolute;
  top: 9px;
  right: 0;
  padding: 20px;
}

.flyout h4 {
  margin-bottom: 12px;
}

.flyout .flyout_text {
  display: block;
  margin-bottom: 50px;
}

.flyout .order_m2 {
  font-size: 24px;
  letter-spacing: 0.02em;
}

.flyout .order_m2 input {
  font-size: 24px;
  letter-spacing: 0.02em;
  background: #6aa2b7;
  border: none 0;
  color: #fff;
  width: 30px;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  margin: 0;
}

input[type="number"] {
  -moz-appearance: textfield;
}

.number_box {
  display: inline-block;
  padding: 11px;
  border: 1px solid #fff;
}

.number_box.error {
  color: #c24011;
  border-bottom: 1px solid #c24011;
}

a.minus_m2 {
  margin-left: 10px;
}

a.plus_m2 {
  margin-right: 10px;
}

.price_info {
  font-family: "Averta Std Regular Italic";
  font-size: 24px;
  letter-spacing: 0.02em;
  margin-right: 53px;
  text-align: right;
  margin-top: -10px;
}

.address_fields,
.address_fields_different_billing {
  display: block;
  margin-top: 44px;
  text-align: left;
}

.address_fields_different_billing {
  margin-top: 24px;
}

.subtitle_buy_solar {
  display: block;
  text-align: left;
  font-family: "Averta Std Semibold";
  text-transform: uppercase;
}

.select_box {
  display: block;
  width: 152px;
  position: relative;
  margin-bottom: 26px;
}

.select_box .selected_value {
  display: block;
  width: 90px;
  height: 32px;
  line-height: 32px;
  padding-left: 10px;
  background: url("images/arrow_down.svg") no-repeat center right 10px;
  background-size: 14px 7px;
  border: 1px solid #fff;
  font-family: "Averta Std Regular Italic";
  font-size: 16px;
  padding-right: 50px;
  cursor: pointer;
  text-align: left;
}

.select_box.error .selected_value {
  color: #c24011;
  border: 1px solid #c24011;
}

.select_box .selected_value.show {
  background: url("images/arrow_up.svg") no-repeat center right 10px;
  background-size: 14px 7px;
}

.select_box .select_values {
  position: absolute;
  width: 100%;
  top: 34px;
  display: none;
  font-family: "Averta Std Regular Italic";
  text-align: left;
}

.select_box .selected_value.selected {
  font-family: "Averta Std Semibold";
  font-size: 16px;
  font-style: normal;
  text-align: left;
}

.select_box .select_values a {
  display: block;
  color: #6aa2b7 !important;
  padding-left: 10px;
  background: #fff;
  font-family: "Averta Std Semibold";
  font-size: 16px;
  font-style: normal;
  text-align: left !important;
}

.select_box .select_values a:first-child {
  border-bottom: 1px solid #6aa2b7;
}

.address_fields input,
.address_fields_different_billing input {
  background: none;
  border: none 0;
  border-bottom: 1px solid #fff;
  font-family: "Averta Std Semibold";
  font-size: 16px;
  color: #fff;
  margin-bottom: 31px;
}

.address_fields input.error,
.address_fields_different_billing input.error {
  color: #c24011;
  border-bottom: 1px solid #c24011;
}

.address_fields input.field_lastname,
.address_fields input.field_firstname,
.address_fields_different_billing input.field_lastname_different_billing,
.address_fields_different_billing input.field_firstname_different_billing {
  width: 219px;
}

.address_fields input.field_lastname,
.address_fields_different_billing input.field_lastname_different_billing {
  margin-right: 13px;
}

.address_fields input.field_plz,
.address_fields_different_billing input.field_plz_different_billing {
  width: 150px;
  margin-right: 13px;
}

.address_fields input.field_location,
.address_fields_different_billing input.field_location_different_billing {
  width: 290px;
}

.address_fields input.field_email,
.address_fields input.field_address,
.address_fields input.ewb_vertragskonto_nr,
input.ewb_objekt_nr,
.address_fields input.field_company,
.address_fields input.field_phone,
.address_fields_different_billing input.field_company_different_billing,
.address_fields_different_billing input.field_address_different_billing,
.address_fields_different_billing input.field_email_different_billing {
  width: 460px;
}

.roof_box .roof_box_inside a.info_field_ewb {
  display: block;
  font-size: 11px;
  font-family: "Averta Std Regular Italic";
  color: #fff;
  margin-top: -25px;
}

img.img_info_field_ewb {
  width: 100%;
  height: auto;
  display: none;
  margin-bottom: 15px;
}

.address_fields input::-webkit-input-placeholder,
.address_fields_different_billing input::-webkit-input-placeholder {
  color: #fff;
  font-family: "Averta Std Regular Italic";
  opacity: 1 !important;
}

.address_fields input:-moz-placeholder,
.address_fields_different_billing input:-moz-placeholder {
  /* Firefox 18- */
  color: #fff;
  font-family: "Averta Std Regular Italic";
  opacity: 1 !important;
}

.address_fields input::-moz-placeholder,
.address_fields_different_billing input::-moz-placeholder {
  /* Firefox 19+ */
  color: #fff;
  font-family: "Averta Std Regular Italic";
  opacity: 1 !important;
}

.address_fields input:-ms-input-placeholder,
.address_fields_different_billing input:-ms-input-placeholder {
  color: #fff;
  font-family: "Averta Std Regular Italic";
  opacity: 1 !important;
}

/* Error */

.address_fields input.error::-webkit-input-placeholder,
.address_fields_different_billing input.error::-webkit-input-placeholder {
  color: #c24011;
  font-family: "Averta Std Regular Italic";
  opacity: 1 !important;
}

.address_fields input.error:-moz-placeholder,
.address_fields_different_billing input.error:-moz-placeholder {
  /* Firefox 18- */
  color: #c24011;
  font-family: "Averta Std Regular Italic";
  opacity: 1 !important;
}

.address_fields input.error::-moz-placeholder,
.address_fields_different_billing input.error::-moz-placeholder {
  /* Firefox 19+ */
  color: #c24011;
  font-family: "Averta Std Regular Italic";
  opacity: 1 !important;
}

.address_fields input.error:-ms-input-placeholder,
.address_fields_different_billing input.error:-ms-input-placeholder {
  color: #c24011;
  font-family: "Averta Std Regular Italic";
  opacity: 1 !important;
}

.chebox_box {
  display: block;
}

.chebox_box,
.chebox_box a {
  font-family: "Averta Std Regular";
  color: #fff;
  line-height: 24px;
  margin-top: 31px;
}

.chebox_box .checkbox {
  display: block;
  width: 24px;
  height: 24px;
  border: 1px solid #fff;
  text-align: center;
  line-height: 24px;
  font-size: 13px;
  font-family: "Averta Std Semibold Italic";
  float: left;
  cursor: pointer;
}

.chebox_box.error .checkbox {
  border: 1px solid #c24011;
}

.chebox_box .checkbox span {
  opacity: 0;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}

.chebox_box .checkbox.active span {
  opacity: 1;
}

.chebox_box .checkbox_label {
  display: inline-block;
  font-size: 16px;
  margin-left: 11px;
}

.chebox_box .checkbox_label a {
  color: #fff !important;
  text-decoration: underline;
}

.chebox_box.error .checkbox_label,
.chebox_box.error .checkbox_label a {
  color: #c24011 !important;
}

/* Different Billing */

.show_different_billing_address_box {
  display: none;
  padding-top: 20px;
}

.subtitle_buy_solar {
  margin-bottom: ;
}

a.submit_form {
  display: inline-block;
  float: left;
  width: 164px;
  height: 60px;
  text-align: center;
  line-height: 60px;
  font-size: 18px;
  letter-spacing: 0.04em;
  color: #4e87a0;
  background: #f9bf4b;
  text-transform: uppercase;
  margin-top: 45px;
  opacity: 1 !important;
}

.share_box {
  display: inline-block;
  margin-top: 38px;
  margin-left: 90px;
}

.share_box span.title {
  display: block;
  font-family: "Averta Std Regular";
  font-size: 18px;
  letter-spacing: 0.08em;
}

.share_box a.social_fb,
.share_box a.social_twitter {
  display: inline-block;
  width: 34px;
  height: 34px;
  margin-top: 0;
}

.share_box a.social_fb {
  background: url("images/share_fb_white.svg") no-repeat center center;
  background-size: 34px 34px;
  margin-right: 22px;
}

.share_box a.social_twitter {
  background: url("images/share_twitter_white.svg") no-repeat center center;
  background-size: 34px 34px;
}

.order_success {
  display: none;
  padding: 20px;
  background: #85b56b;
  color: #fff;
}

/*------------------------------------------------------
CONTENT BOX
------------------------------------------------------*/

.main_content {
  display: block;
  width: 100%;
  text-align: center;
}

.content_box .inside {
  display: block;
  max-width: 984px;
  margin: 0 auto;
  position: relative;
}

.page_detail {
  padding-top: 186px;
}

body.page-id-19 .page_detail {
  padding-top: 123px;
}

/*------------------------------------------------------
MAP
------------------------------------------------------*/

.google_map {
  display: block;
  height: 800px;
  width: 100%;
  margin-top: 120px;
  min-height: 700px;
  position: relative;
}

.google_map #gmap {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

/*------------------------------------------------------
INFO WINDOW
------------------------------------------------------*/

.gm-style-iw + div {
  display: none;
}

.google_map
  #gmap
  > div
  > div
  > div
  > div
  > div:not(:first-child)
  > div
  > div:nth-child(12) {
  border-radius: 0 0 0 0;
}

.gm-style .gm-style-iw {
  border-radius: 0 !important;
}

.roof_info {
  display: block;
  position: relative;
  width: auto;
  max-width: 400px;
  background: #fff;
  color: #575756;
  text-align: left;
  font-family: "Averta Std Semibold" !important;
  font-weight: normal !important;
  font-size: 16px;
  line-height: 22px;
  padding-top: 15px;
  padding-bottom: 10px;
}

.roof_info .close_info_window {
  display: block;
  position: absolute;
  right: 0;
  top: 5px;
  width: 10px;
  height: 10px;
  background: url("images/close_grey.svg") no-repeat center center;
  background-size: 10px 10px;
  z-index: 1000;
}

/* Title */

.roof_info .roof_info_title {
  display: block;
  padding-left: 70px;
  background: url("images/icon_infowindow_house.svg") no-repeat left top 6px;
  background-size: 48px 38px;
  font-family: "Averta Std Extrabold" !important;
  font-weight: normal !important;
  text-transform: uppercase;
  letter-spacing: 0.3em;
  margin-bottom: 17px;
  word-break: break-word;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  hyphens: auto;
}

.roof_info .roof_info_title .roof_title {
  font-size: 22px;
  line-height: 28px;
  padding-right: 10px;
}

.roof_info .roof_info_title .roof_subtitle {
  font-size: 16px;
  line-height: 20px;
}

/* Funding Bar */

.roof_info_funding_bar {
  display: block;
  position: relative;
  width: 100%;
  height: 18px;
  background: #fac04c;
  width: -moz-calc(100% - 10px);
  width: -webkit-calc(100% - 10px);
  width: -o-calc(100% - 10px);
  width: calc(100% - 10px);
}

.roof_info_funding_bar .roof_info_funding_bar_inside {
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  top: 0;
  background: #77be92;
}

/* Funding String */

.roof_info_funding_string {
  display: block;
  font-size: 14px;
  line-height: 14px;
  color: #77be92;
  margin-top: 6px;
  margin-bottom: 12px;
}

.roof_info_short_text {
  display: block;
  margin-bottom: 6px;
}

.more_infos {
  display: block;
}

a.buy_roof {
  display: block;
  color: #fff;
  width: -moz-calc(100% - 10px);
  width: -webkit-calc(100% - 10px);
  width: -o-calc(100% - 10px);
  width: calc(100% - 10px);
  background: #4e87a0;
  margin-top: 10px;
  text-align: center;
  opacity: 1 !important;
  height: 45px;
  line-height: 45px;
}

a.buy_roof--disabled {
  background: #f3f3f3;
  color: #575756;
  cursor: default;
}

/*------------------------------------------------------
ROOF BOX
------------------------------------------------------*/

.roof_box {
  display: none;
  position: absolute;
  top: 120px;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: -moz-calc(100% - 120px);
  height: -webkit-calc(100% - 120px);
  height: -o-calc(100% - 120px);
  height: calc(100% - 120px);
  z-index: 100;
  text-align: center;
  overflow-x: auto;
}

.roof_box:before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -0.25em;
}

.roof_box .roof_box_inside {
  display: inline-block;
  position: relative;
  vertical-align: middle;
  width: -moz-calc(80% - 120px);
  width: -webkit-calc(80% - 120px);
  width: -o-calc(80% - 120px);
  width: calc(80% - 120px);
  max-width: 864px;
  padding: 60px 60px 82px 60px;
  background: rgba(249, 191, 75, 0.94);
}

.roof_box .roof_box_inside a.close_roof_box {
  display: block;
  width: 20px;
  height: 19px;
  background: url("images/close_white.svg") no-repeat center center;
  background-size: 20px 19px;
  position: absolute;
  right: 20px;
  top: 26px;
}

.roof_box .roof_box_inside h2 {
  font-size: 36px;
  line-height: 43px;
  letter-spacing: 0.4em;
  font-family: "Averta Std Extrabold";
}

.roof_box .roof_box_inside h3 {
  font-size: 24px;
  line-height: 28px;
  letter-spacing: 0.4em;
  font-family: "Averta Std Extrabold";
  margin-bottom: 55px;
  text-transform: uppercase;
}

.faq_text {
  margin-top: 45px;
  text-align: left;
}

.roof_box .roof_box_inside .faq_text h3 {
  font-size: 24px;
  letter-spacing: 0.1em;
  margin-bottom: 20px;
  margin-top: 10px;
}

.roof_box .roof_box_inside p {
  margin-bottom: 30px;
}

.roof_box .roof_box_inside a {
  color: #e06642;
}

body.page-id-120 .roof_box.roof_intro {
  display: block;
}

body.page-id-122 .roof_box.roof_overview {
  display: block;
}

body.page-id-122 .roof_box.roof_overview {
  display: block;
}

body.page-id-124 .roof_box.roof_faqs {
  display: block;
}

/*------------------------------------------------------
ANLEITUNG
------------------------------------------------------*/

.roof_intro a.start_map {
  display: block;
  width: 240px;
  height: 70px;
  line-height: 70px;
  background: #e06642;
  color: #fff;
  position: absolute;
  bottom: -35px;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
  opacity: 1;
  text-align: center;
}

/*------------------------------------------------------
ROOF FAQ's
------------------------------------------------------*/

.roof_box.roof_faqs .roof_box_inside {
  margin-top: 40px;
}

/*------------------------------------------------------
ROOF OVERVIEW
------------------------------------------------------*/

.roof_box.roof_overview h2 {
  margin-bottom: 50px;
}

.roof_box.roof_overview h5 {
  margin-left: 14px;
  margin-top: 20px;
  text-align: left;
  text-transform: uppercase;
}

a.roof_element {
  display: block;
  position: relative;
  width: -moz-calc(33.3333% - 28px);
  width: -webkit-calc(33.3333% - 28px);
  width: -o-calc(33.3333% - 28px);
  width: calc(33.3333% - 28px);
  margin: 0 14px;
  float: left;
  margin-bottom: 20px;
  opacity: 1;
}

a.roof_element img {
  width: 100%;
  height: auto;
}

a.roof_element .address_block {
  display: block;
  color: #fff;
  font-size: 16px;
  padding: 9px 0 9px 58px;
  background: #f27e63;
  text-align: left;
  position: relative;
}

a.roof_element .icon_funding {
  display: block;
  z-index: 100;
  width: 54px;
  height: 74px;
  position: absolute;
  left: 7px;
  bottom: 15px;
}

a.roof_element .address_block span.address_text {
  display: block;
  width: -moz-calc(100% - 35px);
  width: -webkit-calc(100% - 35px);
  width: -o-calc(100% - 35px);
  width: calc(100% - 35px);
}

a.roof_element .address_block span.icon_goto {
  display: block;
  position: absolute;
  width: 35px;
  top: 0;
  bottom: 0;
  height: 100%;
  background: #e06642 url("images/icon2_roof_overview.svg") no-repeat center
    center;
  background-size: 10px 11px;
  right: 0;
}

/*------------------------------------------------------
Roof Buy
------------------------------------------------------*/

.roof_buy_steps {
  display: none;
}

.roof_buy_steps .roof_box_inside {
  min-height: 500px;
  background: #6aa2b7;
}

.step_count {
  display: inline-block;
  position: absolute;
  left: 0;
  top: 20px;
  left: 16px;
  font-size: 12px;
  letter-spacing: 0.5em;
}

.roof_buy_steps h4 {
  font-size: 18px;
  line-height: 26px;
  letter-spacing: 0.4em;
  margin-bottom: 13px;
}

.roof_buy_steps h3 {
  margin-bottom: 90px;
}

.roof_buy_steps a.buy_button_step {
  display: block;
  height: 60px;
  line-height: 60px;
  background: #f9bf4b;
  color: #4e87a0;
  text-align: center;
  opacity: 1;
  margin-top: 20px;
}

/*------------------------------------------------------
STEP 1
------------------------------------------------------*/

.two_column_buy1 {
  display: block;
  max-width: 800px;
  margin: 0 auto;
}

.two_column_buy1 .column_left,
.two_column_buy1 .column_right {
  display: block;
  width: -moz-calc(50% - 11px);
  width: -webkit-calc(50% - 11px);
  width: -o-calc(50% - 11px);
  width: calc(50% - 11px);
  float: left;
}

.two_column_buy1 .column_left {
  margin-right: 11px;
}

.two_column_buy1 .column_right {
  margin-left: 11px;
}

.two_column_buy1 .column_left img {
  width: 100%;
  height: auto;
}

.two_column_buy1 .column_right .detail_text_roof {
  display: block;
  text-align: left;
}

/* m2 Listing */

.m2_listing {
  display: block;
}

.m2_listing a.m2_element {
  display: block;
  width: 50px;
  height: 50px;
  border: 1px solid #fff;
  color: #fff;
  text-align: center;
  line-height: 50px;
  font-size: 18px;
  letter-spacing: 0;
  margin: 0 9px 9px 9px;
  float: left;
  opacity: 1;
  -webkit-transition: background 0.3s ease, color 0.3s ease;
  transition: background 0.3s ease, color 0.3s ease;
}

.m2_listing a.m2_element:hover {
  color: #8a9aa0;
  background: rgba(255, 255, 255, 0.7);
}

.m2_listing a.m2_element.selected {
  pointer-events: none;
}

.m2_listing a.m2_element.active,
.m2_listing a.m2_element.selected,
.m2_listing a.m2_element.selected.active,
.m2_listing a.m2_element.selected:hover {
  color: #4e87a0;
  background: rgba(255, 255, 255, 1);
}

.m2_listing a.m2_element sup {
  font-size: 11px;
  margin-left: 1px;
}

.m2_more_less_box {
  display: block;
  text-align: center;
}

.m2_more_less_box .inside_m2_more_less_box {
  display: inline-block;
  width: 204px;
}

.m2_more_less_box a.less_m2,
.m2_more_less_box a.more_m2 {
  display: block;
  width: 45px;
  height: 96px;
  line-height: 96px;
  float: left;
  font-size: 42px;
  text-align: center;
  float: left;
  cursor: pointer;
  color: #fff;
}

.selected_m2 {
  display: block;
  float: left;
  width: 112px;
  height: 96px;
  border: 1px solid #fff;
  text-align: center;
  font-size: 26px;
  line-height: 82px;
}

/* Remove Focus */

.m2_more_less_box div:focus,
.m2_more_less_box a:focus {
  outline: none;
  ie-dummy: expression(this.hideFocus=true);
}

.m2_more_less_box div::selection,
.m2_more_less_box a::selection {
  background: #6aa2b7;
  color: #fff;
}

.m2_more_less_box div::-moz-selection,
.m2_more_less_box a::-moz-selection {
  background: #6aa2b7;
  color: #fff;
}

.m2_more_less_box a::selection {
  background: #6aa2b7;
  color: #fff;
}

.m2_more_less_box a::-moz-selection {
  background: #6aa2b7;
  color: #fff;
}

/* Price Calculation */

.calculate_price {
  display: block;
  text-align: left;
  margin-top: 25px;
  margin-left: 11px;
  letter-spacing: 0.02em;
}

.calculate_price .title_total {
  display: block;
  text-transform: uppercase;
}

.calculate_price .calc {
  display: block;
}

.calculate_price .calc sup {
  font-size: 11px;
  margin-left: 1px;
}

a.buy_step2 {
  margin-left: 11px;
}

/*------------------------------------------------------
STEP 2
------------------------------------------------------*/

.order_form {
  display: block;
  max-width: 488px;
  margin: 0 auto;
}

.roof_box_buy_step2 .calculate_price,
.roof_box_buy_step3 .calculate_price {
  margin-left: 0;
}

.fatal_error {
  display: block;
  background: #c24011 none repeat scroll 0 0;
  color: #ffffff;
  margin-bottom: 40px;
  padding: 20px;
  font-size: 16px;
  line-height: 24px;
}

.fatal_error a {
  color: #fff !important;
  text-decoration: underline;
}

input#submit2 {
  background: #f9bf4b;
  color: #4e87a0;
  display: block;
  font-family: "Averta Std Semibold";
  font-weight: normal;
  height: 60px;
  line-height: 60px;
  margin-top: 20px;
  opacity: 1;
  text-align: center;
  border: none 0;
  padding: 0 50px;
  font-size: 16px;
  margin: 0 auto;
  margin-top: 60px;
  cursor: pointer;
  max-width: 100%;
}

/*------------------------------------------------------
NEUIGKEITEN
------------------------------------------------------*/

.page_neuigkeiten.page_detail {
  background: #fff;
  color: #575756;
}

.page_neuigkeiten.page_detail h2 {
  color: #e06642;
  margin-bottom: 69px;
}

.page_neuigkeiten.page_detail .post_listing {
  display: block;
  position: relative;
  padding-bottom: 107px;
  text-align: left;
}

.page_neuigkeiten.page_detail .post_listing .column_left {
  display: block;
  width: 86px;
  position: absolute;
  top: 86px;
  bottom: 0;
  left: 0;
  height: 100%;
  background: url("images/blog_line.svg") repeat-y center center;
}

.page_neuigkeiten.page_detail .post_listing .column_left .sun_icon {
  display: block;
  width: 86px;
  height: 86px;
  background: url("images/blog_sun.svg") no-repeat center center;
  background-size: 86px 86px;
  position: absolute;
  top: -86px;
  left: 0;
  right: 0;
}

.page_neuigkeiten.page_detail .post_listing .column_right {
  display: block;
  width: -moz-calc(100% - 164px);
  width: -webkit-calc(100% - 164px);
  width: -o-calc(100% - 164px);
  width: calc(100% - 164px);
  float: right;
}

.page_neuigkeiten.page_detail .post_listing .column_right img {
  width: 65%;
  height: auto;
}

.page_neuigkeiten.page_detail
  .post_listing
  .column_right
  h3.post_listing_title
  a {
  color: #4e87a0;
  margin-bottom: 27px;
  text-decoration: none;
}

.page_neuigkeiten.page_detail .post_listing .column_right p {
  margin-bottom: 17px;
}

.page_neuigkeiten.page_detail .post_listing .column_right a {
  color: #e06642;
  text-decoration: underline;
}

.page_neuigkeiten.page_detail .post_listing .column_right strong {
  font-weight: normal;
  font-family: "Averta Std Extrabold";
}

.page_neuigkeiten.page_detail .post_listing .column_right ul {
  margin-left: 20px;
}

.page_neuigkeiten.page_detail .post_listing .column_right h1,
.page_neuigkeiten.page_detail .post_listing .column_right h2,
.page_neuigkeiten.page_detail .post_listing .column_right h3,
.page_neuigkeiten.page_detail .post_listing .column_right h4,
.page_neuigkeiten.page_detail .post_listing .column_right h5,
.page_neuigkeiten.page_detail .post_listing .column_right h6 {
  color: #575756;
  margin-bottom: 20px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-family: "Averta Std Extrabold";
  font-weight: normal;
}

.page_neuigkeiten.page_detail .post_listing .column_right h1 {
  font-size: 30px;
  line-height: 40px;
}

.page_neuigkeiten.page_detail .post_listing .column_right h2 {
  font-size: 28px;
  line-height: 38px;
}

.page_neuigkeiten.page_detail .post_listing .column_right h3 {
  font-size: 26px;
  line-height: 36px;
}

.page_neuigkeiten.page_detail .post_listing .column_right h4 {
  font-size: 24px;
  line-height: 34px;
}

.page_neuigkeiten.page_detail .post_listing .column_right h5 {
  font-size: 22px;
  line-height: 32px;
}

.page_neuigkeiten.page_detail .post_listing .column_right h6 {
  font-size: 20px;
  line-height: 30px;
}

.page_neuigkeiten.page_detail .post_listing .column_right .detailtext {
  display: none;
}

.page_neuigkeiten.page_detail .post_listing .column_right a.show_more,
.page_neuigkeiten.page_detail .post_listing .column_right a.show_less {
  display: inline-block;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  text-decoration: none;
  padding-right: 19px;
}

.page_neuigkeiten.page_detail .post_listing .column_right a.show_more {
  background: url("images/blog_arrow_down.svg") no-repeat right center;
  background-size: 10px 6px;
}

.page_neuigkeiten.page_detail .post_listing .column_right a.show_less {
  display: none;
  background: url("images/blog_arrow_up.svg") no-repeat right center;
  background-size: 10px 6px;
}

/*------------------------------------------------------
CHALLENGE
------------------------------------------------------*/

.content_box.challenge {
  padding-top: 150px;
  padding-bottom: 63px;
  background: #f9bf4b;
}

.content_box.challenge h1 {
  color: #fbcd6f;
  position: absolute;
  top: -70px;
  z-index: 0;
  left: 0;
  right: 0;
  text-align: center;
}

.content_box.challenge .text {
  font-size: 30px;
  line-height: 40px;
  max-width: 820px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.content_box.challenge .text a {
  color: #e06642;
}

.content_box.challenge .text p {
  margin-bottom: 40px;
}

.content_box.challenge a.show_form {
  display: inline-block;
  background: #e06642;
  text-align: center;
  height: 60px;
  line-height: 60px;
  font-size: 18px;
  padding: 0 17px;
  text-transform: uppercase;
  margin-top: 27px;
  opacity: 1 !important;
}

/*------------------------------------------------------
SO FUNKTIONIERTS
------------------------------------------------------*/

.content_box.so-funktionierts {
  background: #f27e63;
  padding-top: 63px;
  padding-bottom: 123px;
}

.content_box.so-funktionierts .illu {
  display: inline-block;
  width: 100%;
  max-width: 718px;
  margin-top: 64px;
}

.content_box.so-funktionierts .illu.mobile {
  display: none;
}

.content_box.so-funktionierts .illu img {
  opacity: 0;
  width: 100%;
  height: auto;
}

/*------------------------------------------------------
ZAHLEN & FAKTEN
------------------------------------------------------*/

.content_box.zahlen-und-fakten {
  background: #fff;
  color: #4e87a0;
  padding-bottom: 90px;
}

.content_box.zahlen-und-fakten a {
  color: #4e87a0;
}

.content_box.zahlen-und-fakten h2 {
  color: #e06642;
}

/* Multicolumn */

.content_box.zahlen-und-fakten .multi_column {
  display: block;
  margin-top: 90px;
  margin-bottom: 68px;
}

.content_box.zahlen-und-fakten .multi_column .column {
  width: 33.3333%;
  float: left;
  text-align: center;
}

.content_box.zahlen-und-fakten .multi_column .column span {
  display: block;
}

.content_box.zahlen-und-fakten .multi_column .column span.text_bottom {
  color: #e06642;
  text-transform: uppercase;
  font-size: 16px;
  line-height: 18px;
}

/* Text */

.content_box.zahlen-und-fakten .text {
  display: block;
}

.content_box.zahlen-und-fakten .text a {
  color: #e06642;
}

.content_box.zahlen-und-fakten .text h3 {
  margin-bottom: 70px;
}

/* Two Columns */

.two_columns {
  display: block;
  max-width: 567px;
  margin: 0 auto;
  margin-top: 10px;
}

.two_columns .column {
  display: block;
  width: 50%;
  float: left;
  text-align: left;
}

.two_columns .column.column_right {
  width: -moz-calc(50% - 124px);
  width: -webkit-calc(50% - 124px);
  width: -o-calc(50% - 124px);
  width: calc(50% - 124px);
  margin-left: 124px;
}

.two_columns .column span.title {
  display: block;
  color: #e06642;
  text-transform: uppercase;
  font-size: 16px;
  letter-spacing: 0.08em;
}

.two_columns .column.column_left a {
  margin-top: 7px;
  display: inline-block;
  font-size: 16px;
  height: 40px;
  line-height: 40px;
  color: #fff;
  background: #e06642;
  padding: 0 13px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.two_columns .column.column_right a {
  display: inline-block;
  margin-top: 9px;
  width: 34px;
  height: 34px;
}

.two_columns .column.column_right a.social_fb {
  background: url("images/share_fb_orange.svg") no-repeat center center;
  background-size: 34px 34px;
  margin-right: 22px;
}

.two_columns .column.column_right a.social_twitter {
  background: url("images/share_twitter_orange.svg") no-repeat center center;
  background-size: 34px 34px;
}

/*------------------------------------------------------
STORY & TEAM
------------------------------------------------------*/

h2.page_default_title {
  margin-bottom: 69px;
}

.page_default {
  text-align: left;
  min-height: 300px;
}

.page_default ul,
.page_default ol {
  margin-left: 20px;
}

.page_default p {
  margin-bottom: 17px;
}

.page_default a {
  color: #e06642;
  text-decoration: underline;
}

.page_default img,
.page_default .wp-caption {
  max-width: 100% !important;
  width: 100%;
  height: auto;
}

.page_default strong {
  font-weight: normal;
  font-family: "Averta Std Extrabold";
}

.page_default h1,
.page_default h2,
.page_default h3,
.page_default h4,
.page_default h5,
.page_default h6 {
  color: #4e87a0;
  margin-bottom: 20px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-family: "Averta Std Extrabold";
  font-weight: normal;
}

.page_default h1 {
  font-size: 30px;
  line-height: 40px;
}

.page_default h2 {
  font-size: 28px;
  line-height: 38px;
}

.page_default h3 {
  font-size: 26px;
  line-height: 36px;
}

.page_default h4 {
  font-size: 24px;
  line-height: 34px;
}

.page_default h5 {
  font-size: 22px;
  line-height: 32px;
}

.page_default h6 {
  font-size: 20px;
  line-height: 30px;
}

/*------------------------------------------------------
PARTNER
------------------------------------------------------*/

.content_box.partner {
  background: #fff;
  color: #6aa2b7;
}

body.home .content_box.partner {
  padding-top: 89px;
  padding-bottom: 17px;
}

.content_box.partner .partner_box,
.content_box.partner .unterstuetzer_box {
  display: block;
  margin-top: 68px;
}

.content_box.partner .unterstuetzer_box {
  margin-top: 49px;
}

.content_box.partner .partner_box a,
.content_box.partner .unterstuetzer_box a {
  display: inline-block;
  margin: 0 65px;
  margin-bottom: 65px;
}

.content_box.partner .partner_box a img,
.content_box.partner .unterstuetzer_box a img {
  opacity: 0;
}

.content_box.partner h2.title_unterstuetzer {
  font-size: 36px;
  letter-spacing: 0.4em;
  margin-top: 35px;
  margin-bottom: 30px;
}

/*------------------------------------------------------
NL
------------------------------------------------------*/

.content_box.nl {
  display: block;
  padding: 50px 0 43px 0;
  background: #fac04c;
}

.content_box.nl h4 {
  max-width: 460px;
  margin: 0 auto;
  margin-bottom: 30px;
}

form.yikes-easy-mc-form {
  width: auto;
}

form.yikes-easy-mc-form {
  display: inline-block;
}

form.yikes-easy-mc-form input {
  width: 290px !important;
  height: 40px !important;
  background: #fff;
  border: none 0;
  line-height: 40px;
  padding: 0 10px !important;
  font: normal 20px/40px "Averta Std Semibold", Helvetica, Arial, Verdana,
    sans-serif;
}

form.yikes-easy-mc-form .field-no-label,
form.yikes-easy-mc-form label {
  width: auto !important;
  margin-bottom: 0 !important;
}

form.yikes-easy-mc-form .yikes-easy-mc-submit-button {
  margin: 0 !important;
  padding: 0 !important;
  margin-left: 3px !important;
}

form.yikes-easy-mc-form label.EMAIL-label {
  float: left;
}

form.yikes-easy-mc-form button.yikes-easy-mc-submit-button {
  display: inline-block;
  margin-left: 3px;
  float: left;
  width: 136px;
  height: 40px;
  background: #e06642;
  border: none 0;
  color: #fff;
  cursor: pointer;
  text-align: center;
  line-height: 40px;
  font: normal 13px/40px "Averta Std Extrabold", Helvetica, Arial, Verdana,
    sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.24em;
}

.edit-link {
  display: none;
}

/*------------------------------------------------------
SPENDEN
------------------------------------------------------*/

.content_box.donations {
  background: #fff;
  color: #4e87a0;
  padding-bottom: 90px;
}

.content_box.donations a {
  color: #fff;
}

.content_box.donations h2 {
  color: #e06642;
}

.donate_button {
  background: #e06642;
  color: inherit;
  display: block;
  font-size: 12px;
  line-height: 40px;
  margin-top: 30px;
  text-transform: uppercase;
}

.donate_form {
  background: rgba(249, 191, 75, 0.94);
  margin-top: 60px;
  padding: 60px 0;
}

.donate_form .select_box .selected_value,
.donate_form .subtitle_buy_solar {
  color: #fff;
}

.donate_form .select_box .selected_value.error {
  color: #c24011;
}

.address_fields input.field_amount {
  margin-bottom: 60px;
  width: 460px;
}

@media all and (max-width: 628px) and (min-width: 0) {
  .address_fields input.field_amount {
    width: 100%;
    margin-right: 0;
  }
}

.donation_receivers h5 {
  color: #c24011;
  text-transform: uppercase;
}

.donation_receivers a {
  color: #6aa2b7 !important;
  display: block;
  margin-bottom: 30px;
}

.donation_receiver {
  margin-top: 30px;
  text-align: left;
}

.donation_receiver label {
  display: block;
}

.donation_receiver input[type="radio"] {
  -webkit-appearance: radio;
}

.donate_form .select_box .select_values a {
  border-bottom: 1px solid #6aa2b7;
}

.donate_form .select_box .select_values a:last-child {
  border-bottom: none;
}

.donate_form .select_box {
  width: 221px;
}

.donate_form .select_box .selected_value {
  width: 159px;
}

.donation_successfull,
.donation_error {
  color: #fff;
  display: none;
  margin-top: 30px;
}

/*------------------------------------------------------
FOOTER
------------------------------------------------------*/

.content_box.footer {
  padding: 30px 0;
  background: #6ba3b8;
}

.content_box.footer .inside {
  text-align: center;
}

.content_box.footer .inside .footer_inside_inside {
  display: inline-block;
}

.content_box.footer .footer_logo {
  display: block;
  width: 238px;
  height: 151px;
  background: url("images/footer_logo.svg") no-repeat center center;
  background-size: 238px 151px;
  float: left;
}

.content_box.footer .address {
  display: block;
  width: 245px;
  float: left;
  margin-left: 40px;
  text-align: left;
  font-size: 16px;
  line-height: 24px;
}

.content_box.footer .address a {
  color: #fff;
}

.content_box.footer .address .copyright {
  margin-top: 14px;
  font-family: "Averta Std Regular";
}

.content_box.footer .address .imprint_agbs {
  display: block;
  margin-top: 15px;
}

.content_box.footer .address .imprint_agbs a {
  display: inline-block;
  margin: 0 5px;
  text-decoration: underline;
}

/*------------------------------------------------------
Media Queries
------------------------------------------------------*/

header a.buy_solar.show @media all and (max-width: 1320px) and (min-width: 0) {
  nav .nav_logo {
    left: 20px;
  }
  nav a.show_form {
    width: 170px;
  }
  nav .nav_social {
    right: 20px;
  }
}

@media all and (max-width: 1180px) and (min-width: 0) {
  a.roof_element {
    width: -moz-calc(50% - 28px);
    width: -webkit-calc(50% - 28px);
    width: -o-calc(50% - 28px);
    width: calc(50% - 28px);
  }
}

@media all and (max-width: 1055px) and (min-width: 0) {
  .content_box .inside {
    max-width: 660px;
  }
  header .header_logo {
    width: 300px;
    height: 190px;
    background: url("images/logo_big.svg") no-repeat center center;
    background-size: 300px 190px;
    top: 120px;
    margin-left: -150px;
  }

  header a.buy_solar {
    top: 330px;
    font-size: 12px;
    line-height: 40px;
    width: 250px;
    height: 40px;
    line-height: 40px;
    margin-left: -140px;
  }

  nav a.show_form {
    font-size: 12px;
    width: 120px;
  }
  nav .nav_inside .nav_links a,
  .subnav a {
    font-size: 14px;
    margin-right: 20px;
    margin-left: 20px;
  }
  nav .nav_inside .nav_links a:first-child,
  .subnav a:first-child {
    margin-left: 0;
  }
  nav .nav_inside .nav_links a:last-child,
  .subnav a:last-child {
    margin-right: 0;
  }
  nav .nav_inside .nav_social a.nav_fb {
    width: 10px;
    height: 60px;
    background: url("images/nav_fb.svg") no-repeat center center;
    background-size: 10px 18px;
  }
  nav .nav_social a.nav_fb {
    margin-right: 13px;
  }
  nav .nav_inside .nav_social a.nav_twitter {
    width: 20px;
    height: 60px;
    background: url("images/nav_twitter.svg") no-repeat center center;
    background-size: 20px 16px;
  }
  nav .nav_logo {
    top: 5px;
    width: 51px;
    height: 51px;
    background: url("images/nav_logo.svg") no-repeat center center;
    background-size: 51px 51px;
  }
  .content_box .inside {
    max-width: 860px;
  }
  .content_box.challenge h1 {
    font-size: 60px;
    top: -70px;
    letter-spacing: 0.3em;
  }
  .content_box.challenge .text {
    font-size: 20px;
    line-height: 30px;
  }
  .content_box.challenge .text p {
    margin-bottom: 20px;
  }
  .content_box.challenge a.show_form {
    font-size: 12px;
    line-height: 40px;
    height: 40px;
  }
  h2,
  .roof_box .roof_box_inside h2 {
    font-size: 24px;
    line-height: 28px;
    word-break: break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
  }
  .content_box.so-funktionierts h2 {
    word-break: break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
  }
  .roof_box .roof_box_inside h2,
  .roof_box .roof_box_inside h3 {
    margin-bottom: 20px;
    letter-spacing: 0.1em;
  }
  .roof_intro.roof_box .roof_box_inside h2 {
    margin-bottom: 0;
  }
  h3,
  .roof_box .roof_box_inside h3 {
    font-size: 20px;
    line-height: 30px;
  }
  .roof_buy_steps h4 {
    margin-bottom: 5px;
  }
  body {
    font-size: 16px;
    line-height: 24px;
  }
  p {
    margin-bottom: 20px;
  }
  .content_box.zahlen-und-fakten .text h3 {
    margin-bottom: 30px;
  }
  .content_box.zahlen-und-fakten .multi_column {
    max-width: 80%;
    margin: 40px auto 38px auto;
  }
  .two_columns {
    margin-top: 40px;
  }
  .content_box.footer .footer_logo {
    width: 180px;
    height: 114px;
    background: url("images/footer_logo.svg") no-repeat center center;
    background-size: 180px 114px;
    margin-top: 20px;
  }
  .content_box.nl input {
    font-size: 16px;
  }
}

@media all and (max-width: 930px) and (min-width: 0) {
  .content_box .inside {
    max-width: 650px;
  }
  header .header_outside_wrap iframe,
  header .header_outside_wrap .video_box {
    display: none;
  }
  .roof_box.roof_overview h5 {
    margin-left: 0;
  }
  a.roof_element {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
  .roof_box .roof_box_inside {
    width: -moz-calc(90% - 120px);
    width: -webkit-calc(90% - 120px);
    width: -o-calc(90% - 120px);
    width: calc(90% - 120px);
  }
}

@media all and (max-width: 720px) and (min-width: 0) {
  header .header_outside_wrap {
    min-height: 470px;
  }
  header .header_logo {
    width: 257px;
    height: 163px;
    background: url("images/logo_big.svg") no-repeat center center;
    background-size: 257px 163px;
    top: 120px;
    margin-left: -128.5px;
  }
  nav .hamburger {
    display: block;
    position: absolute;
    right: 10px;
    top: 12px;
    padding: 10px;
    width: 23px;
    height: 18px;
    background: url("images/hamburger.svg") no-repeat center center;
    background-size: 23px 18px;
  }
  nav .hamburger.active {
    background: url("images/icon_close.svg") no-repeat center center;
    background-size: 17px 16px;
  }
  nav .nav_logo {
    left: 10px;
    z-index: 100;
  }
  nav a.show_form {
    width: 76px;
    height: 43px;
    line-height: 14px;
    padding-top: 17px;
  }
  nav .nav_inside {
    display: none;
    width: 100%;
    height: auto;
    background: #4e87a0;
    top: 60px;
    z-index: 1;
  }
  nav .nav_inside .nav_links {
    width: 100%;
    float: none;
    padding-top: 27px;
  }
  nav .nav_inside .nav_links a {
    display: block;
    margin-right: 0;
    margin-left: 0;
    font-size: 24px;
  }
  nav .nav_inside .nav_social {
    float: none;
    width: 100%;
    margin-left: 0;
    padding-bottom: 10px;
  }
  nav .nav_inside .nav_social a {
    float: none;
  }
  nav .nav_inside .nav_social a.nav_fb {
    margin-right: 126px;
  }
  nav .nav_social {
    display: none;
  }
  nav .nav_social_mobile {
    display: block;
  }
  nav .nav_inside .nav_social_mobile {
    float: none;
    width: 100%;
    margin-left: 0;
    padding-bottom: 10px;
  }
  nav .nav_inside .nav_social_mobile a {
    float: none;
  }
  nav .nav_inside .nav_social_mobile a.nav_fb {
    margin-right: 126px;
  }

  .content_box.so-funktionierts .illu.desktop {
    display: none;
  }
  .content_box.so-funktionierts .illu.mobile {
    display: block;
  }
  .content_box.challenge {
    padding-top: 39px;
    padding-bottom: 20px;
  }
  .content_box.challenge h1 {
    font-size: 24px;
    letter-spacing: 0.3em;
    top: 0;
    position: relative;
    line-height: 28px;
    color: #fff;
    letter-spacing: 0.5em;
  }
  .content_box.challenge .text {
    margin-top: 23px;
  }
  .content_box .inside {
    width: -moz-calc(100% - 26px);
    width: -webkit-calc(100% - 26px);
    width: -o-calc(100% - 26px);
    width: calc(100% - 26px);
    margin: 0 13px;
  }
  .content_box.challenge a.show_form {
    font-size: 16px;
    height: 60px;
    line-height: 60px;
    width: -moz-calc(100% - 34px);
    width: -webkit-calc(100% - 34px);
    width: -o-calc(100% - 34px);
    width: calc(100% - 34px);
    letter-spacing: 0.04em;
  }
  .content_box.so-funktionierts {
    padding-bottom: 75px;
    padding-top: 43px;
  }
  .content_box.so-funktionierts .illu {
    margin-top: 38px;
  }
  .content_box.zahlen-und-fakten .multi_column {
    margin-top: 30px;
    margin-bottom: 28px;
  }
  .content_box.zahlen-und-fakten .multi_column .column {
    float: none;
    width: 100%;
    margin-bottom: 33px;
  }
  .content_box.zahlen-und-fakten .multi_column .column span.text_top {
    font-size: 20px;
    line-height: 30px;
  }
  .two_columns .column,
  .two_columns .column.column_right {
    float: none;
    width: 100%;
    text-align: center;
  }
  .two_columns .column.column_right {
    margin-left: 0;
    margin-top: 43px;
  }
  body.home .content_box.partner {
    padding-top: 40px;
  }
  .content_box.partner .partner_box a,
  .content_box.partner .unterstuetzer_box a {
    display: block;
    float: left;
    width: 45%;
    margin-right: 2.5%;
    margin-left: 2.5%;
    margin-bottom: 10px;
  }
  .content_box.partner .partner_box,
  .content_box.partner .unterstuetzer_box {
    margin-top: 10px;
  }
  .content_box.partner h2.title_unterstuetzer {
    font-size: 18px;
    line-height: 21px;
    letter-spacing: 0.4em;
  }
  h4 {
    font-size: 18px;
    line-height: 24px;
    letter-spacing: 0.4em;
  }
  .content_box.nl input {
    width: -moz-calc(100% - 20px) !important;
    width: -webkit-calc(100% - 20px) !important;
    width: -o-calc(100% - 20px) !important;
    width: calc(100% - 20px) !important;
  }
  .content_box.nl label.EMAIL-label {
    float: none;
  }
  .content_box.nl .yikes-easy-mc-form {
    width: 100% !important;
  }
  .yikes-easy-mc-form .yikes-easy-mc-submit-button {
    margin: 0 auto !important;
    float: none !important;
    display: block !important;
  }
  .content_box.footer .inside .footer_inside_inside {
    display: block;
  }
  .content_box.footer .footer_logo {
    margin: 20px auto 40px auto;
    float: none;
    width: 100%;
  }
  .content_box.footer .address {
    width: 100%;
    float: none;
    margin-left: 0;
  }
  .page_neuigkeiten.page_detail .post_listing .column_left {
    display: none;
  }
  .page_neuigkeiten.page_detail .post_listing .column_right {
    float: none;
    width: 100%;
  }

  /* Challenge */

  .google_map {
    min-height: 100%;
  }
  .roof_box:before {
    display: none;
  }
  .roof_box .roof_box_inside {
    width: -moz-calc(100% - 40px);
    width: -webkit-calc(100% - 40px);
    width: -o-calc(100% - 40px);
    width: calc(100% - 40px);
    min-height: -moz-calc(100% - 80px);
    min-height: -webkit-calc(100% - 80px);
    min-height: -o-calc(100% - 80px);
    min-height: calc(100% - 80px);
    padding: 60px 20px 20px 20px;
  }
  .roof_box.roof_buy_steps {
    top: 60px;
    z-index: 500;
    height: -moz-calc(100% - 60px);
    height: -webkit-calc(100% - 60px);
    height: -o-calc(100% - 60px);
    height: calc(100% - 60px);
  }
  .roof_box.roof_faqs .roof_box_inside {
    margin-top: 0;
  }
  .roof_intro a.start_map {
    bottom: 0;
    position: relative;
    height: 50px;
    line-height: 50px;
  }
  .roof_box .roof_box_inside a.close_roof_box {
    top: 17px;
  }
}

@media all and (max-width: 628px) and (min-width: 0) {
  .flyout {
    width: -moz-calc(100% - 40px);
    width: -webkit-calc(100% - 40px);
    width: -o-calc(100% - 40px);
    width: calc(100% - 40px);
    padding: 20px;
    margin-right: -100%;
  }
  .price_info {
    margin-top: 20px;
    text-align: left;
    margin-right: 0;
  }
  .number_box {
    padding: 5px;
  }
  .address_fields input.field_lastname,
  .address_fields input.field_firstname,
  .address_fields input.field_email,
  .address_fields input.field_address,
  .address_fields input.ewb_vertragskonto_nr,
  input.ewb_objekt_nr,
  .address_fields input.field_company,
  .address_fields input.field_phone,
  .address_fields_different_billing input.field_lastname_different_billing,
  .address_fields_different_billing input.field_firstname_different_billing,
  .address_fields_different_billing input.field_company_different_billing,
  .address_fields_different_billing input.field_address_different_billing,
  .address_fields_different_billing input.field_email_different_billing {
    width: 100%;
    margin-right: 0;
  }
  .address_fields input.field_plz,
  .address_fields_different_billing input.field_plz_different_billing {
    width: -moz-calc(30% - 13px);
    width: -webkit-calc(30% - 13px);
    width: -o-calc(30% - 13px);
    width: calc(30% - 13px);
    float: left;
  }
  .address_fields input.field_location,
  .address_fields_different_billing input.field_location_different_billing {
    width: 68.6%;
  }
  .chebox_box {
    float: none;
    display: block;
    margin-bottom: 15px;
  }
  .chebox_box.order_nl {
    margin-left: 0;
  }
  a.submit_form {
    margin-top: 15px;
    margin-bottom: 15px;
  }
  .share_box {
    clear: both;
    display: block;
    float: none;
    margin-left: 0;
    margin-top: 50px;
    width: 100%;
  }
  .share_box span.title {
    margin-bottom: 5px;
  }
  .address_fields {
    width: 100%;
    overflow: hidden;
  }
  a.minus_m2 {
    margin-left: 5px;
  }
  a.plus_m2 {
    margin-right: 5px;
  }
  .roof_info {
    max-width: 200px;
  }
  .roof_info,
  .roof_info a {
    font-size: 12px;
    line-height: 14px;
  }
  .roof_info .roof_info_title {
    background: none;
    letter-spacing: 0;
    margin-bottom: 5px;
    font-size: 14px;
    line-height: 18px;
    padding-left: 0;
  }
  .roof_info .roof_info_title .roof_title {
    font-size: 16px;
    line-height: 18px;
    margin-top: 8px;
  }
  .roof_info .roof_info_title .roof_subtitle {
    font-size: 14px;
    line-height: 18px;
  }
  .roof_info a.buy_roof {
    height: 23px;
    line-height: 23px;
  }
  .roof_info_funding_string {
    font-size: 10px;
    line-height: 12px;
    margin-bottom: 5px;
  }
  .roof_info a.more_infos {
    display: none;
  }
  .roof_info_funding_bar {
    height: 12px;
  }
  .roof_info .close_info_window {
    right: 50%;
  }
  .roof_buy_steps h4 {
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 0.1em;
  }
  .two_column_buy1 .column_left,
  .two_column_buy1 .column_right {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
  .two_column_buy1 .column_right {
    margin-top: 20px;
  }
  .roof_buy_steps a.buy_button_step {
    height: 50px;
    line-height: 50px;
  }
  input#submit2 {
    font-size: 8px;
    line-height: 40px;
    height: 40px;
    padding-left: 0;
    padding-right: 0;
    max-width: 100%;
  }

  header .header_outside_wrap {
    margin-bottom: 10px;
  }
}

@media all and (max-width: 320px) and (min-width: 0) {
  .address_fields input.field_location,
  .address_fields_different_billing input.field_location_different_billing {
    width: 58%;
    float: left;
  }
}