/* styles for moduls like retention */
#modul .content {
    background: url(/inc/styles/img/sprites/funcModulBg.png) repeat-x 0
        -305px;
    font-size: 12px;
    height: 340px;
    line-height: 18px;
    overflow: hidden;
    position: relative;
    width: auto;
    z-index: 1;
}

#modul h2 {
    margin: 0 0 20px;
}

#modul .text {
    padding:20px;
}

#modul .details .text,
#modul .info-iphone .left .text {
  padding:30px 20px;
}

#modul .text img {
    float: none;
    margin: 0;
    padding:0;
}

#modul .func {
    padding: 0;
}

#modul #retentionDetails ul {
    margin: 0;
}

#modul #retentionDetails ul ul {
    margin: 20px 0;
}

#modul.voucher .func ul {
    margin: 0 0 20px;
}

#modul .footer {
    background: url(/inc/styles/img/sprites/funcModulBg.png) repeat-x 0
        -200px;
    clear: both;
    height: 45px;
    position: relative;
    z-index: 2;
}

#modul .left {
    border-right: 1px solid #fff;
    float: left;
    height: 100%;
    position: relative;
    width: 375px;
}

#modul .thumbs ul {
    position: relative;
}

#modul .thumbs li {
    background: none;
    float: left;
    height: 113px;
    padding: 0;
    text-align: center;
    width: 25%;
}

#modul .thumbs a {
    border: 1px solid #ccc;
    border-color: #ccc #eee #eee #ccc;
    display: block;
    font-size: 11px;
    height: 111px;
    line-height: 12px;
    overflow: hidden;
    text-decoration: none;
}

#modul .thumbs img {
    padding: 3px 0;
}

#modul .thumbs a span {
    color: #666;
    display: block;
}

#modul .thumbs a:hover {
    border: 1px solid #eee;
    border-color: #eee #ccc #ccc #eee;
}

#thumbsShadow {
    background: url(/inc/styles/img/backgrounds/retention_thumbsShadow.png)
        repeat-x;
    bottom: 0;
    left: 0px;
    display: none;
    position: absolute;
    height: 60px;
    width: 375px;
}

#modul .blatant {
    background: url(/inc/styles/img/sprites/funcModulBg.png) repeat-x 0
        -140px;
}

#modul .func,#modul .mainTabs {
    float: left;
    height: 100%;
}

#modul .func {
    border-left: 1px solid #ccc;
    width: 563px;
}

#modul .details .func {
    padding: 20px;
}

#modul.ttariff .func,
#modul.voucher .func,
#modul .details .func {
    padding-left: 45px;
    position: relative;
    width: auto;
}

#modul.ttariff .func,
#modul.voucher .func {
    width: 470px;
}

#modul .details .success {
    float: left;
    padding-left: 40px;
    width: 475px;
}

#modul .details .success dl {
    background-color: #fff;
    overflow: hidden;
    margin-bottom: 10px;
    padding: 10px 0;
    width: 100%;
}

#modul .details .success dd,#modul .details .success dt {
    display: block;
    padding: 0 5px;
    float: left;
}

#modul .details .success dt {
    clear: both;
    text-align: right;
    width: 25%;
}

#modul .details .success dd {
    width: 70%;
}

.success_survey {
  position:absolute;
  bottom:20px;
  left:20px;
}

.nokiamaps {
  background:url(/inc/styles/img/icons/nokiamaps.gif) no-repeat center left;
  padding:2px 0 2px 50px;
}


#modul.voucher .voucher,.details .voucher {
    background: url(/inc/styles/img/sprites/voucher.png) no-repeat 0 0;
}

#simcard, #voucher {
  float:left;
  margin-top:20px;
}

#simcard {
  background:url(/inc/styles/img/backgrounds/retention_simcard.png) no-repeat;
  height:260px;
  width:195px;
}

.details #simcard {
  left:390px;
  position:absolute;
}

#voucher {
  height: 218px;
  position: relative;
  width: 150px;
}

.details #voucher {
  overflow:hidden;
  position:absolute;
  right:20px;
  width:125px;
}

#voucher span {
    display: block;
    height: 27px;
    position: absolute;
    right:0;
    width: 150px;
}

#modul #voucher .note_none {
    background: none;
}

#modul #voucher .note_100 {
    background-position: 0 -108px;
}

#modul #voucher .note_50 {
    background-position: 0 -81px;
}

#modul #voucher .note_20 {
    background-position: 0 -54px;
}

#modul #voucher .note_10 {
    background-position: 0 -27px;
}

#modul #voucher .note_5 {
    background-position: 0 0px;
}

#modul #voucher .row_0 {
    bottom: 0;
    height: 83px;
}

#modul #voucher .row_1 {
    bottom: 83px;
}

#modul #voucher .row_2 {
    bottom: 110px;
}

#modul #voucher .row_3 {
    bottom: 137px;
}

#modul #voucher .row_4 {
    bottom: 164px;
}

#modul #voucher .row_5 {
    bottom: 191px;
}

#modul .footer .medium {
    position: absolute;
    bottom: 5px;
    right: 570px;
}

#modul .mainTabs,#modul .mainTabs li,#modul .mainTabs a {
    background: url(/inc/styles/img/sprites/funcModulBg.png) repeat-x 0 50px
        ;
}

#modul .mainTabs {
    overflow: visible;
    width: auto;
}

#modul .mainTabs li.active {
    background-position: center 0;
    background-repeat: no-repeat;
    margin-top: -19px;
    padding: 19px 0 0;
}

#modul .footer .text {
    font-weight: 700;
}

#modul .footer .text span {
    background: transparent url(/inc/styles/img/sprites/mainNavArrow.png)
        no-repeat;
    display: -moz-inline-stack;
    display: inline-block;
    vertical-align: middle;
    zoom: 1; *
    display: inline;
    width: 7px;
    height: 7px;
    _height: 7px;
}

#modul .mainTabs a,#modul .footer .text {
    color: #fff;
    font-size: 13px;
    height: 45px;
    line-height: 45px;
    padding: 0px;
    text-align: center;
}

#modul .mainTabs li {
    height: auto;
    width: 140px;
}

#modul .mainTabs a {
    border-left: 1px solid #aaa;
    border-right: 1px solid #666;
}

#modul .mainTabs .active a,#modul .mainTabs a:hover {
    background-position: 0 -370px;
    color: #666;
}

#modul .mainTabs .active a {
    border: none;
    color: #666;
    font-weight: bold;
}

/* retention details */
#retentionDetails {
    margin: 0 20px;
    position: relative;
    width: 520px;
}

#retentionDetails .left {
    border: none;
    float: none;
    width: auto;
}

#retentionDetails .content {
    left: 25px;
    overflow: hidden;
    position: absolute;
    top: 20px;
    width: 470px;
}

#retentionDetails .arrow {
    background: url(/inc/styles/img/sprites/funcModulBg.png) repeat-x right
        -30px;
    display: block;
    position: absolute;
    left: 0;
    top: 145px;
    width: 20px;
    height: 47px;
}

#desiredModel {
    font-size: 11px;
    position: absolute;
    padding-left: 5px;
    right: 0;
    z-index: 100;
}

#retentionDetails a.right {
    background-position: 0 -85px;
    left: auto;
    right: 0;
}

#retentionDetails .transparent {
    background: url(/inc/styles/img/sprites/retentionDetails.png) no-repeat
        0 0;
    display: block;
    _display: none;
    position: absolute;
    left: 25px;
    top: 0;
    width: 30px;
    height: 340px;
    z-index: 10;
}

#retentionDetails span.right {
    background-position: right 0;
    left: auto;
    right: 25px;
}

#retentionDetails .detail {
    position: relative;
    width: 470px;
    height: 340px;
}

#retentionDetails .detail a.hardware {
    left: 10px;
    position: absolute;
    top: 30px;
}

#modul.voucher .func .text p,
#modul.ttariff .func .text p,
#modul .details .left .text p {
    margin: 0;
}

#modul .details .func,
#retentionDetails .detail .text,
.voucher .func .text,
.ttariff .func .text {
  height:300px;
  position: absolute;
  right: 50px;
  top: 0;
  width: 250px;
}

#modul.ttariff .func .text,
#modul.voucher .func .text {
  right: 0px;
}

#modul .con {
    clear: none;
    margin: 15px 0 10px;
}

/**
 * ########## Preisbox im Karussell - START ##########
 */
#retentionDetails .text .con {
  bottom:65px;
  height:110px;
  margin:0;
  position:absolute;
  width:250px;
}

#retentionDetails .text .con .layer {
  top:0;
}

#retentionDetails .detail .text .thickbox {
  position:absolute;
  bottom:183px;
}
/**
 * ########## Preisbox im Karussell - ENDE ##########
 */

#modul .con .shadow .Left,
#modul .con .shadow .Right {
    height: 104px;
}

#modul .con .shadow .BL,
#modul .con .shadow .Bottom,
#modul .con .shadow .BR
    {
    bottom: -2px;
}

#modul .con .TL {
    display: block;
}

#modul .con .layer {
    background: #9A1111 url(/inc/styles/img/sprites/funcModulBg.png) repeat-x 0 -710px;
    height: 100px;
    margin: -3px;
    padding: 5px;
    top: -3px;
}

#modul .con .layer * {
    color: #fff;
    line-height: 16px;
}

#modul .con dt,#modul .con dd {
    float: left;
    width: 35%;
}

#modul .con dl {
    overflow: hidden;
    width: auto;
}

#modul .con dt {
    clear: both;
    width: 65%;
}

#modul .con dt.break {
    border-bottom: 1px solid #fff;
    float: none;
    font-size: 0;
    line-height: 0;
    margin: 0 0 8px;
    padding: 8px 0 0;
    width: auto;
}

#modul .con dt.bonus,#modul .con dd.bonus,#modul .con dt.pay,#modul .con dd.pay,#modul .con dt.vouch,#modul .con dd.vouch
    {
    font-weight: bold;
}

#modul .details .con dt.pay,#modul .details .con dd.pay {
    font-weight: normal;
}

#modul .details .con dd.pay {
    position: relative;
}

#modul .details .con dd.pay span {
    background: url(/inc/styles/img/icons/strikeThrough.png) no-repeat
        center;
    bottom: 0;
    height: 15px;
    position: absolute;
    right: 0;
    width: 52px;
}

#modul .con dd {
    text-align: right;
}

#modul .con .blatant {
    background: none;
    bottom: -5px;
    height: 45px;
    line-height: 65px;
    position: absolute;
    width: 245px;
}

#modul .con .blatant span {
    font-size: 45px;
    line-height: 45px;
    position: absolute;
    right: 0;
    top: 0;
    white-space: nowrap;
}

.voucher .buttons,
.ttariff .buttons,
#retentionDetails .buttons {
    bottom: 60px;
    position: absolute;
    right: 20px;
    white-space:nowrap;
}

#modul.voucher .free,
#modul.ttariff .free,
#modul #retentionDetails .free {
  bottom:110px;
}

#modul #retentionDetails .free .thickbox {
  bottom:auto;
}

.voucher .buttons .submit,
.ttariff .buttons .submit,
#retentionDetails .buttons .submit {
    background: #c00 url(/inc/styles/img/sprites/horizontalBg.png) repeat-x 0 -70px;
    border: 1px solid;
    color: #fff;
    display: block;
    font-size: 13px;
    font-weight: 700;
    height: 26px;
    line-height: 28px;
    padding: 0 10px;
    position: absolute;
    right: -4px;
    text-decoration: none;
}

/* retention control */
#modul .controls select {
    border: 1px solid #333;
    border-color: #333 #999 #999 #333;
    padding: 1px;
    width: 200px;
}

#modul .controls {
    padding: 10px 0 0;
    position: relative;
    text-align: center;
}

#modul .controls .bottom,#modul .controls .top {
    background: url(/inc/styles/img/sprites/funcModulBg.png) repeat-x 0
        -650px;
    cursor: pointer;
    display: none;
    position: absolute;
    left: 20px;
    top: 14px;
    height: 19px;
    text-indent: -5000px;
    width: 47px;
}

#modul .controls .bottom {
    background-position: 0 -680px;
    left: auto;
    right: 20px;
}

/* retention detail */
#modul .details .left .hardware,
#modul .info-iphone .hardware {
    position: absolute;
    top: 50px;
    right: 40px;
}

#modul .details .left .text ul {
    margin: 0 0 20px;
    width: 180px;
}

#modul .details .con {
    margin-top: 70px;
}

#modul .details .con .shadow .Left,#modul .details .con .shadow .Right {
    height: 164px;
}

#modul .details .con .layer {
    height: 160px;
}

#modul .details .con dl {
    margin-top: 20px;
}

.details .func .medium {
    position: absolute;
  top: 30px;
  right: 5px;
    z-index: 1;
}

/* activation form */
#activation {
    font-size: 13px;
    line-height: 18px;
}

#activation dl {
    float: left;
    margin: 10px 0 10px 20px;
    width: 350px;
}

#activation dt {
    clear: both;
    float: left;
    font-weight: 700;
    width: 30%;
}

#activation dt.head {
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 20px;
    width: 100%;
}

#main form#activation p,#main form#activation p label,#main form#activation p.agree_advertising label
    {
    float: none;
    font-size: 11px;
    line-height: 14px;
    text-align: left;
    width: auto !important;
}

#main form#activation input.option {
    margin: 0 10px 0 0;
}

/* tarife bei retention */
#activation table.tariffTable {
    width: 100%;
    margin: 0px;
    float: none;
}

#activation table.tariffTable td input.option {
    margin-top: 3px !important;
}

#activation .text {
    margin: 0 20px;
}

#activation span.trigger {
    position: absolute;
    bottom: 10px;
    right: 20px;
}

#activation span.trigger label {
    clear: none;
    width: auto;
}

#activation #tariffList div.error,#activation fieldset.legal div.error {
    display: none;
    margin: 10px 20px;
}

#activation .legal h3 {
  margin:0.5em 0;
}

#activation .legal .text {
  margin-bottom:10px;
}

.dataSheet {
  display:none;
}

#activation fieldset.delivery div.error {
    margin: 0 0 10px 250px;
}

form#activation fieldset.delivery {
    border-top: 1px solid #888;
    display: none;
    padding: 10px 20px;
}

form#activation fieldset.visible,form#activation .visible {
    display: block !important;
}

#modul form.notyet {
    background: none;
}

#modul form.notyet button.submit {
    font-size: 12px;
    height: 24px;
    line-height:1;
}

#modul form.notyet div {
    clear: both;
}

#modul form.notyet fieldset {
    border: none;
    clear: none;
    float: left;
}

#modul form.notyet fieldset.buttons {
    background: none;
    margin: 0;
    width: auto;
}

#modul form.notyet input.email {
    margin-right: 20px;
    padding: 3px 2px;
    width: 175px;
}

.content li.detail .onlinebonus {
    left: -20px;
    position: relative;
    top: 50px;
}

.content .onlinebonus {
  right: 20px;
  position: absolute;
  top: 20px;
}

/**
 * special styles for forms in modal boxes
 */
#TB_window form.customModel h5 label {
    margin: 20px 0 10px 150px;
    width: auto;
}

#TB_window form.successSurvey {
  overflow: hidden;
}

#TB_window form.successSurvey h5,#TB_window form.successSurvey label {
    display: none;
}

#TB_window form.successSurvey label.option {
    display: block;
    float: left;
    padding: 5px 5px 0;
    width: 75%;
}

/**
 * BEGIN: styles for vvl canceler survey
 */
#TB_window .canceler-survey .intro {
  background-position:0 -320px !important;
  height:177px;
}
#TB_window .canceler-survey form.successSurvey {
  *width:100%; /* only ie6 & ie7 */
}

#TB_window .canceler-survey form.successSurvey fieldset.buttons {
  background:none;
  border:0 none;
}

.buttons-survey {
  background:url("/inc/styles/img/sprites/horizontalBg.png") repeat-x scroll 0 -137px #5C5C5C;
  height:45px;
  margin:-20px 0px 20px;
}

#TB_window .buttons-survey a.button {
  color:#fff;
  float:right;
  height:24px;
  line-height:24px;
  margin:10px 8px 0 0;
}

#TB_window form.successSurvey fieldset p.canceler_reason {
  width:370px;
}

#TB_window #loginform-retention-canceler-survey-quality {
  width:470px\9; /* ie hack */
}

#TB_window #loginform-retention-canceler-survey-message {
  left: 391px;
  padding: 75px 0 0;
  position: absolute;
  width: 273px;
}

.canceler-survey .infohover {
  display:inline-block;
  text-indent:-9999em;
}

#intro-survey-tooltip {
  font-size:13px;
  line-height:16px;
}

/**
 * END: styles for vvl canceler survey
 */

#TB_window  div.success a:link {
 color: #499000;
}

#TB_window div.success * {
  font-size: 13px;
}


#TB_window form.successSurvey p.simplicity {
  padding: 0;
}

#TB_window form.successSurvey textarea {
    height: 90px;
    width: 260px;
}

#TB_window form.successSurvey fieldset {
    clear: none;
    float: left;
    padding: 10px 10px 5px;
    width: 270px;
}

#TB_window form.successSurvey fieldset.buttons {
    clear: both;
    margin-top: 5px;
    padding: 0;
    width: 100%;
}

#awaitpageload {
    height: 100%;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 200;
}

/* twinslave subscriber switch */
form.twinslave {
    background: none;
    margin-top: -20px;
    padding: 0 20px;
    width: auto;
}

form.twinslave fieldset {
    background: none !important;
    border: none;
    float: left;
    padding: 0;
    width: auto;
}

form.twinslave fieldset.buttons {
    clear: none;
    float: right;
    margin: 0;
    width: auto;
}

form.twinslave fieldset.buttons button {
    margin: 0;
}

form.twinslave fieldset label,form.twinslave fieldset p {
    width: auto;
}

form.twinslave a.reset {
    display: none;
}

form.twinslave select {
    margin-top: 4px;
    width: 150px;
}

/* ##### SHOP-Fixes - BEGIN */
.shop #modul .con .blatant {
    bottom: 20px;
    width: auto;
}

.shop #modul .con .blatant span {
    position: relative;
    right: auto;
}

.shop .product_detail #modul .con .blatant {
    bottom: 0px;
    height: 55px;
}

.shop a#orderNOW.submit {
  bottom:40px;
  position:absolute;
}
/* ##### SHOP-Fixes - ENDE */

#retentionTop {
    background:url(/inc/styles/img/sprites/aktionshardware.png) no-repeat 0 0;
    position: absolute;
    right: 0;
    top: 0;
    overflow:hidden;
    width: 563px;
    height:29px;
    z-index: 1004;
    display:none;
}

#retentionTop.retentionAction01 {
    background-position: 0px 0px;
}

#retentionTop.retentionAction02 {
    background-position: 0px -50px;
}

#retentionTop.retentionAction03 {
    background-position: 0px -100px;
}

#retentionTop.retentionAction04 {
    background-position: 0px -150px;
}

#retentionTop span {
  background:url(/inc/styles/img/sprites/aktionshardware.png) no-repeat right 0;
  color:#fff;
  display:inline;
  float:left;
  margin-left:30px;
  margin: 0 0 0 30px;
  max-width:450px;
  overflow:hidden;
  padding:3px 20px 0 10px;
  height:29px;
}

#retentionTop.retentionAction01 span{
    background-position: right 0px;
}

#retentionTop.retentionAction02 span {
    background-position: right -50px;
}

#retentionTop.retentionAction03 span {
    background-position: right -100px;
}

#retentionTop.retentionAction04 span {
    background-position: right -150px;
    color:#00ab01;
}

#tariffList a.tableDisplay {
  display:block;
  padding:5px 40px;
}


/* dyn. tarifwechsel */
#retentionTariff ul {
  margin-top:14px;
}

/* tarifdetails-box bei aktivierung */
#retentionTariff a#linkTarifwechsel {
  position:absolute;
  top:265px;
  left:30px;
}
#activation #tariffList tr.currentTariff td {
  border-bottom:1px solid #888;
  padding-bottom:20px;
}
#modul .details .func {
  padding:30px !important;
  padding-right:50px;
  margin:0px; left:330px;
}
#modul .details .left {
  width:330px !important;
}
#modul .details .func {
  width:250px;
  border-right:1px solid #fff;
}
#modul .details #retentionTariff {
  width:190px;
  border-right:none;
  left:640px;
}

/* iCalHelp */
#iCalHelp {
  display:block;
}
  
#iCalHelp p {
  float:right;
  width:290px;
}

#iCalHelp img {
  margin-top:10px;
}

#iCalHelpContent {
  display:none;
  font-size:13px;
  line-height:18px;
}

.easyToolTip {
  margin:0;
  padding:0;
  color: #666;
  cursor: pointer;
  position: relative;
}
.easyToolTipContent {
  background-color: #fefefe;
  border: 1px solid #666;
  padding:10px;
  position: absolute;
  top: 20px;
  display: none;
}

/* ##### iPhone-Info - BEGIN ##### */
#modul .info-iphone .func .p {
  clear:both;
}

#modul div.info-iphone input.email {
  width:285px;
}

.info-iphone p.notyet {
  padding-top:1px;
}

.info-iphone p.notyet span {
  display:block;
  float:left;
  margin-right:20px;
  width:290px;
}

.info-iphone .func h3 {
  margin-top:10px;
}
/* ##### iPhone-Info - END ##### */

.draft {
  display:none;
  left:auto;
  right:67px;
}

/* cooperation logo - END */



/* promotion container on activation view - BEGIN */
.promotion {
  background-color:#d7dade;
  border-top:1px solid #fff;
  padding:20px;
}

.promotion p {
  font-size:12px;
  line-height:18px;
  width:670px;
}
/* promotion container on activation view - END*/

/* special iPhone sprite - BEGIN */
#vvl-iphone-offer{
  position:absolute;
  right:0px;
  z-index:9999;
}
/* special iPhone sprite - END*/

form.tbFromGroenemeyer label.option {
  white-space:nowrap;
}

#TB_window #tbGroeneMeyer .success  {
  padding:0;
}

#TB_window #tbGroeneMeyer form.generated .buttons button.disabled {
   background: url("/inc_common/styles/img/buttons_disabled_loader.gif") no-repeat scroll 13px 50% transparent !important;
}

#modul .footer .verlosung,
.rabattaktion {
  bottom: 8px;
  left: 40px;
  position: absolute;
}

.rabattaktion {
  display:none;
}

#baustelle form.frmRetentionBaustelle, #baustelle form.frmRetentionBaustelle fieldset.buttons  {
	background: none;
} 
#baustelle form.frmRetentionBaustelle fieldset {
    border: none;
}
#baustelle form.frmRetentionBaustelle label {
	width: 190px;
}
#baustelle form.frmRetentionBaustelle button {
	margin-right: 60px;
}
#baustelle form.frmRetentionBaustelle fieldset.buttons {
	margin: 0px;
}
#succes_vvl_register {
	margin-left: 50px;
}

img.baustelle {
	position: absolute;
    right: 40px;
    top: 165px;
}

#websms-stoerer {
  display:block;
  position:absolute;
  top:15px;
  right:15px;
}


