/* ----------------------------------------------------------------------------------------------------------
    template von dirk-hoeschen für computer daten netze | feenders (www.feenders.de)
---------------------------------------------------------------------------------------------------------- */

body#mainbody {color: #444; background: #fff url(../images/body-bg.png) 0 0 repeat-x; width: 100%; padding: 0; margin: 0;height:100%; min-height:100%;}
#flower { position: absolute; top: 0; left: 0; width: 450px; height: 50px; background: #fff url(../images/flower.png) 0 0 no-repeat; }
#container {text-align:left;width: 1037px; padding: 0; 	margin: 0 auto;}
 	   
/* -- Layout -- */
div#wrapper {width: 1000px; overflow: hidden; text-align: left;}
#header {height: 205px; width: 1000px; background: transparent url('../images/header-center-bg.jpg') 200px 50px no-repeat;}
div#banner {position:  absolute; margin-top: 79px; margin-left: 234px; height: 126px; width: 533px; background: transparent 0 0 no-repeat;}
a#about {position:  absolute;  margin-left: 20px; margin-top: 115px; height: 70px; width: 138px; background: transparent url('../images/head-about.gif') 0 0 no-repeat;}
div#portrait {position:  absolute;  margin-left: 660px; margin-top: 47px; height: 157px; width: 109px; background: transparent url('../images/portrait.png') 0 0 no-repeat;}
*html div#portrait { background-image: url('../images/portrait.gif'); }
a#logo {position:  absolute; margin-left: 257px; margin-top: 130px; position: absolute; width: 221px; height: 56px;}
#logo img { background: transparent url('../images/peter-hacks-gesellschaft.png') 0 0 no-repeat;  width: 221px; height: 56px; }
*html #logo img { background: transparent url('../images/peter-hacks-gesellschaft.gif') 0 0 no-repeat;  width: 222px; height: 54px; }
#left {width: 200px; padding: 20px 0px; float: left; display: inline; }
#right {width: 200px;  padding: 20px 0px; float: right; display: inline;  }
#content {width: 500px; min-height: 660px; padding: 20px 50px; float: left; display: inline; overflow: visible; background: transparent url('../images/body-top.png') 0 0 no-repeat; line-height: 1.4em;}
#cwrapper {width: 600px; float: left; display: inline; overflow: visible; background: transparent url('../images/body-bottom.png') 0 100% no-repeat; }
#cfooter {width: 600px; float: left; display: inline; overflow: visible; }
#footer { width: 500px; float: left; display: inline; overflow: visible; padding: 0 50px; color: #888; font: 12px Arial, Helvetica, sans-serif; text-align: right; margin: 5px 0 40px 0;}
#footer a, #footer a:hover { color: #fff; text-decoration: none; }

/* Suche */
div#search {position:  absolute;  margin-left: 800px; margin-top: 155px;}
#mod-search-searchword {
    border-radius: 5px;
    height: 28px;
    width: 180px;
    line-height: 18px;
    padding: 0 10px;
    font: 12px Arial, Helvetica,
    sans-serif; color: #555;
}

div#header_right {position:  absolute;  margin-left: 800px; margin-top: 67px;}



/* Runde Modulboxen */
#left div.module, #right div.module { margin-top: 20px; padding: 0 15px; font-size: 0.95em; }
div.mcontent { font-size: 0.95em; }
#right .moduletable { margin-bottom: 15px; padding-bottom: 15px; background: transparent url('../images/moduleline.png') 50% 100% no-repeat; }
#right .moduletable:last-of-type { margin-bottom: 0; background: none; }
h3.module { font-size: 16px; padding: 0; }
div.module_round { width: 200px; background: url(../images/module-head-bg.png) 0 0 no-repeat; margin-bottom: 25px;}
div.module_round_top { width: 200px; background: url(../images/module-head-bg.png) 0 0 no-repeat;}
#left .mheader, #right .mheader { display:block; width: 164px; color: #fff !important; font-size: 14px; font-weight: bold; padding: 0 18px 0 18px; line-height: 26px; }
#left .mcontent, #right .mcontent { display:block; width: 168px; border: 1px solid #d7d7d7; border-bottom: 0px; background-color: #f2f2f2;  padding:  5px 15px; }
#left .menu .mcontent { padding:  0; width: 198px; }
#left .mfoot, #right .mfoot { display:block; width: 200px; height: 8px; background: url(../images/module-foot-bg.png) 0 100% no-repeat; font-size: 0px; line-height: 1px; min-height: 1px;}
.items-row {  padding-bottom: 20px; margin-bottom: 20px;  background: transparent url('../images/mainline.png') 50% 100% no-repeat; display: block; width: 100%; overflow: visible; }
.items-row:last-of-type { background: none; }
.contact-form .controls input, .contact-form .controls textarea { width: 90%; }


/* Definition des linken Menüs */
#left ul.menu { border-bottom: 1px solid #ccc; margin: 10px 0 0 0; }
#left ul.menu li { margin: 0; padding: 0; background-image: none; }
#left ul.menu li a { width: 162px; font-size: 16px; font-weight: bold; padding: 3px 18px 3px 18px; border-top: 1px solid #ccc; display: block; line-height: 22px; background-image: none;  color: #3B3B3B;}
#left ul.menu li a:HOVER { background-color: #3B5692; color: #fff; } 
#left ul.menu li.current>a { background-color: #e6e6e6; color: #000; }
#left ul.menu li ul { margin: 0; }
#left ul.menu li ul li a, #left ul.menu li#current ul li a { background:transparent url(../images/smalldot.gif) no-repeat 23px 50%; width: 147px; font-size: 14px; font-weight: normal; padding: 3px 18px 3px 33px; border-top: 1px solid #ccc; }
#left ul.menu li ul li a:HOVER, #left ul.menu li#current ul li a:HOVER { background-image: url(../images/smalldot2.gif); background-color: #3B5692; color: #fff; }
ul.menu li ul li#current a:HOVER { background-image: url(../images/smalldot.gif); }

/* Definition des oberen Menüs */
#topmenu { position:relative; float:right; margin-top: 5px; text-align: right;  margin-right: 5px; width: 400px;}
#topmenu ul { margin: 0; padding: 0; display: inline-block; padding-bottom: 5px; }
#topmenu ul li { display: inline-block; *display: inline;  background-image: none; margin: 0; padding: 0;}
#topmenu ul li a { font: 14px Arial, Helvetica, sans-serif; color: #666; padding: 2px 10px; border-right: 1px solid #ccc; background-image: none; }
#topmenu ul li a:hover {background-color: #F2F2F2; }

.readmore { text-align: right; clear: both;  display: block;  padding-top: 15px; }
.readmore:after {clear: both; display: block; content: " ";height: 0;	visibility: hidden;}
a.readon {  background: #F2F2F2 url(../images/arrow-normal.gif) no-repeat scroll 3px 50%; text-decoration:none; border: 1px solid #ccc; color:#3B3B3B; line-height: 18px; padding: 2px 5px 2px 23px;text-decoration:none; cursor: pointer; font-size:14px;}
a.readon:hover {background-image: url(../images/arrow-hover.gif);  background-color: #fff;}
a.arrow { background: transparent url('../images/arrow-blue.gif') 3px 50% no-repeat; padding: 3px 6px 3px  20px; }

a.sicon { display: inline-block; postion:relatic; margin: 0 0 0 10px; background: transparent; color: #3B3B3B; transition: color .6s ease; font-size: 22px; height: 22px; line-height: 22px; width: 22px;  }
a.sicon-fb:hover { color: #43609C; }
a.sicon-twitter:hover { color: #84bbf2; }
a.sicon-youtube:hover { color: #FF0000; }
a.sicon-instagram:hover { color: #666666; }

/* tooltips */
.tool-tip {background:#FFFFCC none repeat scroll 0 0;border:1px solid #D4D5AA;float:left;max-width:200px;padding:5px;}
.tool-title {background:transparent url(../images/selector-arrow.png) no-repeat scroll 0 0;font-size:100%;font-weight:bold;margin:-15px 0 0;padding:15px 0 5px;}
.tool-text {font-size:100%;margin:0;}

.inputbox, #right input { background:#FAFAFA url(../images/input-bg.png) repeat-x scroll 0 100%; border:1px solid #ccc; margin:2px 0; padding: 3px 2px; }
.inputbox:hover,.inputbox:focus,  #right input:focus , #right input:hover { background-color:#FFFFFF;	background-image:none; }	
.invalid { border-color:#bd0d00; }
label.invalid { color:#bd0d00; }
.button{background: #F2F2F2 url(../images/arrow-normal.gif) no-repeat scroll 3px 50%; text-decoration:none; border: 1px solid #ccc; color:#3B3B3B; display:block; line-height:30px; padding: 2px 5px 2px 23px;text-decoration:none; cursor: pointer; font-size:14px;}
.button:hover {background-image: url(../images/arrow-hover.gif); background-color: #fff;}

#userdropdown .controls { display: block }
#userdropdown #login-remember { float: left; margin-right: 10px;  }
#userdropdown .controls .control-label { display: inline; }

span.article_separator { display:block; width: 100%; height: 25px; }
.column_separator { padding-left: 10px; margin-left: 10px; }
table.blog, table.contentpaneopen { width: 100%; }
table.archiv { margin: 5px 0; }          
td.contentheading.archiv { border-bottom: 1px solid #ccc; border-left: none; border-right: none; padding: 5px 0;}
.componentheading { display:block; font-size: 1.5em; margin: 0 0 10px 0; width: 100%; }
.blue { color: #3b5692; }
div.datum { display: block; width: 95%; background-color: #f4f4f4; margin: 15px 0 3px 0; text-align: right; padding: 2px 10px; border-top: 1px solid #ccc;}

/** breiter content */
#cfooter.full { width: 700px; }
#cfooter.full #content { width: 700px; background-image: url("../images/body-full.png") }
#cfooter.full #cwrapper {width: 800px; background-image: url('../images/body-bottom-full.png') }

.clear { clear: both; }
a img { border: none;}
.zitat {font:14px Georgia, "Times New Roman", Times, serif; font-style:italic;  margin: 5px 0 15px 0; padding: 5px 0; border: 1px solid #c6c6c6; border-left: none; border-right: none; }
.gedicht {font:14px Georgia, "Times New Roman", Times, serif; font-style:italic;  margin: 0; padding: 0 0 5px 20px; text-align:center; border-left: none; border-right: none; }
div.trenner { display:block; width: 100%; height: 1px; background: transparent url('../images/mainline.png') 50% 50% no-repeat;  margin: 10px 0; line-height: 1px; overflow:hidden; }
img.border {border: 1px solid #E5E5E5; padding: 2px; }
#right img.border {border: 1px solid #E5E5E5; margin: 5px 0 10px 0; padding: 0;}
.img_caption p { clear: both; margin: 0; padding: 5px; font: 11px Arial, Helvetica, sans-serif; text-align: left; color: #666666; }
img.unterschrift { padding: 1px;border: 1px solid #E5E5E5; }
img.shadow { background: url(../images/shadow.gif) no-repeat right bottom; padding: 0px 6px 6px 0px; border: #f2f2f2 1px solid;	border-right:none; border-bottom:none; }

/* Clearfix */
.clearfix:after {clear: both; display: block; content: " ";height: 0;	visibility: hidden;}
* html > body .clearfix {width: 100%;display: block;}
* html .clearfix {height: 1%;}

video {
    width:100%;
    max-width:500px;
    height:auto;
}