@charset "utf-8";
/* CSS Document */

/*
 * Project: "Praxis Dr. med. Blome" 
 * File: basic.css
 *
 *
 * @copyright	Copyright 2009, Suzana Kötter, ID-script
 * @author	Suzana Kötter,  ID-script
 * @link	http://www.id-script.de 
 *
 *
 */
/*----------- RESET ---------------------------------------
----------------------------------------------------------*/
* {padding: 0; margin: 0; font-size: 100%; font-weight: normal;}
ul, ol {list-style: none;}
b, strong {font-weight: bold;}
img, a img {border: none;}
html:abbr, abbr, acronym  {border-bottom:1px dotted #999; cursor:help;}

/*----------- SCHRIFT / GRÖSSE -----------------------------
-----------------------------------------------------------*/
html { height:100%}
body { 
font-size: 76%;
background:#dbdfe1 url(../bg/bgBody.jpg) left top repeat-x;
font-family:Arial, Helvetica, sans-serif!important;
color:#535353;
text-align: left; 
line-height: 1.4em;
height:100%;
}
h1, h2, h3	{line-height:1.2em;}
h1		{}
h2		{font-size:1.8em; line-height: 1.2em;}
h3 	        {font-size:1.4em; font-weight:bold; color:#53a8d0;}
h4		{text-transform:uppercase; font-weight:bold;}
h5		{font-size:1.2em; line-height: 1.2em; font-weight:bold; color:#000; background-color:#f8f8f8; padding:2px 8px;}
p		{margin: 0.5em 0; text-align:justify;}
/*----------- LINKS --------------------------------------
----------------------------------------------------------*/
a:link, 
a:visited {text-decoration:none; color:#53a8d0;}
a:hover, 
a:focus,
a:active  {text-decoration:underline;} 
/*------------ LISTE ---------------------------------------
-----------------------------------------------------------*/
ul, ol		{padding-top:0.5em;}
ol 		{list-style:decimal; list-style-position: outside; margin-bottom:20px;}
ul li, ol li	{font-size:100%; margin-bottom:4px;}
/*------------ CONTENT -------------------------------------
-----------------------------------------------------------*/
#page	{width:960px; margin:0 auto;}
#header	{background:url(../bg/bgHeader.jpg) left top repeat-x; height:100px; position:relative;}
#logo 	{color:#000000; font-size:18px; left:15px; position:absolute; top:5px; /*top:65px;*/}
#info	{height:260px; padding:28px 20px 0 20px; position:relative; background-color:#fff; background-position:20px 20px; background-repeat:no-repeat;}
#uid2 #info, 
#uid10 #info	{height:280px;}
#info-crossSlide{height:260px;}
#main		{margin-top:10px; background:#fff; padding:10px 20px;}
#uid2 #main 	{margin-top:30px; padding: 20px 20px 10px 20px; position:relative;}

#footer	  {font-size:0.9em; padding:10px 20px 0 20px; background:url(../bg/bgBottomm.png) 0 0 no-repeat;}
#footer p {margin:0;}
#footer a {text-transform:uppercase;}
#footer span {padding-left:50px;}

/*------------ Bildwechsel-- ------------------------------
-----------------------------------------------------------*/
#start		{height:260px; padding:20px; position:relative; background-color:#fff; background-position:20px 20px; background-repeat:no-repeat; background-image:url(bilder/klinik_außen.jpg);}
#uid3 #info	{background-image:url(../img/generation.jpg); position:relative;}
#uid4 #info	{background-image:url(../img/hausbesuch.jpg);}
#uid5 #info	{background-image:url(../img/op.jpg) ;}
#uid6 #info	{background-image:url(../img/checkup.jpg) ;}
#uid8 #info	{background-image:url(../img/team.jpg);}
#info		{background-image:url(../img/atosklinik.png);}

/*------------ Index Seite ---------------------------------
-----------------------------------------------------------*/
.col33	{float:left; width:32%; margin-right: 3%;}
.col32	{float:left; width:32%;}
.col68  {float:right; width:68%;}
.col28	{float:left; width:28%;}	
.m2	{margin: 0 1.5%;}
#col27	{float:right; width:28%; position:absolute; right:20px;}
.col50l	{float:left; width:43%;}
.col50r	{float:right; width:55%;}
.tel			{font-size:1.4em; color:#53a8d0; font-weight:bold; line-height:1.6em;}
.servicetelefon, 
#festnetz		{background:url(../img/telefon.png) left top no-repeat;}
#mobil			{background:url(../img/mobil.png) left top no-repeat;}
.servicetelefon h4,
#festnetz h4, 
#mobil h4		{margin-left:55px; height:50px;}
#anfahrt 		{width:290px; text-align:center;}
#anfahrt a		{background:url(../img/anfahrtskizze.png) left top no-repeat; padding:10px 2px 75px 2px; display:block; border:1px solid #53a8d0; height:25px;}
#anfahrt span		{font-size:0;}
#anfahrt a:hover	{background-image:url(../img/anfahrtskizze_over.png);}
#uid2 #col27 p#error	{margin:0; width:226px; padding:0; color:#000; background-color:#fff59b; text-align:center; position:absolute; top:50px;}

/*------------ ALLGEMEIN -----------------------------------
-----------------------------------------------------------*/
#start h2	{float:right; margin-top:100px; margin-right:80px;}
#motto		{color:#FFF; background:#a0bf39; width:345px; position:absolute; right:20px; top:100px; padding:10px 20px;}
#motto h2	{font-size:1.5em;}
#atos		{position:absolute; bottom:17px; right:50px;}
.clear 		{clear:both;}
.grau		{color:#535353; font-weight:bold;}
.floRight	{float:right; margin-left:15px; width:263px;}
.floRight p	{font-size:0.9em;}
/*------------ Alle Unterseite ------------------------------
-----------------------------------------------------------*/
#content	{margin: 0 240px 0 200px;;}
#colLeft	{float:left; width:200px; margin-left:-20px;}
#colRight	{float:right; width:220px;}

#content li		{background:url(../bg/liPfeil.png) left 6px no-repeat; padding-left:12px; margin-left:20px;}
#content #map_canvas	{ width: 478px; height: 300px; }
#content #directions	{ width: 478px; }
#content>img		{margin:20px;}

#colLeft ul		{padding:10px 0;}
#colLeft ul li		{display:block; background:#f8f8f8; color:#959595; border-left: 3px solid #c9c9c9; padding: 2px 2px 2px 15px; font-size:0.9em;}
#colLeft h4		{color:#53a8d0; font-weight:normal; background:#f8f8f8; text-align:center; padding:5px 0;}
#colLeft ul li a	{font-weight:bold;}

.col28 h1		{color:#53a8d0; font-weight:normal; background:#f8f8f8; text-align:center; padding:5px 0; text-transform: uppercase;}

.box		{display:block; background:#f8f8f8; padding-bottom:10px; margin-bottom:20px; border-right:1px solid #eaeaea; border-bottom:1px solid #eaeaea;}
.box h4		{background:#eee; display:block; color:#53a8d0; letter-spacing:1px; padding:6px 0; text-align:center;}
.box p		{padding:0 20px; font-size:0.9em; margin:0.5em 0;}
.box img	{margin:10px 0 0 0;}

.video		{text-align:center; margin-top:20px;}
.hinweis	{display:block; margin:20px; padding:8px 10px; background:url(../img/film.jpg) 5px 10px no-repeat; border:1px solid #dedede;}
.hinweis p	{padding-left:50px;}
.hinweis a	{font-weight:bold;}

.partner  	{border:1px solid #DFDFDF; float:left; margin-bottom:20px; padding:5px; width:100%;}
.partner img 	{float:right; margin-left:20px; }
/*------------ NAVIGATION-----------------------------------
-----------------------------------------------------------*/
ul#navi		{/*margin-left:160px; float:right;*/ padding:67px 10px 0 10px; }
ul#navi li	{display:inline;}
ul#navi li a:link,
ul#navi li a:visited	{color:#535353; padding:11px 7px 18px 0; text-transform:uppercase; font-size:11px; margin:0;}

ul#navi li a:hover, 
ul#navi li a:focus,
ul#navi li a:active,
ul#navi li a.active		{text-decoration:none; background: url(../bg/naviRight.png) right top no-repeat; color:#FFF;} 

ul#navi li a span		{font-weight:bold; padding:11px 0 18px 7px;}
ul#navi li a:hover span,
ul#navi li a:focus span,
ul#navi li a:active span,
ul#navi li a.active span	{background: url(../bg/naviLeft.png) top left no-repeat;}
/*------------ SPRACHAUSWAHL--------------------------------
-----------------------------------------------------------*/
#sprache	{position:absolute; top:20px; right:20px; font-size:0.9em;}
#sprache ul li 	{display:inline; margin-left:8px;}
#sprache ul li a	{color:#999;}
#sprache img 		{border:1px solid #fff;}
#sprache a:hover img	{border:1px solid #53a8d0;}
/*------------ FORMULAR Hausbesuch--------------------------
-----------------------------------------------------------*/
#uid2 #form		{background:url(../bg/bgForm.png) left top no-repeat; padding:15px 20px; color:#fff; height:330px}
#uid2 #form fieldset	{border:none 0;}
#uid2 #form h4		{color:#fff; text-transform:uppercase; text-align:center; margin-bottom:20px;}
#uid2 #form input,	
#uid2 #form textarea	{font-size:14px; margin-bottom:10px; width:218px; border:1px solid #707070; background:#f4f5f6; padding:2px 4px;}
#uid2 #submit		{float:right; font-size:1.4em; color:#3184aa; padding:0 10px; font-weight:bold; border:1px solid #3184AA; background:#F4F5F6; line-height:1.2em;}
#uid2 #submit:hover	{color:#fff; background:#53A8D0; border:1px solid #fff; cursor:pointer;}
#uid2 #col27 h2		{margin-top:50px; padding:20px; }
#uid2 #col27 p		{padding:0 20px;}

#uid2 a.infobox 	{color:#fff; font-weight:bold; text-decoration:none; padding:1px 3px; float:left; border:1px dotted #fff;}
#uid2 a.infobox:hover	{cursor:help; color:#c30; background:#fff; }
#uid2 a.infobox span	{visibility:hidden; position:absolute; left:-99em; margin-top:-19em; margin-left:-10em;; padding:1em; text-decoration:none; color:#000; }
#uid2 a.infobox:hover span, a.infobox:focus span, a.infobox:active span {visibility:visible; left:1em; border:2px solid #53A8D0; background:#fff59b; width:360px; text-align:justify;}

#colRight div.csc-textpic div.csc-textpic-single-image img {margin-left:20px; margin-top:10px;}
#content div.csc-textpic div.csc-textpic-single-image img {border:5px solid #F2F2F2;}
/*------------ FORMULAR Routenberechnung--------------------------
-----------------------------------------------------------*/
form #getDir {margin-left: 20px; margin-top:20px;}
form #getDir label, form #getDir input, form #getDir select	{display:block;}
form #getDir input, form #getDir select	{margin-top:1px; margin-bottom:8px; color:#666; border:1px solid #999; background:#F4F5F6;}
form #getDir label	{font-weight:bold;}
form #getDir input	{width:170px; padding:3px 2px;}
form #getDir select	{width:176px; padding:2px;}
form input#submit		{float:right; width:90px; color:#f1f1f1; font-weight:bold; border:1px solid #3184AA; background:#53A8D0 url(../bg/bgButton.png) left bottom repeat-x; line-height:1.2em; cursor:pointer; margin-right:5px;}
form input:hover#submit {background:#F4F5F6; color:#53A8D0; border:1px solid #999;}
#colLeft form fieldset	{border:0;}
/*------------ KONTAKTFORMULAR -----------------------------
-----------------------------------------------------------*/
#kontakt	{background:#F8F8F8; padding:20px; border-right:1px solid #eaeaea; border-bottom:1px solid #eaeaea;}
form .row	{clear:both;  margin-bottom:4px;}
form .row label	{float:left; padding-right:5px; text-align:right; width:100px;}
form .row input, form .row textarea	{width:250px; margin-left:5px;}
form .row input.medium	{width:191px;}
form .row input.small	{width:50px;}
/*------------ NEWS ----------------------------------------
-----------------------------------------------------------*/
hr {border:0;}
/* ------ news-latest-container -----*/
.news-latest-container h2 {
    background: #EEEEEE;
    color: #53A8D0;
    font-weight: normal;
    padding: 5px 0;
    text-align: center;
    font-size: 1em;
    text-transform: uppercase;
}
.news-latest-container h3,{
    color: #535353;
    font-size: 1.2em;
}
/* ----- news-list-item ------------*/
.news-list-item {
    margin:5px;
}
.news-list-item h3 {
    font-size: 1.2em;
}
.news-list-date {
    font-size:0.75em;
    color:#545454;
    display: block;
}
.news-list-item img {
    float:left;
    margin:8px 8px 8px 0;	
    border: 2px solid #DEDEDE;
}
.news-list-morelink {
    text-align: right;
    background: #F8F8F8;
    font-size: 0.9em;
}
/* ----- news-single-item -------------*/
.news-single-item h1 {
    color: #53A8D0;
    font-size: 1.4em;
    font-weight: bold;
    margin-bottom: 10px;
}
.news-single-item h2 {
    color: #535353;
    font-size: 1em;
    line-height: 1.4em;
    font-weight: bold;
}
.news-single-img {
    float: right;
    margin-left: 20px;
    margin-top: 0.5em;
}
.news-single-img a img {
    border: 4px solid #DEDEDE;
}
.news-single-img a:hover img {
    border: 4px solid #53A8D0;
}
.news-single-imgcaption {
    font-style: italic;
    width:135px;
}
/*------------ ABGERUNDETE ECKEN----------------------------
-----------------------------------------------------------*/
#main	{background:#fff url(../bg/bgTop.png) 0 0 no-repeat;}
/*
#main,
form	{
	-moz-border-radius:10px; 
	-webkit-border-radius:10px;
}
*/
#info, #start	{
	-moz-border-radius-bottomleft:10px; 
	-moz-border-radius-bottomright:10px;
	-webkit-border-bottom-left-radius: 10px;
	-webkit-border-bottom-right-radius:10px;
}

#print_kontakt{display:none;}
/*------------ ÄNDERUNG FÜR ARABISCH----------------------------
-----------------------------------------------------------*/
.ar .servicetelefon, 
.ar #festnetz		{background:url(../img/telefon.png) top right no-repeat;}
.ar #mobil		{background:url(../img/mobil.png) right top no-repeat;}
.ar .servicetelefon h4,
.ar #festnetz h4, 
.ar #mobil h4		{margin-right:55px; height:50px; margin-left:0px;}
.ar #colLeft ul li	{padding:2px 15px;}
.ar #content li 	{background:url("../bg/liPfeil.png") no-repeat scroll right 6px transparent; padding-right:12px;}