/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */


html,
button,
input,
select,
textarea {
    color: #222;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection declarations have to be separate.
 * Customize the background color to match your design.
 */
/*
::-moz-selection {
    background: #A81717;
    text-shadow: none;
    color: white;
}

::selection {
    background: #A81717;
    text-shadow: none;
    color: white;
}
*/
/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between images and the bottom of their containers: h5bp.com/i/440
 */

img {
    vertical-align: middle;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Chrome Frame prompt
   ========================================================================== */

.chromeframe {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

html {
    background-color: #ccc;
    background-image: url(../img/topgradient.png);
    background-position: 0 0;
    background-repeat: repeat-x;
}

body {
    font: 14px/24px Arial, Helvetica, sans-serif;
    color: #555;
    margin: 0 0 50px 0;
    padding: 0;
    border-top: 0px solid #999;
    min-width: 1020px;
}

a {
    color: #c01;
    text-decoration: none;
    /*-moz-transition: 0.2s linear;
    -webkit-transition: 0.2s linear;
    -o-transition: 0.2s linear;
    transition: 0.2s linear;*/
}

.lightbox a {
  text-decoration: underline;
}

a:hover {
    color: #222;
    text-decoration: underline;
}

a:active, a:focus {
    outline: none;
}

p {
    position: relative;
    margin: 12px 0;
}

p.success, p.failed {
    position: relative;
    display: block;
    background-image: url(../img/success.svg);
    background-repeat: no-repeat;
    background-position: left center;
    margin-top: 10px;
    min-height: 50px;
    margin-left: -1px;
    padding-left: 47px;
}

p.failed {
    background-image: url(../img/failed.svg);
}

.lt-ie9 p.success {
    background-image: url(../img/success.png);
}

.lt-ie9 p.failed {
    background-image: url(../img/failed.png);
}

p.success, p.failed, span.inputmessage {
    display: table;
    height: 50px;
}

span.inputmessage {
    top: 15px;
}

.teaser span.inputmessage {
    top: 32px;
    left: 507px;
    max-width: 415px;
}

.teaser span.inputmessage.hidden {
    left: 535px;
}

p.success > span.text, p.failed > span.text, span.inputmessage > span.text {
    display: table-cell;
    vertical-align: middle;
}

strong {
    font-weight: bold;
    color: #222;
}

header {
    position: relative;
    display: block;
    height: 110px;
    width: 980px;
    margin: 0 auto;
    z-index: 2;
}

a.logo {
    position: absolute;
    display: block;
    width: 160px;
    height: 55px;
    background-image: url(../img/logo.svg);
    background-repeat: no-repeat;
    top: 30px;
    left: 10px
}

.lt-ie9 a.logo {
    background-image: url(../img/logo.png);
}

nav {
    display: block;
}

nav > ul {
    position: relative;
    padding: 0;
    margin: 0 auto;
    font-size: 0;
    line-height: 0;
}

nav a:hover {
    text-decoration: none;
}

nav.mysteinberg {
    position: absolute;
    top: 110px;
    width: 100%;
}

nav.mysteinberg > ul {
    background-color: #444;
    padding: 20px 21px;
    margin: 1px;
    text-align: left;
    /*background-image: url(../img/gradient.png);
    background-repeat: repeat-x;*/
    border: 1px solid #333;
    height: 25px;
}

nav > ul > li {
    position: relative;
    display: inline-block;
}

nav.steinbergnet {
    margin: 44px 10px;
    float: right;
}

nav.steinbergnet a {
    font: 16px/24px Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #222;
}

nav.steinbergnet a:hover {
    color: #A81717;
}

nav.mysteinberg a {
    color: #ccc;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}

nav.mysteinberg a:hover, nav.mysteinberg li:hover > a, nav.mysteinberg li.active > a {
    color: white;
}

nav.mysteinberg li.active:after {
    content: "";
    position: absolute;
    display: none;
    width: 13px;
    height: 8px;
    left: 50%;
    margin-left: -6px;
    bottom: -23px;
    background-image: url(../img/navarrow.png);
}

nav.language {
    position: absolute;
    top: 127px;
    right: 20px;
    background-color: transparent;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0);
    max-height: 35px;
    overflow: hidden;
    opacity: 0.7;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    filter: alpha(opacity=70);
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.lt-ie9 nav.language:hover {
    outline: 1px solid #ccc;
}

nav.language:hover {
    background-color: white;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
    max-height: 130px;
    opacity: 0.95;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=95)";
    filter: alpha(opacity=95);
}

nav.language ul {
    padding: 7px 0;
}

nav.language ul li {
    display: block;
}

nav.language ul li a {
    display: block;
    font: 14px/17px Arial, Helvetica, sans-serif;
    color: #444;
    padding: 5px 12px;
}

nav.language ul li a:hover {
    color: #A81717;
}

nav.language span {
    display: block;
    padding: 5px 28px 5px 12px;
    font: 14px/22px Arial, Helvetica, sans-serif;
    color: #ddd;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
    background-image: url(../img/down-language.svg);
    background-repeat: no-repeat;
    background-position: right 5px;
    margin-right: 5px;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.lt-ie9 nav.language span {
    background-image: url(../img/down-language.png);
}

nav.language:hover span {
    margin-top: -33px;
}

.login nav.language {
    top: 130px;
}

.login nav.language span {
    background-image: url(../img/down-language-login.svg);
    color: #777;
    text-shadow: none;
}

.lt-ie9 .login nav.language span {
    background-image: url(../img/down-language-login.png);
}

div#main {
    position: relative;
    display: block;
    background-color: white;
    width: 920px;
    padding: 30px;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.4);
    margin: 0 auto 30px auto;
    border-top: 65px solid white;
}

.touch div#main {
    overflow: hidden;
}

.lt-ie9 div#main {
    outline: 1px solid #aaa;
}

div#user {
    position: absolute;
    display: block;
    right: 30px;
    top: 30px;
    text-align: right;
    z-index: 1;
}

form, div.forms {
    position: relative;
    display: block;
    margin: 0px -30px;
    padding: 10px 29px;
    background-color: #eee;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}

div.forms {
    padding: 0 29px;
}

div.forms form {
    background-color: transparent;
    border: 1px solid transparent;
    margin: 0px -18px;
    padding: 10px 18px;
    max-height: 65px;
    overflow: hidden;
    -moz-transition: border 0.3s linear, background-color 0.3s linear, margin 0.3s ease;
    -webkit-transition: border 0.3s linear, background-color 0.3s linear, margin 0.3s ease;
    -o-transition: border 0.3s linear, background-color 0.3s linear, margin 0.3s ease;
    transition: border 0.3s linear, background-color 0.3s linear, margin 0.3s ease;
}

div.forms .open {
    background-color: white;
    border: 1px solid #ddd;
    padding: 10px 18px;
    max-height: none;
    margin: 12px -18px;
}

div.forms .open p {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -moz-transition: opacity 0.4s linear;
    -webkit-transition: opacity 0.4s linear;
    -o-transition: opacity 0.4s linear;
    transition: opacity 0.4s linear;
}

div.forms form p.toggle, div.forms .open p {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
}

div.forms form:first-of-type {
    margin-top: 12px;
}

div.forms form:last-of-type {
    margin-bottom: 12px;
}

form > p {
    position: relative;
    margin: 20px 0;
}

div.forms form > p.toggle {
    background-color: #555;
    color: white;
    font-weight: bold;
    padding: 10px 15px;
    margin: 10px 0 25px 0;
    /*text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
    background-image: url(../img/gradient.png);
    background-repeat: repeat-x;*/
    cursor: pointer;
    /*border: 1px solid #333;*/
    -moz-transition: background-color 0.2s linear;
    -webkit-transition: background-color 0.2s linear;
    -o-transition: background-color 0.2s linear;
    transition: background-color 0.2s linear;
}

#softwareregistration .toggle {
  cursor: inherit;
}

div.forms form#products > p.toggle {
    margin-bottom: 15px;
}

div.forms form.disabled > p.toggle, div.forms form.disabled > p.toggle:hover {
    background-color: #666;
    cursor: default;
    opacity: 0.2;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
    filter: alpha(opacity=20);
}

div.forms form > p.toggle:after {
    content: "";
    display: inline-block;
    width: 21px;
    height: 21px;
    background-image: url(../img/down-language.svg);
    vertical-align: top;
    margin: 1px -3px;
    float: right;
}

div.forms form.open > p.toggle:after {
    background-image: url(../img/up-language.svg);
}

.lt-ie9 div.forms form > p.toggle:after {
    background-image: url(../img/down-language.png);
}

div.forms form > p.toggle:hover {
    background-color: #333;
}

form > p.date, form > p.combined-fields {
    font-size: 0;
}

form > p.date select, form > p.combined-fields span {
    display: inline-block;
    width: 150px;
    margin-right: 10px;
    vertical-align: top;
}

form > p.combined-fields span.wide {
    width: 310px;
}

form > p.combined-fields input, form > p.combined-fields select {
    width: 100%;
}

p#password {
    display: block;
    -moz-transition: opacity 0.4s linear 0.2s;
    -webkit-transition: opacity 0.4s linear 0.2s;
    -o-transition: opacity 0.4s linear 0.2s;
    transition: opacity 0.4s linear 0.2s;
}

p#password.visible {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;
}

label {
    display: block;
    padding-left: 1px;
    margin-bottom: 4px;
    font: 14px/24px Arial, Helvetica, sans-serif;
}

label.required:after {
    content: " *";
    color: #c01;
}

input[type="radio"] {
    cursor: pointer;
}

input[type="radio"] + label {
	display: inline-block;
	cursor: pointer;
	font-weight: bold;
	padding-left: 7px;
	opacity: 0.8;
}

input[type="radio"]:checked + label {
	opacity: 1;
}

input[type="text"], input[type="password"], select {
    font: 14px/24px Arial, Helvetica, sans-serif;
    padding: 0 9px;
    height: 38px;
    background-color: white;
    border: 1px solid #aaa;
    width: 470px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}

.lt-ie9 input[type="text"], .lt-ie9 input[type="password"] {
    line-height: 38px;
}

textarea {
    padding: 7px 9px;
    border: 1px solid #aaa;
    width: 470px;
    background-color: white;
    font: 14px/20px Arial, Helvetica, sans-serif;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}

select {
    padding: 9px 7px 9px 5px;
    height: 38px;
    line-height: 38px;
    vertical-align: middle;
}

input[type="radio"] {
    display: inline-block;
    margin: 5px 2px 0 1px;
    vertical-align: top;
}

span.radio {
    display: block;
    position: relative;
    background-color: #f6f6f6;
    border: 1px solid #ccc;
    padding: 9px;
    width: 450px;
}

span.radio label {
    display: inline-block;
    margin: 0 15px 0 0;
    vertical-align: top;
}

option.hidden {
    display: none !important;
}

p.accesscode {
    font: 13px/21px "Courier New", Courier, monospace;
}

p.accesscode label {
    font: 14px/24px Arial, Helvetica, sans-serif;
}

p.accesscode input[type="text"] {
    font: 13px/21px "Courier New", Courier, monospace;
    letter-spacing: 2px;
    text-transform: uppercase;
}

input.activationcode {
    font: 13px/21px "Courier New", Courier, monospace;
    border-color: #ddd;
    color: #c01;
    letter-spacing: 3px;
    margin-bottom: 10px;
}

input.activationcode:focus {
    box-shadow: none;
    border-color: #c01;
    outline: 0;
}

div.checkboxes {
    margin: 0;
    padding: 8px 0 1px 0;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -moz-transition: opacity 0.5s linear 2s;
    -webkit-transition: opacity 0.5s linear 2s;
    -o-transition: opacity 0.5s linear 2s;
    transition: opacity 0.5s linear 2s;
}

/* TODO: Opacity not working here yet! */;
div.checkboxes.hidden {
    right: 1000px;
    opacity: 0 !important;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
}

div.checkboxes p {
    position: relative;
    margin: 10px 0;
}

label.checkboxlabel {
    display: inline-block;
    vertical-align: top;
    padding-left: 25px;
    margin: 0;
}

input[type="checkbox"] {
    position: absolute;
    display: inline-block;
    vertical-align: top;
    margin-top: 5px;
}

input[type="submit"], .button, .submit {
    position: relative;
    display: inline-block;
    margin: 10px 20px 10px 0;
    color: white;
    border: none;
    background-color: #A81717;
    background-image: url(../img/button-on-grey.svg);
    background-position: right top;
    background-repeat: repeat;
    height: 45px;
    font: 25px/43px 'alternate-gothic-no-2-d', Arial, Helvetica, sans-serif;
    padding: 0 45px 0 10px;
    vertical-align: middle;
    text-shadow: 1px 0 1px rgba(0,0,0,0.2), -1px 0 1px rgba(0,0,0,0.2), 0 1px 1px rgba(0,0,0,0.2), 0 -1px 1px rgba(0,0,0,0.2);
}

.japan h1 {
	font: 40px/43px "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif !important;
}

.button {
	background-image: none;
}

input[type="submit"] + img {
    margin: 10px 20px 10px 0;
}

.lt-ie9 .submit, .lt-ie9 input[type="submit"], .lt-ie9 .button, .lt-ie9 .submit {
    background-image: url(../img/button-on-grey.png);
}

div.forms input[type="submit"], .submit {
    background-image: url(../img/button-on-white.svg);
}

.lt-ie9 div.forms input[type="submit"] {
    background-image: url(../img/button-on-white.png);
}

.button.plus {
    background-image: none;
    height: auto;
    padding: 0 10px;
    line-height: 80px;
    -webkit-transition: background-color 0.25s ease;
    -moz-transition: background-color 0.25s ease;
    -ms-transition: background-color 0.25s ease;
    -o-transition: background-color 0.25s ease;
    transition: background-color 0.25s ease;
}

.japan .button.plus {
  line-height: 43px;
}

.button.plus hr {
  margin: 0;
  padding: 0;
}

.button.plus:first-of-type {
  line-height: 39px;
  font-size: 24px;
}

.japan .button.plus:first-of-type {
 font-size: 16px;   
}

.load {
  background-color: #333 !important;
  padding: 10px 11px;
}

.load:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  background-color: #A81717;
  -webkit-animation: buttonload 2.5s linear infinite;
  -moz-animation:    buttonload 2.5s linear infinite;
  -o-animation:      buttonload 2.5s linear infinite;
  animation:         buttonload 2.5s linear infinite;
}

.button.load:after {
  content: attr(data-label);
  line-height: 63px;
  padding: 8px 0px;
}

.japan .button.load:after {
  line-height: 28px;
}


.load:after {
  content: attr(data-label);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 4px 0;
  line-height: 23px;
}

.button.small, .button.grey {
    height: 41px;
    border: 0;
    font: 14px/41px Arial, Helvetica, sans-serif;
    font-weight: bold;
    background-color: #666;
    background-position: right center;
    padding: 0 50px 0 13px;
}

.button.grey {
    background-position: -10px center;
    padding: 0 14px;
    height: 45px;
    line-height: 45px;
    font: 23px/45px 'alternate-gothic-no-2-d', Arial, Helvetica, sans-serif;
}

input[type="submit"]:hover, .button:hover, .submit:hover {
    background-color: #333;
    text-decoration: none;
    color: white;
}

input[type="submit"].disabled, input[type="submit"].disabled:hover {
    background-color: #bbb;
    text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.6);
    opacity: 0.5;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);
    cursor: default;
    padding-right: 50px;
}

.inputmessage {
    position: absolute;
    display: block;
    font: 14px/24px Arial, Helvetica, sans-serif;
    left: 490px;
    top: 29px;
    padding: 7px 10px 7px 5px;
    max-width: 415px;
    background-repeat: no-repeat;
    background-position: left center;
    cursor: default;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -moz-transition: left 0.4s ease 0.3s, opacity 0.4s linear 0.3s;
    -webkit-transition: left 0.4s ease 0.3s, opacity 0.4s linear 0.3s;
    -o-transition: left 0.4s ease 0.3s, opacity 0.4s linear 0.3s;
    transition: left 0.4s ease 0.3s, opacity 0.4s linear 0.3s;
}

.lt-ie9 .inputmessage {
    background-image: url(../img/info.png);
}

.inputmessage > span.message {
    position: absolute;
    display: block;
    width: 34px;
    height: 34px;
    left: 0;
    top: 15px;
    background-image: url(../img/info.svg);
    background-repeat: no-repeat;
    background-position: center;
}

.inputmessage.hidden {
    visibility: hidden;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    left: 520px;
    -moz-transition: left 0.4s ease 0.4s, opacity 0.4s linear 0s, visibility 0s linear 0.4s;
    -webkit-transition: left 0.4s ease 0.4s, opacity 0.4s linear 0s, visibility 0s linear 0.4s;
    -o-transition: left 0.4s ease 0.4s, opacity 0.4s linear 0s, visibility 0s linear 0.4s;
    transition: left 0.4s ease 0.4s, opacity 0.4s linear 0s, visibility 0s linear 0.4s;
}

.inputmessage.info, .inputmessage.success, .inputmessage.error, .inputmessage.lbstartscreen {
    padding-left: 45px;
    /*width: 375px;*/
}

#selectionbuttons .error {
  top: 8px;
  position: relative;
  left: 0;
  display: inline-table;
}

.inputmessage.info, .inputmessage.lbstartscreen {
    background-image: url(../img/info.svg);
    color: #269;
}

.inputmessage.error {
    background-image: url(../img/error.svg);
    color: #A81717;
}

.inputmessage.success {
    background-image: url(../img/success.svg);
    color: #270;
}

.lt-ie9 .inputmessage.error {
    background-image: url(../img/error.png);
}

.lt-ie9 .inputmessage.success {
    background-image: url(../img/success.png);
}

.inputmessage.info.success, .inputmessage.info.error {
    padding-left: 89px;
    background-position: 43px center;
	width: 331px;
}
/*
.inputmessage.info.success:before, .inputmessage.info.error:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 45px;
    height: 100%;
    background-image: url(../img/info.svg);
    background-repeat: no-repeat;
    background-position: left center;
}

.lt-ie9 .inputmessage.info.success:before, .lt-ie9 .inputmessage.info.error:before {
    background-image: url(../img/info.png);
}
*/
a.inputmessage {
    position: relative;
    display: inline-block;
    top: 0;
    left: -3px;
    /*margin-top: 25px;*/
    cursor: pointer;
}

div.checkboxes p.mandatory, div.checkboxes p.suggested, div.checkboxes p.was-suggested, p.submit-with-message {
    margin-bottom: -60px;
    -moz-transition: margin 0.3s ease 0.2s;
    -webkit-transition: margin 0.3s ease 0.2s;
    -o-transition: margin 0.3s ease 0.2s;
    transition: margin 0.3s ease 0.2s;
}

p.submit-with-message {
    margin-bottom: -40px;
}

div.checkboxes p.mandatory.error, div.checkboxes p.suggested.error, p.submit-with-message.error {
    margin-bottom: 10px;
    -moz-transition: margin 0.3s ease;
    -webkit-transition: margin 0.3s ease;
    -o-transition: margin 0.3s ease;
    transition: margin 0.3s ease;
}

span.errormessage {
    position: relative;
    display: inline-block;
    background-color: #148;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
    color: #A81717;
    padding: 7px 12px;
    margin: 10px -1px;
    color: white;
    border: 1px solid white;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -moz-transition: opacity 0.3s linear;
    -webkit-transition: opacity 0.3s linear;
    -o-transition: opacity 0.3s linear;
    transition: opacity 0.3s linear;
}

.suggested span.errormessage {
/*    background-color: #666; */
}

span.close {
    position: absolute;
    width: 20px;
    height: 20px;
    top: 9px;
    right: 9px;
    background-image: url(../img/close.svg);
    cursor: pointer;
}

.lt-ie9 span.close {
    background-image: url(../img/close.png);
}

.lt-ie9 .error span.close {
    display: block;
}

.lt-ie9 span.close {
    display: none;
}

.error span.errormessage {
    display: inline-block;
    margin-top: 10px;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -moz-transition: opacity 0.3s linear 0.2s;
    -webkit-transition: opacity 0.3s linear 0.2s;
    -o-transition: opacity 0.3s linear 0.2s;
    transition: opacity 0.3s linear 0.2s;
}

.suggested span.errormessage.x {
    padding-right: 45px;
}

span.errormessage a {
    display: inline-block;
    padding: 2px 7px;
    margin: -2px 2px;
    background-color: white;
    background-color: rgba(255, 255, 255, 0.8);
    color: #136;
    opacity: 0.9;
    text-shadow: 1px 1px 0 white;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
    font-weight: bold;
    /*background-image: url(../img/buttongradient.png);*/
}

span.errormessage a.yes {
    margin-left: 15px;
}

span.errormessage a.no {
    margin-right: -3px;
}

span.errormessage a:hover {
    opacity: 1;
    background-color: rgba(255, 255, 255, 0.9);
    text-decoration: none;
}

span.errormessage:before {
    content: "";
    position: absolute;
    top: -10px;
    left: -4px;
    width: 20px;
    height: 11px;
    background-image: url(../img/error-arrow.png);
}

.lt-ie9 span.errormessage:before {
    display: none;
}

.suggested span.errormessage:before {
/*    background-image: url(../img/error-arrow-suggested.png);*/
}

a.download {
    position: relative;
    display: inline-block;
    background-color: #5C5C5C;
    padding: 10px 70px 10px 13px;
    font-weight: bold;
    color: #EEE;
    border-radius: 3px;
    margin-right: 15px;
    margin-top: -12px;
    background-position: right top;
    border-radius: 4px;
    min-width: 165px;
    border: 1px solid rgba(211,211,211,0.5);
    -webkit-transition: background-color 0.25s ease;
    -moz-transition: background-color 0.25s ease;
    -ms-transition: background-color 0.25s ease;
    -o-transition: background-color 0.25s ease;
    transition: background-color 0.25s ease;
}

a.download > span {
    display: block;
    font: 12px/12px Arial, Helvetica, sans-serif;
    font-weight: normal;
    color: #CCC;
    margin-bottom: 4px;
}

a.download.win {
    /*background-image: url(../img/download-win.png);*/
    background-image: url(../img/download-win.svg);
}

a.download.mac {
    /*background-image: url(../img/download-mac.png);*/
    background-image: url(../img/download-mac.svg);
} 

a.download:hover {
    text-decoration: none;
    background-color: #333;
}

ul.newproduct, div.allproducts > a {
    padding: 5px 14px 5px 0;
    font-size: 13px;
    list-style: none;
    border-left: 1px solid #ddd;
    width: 215px;
    display: inline-block;
    vertical-align: top;
    margin: 12px 0;
}

form.complete div.allproducts a, form.complete div.allproducts a:hover, form.complete ul.newproduct.group li, form.complete ul.newproduct.group li.title {
    color: #555;
    padding-left: 14px;
    background-position: -10px 4px;
    cursor: default;
}

form.complete ul.newproduct.group li, form.complete ul.newproduct.group li.title, form.complete ul.newproduct.group a:hover li.title  {
    padding-left: 0;
}

div.allproducts.hardware ul.newproduct {
    width: 165px;
}

div.allproducts > a {
    padding-left: 14px;
    background-image: url(../img/close-small.png);
    background-repeat: no-repeat;
    background-position: -10px 13px;
    -moz-transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

div.allproducts > a:hover {
    color: #A81717;
    text-decoration: none;
    padding-left: 28px;
    background-position: 13px 13px;
}

ul.newproduct li.title, ul.newproduct li.subtitle {
    font-weight: bold;
    font-size: 15px;
    color: #222;
    margin-bottom: 5px;
}

ul.newproduct li.subtitle {
    font-size: 13px;
    margin-bottom: 0;
    margin-top: 4px;
}

ul.newproduct li.title a {
    margin-left: -14px;
}

ul.newproduct li {
    position: relative;
    display: block;
    padding: 0;
    width: 100%;
    white-space: nowrap;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    padding-left: 14px;
}

ul.newproduct.group > a, form.complete div.allproducts ul.newproduct.group a.selected {
    display: block;
    background-position: -10px 8px;
}

ul.newproduct.group > a:hover, form.complete div.allproducts ul.newproduct.group a.selected:hover {
    padding-left: 14px;
    background-position: 14px 8px;
}

ul.newproduct.group li, ul.newproduct.group li.title, ul.newproduct.group a.selected li.title {
    padding-left: 0;
    text-overflow: initial;
    white-space: normal;
    color: #c01;
    -moz-transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

ul.newproduct a, form.complete div.allproducts a.selected {
    position: relative;
    display: inline;
    color: #c01;
    cursor: pointer;
    -moz-transition: color 0.15s ease;
    -webkit-transition: color 0.15s ease;
    -o-transition: color 0.15s ease;
    transition: color 0.15s ease;
}

ul.newproduct a:hover, form.complete div.allproducts a.selected:hover {
    color: #222;
    text-decoration: none;
    background-position: 14px 4px;
}

ul.newproduct.group a.selected li.title, ul.newproduct.group a.selected li {
    color: #c01;
}

ul.newproduct li.series a {
    margin-left: 2px;
}

ul.newproduct li.series a:hover {
    padding-left: 0;
}

ul.products {
    padding: 0;
    list-style: none;
    margin: 0 -30px;
    background-color: #eee;
    border-bottom: 1px solid #ccc;
    margin-bottom: 30px;
}

ul.products > li {
    position: relative;
    padding: 0 30px;
    cursor: pointer;
    margin: 0 12px;
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
    -moz-transition: background-color 0.3s linear, border 0.3s linear;
    -webkit-transition: background-color 0.3s linear, border 0.3s linear;
    -o-transition: background-color 0.3s linear, border 0.3s linear;
    transition: background-color 0.3s linear, border 0.3s linear;
}

ul.products > li.deactivated {
    opacity: .65;
    cursor: auto;
    -moz-transition: opacity 0.3s linear;
    -webkit-transition: opacity 0.3s linear;
    -o-transition: opacity 0.3s linear;
    transition: opacity 0.3s linear;
}

ul.products > li.deactivated:hover {
    opacity: .95;
}

ul.products > li.deactivated:hover a.hide {
  opacity: .95;
}

ul.products > li.deactivated span.licenser-title {
    cursor: auto;
}

ul.products > li:nth-child(even):last-of-type {
    margin-bottom: 3px;
}

ul.products > li:nth-child(odd):last-of-type {
    margin-bottom: 20px;
}

.lt-ie9 ul.products > li.odd.last {
    margin-bottom: 20px;
}

.lt-ie9 ul.products > li.even.last {
    margin-bottom: 3px;
}

ul.products > li.open {
    cursor: auto;
}

ul.products > li:nth-child(odd) {
    background-color: white;
    border: 1px solid #ddd;
}

.lt-ie9 ul.products > li.odd {
    background-color: white;
    border: 1px solid #ddd;
}

ul.products > li p {
    margin: 0;
}

ul.products > li div.infos {
    padding-left: 45px;
    font-size: 13px;
}

span.label {
    display: inline-block;
    min-width: 105px;
}

span.margin {
    display: block;
    height: 7px;
    clear: both;
    float: none;
}

.login span.margin {
    height: 14px;
}

ul.products span.margin {
    height: 12px;
}

.js ul.products li div.infos {
    display: none;
}

.js ul.products li:first-of-type:last-of-type div.infos {
    display: block;
}

.js ul.products li:first-of-type:last-of-type div.right {
    display: none;
}

ul.products li p.headline {
    display: block;
    padding: 14px 0;
}

ul.products span.type {
    position: absolute;
    display: block;
    width: 38px;
    height: 38px;
    background-color: #555;
    left: -12px;
    top: 18px;
    /*border: 1px solid #555;*/
    border-radius: 19px;
    background-image: url(../img/software.svg);
    background-position: center;
    background-repeat: no-repeat;
    /*box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);*/
    -moz-transition: 0.3s linear;
    -webkit-transition: 0.3s linear;
    -o-transition: 0.3s linear;
    transition: 0.3s linear;
}

.lt-ie9 ul.products span.type {
    background-image: url(../img/software.png);
    background-color: transparent;
    border: 0;
    width: 38px;
    height: 38px;
}

ul.products li:hover span.type {
    background-color: #333;
    border-color: #333;
}

.lt-ie9 ul.products li:hover span.type {
    background-color: transparent;
}

ul.products span.type.hardware {
    background-image: url(../img/hardware.svg);
}

ul.products span.type.voucher {
    background-image: url(../img/voucher.svg);
}

ul.products span.type.online {
    background-image: url(../img/online.svg);
}

ul.products span.type.usb {
    background-image: url(../img/usb.svg);
}

ul.products span.type.inactive {
    background-image: url(../img/deactivated.svg);
}

ul.products span.type.app {
    background-image: url(../img/app.svg);
}

ul.products span.type.waiting {
    background-image: url(../img/waiting.svg);
}

ul.products span.type.softelicenser {
    background-image: url(../img/softelicenser.svg);
}

ul.products span.type.download {
    background-image: url(../img/download.svg);
}

.lt-ie9 ul.products span.type.hardware {
    background-image: url(../img/hardware.png);
}

.lt-ie9 ul.products span.type.online {
    background-image: url(../img/online.png);
}

.lt-ie9 ul.products span.type.usb {
    background-image: url(../img/usb.png);
}

.lt-ie9 ul.products span.type.app {
    background-image: url(../img/app.png);
}

.lt-ie9 ul.products span.type.softelicenser {
    background-image: url(../img/softelicenser.png);
}

span.inputmessage > span.message > span, ul.products span.type span, ul.products div.right > a.toggle span, ul.products div.right > a.hide span, ul.products div.right > a.info span, span.errormessage span.close span {
    position: absolute;
    display: block;
    background-color: #333;
    color: white;
    white-space: nowrap;
    padding: 6px 10px;
	bottom: 62px;
    /*left: -20px;*/
    visibility: hidden;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    /*box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
    border: 1px solid white;*/
    pointer-events: none;
    font-size: 13px;
    z-index: 10;
	line-height: 21px;
    -moz-transition: bottom 0.3s ease 0.3s, opacity 0.3s linear 0s, visibility 0s linear 0.3s;
    -webkit-transition: bottom 0.3s ease 0.3s, opacity 0.3s linear 0s, visibility 0s linear 0.3s;
    -o-transition: bottom 0.3s ease 0.3s, opacity 0.3s linear 0s, visibility 0s linear 0.3s;
    transition: bottom 0.3s ease 0.3s, opacity 0.3s linear 0s, visibility 0s linear 0.3s;
    margin-right: 45px;
}

span.message span {
	left: -18px;
}

.touch ul.products span.type span, .touch ul.products div.right > a.toggle span, .touch ul.products div.right > a.info span, .touch span.errormessage span.close span {
    display: none;
}

span.errormessage > span.close > span {
    left: -25px;
}

span.inputmessage > span.message:hover > span, ul.products span.type:hover span, ul.products div.right > a.toggle:hover span, ul.products div.right > a.hide:hover span, ul.products div.right > a.info:hover span, span.errormessage span.close:hover span {
    bottom: 37px;
    visibility: visible;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -moz-transition: bottom 0.3s ease, opacity 0.3s linear;
    -webkit-transition: bottom 0.3s ease, opacity 0.3s linear;
    -o-transition: bottom 0.3s ease, opacity 0.3s linear;
    transition: bottom 0.3s ease, opacity 0.3s linear;
}

span.inputmessage > span.message:hover > span, ul.products span.type:hover span, span.errormessage span.close:hover span {
	bottom: 42px;
	visibility: visible;
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	-moz-transition: bottom 0.3s ease, opacity 0.3s linear;
	-webkit-transition: bottom 0.3s ease, opacity 0.3s linear;
	-o-transition: bottom 0.3s ease, opacity 0.3s linear;
	transition: bottom 0.3s ease, opacity 0.3s linear;	
}

span.inputmessage > span.message > span:after, ul.products span.type span:after, ul.products div.right > a.toggle span:after, ul.products div.right > a.info span:after, ul.products div.right > a.hide span:after, span.errormessage span.close span:after {
    content: "";
    position: absolute;
    display: block;
    width: 16px;
    height: 9px;
    background-image: url(../img/hint-arrow.png);
    bottom: -9px;
    /*left: 27px;*/
   right: 10px;
}

span.inputmessage > span.message > span:after {
    left: 28px;
}

ul.products div.right > a.toggle span, ul.products div.right > a.info span, ul.products div.right > a.hide span {
	/*left: -21px !important;*/
	right: -48px !important;		
}

ul.products span.type span {
    left: -24px;
}

ul.products span.type span:after {
    left: 33px;
}

ul.products span.product, ul.products span.licenser-title {
    display: inline-block;
    font-weight: bold;
    color: #333;
    padding-left: 45px;
    font-size: 14px;
    cursor: pointer;
    vertical-align: top;
}

ul.products span.licenser, ul.products span.products {
    display: block;
    padding-left: 45px;
    font-size: 13px;
    line-height: 21px;
    margin-top: 1px;
    max-width: 70%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

ul.products input[type="text"], .renameelicenser span {
    font: 13px/13px "Courier New", Courier, monospace;
    border: 1px solid transparent;
    padding: 0 5px;
    width: auto;
    margin: 0px 5px -5px 5px;
    height: 24px;
    display: inline-block;
    vertical-align: top;
    background-color: transparent;
}

.renameelicenser span {
  line-height: 25px;
}

.lt-ie9 ul.products input[type="text"] {
    line-height: 24px;
}

ul.products input[type="text"]:focus {
    border: 1px solid #ccc;
    width: 300px !important;
}

ul.products input[type="text"].empty {
    margin-right: -10px;
}

ul.products div.right {
    position: absolute;
    right: 16px;
    top: 17px;
}

ul.products div.right > a {
    position: relative;
    display: inline-block;
    vertical-align: top;
    margin: 5px;
    width: 29px;
    height: 29px;
    float: right;
    border-radius: 29px;
    /*border: 1px solid #148;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3);*/
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

div.right a.info {
    background-color: #159;
    background-image: url(../img/info-right.svg)
}

.lt-ie9 div.right a.info {
    background-color: transparent;
    background-image: url(../img/info-right.png);
    border: 0;
    width: 31px;
    height: 31px;
}

ul.products div.right > a span {
    white-space: nowrap;
}

ul.products div.right > a.toggle {
    width: 29px;
    height: 29px;
    background-color: #888;
    border-radius: 20px;
    /*border: 1px solid #666;*/
    background-image: url(../img/arrows.svg);
    background-repeat: no-repeat;
    background-position: 0px 0px;
    -webkit-transition: background-color 0.2s ease, background-position 0.2s ease;
    -moz-transition: background-color 0.2s ease, background-position 0.2s ease;
    -ms-transition: background-color 0.2s ease, background-position 0.2s ease;
    -o-transition: background-color 0.2s ease, background-position 0.2s ease;
    transition: background-color 0.2s ease, background-position 0.2s ease;
}

ul.products div.right > a.hide {
    width: 29px;
    height: 29px;
    background-color: #888;
    border-radius: 20px;
    /*border: 1px solid #666;*/
    background-image: url(../img/hide.svg);
    background-repeat: no-repeat;
    background-position: 0px 0px;
    -webkit-transition: background-color 0.2s ease, background-position 0.2s ease, opacity .2s ease;
    -moz-transition: background-color 0.2s ease, background-position 0.2s ease, opacity .2s ease;
    -ms-transition: background-color 0.2s ease, background-position 0.2s ease, opacity .2s ease;
    -o-transition: background-color 0.2s ease, background-position 0.2s ease, opacity .2s ease;
    transition: background-color 0.2s ease, background-position 0.2s ease, opacity .2s ease;
    opacity: 0;
}

ul.products div.right > a.hide:hover {
    background-color: #A81717;
}

.lt-ie9 ul.products div.right > a.toggle {
    background-image: url(../img/arrows.png);
    background-color: transparent !important;
    border: 0;
    width: 31px;
    height: 31px;
}

.lt-ie9 ul.products div.right > a.toggle:hover, .lt-ie9 ul.products li.open div.right > a.hide.confirm {
    background-position: 0 -31px;
}


ul.products li.open div.right > a.toggle, ul.products li div.right > a.hide.confirm {
    background-position: 0 -29px;
}

ul.products li:hover div.right > a.toggle, ul.products li div.right > a.toggle {
    color: white;
    text-decoration: none;
}

ul.products li div.right > a.hide.confirm {
  background-color: #17A829;
}

ul.products li:hover div.right a.toggle:hover {
    color: white;
    text-decoration: none;
    background-color: #666;
}

ul.products a.edit {
    position: relative;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url(../img/edit.svg);
    background-repeat: no-repeat;
    background-position: center;
    margin: -6px -10px;
    z-index: 2;
    opacity: 0.7;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    filter: alpha(opacity=70);
}

ul.products a.edit:hover,
ul.products a.szdt:hover {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
}

ul.products a.szdt {
    position: relative;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url(../img/szdt.svg);
    background-repeat: no-repeat;
    background-position: center;
    margin: -6px 11px;
    z-index: 2;
    opacity: 0.7;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    filter: alpha(opacity=70);
}

ul.products a.szdt.disabled {
    opacity: .4;
}

ul.products a.szdt.disabled:hover {
    opacity: .5;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);
}


/*ul.products a.delete {*/
a.delete {
    display: inline-block;
    margin: 15px 0 8px 0;
    font-size: 11px;
    color: #888;
    background-image: url(../img/x-mini.png);
    background-repeat: no-repeat;
    background-position: -1px 8px;
    padding-left: 12px;
    cursor: pointer;
}

ul.products a.delete:hover {
    text-decoration: none;
    color: #333;
}

ul.products a.submit-name {
    position: relative;
    display: none;
    background-color: #A81717;
    color: white;
    /*text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6);*/
    font-weight: bold;
    padding: 0 6px;
    font-size: 12px;
    /*border: 1px solid #A81717;
    background-image: url(../img/button-plus.svg);*/
    text-decoration: none;
    margin-bottom: -7px;
    z-index: 2;
}

.lt-ie9 ul.products a.submit-name {
    background-image: url(../img/button-plus.png);
}

ul.products a.submit-name:hover {
    text-decoration: none;
    background-color: #333;
    border-color: #333;
}

span.code, td.code {
    font: 13px/21px "Courier New", Courier, monospace;
    text-transform: uppercase;
    padding-left: 4px;
}

td.code {
    padding-left: 2px;
}

.licenser-title span.code {
    font-size: 13px;
    font-weight: bold;
}

span.red {
    color: #A81717;
    font-weight: bold;
    padding-left: 4px;
}

span.green {
    color: #270;
    font-weight: bold;
    padding-left: 4px;
}

div.actions {
    margin: 0 -30px;
    padding: 15px 30px;
    background-color: #eee;
    border-top: 1px solid #ccc;
    text-align: center;
}

#simplemodal-container div.actions {
    text-align: left;
}

.actions .button.plus {
  min-width: 28%;
  max-width: 28%;
  text-align: center;
}

.actions .button.plus:last-of-type {
  margin: 0;
}

ul.selector {
    position: relative;
    margin: 13px 0 -16px -2px;
    padding: 0;
    z-index: 1;
    text-align: left;
}

ul.selector li {
    display: inline-block;
}

ul.selector li a {
    display: inline-block;
    padding: 5px 10px;
    color: #666;
    border: 1px solid transparent;
}

ul.selector li a:hover {
    text-decoration: none;
    color: #A81717;
}

ul.selector li.active a {
    color: #A81717;
    background-color: white;
    border: 1px solid #ddd;
    border-bottom-color: white;
    cursor: default;
}

footer {
    font-size: 12px;
    color: #999;
    padding: 10px 0;
    height: 20px;
    margin-top: 35px;
}

footer p {
    float: left;
}

footer ul {
    float: right;
}

footer ul li {
    display: inline-block;
    list-style: none;
    margin-left: 10px;
}

footer ul li a {
    color: #999;
}

footer ul li a:hover {
    color: #A81717;
    text-decoration: none;
}

a#top {
    position: relative;
    display: none;
    width: 41px;
    height: 41px;
    margin: 35px 0;
    margin-left: 50%;
    left: -26px;
    background-color: #ccc;
    border: 5px solid white;
    border-radius: 50px;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.4);
    background-image: url(../img/top.png);
    background-repeat: no-repeat;
    background-position: left top;
}

a#top:hover {
    background-color: #A81717;
    background-position: left bottom;
}

table {
    width: 100%;
    margin-left: -2px;
}

thead tr {
    color: #222;
    border-bottom: 1px solid #bbb;
    margin-top: 2px;
}

tbody tr {
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd; 
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

tbody:hover tr {
    color: #ccc;
}

tbody:hover tr:hover {
    color: #111;
}

th, td {
    padding: 2px 10px 2px 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 60px;
    text-align: left;
}

ul.buttons {
    margin: 0 0 0 -1px;
    padding: 15px 0 9px 0;
    list-style: none;
}

ul.buttons li {
    display: inline-block;
    margin-right: 8px;
    margin-bottom: 5px;
}

ul.buttons a {
    position: relative;
    display: inline-block;
    background-color: #A81717;
    color: white;
    /*text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.7);*/
    padding: 4px 9px 4px 9px;
    margin-top: 5px;
    line-height: 23px;
    /*background-image: url(../img/button-small-gradient.png);
    background-repeat: repeat-x;
    box-shadow: 0 1px 0 white, inset 0 1px 0 rgba(255, 255, 255, 0.2);
    border: 1px solid #A81717;*/
    -moz-transition: 0.2s ease;
    -webkit-transition: 0.2s ease;
    -o-transition: 0.2s ease;
    transition: 0.2s ease;
    min-width: 135px;
    text-align: center;
}

ul.buttons a.delete {
    background-color: #888;
    border-color: #666;
}

ul.buttons a.delete:after {
    content: "";
    float: right;
    position: relative;
    display: block;
    width: 15px;
    height: 15px;
    background-image: url(../img/delete.png);
    margin: 3px -2px 3px 8px;
}

ul.buttons a:hover {
    background-color: #333;
    border-color: #111;
    text-decoration: none;
}

div.lightbox {
    position: absolute;
    display: block;
    background-color: white;
    top: 50%;
    left: 50%;
    margin-left: -520px;
    margin-top: -290px;
    width: 1000px;
    height: 550px;
    padding: 20px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.8);
    z-index: 99;
    overflow: hidden;
}

div.lightbox:before {
    content: "";
    position: absolute;
    display: block;
    background-color: #eee;
    border-bottom: 1px solid #ddd;
    left: 0;
    top: 0;
    right: 0;
    height: 90px;
}

div.lightbox-bg {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(30, 30, 30, 0.9);
    z-index: 98;
}

div.lightbox-bg span.close {
    position: absolute;
    display: block;
    right: 5px;
    top: 5px;
    width: 34px;
    height: 34px;
    cursor: pointer;
    z-index: 99;
    background-image: url(../img/close-lightbox.svg);
    opacity: 0.6;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
    filter: alpha(opacity=60);
    -moz-transition: 0.2s ease;
    -webkit-transition: 0.2s ease;
    -o-transition: 0.2s ease;
    transition: 0.2s ease;
}

.lt-ie9 div.lightbox-bg span.close {
    background-image: url(../img/close-lightbox.png);
}

div.lightbox-bg div.surface {
    position: absolute;
    width: 100%;
    height: 100%;
}

div.lightbox-bg span.close:hover {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
}

div.slider {
    position: relative;
    display: block;
    margin-top: 40px;
}

div.slider div.contents {
    position: absolute;
    display: block;
    width: 999999px;
}

div.slider div.contents > div {
    position: relative;
    display: block;
    float: left;
    width: 1000px;
    margin-right: 20px;
    min-height: 100px;
}

div.slider.singlecontent div.contents > div {
    width: 1020px;
}

div.slider div.contents > div.single > div, div.slider div.contents > div.float > div {
    padding: 10px 60px;
}

div.slider div.contents > div.two, div.slider div.contents > div.three {
    padding: 0 45px;
}

div.slider div.contents > div.two > div {
    padding: 15px;
    width: 425px;
    float: left;
}

div.slider div.contents > div.three > div {
    padding: 14px;
    width: 275px;
    float: left;
}

div.slider.singlecontent div.contents > div.three > div {
    width: 300px;
}

div.slider.singlecontent div.contents > div {
    margin: 5px -10px !important;
    padding: 0;
}

div.slider.singlecontent div.contents > div > div {
    padding: 20px !important;
}

div.slider div.contents img {
    max-width: 100%;
    float: left;
    margin-bottom: 15px;
}

div.slider div.contents > div.float > div img {
    margin-right: 15px;
}

div.slider div.contents p {
    min-width: 200px;
}

div.slider span.prev, div.slider span.next {
    position: absolute;
    display: block;
    cursor: pointer;
    width: 65px;
    height: 74px;
    top: 170px;
    left: -10px;
    opacity: 0.6;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
    filter: alpha(opacity=60);
    background-image: url(../img/prev.png);
    -moz-transition: 0.2s linear;
    -webkit-transition: 0.2s linear;
    -o-transition: 0.2s linear;
    transition: 0.2s linear;
}

div.slider span.next {
    right: -10px;
    left: auto;
    background-image: url(../img/next.png);
}

div.slider span.prev:hover, div.slider span.next:hover {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
}

div.slider ul.menu {
    position: absolute;
    display: block;
    text-align: center;
    margin: 0;
    padding: 0;
    top: 435px;
    list-style: none;
    left: 0;
    right: 0;
    line-height: 0;
    font-size: 0;
}

div.slider ul.menu li {
    position: relative;
    display: inline-block;
    width: 11px;
    height: 11px;
    padding: 7px;
    cursor: pointer;
}

div.slider ul.menu li a {
    position: relative;
    display: block;
    width: 11px;
    height: 11px;
    background-color: #999;
    border-radius: 10px; 
}

div.slider ul.menu li.active a, div.slider ul.menu li.active:hover a {
    background-color: #c02;
}

div.slider ul.menu li:hover a {
    background-color: #666;
}

.js .login div.checkboxes {
    display: none;
}

.login div#user {
    display: none;
}

.login nav.mysteinberg {
    display: none;
}

.login div#main {
    border-top: none;
}

::-ms-clear, ::-ms-reveal {
    display: none;
}

ul.typeselector {
    position: fixed;
    display: none;
    top: 0;
    left: -200px;
    padding: 20px;
    margin: 0;
    list-style: none;
    width: 180px;
    -moz-transition: left 0.3s ease;
    -webkit-transition: left 0.3s ease;
    -o-transition: left 0.3s ease;
    transition: left 0.3s ease;
}

ul.typeselector:hover {
    left: 0;
}

ul.typeselector li {
    font-size: 13px;
    cursor: pointer;
}

ul.typeselector li:hover {
    color: #A81717;
}

h2 {
    position: relative;
    margin: 20px 0;
    padding-top: 20px;
    font: 24px/27px alternate-gothic-no-2-d, Arial, Helvetica, sans-serif;
    color: #444;
}

h3 {
    color: #222;
    font-size: 16px;
    margin: 40px 0 15px 0;
    padding-left: 1px;
    border-bottom: 1px solid #ccc;
}

nav > ul > li > a {
    font: 24px/24px alternate-gothic-no-2-d, Arial, Helvetica, sans-serif;
    padding: 5px 8px;
    color: #666;
}

nav.mysteinberg li.active:after {
    bottom: -22px;
}

div.swn {
    position: absolute;
    display: block;
    width: 100%;
    min-height: 100px;
    background-color: #333;
    border-bottom: 1px solid white;
    color: #ccc;
    bottom: 100%;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
}

div.swn.error {
    background-color: #A81717;
    color: white;
}

div.swn div.wrapper {
    position: relative;
    display: block;
    width: 940px;
    padding: 20px;
    margin: 0 auto;
}

div.swn h1 {
    color: white;
    margin: 10px 0 15px 0;
    font-weight: normal;
}

p.teaser {
    margin: 25px -17px;
    padding: 17px;
    background-color: #ddd;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}

p.teaser span.disruptor {
    font: 14px/24px Arial, Helvetica, sans-serif;
    position: absolute;
    display: block;
    top: 25px;
    right: 25px;
    background-color: white;
    /*box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);*/
    padding: 13px 15px;
    width: 380px;
}

p.teaser span.disruptor span.title {
    display: block;
    font: 22px/27px alternate-gothic-no-2-d, Arial, Helvetica, sans-serif;
    color: #A81717;
    margin: 2px 0 10px 0;
}

p.teaser span.disruptor:before {
    content: "";
    position: absolute;
    display: block;
    width: 17px;
    height: 35px;
    /*background-image: url(../img/disruptor-arrow.png);*/
    background-image: url(../img/disruptor-arrow-noshadow.png);
    top: 22px;
    left: -16px;
}

a.download.pdf {
    background-image: url(../img/download-pdf.png);  /* Pfad zum angeh�ngten Bild*/
}

/* END */


/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 100%;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   Theses examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
       only screen and (min-resolution: 144dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow:none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}

/* vvv changes Fabian vvv */
.uibGreyedOut {opacity: 0.25;}
.uibActive {opacity: 1;}
input.validClass{border: 1px solid #2a0;}
input.validClass:focus {border-color: #2a0; outline-size: 1px; outline-color: #2a0;}

div.forms form > p.toggle, div.forms form > p.nontoggle {
    background-color: #555;
    color: white;
    font-weight: bold;
    padding: 10px 15px;
    margin: 10px 0 25px 0;
    /*text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
    background-image: url(../img/gradient.png);
    background-repeat: repeat-x;*/
    cursor: pointer;
    /*border: 1px solid #333;*/
    -moz-transition: background-color 0.2s linear;
    -webkit-transition: background-color 0.2s linear;
    -o-transition: background-color 0.2s linear;
    transition: background-color 0.2s linear;
  opacity: 1;
}

div.forms form > h2.toggle {
    color: black;
    padding: 10px 0px;
    margin: 10px 0 25px 0;
    cursor: pointer;
    -moz-transition: background-color 0.2s linear;
    -webkit-transition: background-color 0.2s linear;
    -o-transition: background-color 0.2s linear;
    transition: background-color 0.2s linear;
}

.teaser span.inputmessage {
    top: 32px;
    left: 507px;
    max-width: 415px;
}
 
.teaser span.inputmessage.hidden {
    left: 535px;
}

li.noproducts {
    padding: 30px 30px 30px !important;
}

div.infos > table {
    margin-bottom: 10px;
}

.buttonOnWhite {
    background-image: url(../img/button-on-white.svg) !important;
}
.renameelicenser {
  margin: 5px 0;
  clear: both;
}

.renameelicenser > span {
  position: absolute;
  padding-left: 10px;
  margin-left: 3px;
  color: #999;
}
.renameelicenser input, .renameelicenser textarea, .renameelicenser select {
  position: relative;
  margin: 0;
  border-width: 1px;
  padding: 6px;
  background: transparent;
  font: inherit;
}

div.infos > p > a.inputmessage {
    margin-top: 10px;
}



/* ^^^ changes Fabian ^^^ */


/* changes Sven */
span.hidden_label {
    display: none !important;
}

p.hidden_content {
    display: none !important;
}

div.hidden_content {
    display: none !important;
}

.errormessage.hidden {
   display: none !important;
}

span.errormessage a.yes {
  cursor:pointer;
}

span.errormessage a.no {
    cursor:pointer;
}

a.createNewAccountButton {
    cursor:pointer;
}

.login h3 {
    margin: 5px 0 -10px 0;
}

a.srf_tab {
    cursor:pointer;
}

form.hidden {
    display: none !important;
}

span.required:after {
    content: "*";
    color: #c01;
}


/* ^^^ changes Sven ^^^*/

h1 {
    position: relative;
    margin: 0 0 28px 0;
    font: 46px/54px alternate-gothic-no-2-d, Arial, Helvetica, sans-serif;
    color: #A81717;
}

h2 {
    position: relative;
    margin: 20px 0;
    padding-top: 12px;
    font: 24px/27px alternate-gothic-no-2-d, Arial, Helvetica, sans-serif;
    color: #444;
}

nav > ul > li > a {
    font: 24px/24px alternate-gothic-no-2-d, Arial, Helvetica, sans-serif;
    padding: 5px 8px;
    color: #666;
}

nav.mysteinberg li.active:after {
    bottom: -22px;
}

@-webkit-keyframes buttonload {
  0%   { left: 0; right: auto; width: 0%; }
  50%  { left: 0; right: auto; width: 100%; }
  51% { left: auto; right: 0; }
  100% { left: auto; right: 0; width: 0%; }
}
@-moz-keyframes buttonload {
  0%   { left: 0; right: auto; width: 0%; }
  50%  { left: 0; right: auto; width: 100%; }
  51% { left: auto; right: 0; }
  100% { left: auto; right: 0; width: 0%; }
}
@-o-keyframes buttonload {
  0%   { left: 0; right: auto; width: 0%; }
  50%  { left: 0; right: auto; width: 100%; }
  51% { left: auto; right: 0; }
  100% { left: auto; right: 0; width: 0%; }
}
@keyframes buttonload {
  0%   { left: 0; right: auto; width: 0%; }
  50%  { left: 0; right: auto; width: 100%; }
  51% { left: auto; right: 0; }
  100% { left: auto; right: 0; width: 0%; }
}

.zdtreason {
	position: relative;
	display: inline-block;
}

#zdtchoosearrow {
	position: absolute;
	background-color: #A81717;
	color: white;
	right: -150px;
	-webkit-transform: rotate(25deg);
	-moz-transform: rotate(25deg);
	-ms-transform: rotate(25deg);
	-o-transform: rotate(25deg);
	transform: rotate(25deg);
	padding: 0 10px;
	bottom: -30px;
	font: 25px/43px 'alternate-gothic-no-2-d', Arial, Helvetica, sans-serif;
	opacity: 0;
}

.japan #zdtchoosearrow {
	font: 16px/43px "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
	-webkit-transform: rotate(14deg);
	-moz-transform: rotate(14deg);
	-ms-transform: rotate(14deg);
	-o-transform: rotate(14deg);
	transform: rotate(14deg);
	bottom: -16px;
	right: -180px;
}

#zdtchoosearrow:before {
	content: '';
	width: 0;
	height: 0;
	position: absolute;
	left: -30px;
	left: -39px;
	top: -13px;
	border-bottom: 35px solid transparent;
	border-right: 40px solid #A81717;
	border-top: 35px solid transparent;
	outline: none;
}

#simplemodal-overlay {
	background-color:#000;
}
#simplemodal-container {
	background-color:#FFF; 
	border:2px solid #444; 
	width: 525px; 
	height: auto !important;
	max-height: 700px;
	overflow-y: auto;
	overflow-x: hidden;
	padding-bottom: 50px;
}
#simplemodal-container article {
	padding: 25px 0 0 0;
}
#simplemodal-container .actions {
	margin: 0;
	border-bottom: 1px solid #ccc;
}          
#simplemodal-container .actions p {
	margin-left: -15px;
}          
#simplemodal-container .actions a {
	margin-left: -15px;
}

#simplemodal-container .actions a:not(.button) {
  margin: 0;
}      

#simplemodal-container .products {
	border: none;
}          
#simplemodal-container .reactivable {
	padding-left: 40px;
} 

ul.products > li.reactivable {
  background-color: white;
  border: 1px solid #ddd;
}

#simplemodal-container .reactivable:nth-child(even) {
	border: 1px solid #ddd;
	background-color:white;
}
#simplemodal-container .reactivable:hover {
	background-color: rgba(187, 0, 34, 0.02);
	border: 1px solid rgba(187, 0, 34, 0.4);
}
#simplemodal-container .reactivable:last-of-type {
	margin-bottom: 20px;
}
#simplemodal-container .csc-default {
	padding-left: 15px;
}

ul.products > li.highlite {
	width: 960px;
	left: -33px;
	outline: 5px double #A81717;
}

#switchtoregularview {
    cursor: pointer;
}

.japan input[type="submit"]
, .japan .button
, .japan .submit {
	font: 16px/43px "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
}

.softwarewizard {
    text-align: center;
}

.softwarewizard h2
, .softwarewizard p {
    text-align: left;
}

.softwarewizard h4 {
    text-align: left;
    border-bottom: 1px solid #444;
}

.softwarewizard .allproducts .newproduct {
    width: auto;
    text-align: left;
    border-left: none;
    padding: 0;
}

.infos .vouchervisual
, .infos .description {
    display: inline-block;
    vertical-align: top;
}

.infos .description {
    max-width: 530px;
}

.vouchervisual {
    min-height: 200px;
    padding: 0 10px 10px 0;
    margin-left: -55px;
}

.vouchervisual img {
    max-width: 200px;
    max-height: 250px;
    height: auto;
}

.voucherlink {
    text-align: right;
    margin-top: 20px !important;
}

.voucherlink .button.plus {
    padding: 10px 20px;
    font: 22px/29px 'alternate-gothic-no-2-d', Arial, Helvetica, sans-serif;
    margin: 0;
}