/* quicksand-regular - latin */
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/quicksand-v30-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/quicksand-v30-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/quicksand-v30-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/quicksand-v30-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/quicksand-v30-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/quicksand-v30-latin-regular.svg#Quicksand') format('svg'); /* Legacy iOS */
}

/* quicksand-500 - latin */
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/quicksand-v30-latin-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/quicksand-v30-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/quicksand-v30-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/quicksand-v30-latin-500.woff') format('woff'), /* Modern Browsers */
       url('fonts/quicksand-v30-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/quicksand-v30-latin-500.svg#Quicksand') format('svg'); /* Legacy iOS */
}

body { padding: 0; margin: 0; background-color: #fff; font-family: 'Quicksand', sans-serif; font-size: 16px; line-height: 30px; color: #1e2020; text-decoration: none; text-align: left; }
h1 { padding: 0; margin: 0 0 7px 0; font-family: 'Quicksand', sans-serif; font-size: 50px; line-height: 62px; font-weight: 400; color: #457e01; }
h2 { padding: 0; margin: 0 0 38px 0; font-family: 'Quicksand', sans-serif; font-size: 26px; line-height: 38px; font-weight: 400; color: #457e01; }
h2.h2header { margin: 0 0 7px 0; }
h3 { padding: 0; margin: 38px 0 23px 0; font-family: 'Quicksand', sans-serif; font-size: 21px; line-height: 35px; font-weight: 400; color: #417700; }
h3 a { text-decoration: none; }
h3.first { margin: 0 0 23px 0; }
h3.sticky { margin: 38px 0 7px 0; }
h3.firststicky { margin: 0 0 7px 0; }
h4 { padding: 0; margin: 0; font-family: 'Quicksand', sans-serif; font-size: 21px; line-height: 35px; font-weight: 400; color: #1e2020; }
h5 { padding: 0; margin: -23px 0 23px 0; font-family: 'Quicksand', sans-serif; font-size: 18px; line-height: 32px; font-weight: 400; color: #1e2020; }
a { color: #417700; text-decoration: underline; }
.rot { color: #dc2626; font-weight: 500; }
p { padding: 0; margin: 0 0 24px 0; }
ul, ol { margin: 0 0 24px 0; padding: 0 0 0 17px; }
strong { font-weight: 500; }
hr { clear: both; height: 1px; border: none; margin: 20px 0 20px 0; border-bottom: 1px dotted #65942d; }
.clearer { clear: both; }
.contentclearer { height: 60px; clear: both; }
#mobilebutton { display: none; }

#navicontainer { width: 100%; position: fixed; z-index: 1000; padding: 0; margin: 0; background: #f1f2f2; opacity: 0.95; }
#navi { width: 1100px; padding: 21px 0 44px 0; margin-left: auto; margin-right: auto; text-align: left; font-size: 18px; }
#navi ul { list-style-type: none; margin: 0; padding: 0; }
#navi .naviitem { float: left; margin: 0 43px 0 0; }
#navi .naviitem a { color: #4f5759; text-decoration: none; }
#navi .active { color: #65942d; padding: 0 0 0 32px; background: url(img/icon_active.png) no-repeat left; }
#navi .active a, #navi .naviitem a:hover { color: #65942d; }
#navi .naviitem ul { position: absolute; z-index: 100; top: 0; padding: 65px 0 0 0; margin: 0 0 0 -55px; left: -999em; text-align: center; }
#navi .naviitem ul li { padding: 8px 15px; background: #f1f2f2; opacity: 0.95; border-top: 1px solid #fff; }
#navi .naviitem ul li a.subactive, #navi .naviitem ul li a:hover { color: #417700; }
#navi .naviitem ul li a, #navi .naviitem ul ul li a { color: #1e2020; }
#navi ul li:hover ul ul, #navi ul li:hover ul ul ul, #navi ul li.sfhover ul ul, #navi ul li.sfhover ul ul ul { left: -999em; }
#navi ul li:hover ul, #navi ul li li:hover ul, #navi ul li li li:hover ul, #navi ul li.sfhover ul, #navi ul li li.sfhover ul, #navi ul li li li.sfhover ul { left: auto; }
#navi select { display: none; }

#logo { width: 1100px; margin-left: auto; margin-right: auto; text-align: left; }
#logo img { margin: 99px 0 26px 225px; }

#headercontainer { width: 100%; padding: 0; margin: 0; background: #f3f4f4; }
#headercontainer.home { background: #bbd39e; }
#header { position: relative; width: 1100px; margin-left: auto; margin-right: auto; text-align: left; padding: 58px 0 45px 0; }
#header.diabetesbehandlung { background: url(img/img_diabetesbehandlung.jpg) no-repeat right; }
#header.volkskrankheit { background: url(img/img_volkskrankheit.jpg) no-repeat right; }
#header.schulung { background: url(img/img_schulung.jpg) no-repeat right; }
#header.fusssyndrom { background: url(img/img_fusssyndrom_01.jpg) no-repeat right; }
#header.innere { background: url(img/img_innere_medizin.jpg) no-repeat right; }
#header.aaron { background: url(img/aaron-telefonassistent.png) no-repeat right; }
#header h1 span { display: block; font-size: 26px; margin: 0 0 -9px 0; color: #4f5759; }
.home #header { padding: 70px 0 42px 0; }
.home #header h1 { font-size: 60px; line-height: 72px; color: #4f5759; margin: 0; }
.home #header h1 span { display: block; font-size: 36px; margin: -3px 0 0 0; }
#profile { position: absolute; top: -142px; right: 58px; }
.home #profile { top: -264px; right: -32px; }
.tablet #profile { top: 21px; right: 170px; }

#content { width: 1100px; margin-left: auto; margin-right: auto; text-align: left; padding: 85px 0 80px 0; }
.side { background: url(img/bg_side.png) repeat-y right; }
.column { float: left; width: 510px; margin: 0 40px 0 0; }
.column ul { list-style-type: square; }
.column ul li { padding: 0 0 0 8px; }
.columnfull { text-align: center; }
.columnwide { float: left; width: 697px; margin: 0 40px 0 0; }
.columnsmall { float: left; width: 33%; text-align: center; }
.columnsmall img { max-width: 95%; height: auto; }
.side .column { width: 530px; margin: 0 20px 0 0; }
.last { margin: 0 0 0 40px; }
#news { position: relative; border: 1px dotted #65942d; margin: 27px 0 57px 0; padding: 38px 29px 11px 29px; }
#news .news { float: left; width: 50%; }
#leaf { position: absolute; top: -57px; right: 17px; }
.highlight { padding: 4px; margin: 0 0 24px 0; background: #65942d; color: #fff; font-weight: 500; text-align: center; }
.sidebar { float: left; width: 470px; margin: 0 40px 0 40px; }
.sidebar h2 { color: #404344; padding: 0 49px; }
.sidebar p { padding: 0 49px; }
.sidebar ul { list-style-type: none; margin: 0; padding: 0 49px; }
.sidebar ul li { padding: 0 0 10px 0; }
.sidebar img { margin: 0 0 16px 0; }
.imgleft { float: left; margin: 0 15px 15px 0; }
.imgright { float: right; margin: 0 0 15px 15px; }
.galerie { margin: 0 0 10px 0; }
.aaron { margin: 50px 0 0 0; }
a.button { padding: 20px; font-family: 'Quicksand', sans-serif; font-size: 16px; line-height: 30px; font-weight: 500; text-decoration: none; color: #fff; background:#65942d; border: none; }
a.button span { font-size: 26px; }

#teasercontainer { width: 100%; padding: 0; margin: 0; background: #bbd39e; }
#teaser { position: relative; width: 1100px; margin-left: auto; margin-right: auto; text-align: left; }
#tablet { position: absolute; top: -59px; left: 40%; }
.teaser { float: left; width: 33%; text-align: center; }
.teaser h2 { color: #404344; margin: 49px 0 26px 0; } 
.teaser p { color: #2a3031; font-size: 18px; line-height: 28px; margin: 0 0 55px 0; }

#footercontainer { width: 100%; padding: 0; margin: 0; background: #4f5759; }
#footer { width: 1100px; margin-left: auto; margin-right: auto; text-align: left; padding: 68px 0 60px 0; }
#footer h2, #footer p, #footer a { color: #fff; }
.contact { float: left; width: 388px; text-align: left; }
.hours { float: left; width: 298px; margin: 0 87px 0 0; text-align: left; }
.hours p, .hourswide p { border-bottom: 1px solid #848a8b; padding: 0 0 7px 0; margin: 0 0 7px 0; }
.map { float: left; width: 327px; text-align: center; }
.mapfull { width: 100%; text-align: center; }
.map iframe, .mapfull iframe { margin: 30px 0 0 0; }

form { background: #bbd39e; padding: 30px; }
form h4 { margin: 23px 0 15px 0; }
fieldset { border: none; margin: 0; padding: 0; }
label { display: inline-block; line-height: 21px; vertical-align: top; width: 100%; padding: 0; margin: 0; color: #1e2020; }
fieldset ol { padding: 0; margin: 0; list-style: none; }
fieldset li { list-style: none; padding: 5px 0; margin: 0; }
fieldset input, fieldset textarea { width: 100%; background: #fff; border: none; font-family: 'Quicksand', sans-serif; font-size: 16px; line-height: 30px; color: #1e2020; text-decoration: none; }
fieldset input[type=checkbox] { float: left; width: auto; margin: 7px 15px 0 0; }
fieldset span { float: left; width: 90%; }
form .button { width: 100px; height: 40px; font-family: 'Quicksand', sans-serif; font-size: 14px; line-height: 30px; font-weight: 500; text-transform: uppercase; color: #fff; background:#65942d; border: none; margin: 0 15px 0 0; }
.fieldblind { display: none; }

/* http://www.menucool.com/tooltip/css-tooltip */
a.tooltip { outline:none; }
a.tooltip:hover { text-decoration:none; } 
a.tooltip span { border-radius:4px; z-index:10; display:none; padding:14px 20px; margin:-270px 0 0 30px; width:300px; }
a.tooltip:hover span { display:inline; position:absolute; border:2px solid #bbd39e; background:#fff; font-family: 'Quicksand', sans-serif; font-size: 13px; line-height: 22px; color: #1e2020; }
.callout { z-index:20; position:absolute; top:270px; border:0; left:-12px; }



/* Responsive */

@media only screen and (max-width: 1100px) {
h2.h2header { margin: 0 3% 7px 3%; }
h4 { margin: 0 3%; }
#mobilebutton { display: block; position: fixed; z-index: 80; bottom: 0; width: 100%; background: #65942d; text-align: center; padding: 5px 0; }
#navi { width: 100%; padding: 0; margin: 0; }
#navi .naviitem { display: none; }
#navi select { display: block; width: 100%; text-align: center; background: #f3f4f4; color: #4f5759; padding: 10px 15px; border: 0; font-family: 'Quicksand', sans-serif; font-size: 18px; }
#navi select option { padding: 10px 0; }
#logo { width: 100%; margin: 0; text-align: center; }
#logo img { margin: 90px auto 20px auto; max-width: 50%; height: auto; }
#header { position: static; width: 94%; margin: 0 3%; padding: 30px 0 12px 0; }
#header.diabetesbehandlung, #header.volkskrankheit, #header.schulung, #header.fusssyndrom, #header.innere, #header.aaron { background: none; }
.home #header { padding: 30px 0 12px 0; }
#profile { display: none; }
#content { width: 100%; margin: 0; padding: 50px 0; }
.side { background: none; padding: 0!important; }
.column { width: 44%; margin: 0 3%; }
.columnwide { float: none; width: 94%; margin: 0 3% 40px 3%; }
.columnsmall { width: 27%; margin: 0 3%; text-align: left; }
.columnsmall img { max-width: 100%; height: auto; }
.side .column { width: 48%; margin: 0 3%; padding: 50px 0; }
.last { margin: 0 3%; }
#news { padding: 38px 3% 11px 3%; }
.sidebar { width: 34%; margin: 0 3%; padding: 50px 3%; background: #f3f4f4; }
.sidebar h2, .sidebar p, .sidebar ul { padding: 0; }
.sidebar img { max-width: 100%; height: auto; }
a.button { padding: 15px; font-size: 14px; }
.aaron { margin: 50px 0; }
a.button span { font-size: 14px; }
#teaser { width: 100%; margin: 0; }
#tablet { top: -40px; left: 41%; }
#tablet img { max-width: 70%; height: auto; }
.teaser { width: 44%; margin: 0 3%; }
.nomobile { display: none; }
#footer { width: 100%; margin: 0; padding: 68px 0 90px 0; }
.contact, .hours, .map { width: 27%; margin: 0 3%; }
.map iframe { width: 100%; }
.mapfull iframe { width: 94%; margin: 30px 3% 0 3%; }
}

@media only screen and (max-width: 800px) {
.column { float: none; width: 94%; }
.side .column { float: none; width: 94%; }
.sidebar { float: none; width: 94%; margin: 0 0 -60px 0; }
#tablet { top: -20px; left: 44%; }
#tablet img { max-width: 40%; }
.contact, .hours { width: 44%; }
.map { float: none; clear: both; width: 94%; padding: 30px 0 0 0; }
}

@media only screen and (max-width: 600px) {
#header h1, .home #header h1 { font-size: 50px; line-height: 62px; }
#header h1 span, .home #header h1 span { font-size: 26px; }
.columnsmall { float: none; width: 94%; margin: 0 3% 40px 3%; }
#teasercontainer { display: none; }
#footer { padding: 30px 0 90px 0; }
.contact, .hours { float: none; width: 94%; text-align: center; }
}

@media only screen and (max-width: 500px) {
#header h1, .home #header h1 { font-size: 40px; line-height: 52px; }
#header h1 span, .home #header h1 span { font-size: 22px; }
#leaf { right: -30px; }
#leaf img { max-width: 70%; height: auto; }
#news .news { float: none; width: 100%; }
}

@media only screen and (max-width: 400px) {
#header h1, .home #header h1 { font-size: 30px; line-height: 42px; }
#header h1 span, .home #header h1 span { font-size: 18px; }
}