html, body, dialog {
    height: 100%;
    font-size: 12px;
    color: var(--color-gray-6) !important;
}

a{color:#031245; text-decoration:none;}
a:hover{color:#031245; text-decoration:underline; cursor:pointer;}
a#headlineText, #headlineText {font-size:12px; font-weight:bold; line-height:14px; color:#333; text-decoration:none;}

.textWarning {font-size:11px;	color:red;}
.headerNavText {float:left; padding:7px 0 0 5px; height:50px; text-decoration:none; visibility:hidden; opacity:0.7; -moz-opacity:0.7; cursor:pointer;}

/* header related stuff */
.border {margin:auto; padding:10px 0 0 5px; width:872px;}
.header, .headerAnalytics {padding: 5px 0 0 4px; width: 100%; height: 91px; background:url(/images/bgLogo.png) no-repeat; background-position:4px 15px;}
#headerMenu{width:100%; height:30px; background: #003681; font-weight:bold; color:#fff; text-align:left;}

a.menuLink{color:#fff; text-decoration:none;}
a.menuLink:hover{color:#fff; text-decoration:underline;}

/* the following id's are use for the basic page layout and create the navigation-colum, the content-colum and the teaser or shop-colum (if on index-page). */
#contentLeftTitle{float:left; padding-left:10px; width:660px; height:26px; background:url(/images/bgContentBoxTitle.gif);}
#contentRightTitle{float:right; padding:4px 0 0 10px; width:182px; height:22px; background:url(/images/bgFilterBoxTitle.gif); color:#fff;}
#contentWide{float:left; padding:15px 0 0 15px; width:833px; height:400px;}

.tabInactive:hover{
    text-decoration:underline; cursor:pointer;
}
.pictureBarLeft{
    float:left;
    padding:3px 0 0 5px;
    width:275px;
}
.pictureBarRight{
    float:left;
    padding:0 0 0 33px;
    width:295px;
}
.textBarRight{
    float:left;
    padding:0 0 0 35px;
    width:390px;
}
.textBarBlock{
    float:left;
    text-align: justify;
    padding:0 0 0 35px;
    width:250px;
}
#footer{
    margin:auto;
    height:5px;
    width:882px;
    background: url(/images/bgFooter.jpg) repeat-x;
}
/* end of page basic layout */


/* fonts, links and spacers */
h1{
    margin:0;
    font-family: "Trebuchet MS", Verdana;
    font-size:14px;
    /*font-weight:bold;*/
    color:#031245;
    /*color:#005399;*/
}
h1 span{font-size:18px; font-weight:normal; line-height:20px; color:#003a8e;}
h1 .grey{color:#57585a;}
h2, a.h2{margin:0; font-family:"Trebuchet MS", Verdana; font-size:15px; color:#57585a;}
h2 span{line-height:20px; color:#003a8e;}
.fett{
    font-family: "Trebuchet MS", Verdana;
    font-size:14px;
    /*font-weight:bold;*/
    color:#031245;
    /*color:#005399;*/
}
.grey{
    font-family: "Trebuchet MS", Verdana;
    font-size:18px;
    color:#aaaaaa;
}
.fettBlue{
    font-weight:bold;
    color:#031245;
}
.formular {
    width:160px;
    border:1px #000 solid;
    font-size: 11px;
    color: #000;
}
.whiteBold {
    color: #ffffff;
    font-weight:bold;
}
label{font-size:11px;}
textarea{
    padding: 3px;
    border:1px #000 solid;
    font-size: 11px;
    color: #000;
    line-height: 16px;
}

.aRight{text-align:right;}

.white{color:#fff;}
.green{color:#0f0;}
.red{color:#f00;}

.btnBigBox{float:left; padding-top:12px; width:178px; height:36px; text-align:center; cursor:pointer;}

.abstand{line-height:20px;}
:root .abstand{line-height:35px;}

img{border: 0px;}


/******************
adboxen */
.titleBarText {
    float:left;
    padding:3px 10px 0 10px;
    font-size:11px;
    color:#fff;
    text-decoration:none;
    position:relative;
    top:2px;
}
.contentBox {
    padding:15px 10px 0 20px;
    width:604px;
    color:#666;
    font-size:11px;
    background:url(/images/bgAlertBox1_0.jpg) no-repeat;
}
.boxLeft{
    float:left;
    width:148px;
}
.boxRight{
    float:right;
    padding:2px 0 0 10px;
    width:146px;
    height:18px;
    background:url(/images/spacer.gif);
    color:#fff;
    cursor:pointer;
}
.keywordBox {
    padding:10px 15px 0 15px;
    width:598px;
    height:67px;
    margin-bottom:15px;
    color:#99caff;
    font-size:11px;
    background:url(/images/bgKeywordBox.jpg) no-repeat;
}
.blueButtonBox {
    background:url(/images/bgOptionButton.jpg) no-repeat;
    float:left;
    height:48px;
    width:256px;
    line-height:17px;
    padding:10px 0 0 14px;
    color:#99caff;
}
.blueButtonBoxText {
    float:left;
    height:40px;
    width:202px;
    line-height:17px;
    color:#ffffff;
}
.blueButtonBoxCheck {
    float:left;
    height:40px;
    width:32px;
    padding:3px 0 0 0;
}

/******************
Filterfunktionen */
label{
    color:#666;
    cursor:pointer;
}

.selectFilter{
    width:170px;
}
.btnSubmit{
    height:18px;
    background:url(/images/buttonBlue26px.jpg);
    border:none;
    color:#fff;
    cursor:pointer;
}
.contentBoxBottom{
    margin-bottom:5px;
    width:634px;
    height:32px;
    background:url(/images/bgAlertBox3.jpg) no-repeat;
}

.visibilityBox{
    float: left;
    padding: 2px 0px 0px 2px;
    width:102px;
    height:9px;
    background:url(/images/visibilityBack.jpg);
}

/******************
ajaxBox */
#eins{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:#000;
    color:#fff;
    display:none;
}


#KWTDiv {
    white-space: nowrap;
    line-height: 14px;
    font-size: 15px;
    font-family: Courier;
    line-height: 14px;
    width: 70%;
    border-left: 1px solid gray;
    height: 380px;
    float: right;
    padding-left: 15px;
    overflow: auto;
}



/* TEMPLATE_AREAS */
#editAd #contentCol {
    display: grid;
    grid-template-areas:
            "bar bar bar"
            "box box box"
            "b c d";
    grid-template-columns: 33% 47% 20%;
    grid-auto-rows: 50px minmax(10px, 165px) 1fr;
    background: #fff;
    max-height: 90vh;
}
#editAd #contentCol #titleBar {
    grid-area: bar;
}
#editAd #contentCol #infoBox {
    grid-area: box;
}
#editAd #contentCol #contentLeft {
    grid-area: b;
}
#editAd #contentCol #contentRight {
    grid-area: c;
    border: solid lightgrey;
    border-width: 0 1px;
    margin: 0 -1px;
}
#editAd #contentCol #adVariationBox {
    grid-area: d;
    overflow: auto;
}


select {height:26px;}
input {height:20px;}
input:invalid {background: #fbbebe;}

#table_div {margin-top: 50px;}

.noaccess {background: url('/images/noaccess.png') no-repeat transparent 5px center;}

.google-visualization-table-td-number {text-align: center;}
.google-visualization-table-tr-over {cursor: pointer;}
.google-visualization-table-table {line-height: 20px;}

.posLeft {padding-left: 8px; text-align: left;}
.border {width: 1300px !important;}
.clear {clear:both;}
.tpl {display:none;}
.yellow, .nextRow {background:#ffff99 !important;}
.activeRow {background:#333 !important; color:#ccc !important;}
.bgGreen {background:green;}
    a.bgGreen:hover {background:#000; color:#fff; text-decoration:none;}
.btnAdopt {display:inline-block !important; margin-right:7px; width:30px; height:95px; font-size:14px; color:#dedede; line-height:95px; text-align:center; vertical-align:top;}
.btnAdoptTop {display:inline-block !important; margin-right:7px; width:110px; height:20px; font-size:14px; color:#dedede; text-align:center; vertical-align:top;}

#infoBox {display: grid; grid-template-columns: 1fr 1fr minmax(300px, 1fr); background:#3c3c3c; border:1px #333 solid; color:#828282;}
    #kundenInfoBox {float:left; padding:0 10px;}
        #kundenInfoTable td {height:30px; text-align:left; vertical-align:top; line-height:23px;}
            #kundenInfoTable td strong {color:#ffff99;}
        #kundenInfoTable tr td:first-child {text-align:right; padding-right:5px;}
        .adVariation {padding:5px; overflow:hidden;}
        .adVariation:nth-child(2n) {background:#eee;}
            .adHeadline {color:#002459; font-weight:bold;}
            .adLinkText {color:#64ad00; font-weight:bold;}
    #affiliateBox {float:left; padding-left:15px;}

#adDetails {height: 100%;}
#bgLayer {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.7); z-index:5;}
#alertAdLayer {display:none; position:fixed; left:50%; margin:-115px 0 0 -672px; width:1344px; height:95%; background:#eee; border:1px #cdcdcd solid; overflow-y:scroll; z-index:10;}
    .layerButton {float:right; margin:5px 10px 5px 0; height:24px; background:#dedede; border:0; color:#3c3c3c; text-decoration:none; line-height:24px; cursor:pointer;}
    .layerButton#closeLayer {background:#666; color:#dedede;}
        .layerButton:hover {background: var(--color-gray-3) !important; color:#dedede;}
            #contentRight {float:left; margin-left:5px; padding:10px 5px;}
                #contentRight input[type=text] {width:428px;}
                #contentRight input[name=url] {width:360px;}
                #contentRight td {text-align:left;}
                #contentRight .urlCheckTable td:first-child {text-align:right;}

            #affiliateBoxDetails {display:none; padding-left:25px; line-height:2.2em;}
                #affiliateBoxDetails > div {float:left; margin-right:15px;}
                    #affiliateBoxDetails > div:hover {color:#fff; cursor:pointer;}
                #affiliateBoxDetails span {display:inline-block; width:130px;}
                #affiliateBoxDetails tr td {text-align:left;}
                #affiliateBoxDetails tr td:first-child {padding-right:10px; text-align:right;}
                    #affiliateBoxDetails td input {width:166px;}
            .affiliateUrlType {display:none; width:92px;}
            .btnPreview {float:left; margin:2px 0 0; padding:0; width:23px; height:42px; border:0; line-height:42px; background:#666; color:#dedede; text-align:center;}
            @media screen and (-webkit-min-device-pixel-ratio:0) {
                .btnPreview {height: 48px;}
            }
            .btnPreview:hover {background: #000;}

            #contentLeft, #contentRight {overflow-y: auto;}
            #contentLeft .btnPreview {flex: 0 0 auto; margin: 0; height: inherit;}



.adStatus {text-align: center;line-height: 24px;}
.adStatus.grey {background:#333;color:#fff;}
.adStatus.green {background:green;color:#fff;}

#tabBar {height:25px; border-bottom:1px #ccc solid;}
    #tabBar ul {margin-top:1em; padding:0 0 0 10px; list-style-type:none; overflow:hidden;}
        #tabBar ul > li {float:left; margin-right:1px; padding:0 10px; height:24px; line-height:24px; background:rgba(0,0,0,.1); border:1px #ccc solid; border-radius:5px 5px 0 0; color:#646464; cursor:pointer;}
        #tabBar .bgRed {background:rgba(153,0,0,.1); color:rgba(153,0,0,1);}
            #tabBar ul > li:hover {background:rgba(0,0,0,.0); color:#333;}

        #tabBar .tabActive {background:#fff; border-bottom:1px #fff solid; color:#002459;}

#alertAdTable {border:#eee solid 1px; width:100%;}
    #alertAdTable tr {background:#fff;}
    #alertAdTable tr:nth-child(2n) {background:#eee;}
    #alertAdTable tr:hover {background:#dbddde;}
        #alertAdTable th {height:20px; line-height:20px;}

#alertAdTable button {height:30px;}

.redBG, #tabBar .redBG {background:#971e00; color:#fff;}
.greenBG, #tabBar .greenBG {background:#5fb067; color:#fff;}

.wrapperAdpoliceLoadingSpinner {
    position: fixed;
    top: 50vh;
    left: 50vw;
    margin: -35px 0 0 -35px;
    width: 70px;
    height: 70px;
    background: url(/images/tpl_spinner_l.gif) rgba(255,255,255,.9) 50% 50% no-repeat;
    background-size: 80%;
    border-radius: 50%;
    z-index: 1000;
}

.flexBox {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}