* { margin: 0; padding: 0; }
body { font-family: Arial, Helvetica, sans-serif; font-size: 0.85em; color: #333; }
a { color: #003366; }
a:hover { color: #ff7f00; }
a img { border: none; }
a.referenzen { display: none; }

h1 { font-family:"Trebuchet MS", Verdana, Geneva, Arial, sans-serif; font-size: 1.95em;  font-weight: normal; margin: 0.5em 0 0.5em 0; }
h1 span { color: #015f95; }
h2 { font-size: 1.2em; margin: 1em 0 0.5em 0; }
h2 a { text-decoration: none; }
h3 { font-size: 1.2em; line-height: 1.5em; margin: 1em 0 0.5em 0; font-weight: normal; }
p { margin: 0.5em 0; padding:0; }
ul { margin-left: 16px; list-style: none; margin: 0.5em 0; }
ol { margin: 1em 0 1em 20px; }
ul li { margin-bottom: 0.2em; }
hr {
    color: #dfdfdf;
    background: #dfdfdf;
    border:none;
    height:1px;
}

.big { font-size: 1.15em; line-height: 1.5em; }
.light { color: #666; font-size: 0.9em; }
.overlay { position: absolute; top:0; right:0; display:none; }

/* Clearfix */
.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix { display: inline-block; }
html[xmlns] .clearfix { display: block; }
* html .clearfix { height: 1%; }
.cf:before,
.cf:after {
    content:"";
    display:table;
}

.cf:after {
    clear:both;
}

/* Button */
.button { 
    border: none;
    text-decoration: none;
    text-align: center;
    font-size: 14px;
    color: #fff; 
    background: #fb7f00;
    background: linear-gradient(#ff8703 0%, #fb7f00 50%, #eb6d00 50%, #e36600 100%);
    background: -moz-linear-gradient(#ff8703 0%, #fb7f00 50%, #eb6d00 50%, #e36600 100%);
    background: -webkit-linear-gradient(#ff8703 0%, #fb7f00 50%, #eb6d00 50%, #e36600 100%);
    background: -ms-linear-gradient(#ff8703 0%, #fb7f00 50%, #eb6d00 50%, #e36600 100%);
    background: -o-linear-gradient(#ff8703 0%, #fb7f00 50%, #eb6d00 50%, #e36600 100%);
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    border-radius: 3px;
    vertical-align: top;
    border: 1px solid #f0ab71;
    border-color: #f0ab71 #954200 #954200 #f0ab71;
    text-shadow: 0 -1px 1px #666666;
    box-shadow: 1px 1px 3px #999;
    line-height: 18px;
    height: 32px;
    cursor: pointer;
    display: inline-block;
    padding: 6px 12px; 
    margin: 0;
}
.button:hover { text-decoration: underline; color: #fff; }
.buttonWhite { background: url(/images/webcard/buttonWhiteBg.jpg) no-repeat; }
.buttonGrey { background: url(/images/webcard/bezahlen.jpg) no-repeat; width: 174px; height: 14px; padding: 6px; margin-top:6px; }
input.button { width: 286px; height: 41px; font-size: 0.9em; padding: 11px; }
.button.large { 
    font-size:1.5em;
    font-weight:normal;
    height:36px;
    line-height:26px;
    padding:4px 0;
    width:336px;
    color: #fff; 
    box-shadow: none;
}
.button.small {
    height: 22px;
    font-size: 1em;
    line-height: 14px;
    padding: 4px 10px;
    box-shadow: none;
    border: none;
}
.button.large:hover { text-decoration: underline; cursor: pointer; }
input.button:hover { text-decoration: underline; cursor: pointer; }
.button.buttonPayment { height: 35px; padding: 0; font-size: 1.4em; box-shadow: none; }
.button.buttonPayment.disabled {background: #aaa; }
.button.buttonPayment.disabled:hover { text-decoration: none; cursor: default; }
#welcomeButton { display: block; background: url(/images/webcard/welcomeButton.jpg) no-repeat; color: #fff; font-size: 1.5em; padding-top: 8px; width: 172px; height: 27px; text-align: center; text-decoration: none; }
#welcomeButton:hover { text-decoration: underline; }


/* ################### AREAS ############### */
#wrapper { width: 864px; margin: 0 auto; background: #fff; }
#header { height: 77px; padding: 28px 16px 0 16px; }
#header_content { height: 54px; font-family:"Trebuchet MS", Verdana, Geneva, Arial, sans-serif; }
#header_content h1, #header_content h2 { text-shadow:1px 2px #DDDDDD; }
#login { float:right; padding-top: 8px; }
#login input { width: 100px; }
#login input.login { background: url(/images/webcard/login.jpg) no-repeat; width: 66px; height: 21px; border:none; color: #fff; font-weight: bold; }
#logo { height: 32px; font-size: 30px; font-weight: bold; }
#logo a { color: #ff7f00; text-decoration: none; }
#logo span { color: #015f95; font-size: 30px; }
#header_content h1 { margin:0; }
#header_content h2 { padding-left: 70px; font-size: 0.9em; margin-top:4px; font-weight: normal; }
.clear { clear: both; font-size: 0; height:0; line-height:0; text-indent: -999em; }
.clear_l { clear: left; font-size: 0; height:0; line-height:0; text-indent: -999em; }
.clear_r { clear:right; font-size: 0; height:0; line-height:0; text-indent: -999em; }
#content { 
    margin: 0;
    line-height: 1.33em;
    text-align: justify;
}

#brands { margin: 16px 0; }
#content_wrapper { }
#footer { padding-top: 6px; width: 840px; margin: 0 auto; font-size: 0.9em; }
#footer_content { padding: 4px 0; }
.text { margin-top: 2em; font-size: 1.15em; }
.text a { color: #777; text-decoration: none; }
.text a:hover { text-decoration: underline; }
.text strong { font-size: 1.15em; font-weight: normal; }
.text li { float: left; color: #999; width: 400px; margin: 4px 10px; }

h2.partner { margin-left: 10px; color: #777; }
ul.partner { list-style: none; margin-left: 10px; margin-bottom: 2em; }
ul.partner li {
    background: url(/images/webcard/add.png) no-repeat left center;
    padding-left: 16px;
    float: left; width: 22%;
    margin-bottom: 1em;
}
ul.partner li a {
    color: #777;
    text-decoration: none;
}
ul.partner li a:hover{
    text-decoration: underline;
}

/* ################## MENU ##################### */
.menu { margin:0 0 0 0; }
.menu ul { width: 100%; background: url(/images/webcard/menuItemBg.jpg) repeat-x 0 -26px; height: 26px; font-size: 0.9em; margin:0; }
.menu li { float: left; margin-bottom:0; height: 26px; }
.menu li.last { float: right; text-align: right; background: url(/images/webcard/menuBgRight.jpg) no-repeat right; padding-right: 11px; }
.menu li a { float: left; display: block; height: 17px; padding: 4px 13px; color: #fff; text-decoration: none; border: 1px solid #03c2d5; border-color: transparent #005f99 #03c2d5 #0d4365; border-width: 0 1px 0 1px; }
.menu li a:hover { background: url(/images/webcard/menuBgHover.jpg) no-repeat center bottom; }
.menu li.active a { background: url(/images/webcard/menuItemBg.jpg) repeat-x 0 0; height: 18px; text-decoration: none; border-color: #009bdb #03c2d4; border-width: 0 1px 0 1px; margin: 0 -1px; }
.menu li.first { background: url(/images/webcard/menuBgLeft.jpg) no-repeat 0 -26px; padding-left: 8px; }
.menu li.first a { border-left: none; }
.menu li.first.active { background-position: 0 0; }
.menu li.first.active a { border-left-width: 0; margin-left: 0; }
.menu .erstellen { float: right; border: none; }

#menuOrange { float: right; padding-top: 16px; margin-bottom:0; }
#menuOrange li { background: url(/images/webcard/b_left.jpg) no-repeat left; padding-left: 9px; height: 21px; float:left; margin-right: 6px; }
#menuOrange li a { background: url(/images/webcard/b_right.jpg) no-repeat right; color: #fff; height: 20px; display: block; float:left; padding: 1px 15px 0 6px; text-decoration: underline; }

/* ############### ORDER ################ */
#openings table tr.bottom td { padding-bottom: 10px; }
#openings table td { padding: 1px 10px 0 0; }

.layoutItem { width: 200px; margin: 16px; float:left; }

/* ############## CONTENT ################### */
#content .slogan { font-size: 1.3em; color: #666; font-style: italic; text-align: center; }
.shadow_bottom { display: block; width: 746px; background: url(/images/shadow_bottom.png) repeat-x; }
#content .infoList { list-style: none; margin-left: 0; }
#content .infoList li {
    background: url(/images/webcard/haken.png) no-repeat 0 4px;
    padding-left: 30px;
    margin-bottom: 12px;
}
a.ausprobieren:hover { text-decoration: underline; }
.erstellenButton {
    display:block;
    width:219px; height:20px;
    color:#fff; font-size:1.3em; text-align:center; font-family:Arial,Helvetica,sans-serif;
    padding:6px 4px;
    background: url(/images/webcard/startseiteButtonBg.jpg) no-repeat;
}
a.erstellenButton:hover { color: #ffff00; }
.erstellenButton.blue { background: url(/images/webcard/startseiteButtonBlue.jpg) no-repeat; }
.erstellenButton.blue:hover { color: #33ccff; }

.weiterButton { 
    display:block; width:150px; height:16px; 
    color:#fff; font-size:1em; text-align:center; font-family:Arial,Helvetica,sans-serif;
    padding:3px; 
    background:url(/images/webcard/weiterButtonBg.jpg) no-repeat; 
}
a.weiterButton:hover { color: #c30; }

/* Startseite */
ul.vorteile { background-color:#f4f4f4;margin:0 1px;list-style:none; padding:12px; font-size:0.95em; }
ul.vorteile li { background:url(/images/webcard/gruener-haken.jpg) no-repeat left top; padding-left:20px; }

/* Leistungen */
.success dd { margin-left: 140px; padding: 5px 0; }
.success h3 { margin-top: 0; }

.testimonials { }
.testimonials .testimonial { margin-bottom: 50px; }
.testimonials .testimonial h2 { font-size: 1.3em; text-align: left; margin: 0.25em 0pt; }
.testimonials .testimonial .pic { float: right; margin-left: 10px; }
.testimonials .testimonial .text { background: url(/images/webcard/testimonial/quotes.png) no-repeat top left; margin:0; padding-left: 46px; font-size: 1.2em; line-height: 1.6em; font-style: italic; }
.testimonials .testimonial .rating { float: right; font-size: 0.75em; color: #fff; }
.testimonials .testimonial a { text-decoration: none; }
.testimonials .testimonial .company { font-size: 0.75em; text-decoration: none; }
.hreview-aggregate { display: none; }

.press { width: 200px; float: right; padding: 5px; }
.press img { width: 200px; }
.press h2 { font-size: 1.2em; margin: 0.25em 0; }

/* Beispiele */
.beispiele_bg { background: url(/images/webcard/beispieleBg.jpg) no-repeat bottom; height: 227px; }
.check { height: 227px; margin:0; }
.check li { background: url(/images/webcard/check.png) no-repeat left; height: 26px; padding: 10px 0 0 34px; color: #fff; font-size: 1.23em; }

div#beispiele a { display: block; float:left; margin-right: 3px; }
div#beispiele a div { float:left; margin-right:16px; }
div.beispiel { display: none; margin-top: 1em; }
div.beispiel div { float: left; margin-right: 16px; }
div.beispiel h2 { margin-top: 0; }
div.beispiel ul { margin-left: 360px; }

ul.beispieleKunden { list-style: none; margin: 0; }
ul.beispieleKunden li { float: left; margin: 15px; }
ul.beispieleKunden li a { display: block; width: 150px; height: 113px; padding: 5px; border: 1px solid #ccc; }
ul.beispieleKunden li a:hover { border-color: #fc0; }

/* Preise */
.check2 li { background: url(/images/webcard/check.jpg) no-repeat left; height: 22px; padding: 6px 0 0 28px; float: left; width: 233px; font-size: 1em; }
.check2 li.price { padding-left: 0; color: #0073b6; background: none; }
.check2 .fail { background: url(/images/fail.gif) no-repeat 4px center; }

.priceList { color: #fff; font-size: 1.25em; }
.priceList li { padding: 8px 10px 12px 32px; height: 16px; margin:0; background: url(/images/webcard/priceBg.png) no-repeat 0 -36px; }
* html .priceList li { background: none; }
* html .priceList .active { background: url(/images/webcard/priceBg.png) no-repeat 0 0; }
.priceList .price { float: right; }
.priceList .active { background-position: 0 0; }

.featureList { border-top: 1px solid #ccc; border-left: 1px solid #fcfcfc; border-right: 1px solid #f0f0f0; }
.featureList td { padding: 12px 4px; }
.featureList .col1, .featureList .col3 { background-color: #f5f5f5; text-align: center; }
.featureList .col2, .featureList .col4 { background-color: #fff6e6; }
.featureList .col1 { width: 160px; border: 1px solid #ccc; border-color: #ebebeb #dedede #ccc #ccc; }
.featureList .col2 { width: 166px; border: 1px solid #ccc; border-color: #ebebeb #dedede #ccc #ccc; border-left-width: 0; text-align: center; }
.featureList .col3 { width: 159px; border: 1px solid #ccc; border-color: #ebebeb #dedede #ccc #ccc; border-left-width: 0; }
.featureList .col4 { width: 250px; padding-left: 12px; border: 1px solid #ccc; border-color: #ebebeb #ccc #ccc #ccc; border-left-width: 0; font-size: 1.1em; }
.featureList .col4 .light { font-size:0.8em; }

/* erstellen */
.desc { font-size: 1.05em; color: #fff; margin-top: 40px; }

/* Hilfe */
dl.faq_list dt {
    background: none repeat scroll 0 0 #F6F6F6;
    border: 1px solid #eee;
    color: #033366;
    display: block;
    font-size: 1.1em;
    font-weight: bold;
    margin: 1em 0 0;
    padding: 0.5em 1em;
    float: none;
    width: auto;
}
dl.faq_list dt a { text-decoration: none; }
dl.faq_list dd {
    border: 1px solid #eee;
    border-width: 0 1px 1px;
    margin: 0;
    display: none;
    padding: 0.5em 1em;
    width: auto;
}
dl.faq_list dd.faq_shown {
    display: block;
}
dl.faq_list .faq_top { text-align: right; }

/* Intern */
table.subint_menu td .a {
    color:#FF7F00;
    display:block;
    font-size:1.7em;
    margin-bottom:0.2em;
}
table.subint_menu td a:hover {
    color:#FF7F00;
}
table.subint_menu td {
    color:#666666;
    font-size:0.8em;
    line-height:1.2em;
    padding:0 2px;
}

.green { padding: 6px; margin-bottom: 1em; background: #8efbab; border-bottom: 2px solid #1c7e36; }
.red { padding: 6px; margin-bottom: 1em; background: #f7b5b5; border-bottom: 2px solid #cc0000; }

/* ################# FORMS ########################## */
dl { margin: 1em 0 1.2em 0; list-style: none; }
dt { float:left; font-size: 1em; width: 120px; }
dl.wide dt { width: 180px; }
dl.wide dd { margin-left: 180px; }
dd { margin-bottom: 10px; font-size: 0.9em; margin-left: 120px; }
* html dd { margin-left: 0; }
*+html dd { margin-left: 0; }
.addr, .addr input, .chk { display: none; }
dd input[type=text], dd input[type=password], textarea {
    border:1px solid #A29276;
    padding:1px;
    -moz-border-radius:3px;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    background-color: #fff;
}
dd input[type=text], dd input[type=password] {
    height: 17px;
}
dd input[type=text]:focus, dd input[type=password]:focus, textarea:focus {
    border-color: #fe765e;
}
dd input[type=submit] { padding: 0 16px; }
dd em { color: #666; }
#content .error, #content .error_list {
    padding: 1px 3px;
    margin-bottom: 6px;
    background-color: #ad0000; 
    border: 1px solid #ccc;
    -moz-border-radius: 4px;
    color: #fff;
}
form#loginForm input { 
    font-size: 0.8em;
    padding:2px;
}
input.hasDefault { 
    color: #999;
}

/* #################### TABLES ######################### */
table.bill { width: 100%; background: #fff; }
table.bill th { background-color: #015f95; color: #fff; }
table.bill th, table.bill td { padding: 2px; }
table.bill td { background: #eee; }
table.bill tr.row1 td { background: #E8F2F7; }
table.bill tr.row2 td { background: #F7F7F7; }
table.bill tr.error td { background: #fcc; color: #000; }

table.bill.vtop td { vertical-align: top; }

table.prices { background: #fff; width: 253px; }
table.prices th { background: #015f95; color: #fff; padding: 4px; }
table.prices td { padding: 4px; }
table.prices tr.row1 td { background: #E8F2F7; }
table.prices tr.row2 td { background: #F7F7F7; }

table.bill td.price, table.prices td.price { text-align: right; padding-right: 10px; }

table.leistungen { width: 100%; text-align:left; }
table.leistungen tr td { padding: 12px 0; }
table.leistungen tr td.icon { width: 60px; }
table.leistungen tr td.label { padding-right: 22px; width: 160px; }
.leistungen h3 { margin:0; font-size: 1.1em; }


#imgContainer img { position: absolute; top:-40px; }

/* Overlay */
div.overlay { 
    background-image:url(/images/webcard/overlay/white.png); 
    width:470px; 
    height:366px;         
    display:none; 
    padding:28px; 
} 
div.overlay div.close { 
    background-image:url(/images/webcard/overlay/close.png); 
    position:absolute; 
    right:5px; 
    top:5px; 
    cursor:pointer; 
    height:35px; 
    width:35px; 
}

/* Referenzen */
ul.referenzen { list-style: none; }
ul.referenzen li { float:left; margin-right: 1em; font-size: 0.65em; }

.testInfo td { padding: 0.5em 0; }


/* ############### IE FIX ############################# */
* html .hollyhack {
    height: 1%;
}

/* ########## jQuery Autocomplete ######## */
.ac_results { padding: 0px; border: 1px solid black; background-color: white; overflow: hidden; z-index: 99999; } 
.ac_results ul { width: 100%; list-style-position: outside; list-style: none; padding: 0; margin: 0; }
.ac_results li { margin: 0px; padding: 2px 5px; cursor: default; display: block; font: menu; line-height: 16px; overflow: hidden; }
.ac_loading { background: white url('indicator.gif') right center no-repeat; }
.ac_odd { background-color: #eee; }
.ac_over { background-color: #0A246A; color: white; }

/* Startpage */
#panel { background: url(/images/webcard/topBoxBgShort.jpg) no-repeat; color: #fff; padding: 16px 36px; position: relative; width: 806px; }
.index #panel, #panel.start { padding: 16px 30px 20px; }
.index #panel, .beispiele #panel, .tarife #panel, .erstellen #panel, .baukasten #panel, .webseite #panel, #panel.large { background-image: url(/images/webcard/topBoxBg.jpg); height:  }
.beispiele #panel { padding-bottom:0; }
#panel .sub { font-size: 1em; }
#panel h1 { margin:  0.3em 0 0.5em 0; font-size: 1.7em; }
#panel h2 { font-weight: normal; text-align: center; font-size: 1.8em; margin-bottom:1em;  }
#panel h1, #panel h2 { text-shadow: 0 1px 2px #444; }
#panel a { color: #fff; }
#panel .clear { background: url(/images/webcard/topBoxBottom.png) no-repeat; height: 6px; width: 864px; position: absolute; left: 0; bottom: 0; }
#panel #screens { float: right; width: 386px; height: 300px; padding: 6px 0 0 12px; position: relative; }
.panel_mini { background: url(/images/webcard/topBoxMini.jpg) no-repeat 1px 0; height: 8px; font-size:0.01pt; }
#screens .screen { list-style: none; }
#screens .screen li { display: none; width: 386px; height: 278px; background: url(/images/webcard/lp/examples.png) no-repeat 0 0; }
#screens .screen li.exp2 { background-position: 0 -278px; }
#screens .screen li.exp3 { background-position: 0 -556px; }
#screens .screen li.exp4 { background-position: 0 -834px; /*background-image:url(/images/webcard/lp/examples2.jpg);*/ }
#screens .screen li.first { display: block; }
#video_container { float: left; padding-top: 24px; }
.mirror { background: url(/images/webcard/reflection.jpg) no-repeat; position: absolute; top: 295px; left: 8px; width: 376px; height: 22px; }

h2.teaser { text-align: center; font-size: 2.5em; margin: 1em 0; font-weight: normal; }
h3.teaser { font-size: 1.3em; text-align: center; }
.index #panel h1, .erstellen #panel h1, #panel.large h1 { font-size: 3.2em; text-align: center; }
.beispiele #panel h1 { font-size: 1.7em; text-align: left; }
a.wideButton { background: url(/images/webcard/lp/buttonBg.png) no-repeat; display: block; width: 700px; height: 35px; color: #fff; text-shadow: -1px -1px 0 #666; margin: 1.5em auto; text-align: center; font-size: 1.3em; line-height: 35px; text-decoration: none; }
a.wideButton:hover { background-position: 0 -35px; }

#buildForm { float: right; }
#buildForm dl { margin:0; }
#buildForm dt { float: none; width: auto; font-size: 1.2em; padding-bottom: 6px; }
#buildForm dd { margin-left:0; padding-bottom: 6px; min-height: 21px; }
#buildForm dd input { width: 302px; background: url(/images/webcard/fieldBg.png) repeat-x; border: 1px solid #333; height: 31px; font-size: 1.4em; border-radius: 0; padding: 1px 4px; }
#buildForm dd input:focus { box-shadow: 0 0 10px #0cf; }
#buildForm .button.large { width: 310px; text-shadow: 0 -1px 0 #444; line-height: 24px; }
#buildForm .agb { margin:0 0 12px 0; }

#info { background: url(/images/webcard/shadedBoxBottom.jpg) no-repeat bottom; padding: 12px 40px 28px 40px; }

ul.green_checks { margin-bottom: 0; }
ul.green_checks li { margin-bottom: 0.8em; background: url(/images/webcard/startseiteHaken.jpg) no-repeat left center; color: #244d76; padding-left: 30px; line-height: 1.33em; }

ul.subtitles { list-style: none; background: url(/images/webcard/subtitlesBg.png) no-repeat; padding: 16px 0 0 16px; }
ul.subtitles li { background: url(/images/webcard/interface/icon-domain.jpg) no-repeat; padding: 10px 0 8px 60px; margin-bottom: 1em; font-size: 1.1em; }
ul.subtitles .light { font-size: 0.75em; }

.pdf { background: url(/images/webcard/pdf.png) no-repeat scroll 0 6px; padding: 0 0 12px 54px; }

textarea.hasDefault { color: #999; }

/* Floats */
.col-3 { float: left; width: 214px; margin: 0 23px; }
.left245 { float: left; width: 245px; margin-right: 16px; margin-bottom: 1em; }
.right245 { float: left; width: 245px; margin-bottom: 1em; }
.left360 { float:left; width: 360px; }
.right360 { margin-left: 365px; }
.left374 { float: left; width: 374px; }
.right374 { margin-left: 418px; }
.left450 { float: left; width: 450px; }
.right450 { margin-left: 450px; }
.left540 { float: left; width: 540px; }
.right540 { margin-left: 550px; }

/**
 * jQuery lightBox plugin
 * This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
 * and adapted to me for use like a plugin from jQuery.
 * @name jquery-lightbox-0.5.css
 * @author Leandro Vieira Pinho - http://leandrovieira.com
 * @version 0.5
 * @date April 11, 2008
 * @category jQuery plugin
 * @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
 * @license CC Attribution-No Derivative Works 2.5 Brazil - http://creativecommons.org/licenses/by-nd/2.5/br/deed.en_US
 * @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
 */
#jquery-overlay { position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; }
#jquery-lightbox { position: absolute; top: 0; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0; }
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box { position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#lightbox-container-image { padding: 10px; }
#lightbox-loading { position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#lightbox-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext { width: 49%; height: 100%; zoom: 1; display: block; }
#lightbox-nav-btnPrev { left: 0; float: left; }
#lightbox-nav-btnNext { right: 0; float: right; }
#lightbox-container-image-data-box { font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%; padding: 0 10px 0; }
#lightbox-container-image-data { padding: 0 10px; color: #666; }
#lightbox-container-image-data #lightbox-image-details { width: 70%; float: left; text-align: left; }	
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber { display: block; clear: left; padding-bottom: 1.0em; }			
#lightbox-secNav-btnClose { width: 66px; float: right; padding-bottom: 0.7em; }

/* Accordion */
.accordion .slide h3 {
    background: url(/images/webcard/arrowRight.gif) -moz-linear-gradient(#FFFFFF, #F1F1F1) repeat scroll 0 0 #EEEEEE;
    border: 1px solid #CCCCCC;
    color: #222222;
    font-weight: bold;
    text-shadow: 0 1px 0 #FFFFFF;
}
.accordion .slide { background: }
.accordion .slide.open {

}

/* Popup Bubbles */
.bubble-container { padding: 11px; background: transparent; position: absolute; top: 30px; left: 6px; font-family: Arial, sans-serif; font-weight: normal; font-style: normal; }
.bubble { background: #0070A5; border: 5px solid #4094BC; border-radius: 10px; color: #fff; font-size: 14px; width: 400px; box-shadow: 1px 1px 4px #444; overflow: visible; }
.bubble-arrow { width: 26px; height: 26px; position: absolute; background-repeat: no-repeat; background-color: transparent; background-position: top left; }
.bubble-arrow-bottom, .bubble-arrow-bottomcenter, .bubble-arrow-bottomright { background-image: url(/images/webcard/interface/bubble/arrow-bottom.png); position: absolute; top:0; }
.bubble-arrow-bottomright { right: 40px; }
.bubble-arrow-bottomcenter { left: 50%; }
.bubble-arrow-bottom { left: 20px; }
.bubble-arrow-top { background-image: url(/images/webcard/interface/bubble/arrow-top.png); bottom:-10px; left: 20px; }
.bubble-arrow-left { background-image: url(/images/webcard/interface/bubble/arrow-right.png); right: -10px; }
.bubble-arrow-right { background-image: url(/images/webcard/interface/bubble/arrow-left.png); left:0; top: 18px; }
.bubble-content { padding: 6px; line-height: 20px; }
.bubble-content .light { font-size: 0.9em; color: #dedede; }
.bubble-content a { color: #fff; text-decoration: underline; }
.bubble-close { background: url("/images/webcard/interface/bubble/close.png") repeat scroll 0 0 transparent;
		font-size: 0;
		height: 22px;
		position: absolute;
		right: 6px;
		text-indent: -999em;
		top: 6px;
		width: 22px;
}

/* Domain Alerts */
.domainMsg { margin-top:0.3em;font-size:0.8em;display:none;}
.domainAlert { color:#ff0000; padding-left: 40px; }
.domainExists { color:#ff0000; }
.domainFast { color:#fff; display: block; }
.domainOk { color:#9f0; }
.domainOk img { height: 18px;display:block;width:18px;float:left; margin-right: 6px; }

/* Payment Boxes */
.payment h2 { font-weight: normal; font-size: 1.5em; margin: 1.5em 0 1em 0; }
.payment .box { background: #E8F2F7; border: 1px solid #ccc; padding: 6px; border-radius: 8px; }
.payment .billBox { background: #fffcf3; border: 1px solid #ffdb94; padding: 10px; margin-top: 20px; border-radius: 8px; }
.payment .circle {
    background:#00a2dc; display:block; float:left;
    width:26px;height:26px;line-height:26px;
    padding:0px;text-align:center;font-size:18px;margin-right:10px;margin-top:-4px;
    border-radius:26px;-moz-border-radius:26px;-webkit-border-radius:26px;-o-border-radus:26px;color:#fff;
}
.paymentPrice, .paymentMethod { background: #E8F2F7; border: 1px solid #CCCCCC; padding: 12px 20px; border-collapse: collapse; margin-top: -1px; position: relative; z-index: 1; }
.paymentPrice { cursor: pointer; }
.paymentPrice.top, .paymentMethod.top { border-radius: 8px 8px 0 0; }
.paymentPrice.bottom, .paymentMethod.bottom { border-radius: 0 0 8px 8px; margin-bottom: 1em; }
.paymentPrice.best, .paymentMethod.best { background: #e0fce3; padding: 20px; border-color: #79cf76; z-index: 2; }
.paymentPrice table { width: 100%; }
.paymentPrice table .col1 { width: 40px; }
.paymentPrice table .col2 { width: 100px; }
.paymentPrice table .col4 { width: 250px; }
.paymentPrice .textRed { color: #ff0000; font-weight: bold; }
.paymentPrice .textGreen { color: #009900; font-weight: bold; }
.paymentPrice .textGrey { color: #666666; font-weight: normal; }
.paymentAdditional dt, .paymentMethodForm dt { text-align: right; padding-top: 4px; width: 150px; }
.paymentAdditional dd, .paymentMethodForm dd { margin-left: 160px; }
.paymentAdditional label, .paymentMethodForm label { font-size: 1.15em; }
.paymentAdditional input[type="text"], .paymentAdditional select, .paymentMethodForm input[type="text"], .paymentMethodForm select { background: url(/images/webcard/fieldBg.png) repeat-x scroll 0 0 transparent; border: 1px solid #333333; border-radius: 0 0 0 0; font-size: 1.2em; height: 27px; padding: 1px 4px; width: 260px; }
.paymentAdditional select, .paymentMethodForm select { width: 270px; padding: 3px; }
.paymentAdditional .check, .paymentAdditional .fail {
    display: none;
    width: 31px;
    height: 31px;
    vertical-align: top;
}
.paymentAdditional .check { background: url(/images/webcard/check2.png) no-repeat center; }
.paymentAdditional .fail { background: url(/images/fail.gif) no-repeat center; }
.creditCardExpire select { width: 130px; margin-right: 6px; }
.paymentMethod td { padding-right: 8px; }
.paymentMethodName { font-size: 1.15em; }
#creditCardCvc2 { width: 60px; }

.ui-dialog {
    box-shadow: 0 0 10px #444;
}

/* Welcome screen / Plan and domain chooser */
#welcome {
    background: url(/images/webcard/welcomeBg.jpg) repeat-x;
    box-shadow: 0 0 4px rgba(50, 50, 50, 0.5);
    margin: 2em auto 1em auto;
    width: 732px;
    border-radius: 10px;
    overflow: hidden;
}
#welcome .featureList {
    border-left: none;
    border-right: none;
}
#welcome .featureList .col4 {
    border-right: none;
    width: 232px;
}
.welcomeHeadline {
    padding: 20px;
}
.welcomeHeadlineLeft {
    float: left;
}
.welcomeHeadlineRight {
    float: right;
}
.welcomeHeadline h1 {
    color: #333; font-weight: normal; font-size: 28px; font-family: 'Trebuchet MS',Verdana,Geneva,Arial,sans-serif; margin: 0;
}
.welcomeHeadline h2 {
    color: #333; font-weight: normal; font-size: 1.2em;
}
.welcomePlans {
    overflow: hidden;
}
.welcomePlansLeft {
    float: left;
}
.welcomePlansLeft img {
    margin-left: -1px;
}
.welcomePlansRight {
    float: right;
    padding-right: 40px;
}
.domainBox {
    background: #009edf;
    background: linear-gradient(top, #009edf, #008ecc);
    background: -moz-linear-gradient(top, #009edf, #008ecc);
    background: -webkit-linear-gradient(top, #009edf, #008ecc);
    background: -ms-linear-gradient(top, #009edf, #008ecc);
    background: -o-linear-gradient(top, #009edf, #008ecc);
    width: 720px;
    padding: 6px;
}
.domainBoxButton {
    padding: 24px 40px 0 0; 
    float:right;
}
.domainBoxContent {
    width: 474px; 
    color: #fff; 
    font-size: 1.2em;
    padding-left: 6px;
}
.welcomeFooter {
    text-align:center;
    padding-left: 10px;
}

/* Confirmation page */
.confirmationMan {
	float: left;
}
.confirmationMan img {
	width: 240px;
	vertical-align: top;
}
.confirmationContent {
	margin-left: 240px;
	padding-top: 40px;
}
.confirmationBubble {
    background-color: #F4F4F4;
    border-radius: 14px;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 1.4em;
    padding: 10px;
    position: relative;
    text-align: center;
    text-rendering: optimizelegibility;
}
.confirmationBubble:after {
    border-color: #F4F4F4 #FFFFFF;
    border-style: solid;
    border-width: 0 0 15px 40px;
    bottom: 15px;
    content: "";
    display: block;
    left: -40px;
    position: absolute;
    width: 0;
}
.trusted-shops-protection {
	background: #f4f4f4;
	padding: 20px;
	border-radius: 14px;
}
.trusted-shops-protection h2 {
	margin-top: 0;
}