/*
Theme Name:     freedom-schubert-bauer	
Theme URI:      http://datenwege-informatik.de
Description:    Spezielle Anpassungen des Templates "freedom" für die website "dr-schubert-geotec.de"
Author:         Gernot Daum
Author URI:     http://Datenwege-Informatik.de
Template:       freedom
Version:        1.0
*/

/* Allgemein */

body {
  /* background-color: #e2fff2; */
  background-color: #fff;
  hyphens: auto
}

.wide #page, .inner-wrap, .footer-socket-wrapper {max-width: 1120px}

#main {
  padding-top: 10px;
  padding-bottom: 10px;
}

h1, h2, h3 {text-align: center} 


/* Kopf */
#header-text-nav-wrap {padding: 10px 0}
#header-image {float: left; width: 23%}
#header-logo-image {float: left; width: 77%}
#header-logo-image img {
	max-height: 240px;
	width: auto
}
#header-text {display: none}
.main-navigation {
	text-align: right;
	background-color: #fff;                                                
  z-index: 10;                                                           
  max-width: 1120px;   
	top:0
}
.main-navigation ul li ul li:last-child {
  float: left;
}
.main-navigation ul li:last-child a {
  padding-right: 0;
}

/* Fuss */
.footer-widgets-wrapper, .footer-socket-wrapper {background-color: #081818}
.footer-widgets-area {padding-top: 10px}
.footer-widgets-area h1 {margin: 0 10px; color: #ccc; font-size: 18px}
#colophon .widget {margin-bottom: 0}
#colophon .widget ul li {
  width: 60%;
  margin-left: 20%;	
  border-bottom: none;
}
.tg-one-half {padding: 0}

/* Individuelle Einstellungen */
.main-navigation ul li ul {
	background-color: #fff; 
  width: 300px;
}

#site-navigation ul li ul li a {
  width: 266px;
}
.Stellenangebote h2 {font-size: 32px}
 
/* Inhalte */ 
.entry-header {
	display: none
}
.page_in_widget {
	width: 96%;
	margin-left: 2%
}

.entry-content ul {
	list-style: none;
}
.entry-content ul li:before {
  content: "■";
  margin-left: -18px;
  padding-right: 8px;
  color: #31c7ad; 
}
.entry-content ul li {
	font-size: 16px
}

/* Spaltenlayout */
.Vollseite, .Halbseite, .HalbseiteL, .HalbseiteR, .Halbbox, 
.Dreiviertelseite, .Drittelseite, .Drittelbox, .Zweidrittelseite, .Zweidrittelbox, 
.Viertelseite, .Viertelbox, .Sechstelseite {
	float: left;
	margin: 0% 1.5%
}
.Vollseite {
	width: 97%
}
.Dreiviertelseite {
	width: 72%
}
.Zweidrittelseite, .Zweidrittelbox {
	width: 63.66%; 
}
.Halbseite, .HalbseiteL, .HalbseiteR, .Halbbox {
	width: 47%
}
.Drittelseite, .Drittelbox {
	width: 30.33%
}
.Viertelseite, .Viertelbox {
	width: 22%
}
.Sechstelseite {width: 16.66%}
.newline {clear: both}

/* Bildpositionierung */
.Fill1 {
	width: 10%; 
	margin-left: 45%
}
.Fill2 {
	width: 20%; 
	margin-left: 40%
}
.Fill3 {
	width: 30%; 
	margin-left: 35%
}
.Fill4 {
	width: 40%; 
	margin-left: 30%
}
.Fill5 {
	width: 50%; 
	margin-left: 25%
}
.Fill6 {
	width: 60%; 
	margin-left: 20%
}
.Fill7 {
	width: 70%; 
	margin-left: 15%
	}
.Fill8 {
	width: 80%; 
	margin-left: 10%
}
.Fill9 {
	width: 90%; 
	margin-left: 5%
}
.Fill  {
	width: 100%
}
.FillH {
	float: left; 
	width: 48%; 
	margin: 0 1%
}

/* Kacheln */
.tileq1, .tilea01 {
	float: left;
	width: 92%;
	margin: 30px 2%;
	padding: 2%;
	min-height: 300px;
  border-bottom: 1px solid #f8f8f8;
  box-shadow: 0 2px 5px rgba(29, 117, 102, 0.8);
  text-align: center;
  hyphens: none
}
.tileq1 h3 {
	font-size: 24px
}
.tileq1 img {
	margin: 0;
	margin-bottom: 15px
}
.tileq1 .unterschrift {
	font-size: 12px;
	line-height: 24px
}
#wrapper .tileq1 h3 {
	font-size: 1.2em;
	line-height: 1.4em
}
a.tileq1 {
	background-color: #fff;
}
.tileq1 h1, .tileq1 h2, .tileq1 h3, .tileq1 h4, .tileq1 h5 {
	color: inherit
}
.entry-content a.tileq1 {
	color: #000000
}
.entry-content a.tileq1:hover{
	color: #fff;
	background-color: #31c7ad
}
.tilea01 .frame {
	position: relative;
	overflow: hidden;
	width: 100%; 
	min-height: 300px
}
.tilea01 img {margin-bottom: 20px}
.tilea01 .anim {
	position: absolute;
	left: 0;
	width: 96%;
	height: 100%;
	padding: 0 2%;
	top: 80%;
  transition: top 0.3s;
	background-color: #fff 
}
.tilea01 .anim h3 {font-size: 22px; margin-top: 5px; transition: margin-top 0.3s}
.tilea01 .anim h4 {font-size: 18px; margin-top: 20px; line-height: 20px}
.tilea01:hover .anim {
	top: 0;
	background-color: rgba(49, 199, 173, 0.8)
}
.tilea01:hover .anim h3 {margin-top: 20%}


/* Tabellen */ 

.contactdata th, .contactdata td, .publications th, .publications td {
	display: block;
	float: left;
	border: none;
	padding: 6px 0;
} 
.contactdata .namewide, .contactdata .valuewide {width: 98%;	margin: 1% 0}
.contactdata .name, .home .contactdata .namewide {width: 36.2%;	margin: 1% 0}
.contactdata .value, .home .contactdata .valuewide {width: 59.8%;	margin: 1% 0}
.publications .author {width: 29%; margin: 1% 0}
.publications .publication {width: 63%; margin: 1% 0}

/* Tabs */ 
.Referenzen {float : left; width : 100%}
.Referenzen > section > h2 > label {cursor : pointer}
.Referenzen > input {display : none}
.Referenzen > input:not(:checked) + section > ul {display : none}
.Referenzen > section > h2 {
	display                 : block; 
  float                   : left;  
  text-align              : left;  
  font-size               : 15px;  
  margin                  : 0;     
  width                   : 20%;   
  height                  : 60px;  
  margin                  : 0 0.2%;
  padding                 : 0 0.3%;
  overflow                : hidden;
  border                  : 1px solid #1d7566;
  border-top-left-radius  : 4px;
  border-top-right-radius : 4px;
}
.Referenzen.medium > section > h2 {width: 17%}
.Referenzen.small > section > h2 {width: 10%}
.Referenzen > section > h2 > label {
		display : block; 
		hyphens : none; 
    width   : 100%;
    height  : 100%  
}  
.Referenzen > input:checked + section > h2 {background-color : #31c7ad}
.Referenzen > section > ul {
  float  : right;
  width  : 100%;
  margin : 65px 0 0 -100%;
}
.Referenzen > section > ul > li {
	width: 75%;
	margin-top: 5px;
	margin-left: 5%
}

/* Kontaktformulare */
.wpcf7-form input, .wpcf7-form select,
.wpcf7-form .wpcf7-textarea {
	background-color: #f0f0f0;
	border: 1px solid #909090;
	box-shadow: 0 0 2px #000;
	margin: 4px 2px;
	padding: 4px;
	max-width: 100%
}
.lblContact, .lblContact3, .txtContact, .txtContact7, .txaContact, 
.selContact7 { 
	display: block;
	float: left;
}
.lblContact, .lblContact3 {
	clear: both;
	display: block;
	text-align: left;
	width: 100%;
	padding-top: 10px
}
.lblContact3 {
	width: 30%
}
.lblContact p, .lblContact3 p {
	margin: 0;
	padding-top: 2px
}

.txtContact, .txaContact, .btnContact {
	clear: both;
	width: 98%
}
.txtContact7, .selContact7  {
	width: 68%
}
.textwidget .txaContact {
	margin-top: 10px
}
.wpcf7-form input[type="text"], .wpcf7-form .wpcf7-textarea, 
.wpcf7-form input[type="email"], .wpcf7-form input[type="submit"] {
	border: none;
  box-shadow: 0 2px 5px rgba(29, 117, 102, 0.8);
}
.wpcf7-form input[type="submit"] {
  background-color: #1d7566
}
.wpcf7-form input[type="submit"]:hover {
  background-color: #31c7ad
}



/* Google Maps */
div#googleMap {width: 32em; height: 26em; margin: 1em 2em}


/* Responsive Anpassung */

/* Maximalbreite */
@media only screen and (max-width: 1120px) {
	#header-text-nav-container .inner-wrap {width: 98%}
	.main-navigation a {padding: 12px 10px; font-size: 18px}
	.Referenzen > section > ul > li {width: 70%}
  div#googleMap {width: 28em}
}

/* Wechsel zum Tablet quer */
@media only screen and (max-width: 960px) {
	#header-image {display: none}
	#header-logo-image {float: none; width: 100%}
	.main-navigation a {padding: 12px 6px; font-size: 15px}
	.Zweidrittelseite, .Zweidrittelbox, .Halbseite, .Halbbox {
	  width: 96%
  }
  .Drittelseite, .Drittelbox {width: 70%; margin: 10px 15%}
  table {margin: 0}
  .contactdata .namewide {width: 36.2%;	margin: 1% 0}
  .contactdata .valuewide {width: 59.8%;	margin: 1% 0}
	.Referenzen > section > h2 {
		float      : none;
    font-size  : 22px;  
    width      : 100%;   
    height     : 30px;  
    margin-top : 20px;
    text-align : center  
	}
	.Referenzen > input:checked + section > h2 {background-color: #fff}
	.Referenzen > input:not(:checked) + section > ul {display: block}
	.Referenzen > section > ul {float  : none; margin: 0}; width: 95%;
	.Referenzen > section > ul > li {width: 95%}
	.Referenzen > section > h2 > label {cursor: inherit}
	.Referenzen > input:checked + section > h2 > label {background-color : #fff}
  div#googleMap {width: 34em; margin: 0}
}

/* Großer Umbruchpunkt - Wechsel zu Tablets Portrait */
@media only screen and (max-width: 767px) {
	#masthead .menu-toggle::before {color: #31c7ad}
	#masthead .current_page_item a, 
	#masthead .main-small-navigation li a:hover 
	{background-color: #31c7ad}
	.Drittelseite, .Drittelbox {width: 96%; margin: 10px 2%}
  .tileq1, .tilea01 {margin: 0 2%}
  #colophon .widget_nav_menu {text-align: center}
  div#googleMap {width: 26em}
}
@media only screen and (max-width: 640px) {
	h1 {font-size: 30px}
	h2 {font-size: 28x}
	h3 {font-size: 26x}
  div#googleMap {width: 20em}
}
@media only screen and (max-width: 480px) {
	h1 {font-size: 26px}
	h2 {font-size: 24px}
	h3 {font-size: 22px}
  .home .contactdata .namewide, .home .contactdata .valuewide,
  .contactdata .namewide, .contactdata .valuewide, .publications .author, .publications .publication
  {width: 98%;	margin: 1% 0}
  .publications .author {padding-bottom: 2px}
    .publications .publication {padding-top: 2px}
  div#googleMap {width: 16em}
}
@media only screen and (max-width: 400px) {
	h1 {font-size: 22px}
	h2 {font-size: 20px}
	h3 {font-size: 18px}
	body {font-size: 16px}
	.main-navigation {background-color: #f00}
  div#googleMap {width: 14em}
}