/*! Charaf-Theme für web4design Shopbewertungen | MIT License */
html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid #C9963A;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}

/* Google Fonts — Cinzel & Cormorant Garamond & DM Sans */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;700&family=Cormorant+Garamond:ital,wght@0,300;0,400;1,300&family=DM+Sans:wght@400;500;700&display=swap');

*, *:before, *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

html, body {
    background: #0D0A06;
    font-family: 'DM Sans', sans-serif;
    color: #F7F0E3;
}

.clrnone {clear:both;height:0;width:0;overflow: hidden;display: block;}

p {font-size: 0.95em; color: rgba(247,240,227,0.7);}

a:link, a:visited {color: #C9963A; text-decoration:none;}
a:hover, a:active {color: #e8b84b;}

.tleft {text-align:left;}
.tcenter {text-align:center;}
.tright {text-align:right;}

.floatleft {float:left;}
.floatright {float:right;}

/* ----------------------------------------------------------------------------- */
.wrapper {
    background: #1A1408;
    margin: 2em auto 0 auto;
    max-width: 65.8125em;
    min-height: 100%;
    box-shadow: 0 10px 40px rgba(0,0,0,0.5);
    padding-bottom: 2em;
    border: 1px solid rgba(201,150,58,0.25);
}

.thegradient {
    background: #241C0C;
    border: 1px solid rgba(201,150,58,0.25);
    border-radius: 0;
}

.langboxtop {
    background: #0D0A06;
    text-align: right;
    border-bottom: 1px solid rgba(201,150,58,0.15);
}

.langboxtop img {margin-right: 0.5em;}
.langflag {display:none;}
.langnames {padding: 0.5em;}
.langnames a { margin-left: 0.5em; border-left: 1px solid rgba(201,150,58,0.2); padding: 0.2em 0.5em 0.2em 0.5em;}

.toptexthide, .reviewboxhide, .leftsidehidden {display:none;}
.toptext {display:none;}

.toptext h1 {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 1.8em;
    margin: 0;
    padding: 0.2em 0 0 0.2em;
    text-align: center;
    color: #F7F0E3;
    font-weight: 400;
    letter-spacing: 0.05em;
}

.toptext p {display:none; color: rgba(247,240,227,0.6);}

.backtoshop {
    text-align: center;
    margin: 0.2em;
    padding: 0.2em;
}

.backtoshop img{
    width:12.5em;
    height:6.25em;
    float:left;
    filter: brightness(1.1);
}

.captchaimg {
    width:10.5em;
    height: auto;
    border: 1px solid rgba(201,150,58,0.25);
}

.backtoshop span {
    display: block;
    margin: 2em 0 0 0.8em;
    font-weight: 700;
    font-family: 'Cinzel', serif;
    color: #C9963A;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-size: 0.85em;
}

h1.headerTopShow {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 1.3em;
    color: #F7F0E3;
    font-weight: 400;
}

.shopreviewboxmainbg {
    background: #1A1408;
    border-top: 1px solid rgba(201,150,58,0.2);
    border-bottom: 1px solid rgba(201,150,58,0.2);
    padding: 0.4em;
    margin: 0.6em 0 0 0;
    clear:both;
}

.shopreviewbox {
    background: #241C0C;
    border: 1px solid rgba(201,150,58,0.35);
    margin: 0.4em auto 0.4em auto;
    text-align: center;
    width: 14em;
    box-shadow: 0 4px 20px rgba(201,150,58,0.1);
}

.shopreviewboxinner {border: 1px solid rgba(201,150,58,0.15); padding: 5px;}

.shopreviewboxtitle {
    font-family: 'Cinzel', Georgia, serif;
    font-weight: 700;
    font-size: 1em;
    margin: 0 0 0.4em 0;
    padding: 0.3em 0 0.3em 0;
    border-bottom: 1px solid rgba(201,150,58,0.3);
    color: #C9963A;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

.reviewValue {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 1.8em;
    padding: 0.2em 0;
    margin: 0;
    font-weight: 700;
    color: #F7F0E3;
}

.ratingValue {
    margin: 0;
    padding: 0.2em 0;
    font-weight: 400;
    font-size: 1em;
    font-family: 'Cormorant Garamond', serif;
    font-style: italic;
    color: #C9963A;
}

.mainContent {
    width: 100%;
    padding: 0.4em;
}

.mainContentTopShow {display:none;}

.titlebox {
    padding: 0.5em 0.2em 0.675em 0.2em;
    margin: 0 0 0.5em;
    font-family: 'Cinzel', Georgia, serif;
    font-weight: 400;
    border-bottom: 1px solid rgba(201,150,58,0.25);
    font-size: 1em;
    color: #C9963A;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

/* left side shopreview-page */
.leftside {
    width: 100%;
    padding: 0 0.4em 0.4em 0.4em;
}

.leftside h2 {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 1.05em;
    margin: 0;
    padding: 0 0 0.3em 0;
    color: #C9963A;
    font-weight: 400;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.leftdetailtab, .leftdetailtabreview {
    border: 1px solid rgba(201,150,58,0.25);
    width: 100%;
    font-size: 0.85em;
    background: #0D0A06;
    color: rgba(247,240,227,0.85);
}

.leftdetailtab caption {
    font-family: 'Cinzel', serif;
    font-size: 0.95em;
    text-align: left;
    padding: 0.4em 0.3em;
    border: 1px solid rgba(201,150,58,0.25);
    border-bottom: 0;
    font-weight: 400;
    color: #C9963A;
    background: #241C0C;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.leftdetailtab td, .leftdetailtabreview td {
    padding: 0.4em;
    border-bottom: 1px solid rgba(201,150,58,0.12);
}

.ldttdwidth {width:125px;}

.leftdetailtabreview th {
    font-family: 'Cinzel', serif;
    font-size: 0.95em;
    text-align: left;
    padding: 0.4em 0.3em;
    border-bottom: 1px solid rgba(201,150,58,0.25);
    font-weight: 400;
    color: #C9963A;
    background: #241C0C;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.abuttondefault {
    border-radius: 0;
    padding: 0.8em 1.2em;
    font-family: 'Cinzel', serif;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    cursor: pointer;
    display: block;
    text-align: center;
    font-size: 0.85em;
}

.openbox {
    padding: 0.4em;
    margin: 0.7em 0 0.7em 0;
    font-family: 'Cinzel', serif;
    font-weight: 400;
    color: #C9963A;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    cursor: pointer;
    display: block;
    text-align: center;
    font-size: 0.9em;
}

.opendetail {
    display: none;
    background: #241C0C;
    border: 1px solid rgba(201,150,58,0.25);
    padding: 0.6em;
    margin: 0.5em 0 0.5em 0;
}

.opendetail h2 {margin: 0.4em 0 0.2em 0;}

a.votebutton {
    background: linear-gradient(135deg, #C9963A, #e8b84b, #C9963A);
    border: 1px solid #C9963A;
    color: #0D0A06 !important;
    font-family: 'Cinzel', serif;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    padding: 0.9em 1.5em;
    display: inline-block;
    text-align: center;
    transition: all 0.2s ease;
}

a.votebutton:hover {
    background: linear-gradient(135deg, #e8b84b, #C9963A, #e8b84b);
    box-shadow: 0 4px 20px rgba(201,150,58,0.4);
}

.rightvotebutton {display:none;}
.appearbutton {display:none;}

.shopreviewok {
    border: 1px solid #4CAF50;
    background: rgba(76,175,80,0.1);
    color: #4CAF50;
    font-weight: bold;
    margin: 0 0 0.5em;
    padding: 0.6em;
    text-align: center;
    font-size: 0.9em;
}

.valuationSelect {
    margin: 0 0 1em 0;
    padding: 0;
    overflow: hidden;
    list-style-type: none;
    clear: both;
    border: 1px solid rgba(201,150,58,0.2);
}

.valuationSelect li {
    width: 25%;
    float: left;
    display: block;
    text-align: center;
    margin: 0;
    padding: 0.5em 0.3em;
    font-size: 0.8em;
    list-style-type: none;
    font-family: 'Cinzel', serif;
    font-weight: 400;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.positive a {color: #4CAF50; display: block; text-decoration: none;}
.negative a {color: #E57373; display: block; text-decoration: none;}
.neutrale a {color: #FFD54F; display: block; text-decoration: none;}
.all a {color: #F7F0E3; display: block; text-decoration: none;}

.bactive {
    margin: 0;
    padding: 0.3em;
    background: #241C0C;
    border: 1px solid rgba(201,150,58,0.35);
    border-radius: 0;
}

.bnonactive {
    overflow: hidden;
    margin: 0;
    border: 1px solid transparent;
    border-radius: 0;
    padding: 0.3em;
}

.shopvotingbox {
    padding: 0.8em;
    background: #241C0C;
    border: 1px solid rgba(201,150,58,0.25);
    border-radius: 0;
    margin: 0.4em 0.4em 1em 0.4em;
    font-size: 0.95em;
}

.titlecomment {
    font-family: 'Cinzel', serif;
    font-weight: 400;
    margin: 0 0 0.3em 0;
    font-size: 1em;
    color: #C9963A;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.admincomment {
    padding: 0.6em;
    background: #0D0A06;
    border-left: 3px solid #C9963A;
    border-radius: 0;
    margin: 0.4em;
    font-size: 0.9em;
    color: rgba(247,240,227,0.7);
}

.littlegrey {color: rgba(247,240,227,0.4);}

.shopvotingboxhr {
    background: rgba(201,150,58,0.15);
    color: rgba(201,150,58,0.15);
    height: 1px;
    border: none;
    margin: 0.5em 0 0.5em 0;
    padding: 0;
}
.hrwidth {margin: 1em 0 1em 0;}

.shopvotingboxauthor {
    float: left;
    padding: 0.4em 0 0.4em 0;
    margin: 0;
    font-family: 'Cormorant Garamond', serif;
    font-style: italic;
    color: #C9963A;
    font-size: 1.05em;
}

.shopvotingdate {
    float: right;
    padding: 0.4em 0 0.4em 0;
    margin: 0;
    font-size: 0.85em;
    color: rgba(247,240,227,0.5);
}

.shopvotingnavbar {
    font-size: 11px;
    text-align: center;
    padding: 20px 0 0 0;
}

.shopvotingnavbar a {
    padding: 0.8em 1.2em;
    border: 1px solid rgba(201,150,58,0.3);
    background: #241C0C;
    border-radius: 0;
    color: #C9963A;
    font-family: 'Cinzel', serif;
    letter-spacing: 0.15em;
}

.shopvotingnavbar a:hover {background: #C9963A; color: #0D0A06;}

.shopvotingnavbar strong {
    padding: 0.8em 1.2em;
    border: 1px solid #C9963A;
    background: #C9963A;
    border-radius: 0;
    color: #0D0A06;
    font-family: 'Cinzel', serif;
    letter-spacing: 0.15em;
}

.shopreviewLoginBox input[type="text"], 
.shopreviewLoginBox input[type="password"], 
.shopreviewLoginBox textarea,
.votingdetailtab input[type="text"],
.votingdetailtab textarea {
    border: 1px solid rgba(201,150,58,0.3);
    border-radius: 0;
    padding: 0.5em;
    background: #0D0A06;
    color: #F7F0E3;
    font-family: 'DM Sans', sans-serif;
}

.shopreviewLoginBox input:focus, 
.votingdetailtab input:focus,
.votingdetailtab textarea:focus {
    outline: none;
    border-color: #C9963A;
    box-shadow: 0 0 0 2px rgba(201,150,58,0.2);
}

.shopreviewLoginBox button, 
button[type="submit"] {
    width: 100%;
    border-radius: 0;
    padding: 0.9em 1.5em;
    font-family: 'Cinzel', serif;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    cursor: pointer;
    display: block;
    text-align: center;
    background: linear-gradient(135deg, #C9963A, #e8b84b, #C9963A);
    border: 1px solid #C9963A;
    color: #0D0A06;
    transition: all 0.2s ease;
}

.shopreviewLoginBox button:hover, 
button[type="submit"]:hover {
    background: linear-gradient(135deg, #e8b84b, #C9963A, #e8b84b);
    box-shadow: 0 4px 20px rgba(201,150,58,0.4);
}

.shopreviewLoginBox h2 {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 1.2em;
    padding: 0 0 0.3em 0;
    margin: 0;
    border-bottom: 1px solid rgba(201,150,58,0.25);
    color: #F7F0E3;
    font-weight: 400;
    letter-spacing: 0.1em;
}

.shopreviewLoginBox h3 {
    text-align: center;
    font-family: 'Cinzel', serif;
    color: #C9963A;
    letter-spacing: 0.1em;
}

.shopreviewLoginBox label {display: block; padding: 1em 0 0.5em 0; clear: both;}

.shopreviewLoginBox label p {
    float: left;
    min-width: 115px;
    padding: 0.4em 0 0 0;
    margin: 0;
    color: rgba(247,240,227,0.7);
}

.shopreviewLoginBox input.binputError {border: 1px solid #E57373; background: rgba(229,115,115,0.1);}

.notregister {padding: 0;}
.berror {color: #E57373; display: block; font-size: 0.75em; margin-top: 0.3em;}

.oblistar {color: #E57373;}
.oblifields {font-size: 0.75em; color: #E57373;}

.dlstarbox {margin: 0; padding: 0; clear: both;}
.dlstarbox dt {float: left; width: 7.5em; padding-top: 0.2em; font-weight: bold; color: #C9963A; font-family: 'Cinzel', serif; font-size: 0.9em; letter-spacing: 0.08em;}

.boxvotesub {border: 1px solid rgba(201,150,58,0.25); padding: 0.6em; background: #241C0C;}
.dlstarboxsub {margin: 0; padding: 0; clear: both;}

.starshop {background: #0D0A06;}

.subvotingtab {
    border-spacing: 0;
    border-collapse: separate;
    border: 1px solid rgba(201,150,58,0.25);
    border-bottom: 0;
    width: 100%;
}

.subvotingtab td {
    border-bottom: 1px solid rgba(201,150,58,0.15);
    padding: 0.5em;
}

.votingdetailtab {
    border-spacing: 0;
    border-collapse: separate;
    border-bottom: 0;
    width: 100%;
}

.votingdetailtab td {
    padding: 0.3em;
    vertical-align: top;
}

.votingdetailtab input, .votingdetailtab textarea {width: 100%;}

.optname {font-size: 0.75em; color: rgba(247,240,227,0.5);}

.firsttd {
    width: 8.3em;
    font-family: 'Cinzel', serif;
    font-weight: 400;
    color: #C9963A;
    font-size: 0.9em;
    letter-spacing: 0.05em;
}

input[type="text"].characterleft {
    background: #241C0C;
    width: 3.5em;
    margin-top: 0.3em;
    color: #F7F0E3;
}

.remainingcharacter {font-size: 0.75em; color: rgba(247,240,227,0.5);}

.voteinfo {display: block; float: left; margin: 0.4em 0 0 0.6em; font-size: 0.85em; color: rgba(247,240,227,0.6);}

.shopreviewwritebox h3 {text-align: left; font-size: 1em; font-family: 'Cinzel', serif; color: #C9963A; letter-spacing: 0.1em;}

input[type="text"].captchainput {width: 7em;}

.privacytextbox {
    border: 1px solid rgba(201,150,58,0.25);
    padding: 0.6em;
    max-height: 100px;
    overflow: auto;
    font-size: 0.9em;
    background: #0D0A06;
    color: rgba(247,240,227,0.75);
}

.privacycheckboxbox {
    border: 1px solid transparent;
    padding: 0.3em;
}

.privacycheckboxbox label {padding: 0; margin: 0; color: #F7F0E3;}

.closed { background:url(img/arrow_up.png) right no-repeat; display:block; }
.open { background:url(img/arrow_down.png) right no-repeat;}

/* errors */
.loginerrorinfobox {
    border: 1px solid #E57373;
    background: rgba(229,115,115,0.1);
    padding: 0.6em;
    display: block;
    color: #E57373;
    font-size: 0.85em;
    font-weight: bold;
    text-align: center;
}

input.redbordererror, textarea.redbordererror {
    border: 1px solid #E57373 !important;
    background: rgba(229,115,115,0.1);
}

.voteerrorbox {
    border: 1px solid #E57373;
    background: rgba(229,115,115,0.1);
    margin-bottom: 0.8em;
    padding: 0.6em;
    font-size: 0.85em;
    color: #E57373;
}
.voteerrorbox ul {margin: 0 0 0 1em; padding: 0;}
.voteerrorbox ul li {padding: 0.2em 0 0.2em 0;}
.borderred {border: 1px solid #E57373; background: rgba(229,115,115,0.1);}
.trerror {border: 1px solid #E57373; background: rgba(229,115,115,0.1);}
.borderred td {border-bottom: none;}

.copybottom {
    background: #0D0A06;
    border: 1px solid rgba(201,150,58,0.15);
    border-top: 0;
    padding-right: 0.7em;
    margin: 0 auto 0 auto;
    max-width: 65.8125em;
    height: 1.5em;
    color: rgba(247,240,227,0.3);
    text-align: right;
}

.copybottom span {font-size: 0.7em;}
.copybottom a {color: rgba(201,150,58,0.5);}

/* Responsive */
@media only screen and (min-width: 30.8em) {
    .backtoshop {
        border: none;
        text-align: center;
        float: right;
        margin: 0.4em 0.6em 0.4em 1em;
        height: 8em;
        width: 12.5em;
    }
    .backtoshop img{float: left;}
    .leftdetailtabreview {width: 25em;}
    .shopreviewboxmainbg {background: none; margin: 0; padding: 0; border: none; clear: none;}
    .backtoshop img {min-width: 100%; float: none;}
    .backtoshop span {clear: both; display: block; margin: 0;}
    .shopreviewbox {float: left; width: 14em; margin: 0.4em 1em 0 0.4em;}
    .leftside {clear: both;}
    .shopreviewLoginBox {clear: both; border-top: 1px solid rgba(201,150,58,0.2); padding-top: 0.5em;}
}

@media only screen and (min-width: 44em) {
    .toptext {display: block; font-size: 0.9em;}
    .toptext p {font-size: 0.9em; margin: 0.5em 0.4em 0 0.4em; padding: 0; display: inherit; color: rgba(247,240,227,0.55);}
    .toptext h1 {text-align: left; margin-left: 0.2em; font-size: 1.6em;}
    .shopreviewLoginBox {padding-top: 0.5em;}
}

@media only screen and (min-width: 47.5em) {
    .leftside {width: 40%; padding: 0.8em; float: left;}
    .leftsidehidden {display: block;}
    .mainContent {width: 60%; padding-top: 1em; float: left;}
    .leftdetailtabreview {width: 100%;}
    .opendetail {display: block; background: none; border: 1px solid transparent; padding: 0;}
    .opendetail h2 {text-decoration: none; margin-bottom: 0.5em; border-bottom: 1px solid rgba(201,150,58,0.2); padding-bottom: 0.3em;}
    .openbox {text-align: left; padding-top: 0;}
    .reviewboxhide {display: block;}
    .thegradient {background: none; border: none; border-bottom: 1px solid rgba(201,150,58,0.2); border-radius: 0;}
    .shopvotingboxhrhide {background: rgba(201,150,58,0.15); color: rgba(201,150,58,0.15); height: 1px; border: none; margin: 1em 0.4em 1em 0.4em; padding: 0; clear: both;}
    .toptext {display: block; font-size: 1em;}
    .toptext p {font-size: 0.9em; margin: 0.5em 0.4em 0 0.4em; padding: 0 1em 0 0; display: inherit;}
    .toptext h1 {text-align: left; margin-left: 0.2em; font-size: 2em;}
    .shopreviewLoginBox {clear: both; border-top: none;}
    .shopreviewLoginBox h3 {text-align: left; font-size: 1.1em; padding: 0 0 0.3em 0;}
    .appearbutton {clear: both; display: block; width: 12.5em; margin: 0; float: right; padding: 0.1em;}
    .buttonfloatleft {float: left; width: 12.5em;}
    .buttonfloatright {float: right; width: 12.5em;}
}

@media only screen and (min-width: 54.375em) {
    body {margin: 1em;}
    .copybottom {margin-bottom: 1.5em;}
    .langflag {display: block;}
    .langnames {display: none;}
    .leftside {width: 35%;}
    .mainContent {width: 65%;}
}

@media only screen and (min-width: 64em) {
    .leftside {width: 30%;}
    .mainContent {width: 70%;}
}