/* 
Datei       		: style.css für collmex.de 
Autor       		: Markus Baersch, gandke marketing & software gmbh 
Fassung vom		: 23.03.2015
*/


/*
2do 4 App:
textarea.fulltxt {width:555px; }
select.wtxt1 {min-width:206px; }
select.wtxt0 {min-width:96px; }
select.wtxt2 {min-width:156px; }
.wtxt1 {min-width:200px; }
.wtxt0 {min-width:90px; }
.wtxt2 {min-width:150px; }
*/


#stw { position: fixed; filter:alpha(opacity:0);-khtml-opacity:0;-moz-opacity:0;opacity:0; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; visibility: hidden; overflow: hidden; text-align: center; z-index: 99999999; background-color: #466E82; width: 32px; height: 32px; line-height: 30px; right: 10px; bottom: 10px; font-size:18px; color:#fff; text-decoration:none; -moz-border-radius:50%;-webkit-border-radius:50%;-o-border-radius:50%;border-radius:50%; 
-webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; }
#stw:hover { background-color: #11628B;filter:alpha(opacity:100);-khtml-opacity:1.0;-moz-opacity:1.0;opacity:1.0; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
#stw.show-stw { visibility:visible; cursor:pointer; filter:alpha(opacity:60);-khtml-opacity:0.6;-moz-opacity:0.6;opacity:0.6; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";}


@media all and (max-width: 1040px) {
.bg_teaser {padding-left:0;}
}


@media all and (max-width: 940px) {
.h_page { margin:0;  padding:0; width: 100%;}
#c_page { margin:0 1% 0 0;  padding:0; width: auto;}
#content { width: 65%; }
#sidebar { width: 20%; }
.bg_teaser, #maincnt {padding-left:1%;}
.dpage-tmain { width:74% }
#ipnav {width: 22%;}
#mnav {margin-left:1%!important; }
#mnav li { margin-right: 1.5em; }
#mnav li:last-child { margin-right: 0; }

.fronttext1 { width:48%; padding-right:1%; margin-right:1%;}
.fronttext2 { width:48%; }
.frontboxes {padding-top:2em; line-height:1.5em; font-size:1em;}
.fronttext {padding-top:3em; }
.frontbox {width:30%; margin-right: 1%; height:auto; min-height:110px;}
.frontbox:last-child {margin-right: 0;}
.ts-r, .ts-l {width: 48%;}
#ts-verein, #ts-rechnung, #ts-buchhaltung, #ts-paket {width: 100%;}
}


@media all and (max-width: 840px) {
#swnav { margin:0}
#ipnav ul { padding-left:0; }
#maincnt img, #maincnt iframe, #maincnt textarea, #maincnt pre, 
#maincnt input, #maincnt form, #maincnt table, #maincnt object {max-width:100%!important}
#maincnt img { height: auto!important; }
#CollmexIFrame {max-width:96%!important; overflow:scroll!important;}
#maincnt table.help { font-size:1em; display:block; width:auto; max-width:auto; overflow-y: hidden; overflow-x:scroll; }
}

@media all and (max-width: 750px) {
#loginform #Text1 {width: auto; }
#mnav {width:99%}
#tp { background: #466E82; height: auto; padding-bottom:10px; margin:0}
#swnav { padding-left:1%; width:99%; height:auto; overflow:visible; }
#swnav  li { height: auto; width: auto; }
#swnav  li a { padding-left:2em; padding-right:2em }
.feature { padding-right: 4em; }
}


@media all and (max-width: 700px) {
.frontbox {float:none; width:auto; margin:1em 1% 1em 0; background:none; border:none; border-bottom:1px solid #ccc;-moz-border-radius:0; border-radius:0; -webkit-border-radius:0; -o-border-radius:0; padding: 1em 0}
.bx-referenz, .bx-zertifikat, .bx-login {background-position:29em 90%}
a.herobtn {font-size:1em;}
.frontboxes {padding-top:0;}
#feature_nav {font-weight:normal;font-size:1em;}
}

@media all and (max-width: 639px) {
#ipnav, .dpage-tmain { width:auto; float:none }
.dpage-title {margin-bottom:1em; border-bottom:1px solid #466E82;}
#ipnav li.current a, #ipnav.lng, #ipnav { border:0; background-image:none; margin:0; }
#ipnav:before {content:"Navigation";display:block;font-size:1.6em;margin:1em 0 0.5em 0;color:#676767;}
#maincnt table { width:100%; margin:0; word-wrap:break-word; }
}

@media all and (max-width: 600px) {
#maincnt {background:#fff!important;}
#footer {padding: 2em 1em; color:#fff; background:#466E82; margin-left:-1%}
#footer a {color:#fff;}
.bg_teaser { height:auto;}
.ts-r {margin-right:1%}
.bg_teaser h2, .hdline { font-size: 1.2em;}
.tagline { border-bottom: 0; }
a.herobtn, a.herobtn:hover {font-size:1em; font-weight:normal; display:block; margin:0 6px;}
a.herobtn span {display:block; word-wrap:break-word;}
#imlogo {float:none!important}
#ipnav li {list-style-type:none; padding-left:36px; }
#ipnav li a {padding: 10px 0; display: block;  font-size:15px;  font-weight: normal;  text-decoration: none; color: #444; }
#ipnav li.current a, #ipnav li a:hover {font-weight: bold; color: #456d81;}
#mnav li.current a {color: #fff; margin-right:0; background-image: none; font-weight:bold; border-bottom:1px solid #fff;}

#mnav li a { padding: 3px 0.5em; }
li.mn-Home a,
li.mn-Produkte a,
li.mn-Kontakt a,
li.mn-Partner a,
li.mn-Sicherheit a,
li.mn-Service a {background-image: none; }

li#ip-paket,
li#ip-rechnung, 
li#ip-buchhaltung,
li#ip-verein,
li#ip-preise {background-size:auto;}

.fronttext {padding-top:1em; }
.fronttext1, .fronttext2 { float:none; width:auto; margin-right:1%; padding-right:0; border:0;}
#fnav {float:none; font-size:1.3em;}
a.testbtn { display:block; }
}

@media all and (max-width: 520px) {
.bx-referenz, .bx-zertifikat, .bx-login {background-position:95% 95%}
a.sw-paket, 
a.sw-rechnung, 
a.sw-buchhaltung,
a.sw-verein {background-image: none; }
#swnav li a  {font-weight:normal; padding:3px 1em; width:auto; height:auto; }
#swnav li.current a  {font-weight:bold;padding-bottom:0 }
#swnav li {border:0; width:auto; height:auto; padding:0; }
#bg_switch {height: auto}
#prefooter {display:none;}
.dpage-top { padding-bottom:0;}
.feature_toggle {position:relative;}
.feature { padding-right: 0; }
p.feature_detail {margin-left: 0;}
}

@media all and (max-width: 500px) {
#swnav li, #mnav li { font-size:0.9em; }
.dpage-timg { float:none; margin:0 0 2em 0; text-align:left!important;}
table.feature_table, th.feature_h  { font-size:0.9em; }
th.feature_table, th.feature_table_small { font-size:1em; }
#feature_nav a {padding: 0; white-space:nowrap; font-size:0.9em; overflow:hidden;padding-left:0;}
}

@media all and (max-width: 420px) {
a.herobtn span {background-image:none; padding-left:0;}
#feature_nav a {font-size:0.8em;}
}