/* 
Theme Name:		 GMTA - Twenty Seventeen Child
Theme URI:		 http://code.arnoldbodeschule.de/
Description:	 GMTA - Gestaltungs- und medientechnische Assistent
Author:			 Norman Seeliger
Author URI:		 http://code.arnoldbodeschule.de
Template:		 twentyseventeen
Version:		 1.0.0
Text Domain:	 Twenty-Seventeen-child
-------------------------------------------------------------- */ 


/* - */
/* Typo und links
------------------------------------------ */

html {
	font-size: 14px
}

body,
button,
input,
select,
textarea {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	word-break: keep-all;
}

#main td.id-project {
	background-size: contain;
	background-position: top;
}


.accordion.green_white {
	animation: color_change 5s ease-in-out infinite alternate; 
	background-color: #097372; 
	color: #fff;
}



#page .panel-content .entry-title {
	text-transform: none;
	letter-spacing: 0;
	color: #900;
	font-size: 2.5rem;
	max-width: 10ch;
	display: inline-block;
	transform: translateY(-5vw);
}

.hessen_loewe {
	display: inline-block;
	position: relative;
	  height: 20vh;
  padding-top: 0;
  overflow: hidden;
	
}

.logo_SBS {
	font-weight: bold;
}

.hessen_loewe svg {
	width: 100%;
	height: 100%;
}


.projekt h4 {
	color: #900;
	margin-top: 0;
	padding: 0;
	margin-bottom: 0;
}

.projekt p {
	margin: 0;
}


#page a {
	text-decoration: none;
}


#page a:hover {
	color: #0c2;
	cursor: pointer;
}





#page a:active {
	color: #3fc;
	cursor: pointer;
}


.red_rect {
	display: inline-block;
	width: 0.4rem;
	height: 0.8rem;
	background-color: #900;
	margin: 0 0.15rem;
}

.site-footer {
    background-color: #ddd;}


.entry-content p {
	max-width: 40ch;
	font-size: 1rem
}


.page-template-user_profil-php .entry-content {
	padding-left: 2rem;
	padding-right: 2rem;
	background-color: #ddd;
}



.entry-content .pointer-p {
	background-color: #ddd;
	padding: 0 1rem 2rem 1rem;
	position: relative;
}

.entry-content {
  margin-bottom: 3rem;
}

.entry-content .pointer-p::after {
	position: absolute;
	bottom: -2rem;
	left: 0;
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 3.5rem 3.5rem 0 3.5rem;
	border-color: #ddd transparent transparent transparent;
	animation: pulse_down 1.2s ease-in-out alternate infinite;
}

.entry-content h2 {
    display: none;
}



.login-form {
  position: relative;
	color: #003;
	transition: all 0.5s;
}

.login-form:hover {
  color: #3fc
}



.gruppe-schule-list,
.gruppe-schule-custom,
.gruppe-custom {display: none}

.visible {display: block!important}


#page .login-username label {
  margin-top: 1.25rem;
}

.left input {
	margin-top: 0.1rem
}

.login-username label,
.login-password label {
	display: inline-block;
}

.login-username svg,
.login-password svg {
transform: translateY(0.4rem);
}

.login-username {
	margin-bottom: 0;
}

#loginform .login-username,
#loginform .login-password {
	width: 60%;
}

#loginform {
	position: relative;
}

#loginform .login-submit {
	width: 40%;
	  position: absolute;
  right: 0;
  top: 9rem;
}


.login-form svg {
  display: block;
margin: 0 auto;
width: 3.5rem;
height: 3.5rem;
position: absolute;
pointer-events: none;
	left: 50%;
	transform: translateX(-50%);

}



.page-template-user_profil-php .site-header {
	display: none
}




/* - */
/* Logo, Header, Menu
------------------------------------------ */

#gmta_logo {
	position: fixed;
	z-index: 0;
 	top: 1vh;
 	left: 8vw;
	width: 24vw;
}

#gmta_logo.logo_small {
	width: 12rem;
	position: fixed;
	top: -1.33rem;
	left: 1vw;
	z-index: 9;
	animation: fade-in 0.4s ease-in-out;
}


.admin-bar #gmta_logo.logo_small {
	top: 0.5rem;
}



#gmta_logo.logo_small .swoop_tiny, 
#gmta_logo.logo_small .swoop_tiny_wide,
#gmta_logo.logo_small .shimmer {
	display: none;
}

#gmta_logo svg {
	position: absolute;
	display: block;
	width: 100%;
	height: auto;
	margin: 0 auto;
}

.logo-shapes {
	shape-rendering: geometricPrecision;
}


.jp-carousel-overlay::after {
	content: url('img/gmta_logo_black.svg');
	position: fixed;
	top: 2vh;
	left: 2vw;
	z-index: 1;
}

.custom-header .container {
	transform: translate(-6vw,2vh)
}

.twentyseventeen-front-page #page .site-header, .container {
	height: 36vh;
}

#page .site-header, .container {
	height: 36vh;
}

.site-header {
	background-color: #fff;
}


.custom-header-media {
  pointer-events: none;
}

.custom-header-media .page_image {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top left;
	background-color: #fff;
	height: 36vh;
	position: relative;

}


.custom-header-media .page_image::before {
	content: '© HKM';
	position: absolute;
	right: 0.5rem;
	top: 0.5rem;
	font-size: 10px;
	font-weight: bold;
	color: #fff;
}

.custom-header-media:before {
	background: transparent!important;
}

.hessen_loewe .machine {
/*position: absolute;
top: 0;
	left: 0*/
}

.hessen_loewe .sbs_logo_lion {
 width: 100%;
	height: auto;
}


#page .site-description,
#page .site-title {
	display: none;
}

#page .site-branding-text {
	padding-bottom: 2rem
}

.reduce {
	opacity: 0.5;
}

.id-project {
    font-size: 1.05rem;
	font-weight: bold;
	color: #000;
	line-height: 1rem;
	background-size: cover;
	width: 16vw;
	text-align: center;
 	min-height: 12rem;
 	background-position: center;
background-size: cover;
background-repeat: no-repeat;
}


#page .navigation-top {
	background-color: transparent;
	border: none;
	width: 100%;
	position: static!important;


}

.acf-field-59faa2fe02ef2>.acf-label,
.acf-field.acf-field-59f46a305681e>.acf-label,
.acf-field.acf-field-59f43fef47f53>.acf-label {
	display: none;
}

.acf-field-59f42769d78dd  {
	clear: both!important;
}

.projekte_title {
	font-weight: bold;
	color: #097372;
	font-size: 2.5rem;
	line-height: 2.8rem;
	text-align: right;
	padding-top: 0;
	margin-top: 0;
}

.user-settings .projekte_title {
	text-align: left;
	color: #097372;
}

/*.projekte_title span:first-of-type {
	color: #3ab6ab;
}*/

.panel-content>.wrap {
	padding-top: 0;
}

#page .navigation-top nav {
/*	box-shadow: 0 0.5rem 3rem 0.5rem rgba(0,0,0,0.5);
	background-color: #ddd;*/
	text-align: center;
	margin: 0 auto;
	display: inline-block;
	padding: 0 0 2rem 2rem;
}

.navigation-top svg {
	width: 3.5rem;
	height: 3.5rem;
	transform: translateY(1rem);
}

.menu_item span {
	text-align: center;
	width: 100%;
	display: block;
	padding-bottom: 0.75rem;
}

.menu_item svg {
	width: 3.5rem;
	height: 3.5rem;
	display: block;
	margin: 0 auto;

}


#page .navigation-top .menu_item:link {
	font-size: 1.15rem!important;
	display: inline-block;
	margin-right: 3rem;
}

.marker {
	
	padding: 1rem 3rem 2rem 3rem;
	margin-left: -2rem;
	border-left: 1rem solid #070;
	background-color: #ddd;
}



.user-settings {
  /*background: rgba(255,255,255,0.85);*/
  background: rgba(226,242,238,0.08);  
  position: absolute;
  top: 0;
  display: inline-block;
/*  width: 84%;
  margin-left: -42%;*/
  left: 0;
  max-width: 0;
  overflow: hidden;
  opacity: 0.9;
  transition: left 0.2s, max-width 0.5s, opacity 0.3s, box-shadow 0.5s;
  box-shadow: 0 1rem 8rem 1rem rgba(0,0,0,0);
  padding: 0;
  border-bottom: 3.5rem solid transparent;
}


.user-settings #cancel.all_setting_switch_button {
  color: #999;
  transition: color 0.5s;
  display: block;
  text-align: left;
  margin-top: 2rem;
}

.user-settings #cancel.all_setting_switch_button:hover {
	color: #097372;
}


#page {
	transition: filter 0.6s, opacity 0.67s;
}

.show #page {
	filter: blur(1.5rem);
	opacity: 0.5;
	height: 100vh;
	overflow: hidden;
}


body {
	transition: background-color 0.7s
}

.show body {
	background-color: #ccc;
}

.show .user-settings,
#user:target .user-settings {
  max-width: 100vw;
  left: 0;
  padding: 2rem 3rem 2rem 4rem;
  width: auto;
  display: inline-block;
  opacity: 1;
  margin-left: 0;
  box-shadow: 0 1rem 8rem 1rem rgba(0,0,0,0.85);
  border-bottom: 3.5rem solid #097372;
  animation: border_change 5s ease-in-out infinite alternate;
}


#acf-register-form *:invalid {
	border-left: 1rem solid #700;
	padding-left: 1rem;
}


.no_submit {
	cursor: no-drop;
	transform: scale(1);
	
}

.no_submit svg {
	opacity: 0.5
}


#new_user {
	transition: all 0.4s ease-in-out;
	color: #999;
}


#new_user span {
	text-align: left!important;
}


#new_user svg {
	margin: 0 auto 0 0;
}




#new_user.submit_ready {
	cursor: pointer;
	color: #097372;
	font-weight: bold;
	transform: scale(1.1);
}

#new_user.submit_ready  svg {
	opacity: 1
}


.user_form .no_label label {
	display: none!important;
}

/*.user_form .acf-field-59e738ecb0130,
.user_form .datenschutz-group {
	flex-basis: 296px;
}*/


.user_form .acf-fields .right {
	
	float: right;
}


#mission_control {
	padding: 0.6rem;
  background: rgba(0,0,0,0.12);
  margin-bottom: 2rem
}

.user_form .acf-field-59e738ecb0130 {
	padding: 0!important;
}

#datenschutz_info_accordion .panel {
	font-size: 11px;
}

#datenschutz_info_accordion .panel li {
	padding-left: 1rem;
	text-indent: -1.2rem
}


.user_form form>.acf-fields {
	display: flex;
	justify-content: space-around;
	
}

.user_form .acf-fields .acf-field-group.anrede {
	padding: 0 2rem 0 0;

	max-width: 25rem;
}

.user_form .acf-fields .acf-field-group.bezug {
	padding: 0 2rem 0 2rem;
	width: 24rem;
	max-width: 25rem;
}

.user_form .acf-fields .acf-field-group.schule {
	padding: 0 2rem 0 2rem;
	width: 24rem;
	max-width: 25rem;
}

.user_form .acf-fields .acf-field-group.datenschutz {
	padding: 0 0 0 2rem!important;
	width: 26rem;
	max-width: 26rem;
}


.user_form button[disabled="disabled"] {
	color: #999;
}

.user_form button[disabled="disabled"]:hover {
	background-color: #fff;
	cursor: not-allowed;
	color: #999;
	border-color: #ddd;
}

.user_form button {
	background-color: #fff;
	border: 1px solid #ddd;
	padding: 1rem;
	color: #000;
	margin-top: 2rem;
	transition: all 0.4s
}

.user_form button:hover {
	background-color: #070;
	color: #fff;
	border-color: #000;

}

.user_form .form-table {
	margin: 0;
	border: 0;
}

.user_form .form-table tr {
	background-color: transparent; 
	border: none;
}

.user_form .left {
	float: left;
	width: 48%
}

.user_form .right {
	float: right;
	width: 48%;
}

.user_form .acf-field {
	clear: none;
}


.user_form .acf-label label {
	font-size: 11px;
	color: rgba(0,0,0,0.4);
}

.user_form .acf-field li label {
	font-size: 1rem;
}


.user_form .acf-field li {
	margin-top: 0.35rem;
}

.user_form ul.acf-checkbox-list li,
.user_form ul.acf-radio-list li {
	line-height: 1.4rem
}

.acf-add-checkbox::before {
    content: '➕ ';
    color: #fff;
    border: 1px solid #ccc;
    font-weight: bold;
    font-size: .8rem;
    padding: 2px;
    background-color: #fff;
    border-radius: 50%;
    margin: 0 3px 0 -3px;
}

.acf-add-checkbox:hover {
	color: #22dddd;	
}

.acf-add-checkbox {
	font-weight: bold;	
	transition: color 0.4s;
	color: #097372
}


.user_form .acf-field-group td.acf-label,
.user_form .acf-field-group>.acf-label,
a.cf-field-recaptcha label {
	display: none;
}


.acf-field-59df03f1631c4,
.acf-field-59df03fa631c5 {
	min-height: 3rem!important
}

.acf-field-59f42769d780a,
.acf-field-59f42769d7873 {
	min-height: none!important;
}

.user_form .acf-fields.-border {
	border: none;
	background: transparent;
}

.user_form .acf-field-group .acf-fields .acf-field {
	padding: 0;
}


#datenschutz .acf-switch {
	display: block;
	width: 100%;
	max-width: 9rem
}

#datenschutz label {
	text-align: left;
}

#datenschutz .acf-switch-off {
	float: right;
}

#datenschutz .acf-switch.-on:hover,
#datenschutz .acf-switch:hover {
	background-color: #097372;
}

#datenschutz .acf-switch.-on {
	border: none;
}

.user_form .acf-switch {
	height: 3rem
}

.user_form .acf-fields .acf-field:first-of-type label {
	margin-top: 0;
}

.user_form .acf-fields>.acf-field {
	border: none;
}

.g-recaptcha>div {
	margin: 0 auto;
}

.user_form>* {
	-webkit-column-break-inside: avoid; /* Chrome, Safari */
    page-break-inside: avoid;           /* Theoretically FF 20+ */
    break-inside: avoid-column;         /* IE 11 */
   
}


.user_form .captcha label,
.user_form h2 {
	display: none!important;
}


.user_form .acf-field .marker {
	margin-top: 2rem;
	padding: 0.75rem 1.25rem 1rem 1rem;
	margin-left: 0;
}

.marker p {
	margin: 0;
}

.user_form .marker label {
	margin-top: 0
}

#anmelden .left {
  float: left;
  width: 48%;
}

 .right {
	float: right;
	width: 48%;
}


#anmelden {
  padding: 0.5rem 2rem 2.5rem 2rem}

#anmelden .border-left {
  float: left; 
  padding: 0 1vw 0 0;
  border-left: 1rem solid #070;
  margin-left: 2rem;
  margin-top: 1rem;
  max-width: 30ch;
  width: 50%;
  background-color: #fff;
}

#page input[type="submit"]:hover {
background-color: transparent;}


#anmelden::after {
  clear: both;
  content: '.';
	color: transparent;
	height: 0;
	display: block;
}

.navigation-top .nav-logo {
	display: none;
	width: 11rem;
	top: 0;
	left: -12rem;
}

.navigation-top.site-navigation-fixed .nav-logo {
	display: block;
}

/*#anmelden {
	background-color: transparent;
	box-shadow: 0 1rem 2rem 0.5rem rgba(0,0,0,0);
	transition: all 0.5s;
	overflow: hidden;
	height: 0;
}

#anmelden #loginform {
	display: none;
}

#anmelden:target {
	background-color: #ddd;
	height: auto;
	box-shadow: 0 1rem 2rem 0.5rem rgba(0,0,0,0.2);
}

#anmelden:target #loginform {
	display: block;
}*/


/*triangle hack*/
.left-pointing-triangle::after {
  content: "\25C0 \FE0E";
}
.right-pointing-triangle::after {
  content: "\25B6 \FE0E";
}


#acf-register-form {
	position: relative;
}


#acf-register-form #new_passwort_reg_user {
	display: none;
}



header h1 {
  font-size: 8rem;
  font-weight: bold;
  line-height: 1rem;
  margin: 0;
  color: #ddd;
  display: inline-block;
  padding: 6vw 0 0 0;
  text-align: center;
}

header h1 span {
  font-size: 2rem;
  display: block;
  max-width: 15ch;
  margin-top: 4rem;
  line-height: 2rem;
  color: #000;
  text-shadow: 0 0 4rem rgba(255,255,255,0.8);
}

.machine {
	top: 0;
	left: 0;
  width: 9rem;
  fill: #ddd;
  animation: machine_wooble 3s alternate infinite ease-in-out }


@keyframes machine_wooble {
0%   {transform: translate(0.7rem, 0) perspective(40vw) rotateY(7deg) rotateX(-6deg) scale(0.83);}
100% {transform: translate(1.3rem, 0.7rem) perspective(39vw) rotateY(-21deg) rotateX(10deg) scale(0.84);}
}


.small {
  fill: #097372;
}

.medium-shadow, .large-shadow {
  fill: rgba(0, 0, 0, 0.45);
 }

 .small-shadow {
  fill: rgba(0, 20, 40, 0.9);
 }

.small {
	        animation: counter-rotation 5s infinite linear;
          transform-origin: 100.136px 225.345px; }

.small-shadow {
	        animation: counter-rotation 5s infinite linear;
          transform-origin: 110.136px 235.345px; }

.medium {
	        animation: rotation 7.5s infinite linear;
          transform-origin: 254.675px 379.447px; }

.medium-shadow {
	        animation: rotation 7.5s infinite linear;
          transform-origin: 264.675px 389.447px; }

.large {
        	animation: counter-rotation 10s infinite linear;
          transform-origin: 461.37px 173.694px; }

.large-shadow {  
	        animation: counter-rotation 10s infinite linear;
          transform-origin: 471.37px 183.694px; }


@keyframes rotation {
    from {transform: rotate(0deg);}
    to   {transform: rotate(359deg);}
}

@keyframes counter-rotation {
    from {transform: rotate(359deg);}
    to   {transform: rotate(0deg);}
}





/* - */
/* Bilder
------------------------------------------ */

.tiled-gallery-item img {
	width: 100%!important;
	height: auto!important;
}



/* - */
/* Animationen
------------------------------------------ */


@keyframes pulse_down {
   0%   {transform: translateY(-0.4rem)}
   100% {transform: translateY(0rem)}
}


/* - */
/* Accordion
------------------------------------------ */

/* Style the buttons that are used to open and close the accordion panel */
.accordion {
    background-color: rgba(0,0,0,0.3);
    color: #444;
    cursor: pointer;
    font-size: 1.15rem;
    padding: 0.75rem 1rem 1rem 1rem;
    width: 100%;
    text-align: left;
    border: none;
    outline: none;
    transition: all 0.4s;
    font-weight: bold;
    line-height: 1.5;
}



.user_form .accordion {
	font-size: 1rem;
	padding: 0.25rem 1rem 0.5rem 1rem;
}


dl dd {
	background-color: #fff;
	margin: 0 0.5rem 0.5rem;
	opacity: 0.45;
	padding: 0 1rem;
	overflow: hidden;
	max-height: 0;
	transition: all 0.4s ease-in-out;
}


#datenschutz_container {
	margin: 0;
}

#datenschutz_container dl dd {
	margin: 0;
}


dt.active + dd {
	max-height: 400vh;
	padding: 1rem;
	opacity: 1;
}



.accordion svg {
	transform: translateY(0.4rem);
	margin-right: 0.5rem;
}




.panel {
	margin-bottom: 0;
	padding: 0.5rem;
	font-size: 1rem;
	border: 1px solid #ddd;
}



.accordion:hover, .accordion.active:hover {
	background-color: #555;
	color: #ddd;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.accordion.active {
    background-color: #aaa;
    color: #444;
}

/* Style the accordion panel. Note: hidden by default */
.panel {
    padding: 0 1rem;
    background-color: white;
}


.right_marker {
  float: right;
  transform: rotate(180deg) translate(0.5rem,-0.25rem);
  transition: transform 0.4s ease-in-out;
}

.active .right_marker {
  transform: rotate(0);
}


/* - */
/* Secure Table
------------------------------------------ */

table thead, caption.logged_in {
	background-color: #aaa;}

table thead, table h4, caption.logged_in {
font-weight: bold;
color: #444;
font-size: 1.15rem;}

table {
font-size: 1rem;
margin-bottom: 3rem;
border-bottom: 5rem solid #aaa}

table tbody tr:nth-of-type(even) {
background-color: rgba(0,0,0,0.07)}

table tbody tr:nth-of-type(odd) {
background-color: rgba(0,0,0,0.10)}

table td, th {
padding: 1.5rem 1rem 2rem 1rem!important;
vertical-align: top;
border: none;}

table h4 {
margin: 0;}


.logged_out span {
	font-weight: normal;
	opacity: 0.7;
}


#page table tr, #page table td, #page table th {
	border: none;
}

table td {
position: relative}


table p {
	max-width: 40ch
}


.icon_anhang {
	position: absolute;
    color: #999;
}


table caption.logged_out {
  font-weight: bold;
  color: #fff;
  font-size: 1.15rem;
  background-color: #097372;
  padding: 1rem;
animation: color_change 5s ease-in-out infinite alternate;
}

@keyframes color_change { 
    0% { background-color: #097372;}
    100% { background-color: #084250}
}

@keyframes border_change { 
    0% { border-color: #097372;}
    100% { border-color: #084250}
}

table caption.logged_in {
	display: none;
}

a {
text-shadow: none;
text-decoration: none!important;
font-weight: bold;
box-shadow: none!important;
color: #097372!important;
/*border-bottom: 1rem solid transparent;*/
transition: all 0.5s;}

a:link,
a:visited {
	color: #097372!important;
}



a:hover {
	color: #031!important;
	/*border-bottom: 1rem solid rgba(0,0,90,0.2);*/
}

#page a:active {
	color: #0cb!important
} 

.project_file {
   padding-left: 2rem}


.project_file:hover .preview_img_container::after {
	position: absolute;
	transform: translateX(0.25rem) translateY(-1rem);
	z-index: 100;
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 2rem 2rem 2rem 0;
	border-color: transparent #fff transparent transparent;
}


.pdf_preview {
  position: absolute;
  display: none;
  background-color: #fff;
  box-shadow: 0 0.5rem 3rem 0.5rem rgba(0,0,0,0.62);
  padding: 1rem 1rem 1.5rem 1rem;
  transform: translateX(2rem) translateY(-40%);
	z-index: 99;
}

.project_file:hover .pdf_preview {
display: inline-block;}

.projekt strong {
	color: #999;
}



.edit_post {
	display: none;
	position: absolute;
	right: 1rem;
	top: 0;
	opacity: 0.25;
}

.projekt:hover .edit_post {
	display: inline;
	transition: all 0.3s;
}


.edit_post:hover {
	opacity: 1;
}


.projekt:hover .edit_post:hover::before {
	content: 'edit';
	font-size: 10px;
	text-align: right
}

.schule strong {
	color: #555;
	margin-top: 1rem;
	display: block;
}

.schule strong:first-of-type {
	margin-top: 0;
}

.contact .name {
	color: #555;
}


.result-message {
	border-left: 1rem solid #090;
	padding-left: 1rem;
	font-weight: bold;
	transition: all 1s ease-in-out;
}


.result-message.alert-success {
  border-left: 1rem solid #090;
  padding: 1rem;
  font-size: 1.25rem;
  font-weight: normal;
  display: inline-block;
  background: #ddd;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  box-shadow: 0 1rem 6rem 1rem rgba(0,0,0,0.5);
}

.result-message.alert-success span {
  font-size: 2rem;
  line-height: 2.2rem;
  font-weight: bold;
}

/* - */
/* Form Register and Edit
------------------------------------------ */

.user_form .acf-field {
	margin: 0
}

/*#page form {
  max-width: 33rem;
 margin: 0 auto;}*/

.user_form label {
	margin-top: 2rem;
	font-size: 1.15rem;
	font-weight: bold;
}


.user_form label span {
  font-size: 10px;
  display: block;
  color: #555;
}

.user_form .acf-required {
	color: #900;
	display: inline;
}

.user_form .acf-true-false label {
	margin-top: 0;
}

.user_form .acf-switch  {
	background-color: rgba(0,0,0,0.3);
}

.user_form .acf-switch-off {
	text-shadow: none;
	color: #ddd;
}

.user_form .acf-switch.-on {
	background-color: #097372;
}

.user_form .acf-true-false .acf-switch-on {
	text-shadow: none;
	color: #fff;
}

.user_form .acf-field input[type="password"],
.user_form .acf-field input[type="email"],
.user_form .acf-field input[type="text"],
.user_form .acf-field input[type="number"],
.user_form .acf-field input[type="url"]
 {

  color: #666;
  background: #fff;
  background-image: none;
  background-image: none;
  border: 1px solid #ddd;
  -webkit-border-radius: 0;
  border-radius: 0;
  display: block;
  padding: 0.6em;
  width: 100%;
  font-size: 1rem;
  line-height: 1.4;
  height: auto;
  margin-bottom: 1.5rem;
}

.user_form .acf-field textarea {
	margin-bottom: 1.5rem;
}

/*.user_form .acf-field-group .acf-field-recaptcha {
  margin-bottom: 1.5rem;
}*/

.user_form .acf-radio-list,
.user_form .acf-checkbox-list {
	margin-bottom: 1.25rem;
}


.user_form .acf-field select {
  font-size: 11px;
  line-height: 1.5;
  padding: 0.25em;
  height: 3rem;
  margin-bottom: 2rem;
  font-weight: bold;
}




.user_form .acf-field select:invalid {
	border-left: 1rem solid #700;
}


.user_form .select2-container .select2-selection--multiple {
	cursor: pointer;
	padding: 0.5rem 1rem;
}


.user_form form input[type="text-submit"] {
  margin-top: 2rem;
  padding-right: 0;
  padding-left: 0;
}



#schulform>.acf-input,
#schulform>.acf-input>.acf-fields {
	height: 100%;
}

/* absende buttons */
#schulform .acf-field-59f8581b8f908 {
	position: relative;
	bottom: 0;
	padding: 1rem 1rem 1.5rem 2rem;
	background-color: rgba(0,0,0,0.12);
}



.page-template-user_profil .form-table tr:nth-of-type(odd),
.page-template-user_profil .form-table tr:nth-of-type(even) {
	background-color: transparent;
}

.page-template-user_profil .form-table td {
	display: block;
	width: 100%;
}

.user_form .acf-field {
	border: none!important;
}

.user_form .acf-field-59df03cf631c3 .acf-field-select {
	padding: 0 1rem 0 0!important;
}

.user_form .acf-field-59df03fa631c5 .acf-field-select {
	padding: 0 0 0 1rem!important;
}


.user_form .acf-label {
	padding-bottom: 0!important;
	margin-bottom: 0!important;
}

.page-template-user_profil .form-table .acf-label label {
	margin-bottom: 0!important;
	padding-bottom: 0!important;
}

.login-submit {
	color: #097372;
	position: relative;
	transition: all 0.3s ease-in-out;
}

.login-submit:hover {
	color: #044;
}

.login-submit svg {
	width: 3.5rem;
	height: 3.5rem;
	position: absolute;
	pointer-events: none;
	left: 50%;
	transform: translateX(-50%);
}

.login-submit input[type="submit"] {
	width: 100%;
	background-color: transparent;
	padding-top: 3.75rem;
	color: currentColor;
	font-size: 1.08rem;
	text-align: center;
	padding-left: 0;
	padding-right: 0;

}


#setting_control_container input[type="submit"]:hover {
	background-color: #097372;
}



#page .wrap .entry-content {
  float: right;
  width: 58%;
}

#page .wrap .entry-header {
  float: left;
  width: 36%;
  text-align: right;
}




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

@media screen and (min-width: 48em) {
	#page .custom-header,
	#page .custom-header-media {
		height: 100%;
	}


	.wrap,
	.navigation-top .wrap {
	max-width: 1280px;}
}

@media screen and (max-width: 2010px) {
html {
	font-size: 13px;
}

#page .wrap {
	padding-left: 0;
	padding-right: 0;
} 
}

@media screen and (max-width: 1290px) {

.user_form .acf-fields .acf-field-group.anrede {
	padding: 0 2rem 0 0;
	max-width: 22rem;
}

.user_form .acf-fields .acf-field-group.bezug {
	padding: 0 1rem 0 1rem;
	max-width: 22rem;
}

.user_form .acf-fields .acf-field-group.schule {
	padding: 0 1rem 0 1rem;
	max-width: 22rem;
}

.user_form .acf-fields .acf-field-group.datenschutz {
	padding: 0 0 0 2rem!important;
	max-width: 26rem;
}
}


@media screen and (max-width: 1080px) {
	html {
		font-size: 12px;
	}

	#anmelden {
		padding-left: 0;
		padding-right: 0;
	}

	#datenschutz_info_accordion .panel {
		font-size: 10px;
	}

	.show .user-settings {
		width: 100%;
		
		  padding: 1rem 2rem 3rem 2rem;
	}

	}

@media screen and (max-width: 990px) {
	html {
		font-size: 11px;
	}

	.show .user-settings {
		padding: 1rem 1rem 1.5rem 1rem;
	}

}



@media screen and (max-width: 848px) {
#page .schule, 
#page .contact {
	display: block;
} 
#page thead th:nth-of-type(2) {
	display: none;
}

.accordion,
#page form label {
	font-size: 1rem;
}

.projekte_title {
	font-size: 1.75rem;
	line-height: 2rem
}
}

@media screen and (max-width: 700px) {
#anmelden .left,
#anmelden .right {
	float: none;
	width: 100%;
	display: block;
	}}

@media screen and (max-width: 600px) {
.projekt {
	display: block;
}

.site-footer {
	padding-left: 1rem;
	padding-right: 1rem;
}


#page td {
	display: block;
	width: 100%;
	padding-bottom: 0;
}

#page .id-project {
	border-top: 2rem solid #0a9390;
}

#page thead th:nth-of-type(3) {
	display: none;
}
.panel-content .entry-header,
.custom-header-media .entry-header {
	/*display: none;*/
}

#page .wrap .entry-header {

	float: none;
	width: 90%;
}

#page .hessen_loewe {
	height: 10vh;
}

#page .panel-content .entry-content,
#page .custom-header-media .entry-content {
	width: 100%;
}




}




@media (max-width: 1300px ) and (orientation: portrait) {

	.user_form form>.acf-fields {
		flex-direction: column;
	}

}






/*
prefixer temp
*/

.machine {
	top: 0;
	left: 0;
  width: 9rem;
  fill: #ddd;
  -webkit-animation: machine_wooble 3s alternate infinite ease-in-out;
          animation: machine_wooble 3s alternate infinite ease-in-out }


@-webkit-keyframes machine_wooble {
0%   {-webkit-transform: translate(0.7rem, 0) perspective(400vw) rotateY(7deg) rotateX(-6deg) scale(0.83);transform: translate(0.7rem, 0) perspective(400vw) rotateY(7deg) rotateX(-6deg) scale(0.83);}
100% {-webkit-transform: translate(1.3rem, 0.7rem) perspective(390vw) rotateY(-21deg) rotateX(10deg) scale(0.84);transform: translate(1.3rem, 0.7rem) perspective(390vw) rotateY(-21deg) rotateX(10deg) scale(0.84);}
}


@keyframes machine_wooble {
0%   {-webkit-transform: translate(0.7rem, 0) perspective(400vw) rotateY(7deg) rotateX(-6deg) scale(0.83);transform: translate(0.7rem, 0) perspective(400vw) rotateY(7deg) rotateX(-6deg) scale(0.83);}
100% {-webkit-transform: translate(1.3rem, 0.7rem) perspective(390vw) rotateY(-21deg) rotateX(10deg) scale(0.84);transform: translate(1.3rem, 0.7rem) perspective(390vw) rotateY(-21deg) rotateX(10deg) scale(0.84);}
}


.small {
  fill: #097372;
}

.medium-shadow, .large-shadow {
  fill: rgba(0, 0, 0, 0.45);
 }

 .small-shadow {
  fill: rgba(0, 20, 40, 0.9);
 }

.small {
	        -webkit-animation: counter-rotation 5s infinite linear;
	                animation: counter-rotation 5s infinite linear;
          -webkit-transform-origin: 100.136px 225.345px;
              -ms-transform-origin: 100.136px 225.345px;
                  transform-origin: 100.136px 225.345px; }

.small-shadow {
	        -webkit-animation: counter-rotation 5s infinite linear;
	                animation: counter-rotation 5s infinite linear;
          -webkit-transform-origin: 110.136px 235.345px;
              -ms-transform-origin: 110.136px 235.345px;
                  transform-origin: 110.136px 235.345px; }

.medium {
	        -webkit-animation: rotation 7.5s infinite linear;
	                animation: rotation 7.5s infinite linear;
          -webkit-transform-origin: 254.675px 379.447px;
              -ms-transform-origin: 254.675px 379.447px;
                  transform-origin: 254.675px 379.447px; }

.medium-shadow {
	        -webkit-animation: rotation 7.5s infinite linear;
	                animation: rotation 7.5s infinite linear;
          -webkit-transform-origin: 264.675px 389.447px;
              -ms-transform-origin: 264.675px 389.447px;
                  transform-origin: 264.675px 389.447px; }

.large {
        	-webkit-animation: counter-rotation 10s infinite linear;
        	        animation: counter-rotation 10s infinite linear;
          -webkit-transform-origin: 461.37px 173.694px;
              -ms-transform-origin: 461.37px 173.694px;
                  transform-origin: 461.37px 173.694px; }

.large-shadow {  
	        -webkit-animation: counter-rotation 10s infinite linear;  
	                animation: counter-rotation 10s infinite linear;
          -webkit-transform-origin: 471.37px 183.694px;
              -ms-transform-origin: 471.37px 183.694px;
                  transform-origin: 471.37px 183.694px; }


@-webkit-keyframes rotation {
    from {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
    to   {-webkit-transform: rotate(359deg);transform: rotate(359deg);}
}


@keyframes rotation {
    from {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
    to   {-webkit-transform: rotate(359deg);transform: rotate(359deg);}
}

@-webkit-keyframes counter-rotation {
    from {-webkit-transform: rotate(359deg);transform: rotate(359deg);}
    to   {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
}

@keyframes counter-rotation {
    from {-webkit-transform: rotate(359deg);transform: rotate(359deg);}
    to   {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
}