/*
Theme Name: Georgi-Zahnmedizin
Theme URI: http://www.georgi-zahnmedizin.de
Version: 1.0
Description: Ein Theme nur für Dich :)
Author: Daniel Gilger
Author URI: http://www.gigmedia.de
*/

* {
	margin: 0;
	padding: 0;
        color: #4C4C4C;
        font-family: "gillsansl";
}
ul{
    list-style: none;
}
li{
    margin: 0;
    padding: 0;
}
.clear {
	clear: both;
        height:0px;
}

.inner, #sitemenu ul li ul {
	width: 1000px;
	margin: 0 auto;
}

body {
        font-size: 18px;
        line-height: 1.4em;
        background-attachment: fixed;
        background-size: 100% auto;
        background-position: right top;
        background-repeat: no-repeat;
}

.rightnav{
    float:right;
    position:relative;
    top:-40px;
}

body,input, textarea{
    font-family: raleway,sans-serif;
}

.header, .header.Klein{
    background-color: #fff;
    width: 100%;
    /*box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.7);*/
    z-index: 10000;
}

.header.Klein{
    border-bottom: 1px solid #c4c4c4;
}
.navspace{
	height: 50px;
	position:relative;
	/*overflow:hidden;*/
	white-space:nowrap;
	z-index:1000;
}
#sitemenu{
	text-align:center;
	display:inline-block !important;
    overflow:hidden;
	box-sizing:border-box;
	padding-bottom: 0px !important;
}
.header.Klein .menuspacer, .logoKlein{
    height: 80px;
}
#sitemenu.Klein{
    overflow:hidden;
}
#sitemenu.Klein .menu-item A{
}
#sitemenu .menu-item A{
    line-height: 40px;
    box-sizing: border-box;
}
/*Menu Dropdown*/
#sitemenu ul li a:HOVER, #sitemenu ul li.current_page_item a{
    /*color: #39B6B8;*/
}
#sitemenu{
	
	overflow:hidden;
}
#sitemenu ul {
    overflow:hidden;
}
#sitemenu ul li, #footer ul li{
    list-style: none;
}
#sitemenu ul li ul{
	position:absolute;
	padding:20px;
	border-radius: 0 0 10px 10px;
    z-index:999;
	left:0;
    background-color: rgba(255, 255, 255, 0.95);
    display: none;
}
#sitemenu ul li ul li{
    margin: 0 0px !important;
	width:33%;
    float:left;
	text-align:left;
}
#sitemenu ul li:Hover ul{
    display: block;
	-webkit-animation: flyintopanim 0.5s ease;
  animation: flyintopanim 0.5s ease;
}
/* ------- */

a{
    text-decoration: none;
}
.entry a{
	color: #77adc9 !important;
	text-decoration: underline;
}

div.contentbox a{
    color: #77adc9 !important;
}
.terminbuchen{
	width: 445px; float:right;
	font-size: 13px !important;
	margin: 0px 0px 50px 70px;
}
a.linkbutton{
    transition: background-color 0.3s;
	box-sizing:border-box;
	color: #77adc9 !important;
    border: 1px solid #9EA6B4;
	font-size: 2em;
	display:block;
	padding: 10px 10px 10px 10px;
	border-radius: 5px;
}
a.linkbutton.termin{
	margin-top: 10px;
	padding: 20px 10px 10px 10px;
	background-image: url("img/termin2.svg");
	background-repeat: no-repeat;
	background-size: 40px;
	background-position: right 10px top 12px;
}
a.linkbutton.termin:hover{
	background-image: url("img/termin.svg");
}
a.linkbutton.termin span{
	margin: 20px 0 0 0;
	width: 100%;
	display:block;
	font-size: 0.62em;
	text-transform: uppercase;
	color: #9EA6B4;
}
a.linkbutton.termin:hover span{
	color: #FFFFFF !important;
}
h2.termin{
	display:block;
	padding: 10px 10px 10px 70px;
	background-image: url("img/termin2.svg");
	background-repeat: no-repeat;
	background-size: 50px;
	background-position: 10px center;
}
.fly-in-bottom{
  -webkit-animation: flyinbottomanim 0.5s ease;
  animation: flyinbottomanim 0.5s ease;
  overflow: hidden !important;
}
@-webkit-keyframes flyintopanim
{
  0% {-webkit-transform: translateY(-50px);opacity: 0.0;}
  30% {-webkit-transform: translateY(-10px);opacity: 0.3;}
  100% {-webkit-transform: translateY(0px);opacity: 1;}
}
@keyframes flyintopanim
{
  0% {transform: translateY(-50px); opacity: 0.0;}
  30% {transform: translateY(-10px);opacity: 0.3;}
  100% {transform: translateY(0px); opacity: 1;}
}
@-webkit-keyframes flyinbottomanim
{
  0% {-webkit-transform: translateY(100px);opacity: 0;}
  100% {-webkit-transform: translateY(0px);opacity: 1;}
}
@keyframes flyinbottomanim
{
  0% {transform: translateY(100px); opacity: 0;}
  100% {transform: translateY(0px); opacity: 1;}
}

.sitepicture IMG{
  -webkit-animation: flyinsitepicture 1s ease;
  animation: flyinsitepicture 1s ease;
  overflow: hidden !important;
}

@-webkit-keyframes flyinsitepicture
{
  0% {/*-webkit-transform: translateY(300px);*/opacity: 0;}
  30% {/*-webkit-transform: translateY(300px);*/opacity: 0;}
  100% {/*-webkit-transform: translateY(0px);*/opacity: 1;}
}
@keyframes flyinsitepicture
{
  0% {/*transform: translateY(300px);*/ opacity: 0;}
  30% {/*-webkit-transform: translateY(300px);*/opacity: 0;}
  100% {/*transform: translateY(0px);*/ opacity: 1;}
}

/* Main Menue */
#sitemenu{
    display:block;
    overflow: hidden;
    font-size: 0px;
}
.menu, .menu-item{
    margin: 0;
    padding: 0;
}

#sitemenu .menu-item{
    display: block;
    float:left;
}
#menu-mainmenu > .menu-item > A{
	background-color: #FFFFFF;
}
#sitemenu .menu-item A{
    box-sizing:border-box;
    overflow: hidden;
    text-transform: uppercase;
    display: block;
    margin-left: 0px;
    padding: 0 15px;
    color: #9EA6B4;
    vertical-align: middle;
    transition: 0.3s;
	border-top-style: solid;
	border-top-width: 5px;
	border-top-color:transparent;
    border-bottom-style: solid;
    border-bottom-width: 5px;
    border-bottom-color: transparent;
    font-size: 18px;
}

.contentbox p{
    margin: 0.8em 0;
}
.contentbox ul{
    list-style: circle;
}
.contentbox ul li{
    margin-left: 20px;
}

/*contactform*/
.contactform{
    width: 70%;
    float:right;
}

.contactform div.submit, .linkbutton{
    padding: 0;
    width: 100%;
}

.contactform label, .contactform div.submit{
    margin-top: 10px;
}
.contactform label, .contactform input[type=text], .contactform textarea{
    clear: both;
    box-sizing: border-box;
    width: 100%;
    display: block;
}
.contactform input[type=text], .contactform textarea{
    border: 1px solid #ddd;
    line-height: 1.2em;
}
.contactform input[type=text]:hover, .contactform textarea:hover, .contactform input[type=text]:focus, .contactform textarea:focus{
    border: 1px solid #39B6B8;
}
.contactform input[type=text], .contactform textarea, .contactform input[type=submit], .linkbutton{
	text-decoration:none !important;
    border-radius: 3px;
    padding: 5px 10px;
    font-size: 1.2em;
}
.contactform input[type=submit]:hover, .linkbutton:hover{
	color: #FFF !important;
    background-color: #77adc9;
}
.contactform input[type=submit]{
    background-color: #F0F0F0;
    font-size: 1.5em;
    border: 0px none;
    cursor: pointer;
    float: right;
    margin: 0px;
    /*max-width: 35%;*/
}

.contactform .half{
	width:47%;
}
.datenschutzhinweis{
	width:25%;
}
.kontaktlist .kontaktlistLeft{
	width: 140px !important;
}
/* /contactform */
#menu-mainmenu > .menu-item > A:HOVER, #menu-mainmenu > .menu-item > A.active{
    border-bottom-color: #77adc9;
	background-color: #FFFFFF;
}
.sub-menu > .menu-item > A{
	font-size:15px !important;
	width: 100%;
	display:block;
	text-overflow: ellipsis;
}
.sub-menu > .menu-item > A:HOVER, .sub-menu > .menu-item > A.active{
	font-weight:bold;
}
#sitemenu .menu-item A:HOVER, #sitemenu .menu-item A.active{
    color: #77adc9;
}
/* logo klein */
.logoKlein{
    float: left;
}
.logoKlein A{
    height: 80px;
    width: 250px;
    opacity: 0.7;
    margin: 10px 0;
    background-image: url('img/logo_georgi_zahnmedizin_sr.svg');
}
.Klein{
    float:right !important;
}
.menuspacer{
    height: 400px !important;
}
.Klein, .logoKlein{
    height: 80px !important;
}
.header.Klein{
    position: fixed;
}

/* /logo klein */

.logo{
    padding: 20px;
}

.logo A{
    width: 250px;
    height: 200px;
    margin: 20px auto;
    background-image: url('img/logo_georgi_zahnmedizin_su.svg');
    background-position: center;
}

.logo A, .logoKlein A{
    display: block;
    background-repeat: no-repeat;
    background-size:contain;
}
.logo A:HOVER{
    transition: 0.2s;
    opacity: 1.0;
    animation: pulse 1s ease;
}

@-webkit-keyframes pulse {
    0% { -webkit-transform: scale(1); }
    30% { -webkit-transform: scale(1.05);}
    100% { -webkit-transform: scale(1);}
}
@keyframes pulse {
    0% { transform: scale(1); }
    30% { transform: scale(1.05);}
    100% { transform: scale(1);}
}

/* Big-Pictures */
.sitepicture{
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    /*height: 480px;
    position: relative;*/
}

.iconlist{
    padding: 20px 0;
}
.iconlist li{
    display: block;
    float:left;
    width: 33%;
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
    transition: 1s;
    vertical-align: bottom;
    
}
.iconlist li div, .iconlist li div span{
    color: #9EA6B4;
}
.iconlist li div{
    display: block;
    text-align: center;
    margin-top: 20px;
}
.iconlist li div span{
    font-size: 1.5em;
    text-transform: uppercase;
}
.iconlist li:HOVER DIV, .iconlist li:HOVER div span{
    color: #77adc9;
}
.line{
    height:0px;
}
.line, #sitemenu ul li ul{
    border-top: 1px solid #9EA6B4;
}
#sitemenu ul li ul{
	border: 1px solid #9EA6B4;
}
.dark{
    background-color: #F0F0F0;
}

.iconlist li div:first-child{
    height: 100px;
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
    transition: 1s;
}

.iconlist li div.behandlung{
    background-image: url("img/icon_behandlung.svg");
}

.iconlist li:HOVER div.behandlung{
    background-image: url("img/icon_behandlung_a.svg");
}

.iconlist li div.prophylaxe{
    background-image: url("img/icon_prophylaxe.svg");
}

.iconlist li:HOVER div.prophylaxe{
    background-image: url("img/icon_prophylaxe_a.svg");
}

.iconlist li div.ueberweiser{
    background-image: url("img/icon_ueberweiser.svg");
}

.iconlist li:HOVER div.ueberweiser{
    background-image: url("img/icon_ueberweiser_a.svg");
}

.sitepicture DIV.hinweis{
    display: block;
    font-size: 2.5em;
    font-weight: bold;
    line-height: 1.5em;
    /*background: rgba(158, 166, 180,0.7);*/
    text-align: center;
    /*background: rgba(76, 76, 76, 0.7);*/
    vertical-align: middle;
    width: 100%;
    position: absolute;
    height:70%;
    bottom: 0px;
    overflow: hidden;
    font-weight: lighter;
}
.sitepicture DIV.hinweis DIV.inner, .sitepicture DIV.hinweis DIV.inner A{
    color: #fff;
}
.sitepicture DIV.overlay{
    width: 100%;
    height: 100%;
    /*background: rgba(255, 255,255,0.7);*/
}
.sitepicture DIV.hinweis A{
    display: inline-block;
    border-radius: 5px;
    border: 1px solid #ffffff;
    padding: 0 10px;
    font-size: 0.8em;
    line-height: 1.5em;
    transition: 0.5s;
}
.leistungenThumb{
    background-repeat: no-repeat;
    background-size: cover;
    float:left;
    display: block;
    width: 300px;
    height: 300px;
    margin: 10px;

    font-size: 1.8em;
    line-height: 2em;
    font-weight: normal;
    text-transform: uppercase;
    vertical-align: middle;
    color: #77adc9;
}
.s1{
    color:#77adc9 !important;
    text-shadow: 0 0 0.4em #FFF, 0 0 0.4em #FFF, 0 0 0.4em #FFF;
}
.s2{
    color:#FFFFFF !important;
    text-shadow: 0 0 0.6em #000, 0 0 0.6em #000, 0 0 0.6em #000;
}

.sitepicture DIV.hinweis A:HOVER{
    background-color: rgba(158, 166, 180,0.5);
}

/* Contentbox */
h1{
    font-size: 1.8em;
    font-weight: normal;
    text-transform: uppercase;
    margin-bottom: 1em;
    margin-top: 20px;
    color: #77adc9;
	line-height: 1.5em;
}

h2, .notify A{
    font-size: 1.3em;
    font-weight: normal;
    text-transform: uppercase;
}
h2{
    margin-bottom: 1em;
    margin-top: 20px;
}

.contentbox{
    line-height: 1.5em;
    padding-bottom: 20px;
}

/* Footer */
#footer{
    margin-top: 60px;
    padding-top: 20px;
    background-color: #9EA6B4;
}

#footer *{
    color: #FFF !important;
}

#footer .box{
    width: 23%;
    float:left;
    border-right: 1px dashed #9EA6B4;
    margin-right: 2.5%;
}

#footer A:HOVER{
    text-decoration: underline;
}

#footer .active, #footer A:HOVER{
    color: #4C4C4C !important;
}

/* Social-Buttons */
A.social{
    display: block;
    width: 2em;
    height: 2em;
    margin: 0px 0 0 10px;

    background-size: contain;
    background-repeat: no-repeat;
    background-position: center 5px;

    float:left;
    border-radius: 100%;
    border: 5px solid #fff;
}
A.social{
    background-color: #9EA6B4;
}
A.social:hover{
    background-color: #4C4C4C;
}

.iFacebook{
    background-image: url("img/icon_facebook.svg");
}
.iGoogle{
    background-image: url("img/icon_google.svg");
}
.iInstagram{
	background-color: #fd5949 /*0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%*/ !important;
    background-image: url("img/icon_instagram.svg");
}
/*Team*/
TD.bildzellelinks{
width:20%;padding-right: 20px;vertical-align:top;padding-top: 20px;text-align:left;
}
TD.bildzellerechts{
width:20%;padding-left: 20px;vertical-align:top;padding-top: 20px;text-align:right;
}
td .picmobile{ display: none;}
/*Links - Logos*/
.links-logo a {display:block; width: 110px;height:110px;float:left;margin: 0 50px 30px 0;opacity: 0.2;}
.links-logo a:HOVER {opacity: 1; transition:0.5s; -moz-box-shadow: 0 0 10px #888;-webkit-box-shadow: 0 0 10px#888;box-shadow: 0 0 10px #888;}
.links-logo a img{float:left;width: 110px;height:110px;}
/*HomeLinks*/
.halfsite{
	width: 50%;
	float:left;
	background-image: url(img/pfeil.svg);
	background-position: 125% 90%;
}
.notify .inner{
	background-image: url(img/pfeil_w.svg);
	background-position: 125% 40%;
}
.halfsite, .notify .inner{
	box-sizing:border-box;
	padding: 10px 20px 10px 0;
	background-repeat: no-repeat;
	background-size: 100px 20px;
	transition: all 500ms ease;
}
.halfsite > A{
	display:block;
	border-left: 0px solid #77adc9;
	padding-left: 130px;
	padding-right:20px;
	transition: all 500ms ease;
	fill:#A4B1BC;
}
.halfsite:nth-child(3) {
  clear:both;
  float:left;
}
.halfsite:HOVER{
	background-position: 100% 90%;
}
.notify:HOVER .inner{
	background-position: 100% 40%;
}
.halfsite:HOVER > A{
	display:block;
	border-left: 5px solid #77adc9;
	padding-left: 130px;
}
.halfsite:HOVER H2{
	color: #77adc9;
}
.desktophide{
	display:none !important;
}
.notify{
	margin: 0;
	padding: 0px;
	
    background-color: #77adc9;
	/*background-color: #F0F0F0;*/
	transition: all 500ms ease;
	border-top: 1px solid #c4c4c4;
	border-bottom: 2px solid #fff;
}

.notify:HOVER{
    background-color: #77adc9;
}
.notify .inner A SPAN{
	font-size: 0.7em;
	color: #F0F0F0;
}
.notify .inner A{
	background-image: url(img/i_team_w.svg);
	color: #EFEFEF;
	background-repeat: no-repeat;
	background-position: 100% 0;
	background-size: contain;
	line-height: 1.8em;
	transition: all 500ms ease;
}
.notify:HOVER .inner A{
	padding-left: 20px;
	border-left: 3px solid #FFFFFF;
	background-image: none;
	color: #ffffff !important;
}