html{
    font-family: Verdana;
    font-size: 12px;
    background-color:#eeeeee;
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
body{
    background-color:#eeeeee;
}
/*Menu Bilder*/ 
img.OneBEPicture{
    width: 30px;
    border:solid 1px green;

}
img.TwoBEPicture{
    width: 60px;
    height: 70px;
    border:solid 1px green;
}
img.ThreeBEPicture{
    width: 90px;
    height: 70px;
    border:solid 1px green;
}

img.FourBEPicture{
    width: 120px;
    height: 70px;
    border:solid 1px green;
}
img.FiveBEPicture{
    width: 150px;
    height: 70px;
    border:solid 1px green;
}
img.SixBEPicture{
    width: 180px;
    height: 70px;
    border:solid 1px green;
}
img.TwelveBEPicture{
    width: 360px;
    height: 70px;
    border:solid 1px green;
}
img.TwelveBEPictureMenu{
    width: 180px;
    height: 70px;
    border:solid 1px green;
}
/*Menu Bilder für Seitenbleche*/
img.TwoHEPicture{
    width: 63px;
    height: 70px;
    border:solid 1px green;
}

img.TwoHEPictureDeep{
    width: 110px;
    height: 70px;
    border:solid 1px green;
}
img.FourHEPicture{
    width: 63px;
    height: 140px;
    border:solid 1px green;
}

img.FourHEPictureDeep{
    width: 110px;
    height: 140px;
    border:solid 1px green;
}
img.SixHEPicture{
    width: 63px;
    height: 210px;
    border:solid 1px green;
}
img.SixHEPictureDeep{
    width: 110px;
    height: 210px;
    border:solid 1px green;
}
img.EightHEPicture{
    width: 63px;
    height: 280px;
    border:solid 1px green;
}

img.EightHEPictureDeep{
    width: 110px;
    height: 280px;
    border:solid 1px green;
}

div.OneBEPictureOver{
    width: 30px;
    height: 70px;
    border:solid 1px red;
    background-repeat: no-repeat;
    background-size: 30px;
    opacity: 0.6;
}
div.separator{
    width:2px;
    height: 90px;
    background-color: red;
    position: absolute;  
    margin-top:-80px;
}
div.draggSYSBOXX{
    width: 30px;
    height: 70px;
    position: absolute;

}
div.draggSYSBOXXSide{
    width: 63px;
    height: 70px;
    position: absolute;


}

div.draggSYSBOXXSideDeep{
    width: 110px;
    height: 70px;
    position: absolute;

}

div.draggArea{
    width: 30px;
    height: 70px;

}
/*Bilder in der SYSBOXX (als Div dargestellt)*/
/*ein BE*/
div.viewOneBEPicture{
    width: 30px;
    border:dashed 1px green;
    height: 70px;
    background-repeat: no-repeat;
    background-size: 30px 100%;

}
/*inaktives Modul*/
div.viewOneBEPictureDark{
    width: 30px;
    border:dashed 1px grey;
    height: 70px;
    background: rgba(120,120,120,0.2);
    background-repeat: no-repeat;
    background-size: 30px 100%;
}
/*zwei BE*/
div.viewTwoBEPictureFirst{
    border:dashed 1px green;
    border-right: none;
    width: 30px;
    height: 70px;
    background-repeat: no-repeat;
    background-size: 60px 70px;
}
div.viewTwoBEPictureSecond{
    border:dashed 1px green;
    border-left: none;
    width: 30px;
    height: 70px;
    background-position: -30px 0px;
    background-size: 60px 70px;
    background-repeat: no-repeat;
}
/*drei BE*/
div.viewThreeBEPictureFirst{
    border:dashed 1px green;
    border-right: none;
    width: 30px;
    height: 70px;
    background-size: 90px 70px;
    background-repeat: no-repeat;
}
div.viewThreeBEPictureSecond{
    border:dashed 1px green;
    border-left: none;
    border-right: none;
    width: 30px;
    height: 70px;
    background-position: -30px 0px;
    background-size: 90px 70px;
    background-repeat: no-repeat;
}
div.viewThreeBEPictureThird{
    border:dashed 1px green;
    margin-left:-1px;
    border-left: none;
    width: 30px;
    height: 70px;
    background-position: -60px 0px;
    background-size: 90px 70px;
    background-repeat: no-repeat;
}

/*vier BE*/
div.viewFourBEPictureFirst{
    border:dashed 1px green;
    border-right: none;
    width: 30px;
    height: 70px;
    background-size: 120px 70px;
    background-repeat: no-repeat;
}
div.viewFourBEPictureSecond{
    border:dashed 1px green;
    border-left: none;
    border-right: none;
    width: 30px;
    height: 70px;
    background-position: -30px 0px;
    background-size: 120px 70px;
    background-repeat: no-repeat;
}
div.viewFourBEPictureThird{
    border:dashed 1px green;
    border-left: none;
    border-right: none;
    width: 30px;
    height: 70px;
    background-position: -60px 0px;
    background-size: 120px 70px;
    background-repeat: no-repeat;
}
div.viewFourBEPictureFourth{
    border:dashed 1px green;
    border-left: none;
    margin-left:-1px;
    width: 30px;
    height: 70px;
    background-position: -90px 0px;
    background-size: 120px 70px;
    background-repeat: no-repeat;
}

/*fünf BE*/
div.viewFiveBEPictureFirst{
    border:dashed 1px green;
    border-right: none;
    width: 30px;
    height: 70px;
    background-size: 150px 70px;
    background-repeat: no-repeat;
}
div.viewFiveBEPictureSecond{
    border:dashed 1px green;
    border-left: none;
    border-right: none;
    width: 30px;
    height: 70px;
    background-position: -30px 0px;
    background-size: 150px 70px;
    background-repeat: no-repeat;
}
div.viewFiveBEPictureThird{
    border:dashed 1px green;
    border-left: none;
    border-right: none;
    width: 30px;
    height: 70px;
    background-position: -60px 0px;
    background-size: 150px 70px;
    background-repeat: no-repeat;
}
div.viewFiveBEPictureFourth{
    border:dashed 1px green;
    border-left: none;
    border-right: none;
    width: 30px;
    height: 70px;
    background-position: -90px 0px;
    background-size: 150px 70px;
    background-repeat: no-repeat;
}
div.viewFiveBEPictureFifth{
    border:dashed 1px green;
    border-left: none;
    margin-left:-1px;
    width: 30px;
    height: 70px;
    background-position: -120px 0px;
    background-size: 150px 70px;
    background-repeat: no-repeat;
}

/*sechs BE*/
div.viewSixBEPictureFirst{
    border:dashed 1px green;
    border-right: none;
    width: 30px;
    height: 70px;
    background-size: 180px 70px;
    background-repeat: no-repeat;
}
div.viewSixBEPictureSecond{
    border:dashed 1px green;
    border-left: none;
    border-right: none;
    width: 30px;
    height: 70px;
    background-position: -30px 0px;
    background-size: 180px 70px;
    background-repeat: no-repeat;
}
div.viewSixBEPictureThird{
    border:dashed 1px green;
    border-left: none;
    width: 30px;
    height: 70px;
    background-position: -60px 0px;
    background-size: 180px 70px;
    background-repeat: no-repeat;
}
div.viewSixBEPictureFourth{
    border:dashed 1px green;
    border-left: none;
    border-right: none;
    width: 30px;
    height: 70px;
    background-position: -90px 0px;
    background-size: 180px 70px;
    background-repeat: no-repeat;
}
div.viewSixBEPictureFifth{
    border:dashed 1px green;
    border-left: none;
    width: 30px;
    height: 70px;
    background-position: -120px 0px;
    background-size: 180px 70px;
    background-repeat: no-repeat;
}
div.viewSixBEPictureSixth{
    border:dashed 1px green;
    border-left: none;
    width: 30px;
    margin-left:-1px;
    height: 70px;
    background-position: -150px 0px;
    background-size: 180px 70px;
    background-repeat: no-repeat;
}
/*zwölf BE*/
div.viewTwelveBEPictureFirst{
    border:dashed 1px green;
    border-right: none;
    width: 30px;
    height: 70px;
    background-size: 360px 70px;
    background-repeat: no-repeat;
}
div.viewTwelveBEPictureSecond{
    border:dashed 1px green;
    border-left: none;
    border-right: none;
    width: 30px;
    height: 70px;
    background-position: -30px 0px;
    background-size: 360px 70px;
    background-repeat: no-repeat;
}
div.viewTwelveBEPictureThird{
    border:dashed 1px green;
    border-left: none;
    width: 30px;
    height: 70px;
    background-position: -60px 0px;
    background-size: 360px 70px;
    background-repeat: no-repeat;
}
div.viewTwelveBEPictureFourth{
    border:dashed 1px green;
    border-left: none;
    width: 30px;
    height: 70px;
    background-position: -90px 0px;
    background-size: 360px 70px;
    background-repeat: no-repeat;
}
div.viewTwelveBEPictureFifth{
    border:dashed 1px green;
    border-left: none;
    width: 30px;
    height: 70px;
    background-position: -120px 0px;
    background-size: 360px 70px;
    background-repeat: no-repeat;
}
div.viewTwelveBEPictureSixth{
    border:dashed 1px green;
    border-left: none;
    width: 30px;
    height: 70px;
    background-position: -150px 0px;
    background-size: 360px 70px;
    background-repeat: no-repeat;
}
div.viewTwelveBEPictureSeventh{
    border:dashed 1px green;
    border-left: none;
    width: 30px;
    height: 70px;
    background-position: -180px 0px;
    background-size: 360px 70px;
    background-repeat: no-repeat;
}
div.viewTwelveBEPictureEighth{
    border:dashed 1px green;
    border-left: none;
    border-right: none;
    width: 30px;
    height: 70px;
    background-position: -210px 0px;
    background-size: 360px 70px;
    background-repeat: no-repeat;
}
div.viewTwelveBEPictureNinth{
    border:dashed 1px green;
    border-left: none;
    width: 30px;
    height: 70px;
    background-position: -240px 0px;
    background-size: 360px 70px;
    background-repeat: no-repeat;
}
div.viewTwelveBEPictureTenth{
    border:dashed 1px green;
    border-left: none;
    width: 30px;
    height: 70px;
    background-position: -270px 0px;
    background-size: 360px 70px;
    background-repeat: no-repeat;
}
div.viewTwelveBEPictureEleventh{
    border:dashed 1px green;
    border-left: none;
    width: 30px;
    height: 70px;
    background-position: -300px 0px;
    background-size: 360px 70px;
    background-repeat: no-repeat;
}
div.viewTwelveBEPictureTwelfth{
    border:dashed 1px green;
    border-left: none;
    width: 30px;
    height: 70px;
    margin-left:-1px;
    background-position: -330px 0px;
    background-size: 360px 70px;
    background-repeat: no-repeat;
}

/*Seitenbleche*/
/*zwei HE 80*/
div.viewTwoHEPicture{
    width: 63px;
    border:dashed 1px green;
    height: 70px;
    background-repeat: no-repeat;
    background-size: 63px 70px;
}
div.viewTwoHEPictureDark{
    width: 63px;
    border:dashed 1px grey;
    height: 70px;
    background: rgba(120,120,120,0.2);
    background-repeat: no-repeat;
    background-size: 63px 70px;
}
div.viewTwoHEPictureOver{
    width: 63px;
    border:solid 1px red;
    height: 70px;
    background-repeat: no-repeat;
    background-size: 63px 70px;
    opacity: 0.6;
}
/*vier HE 80*/
div.viewFourHEPictureFirst{
    width: 63px;
    border:dashed 1px green;
    height: 70px;
    border-bottom: none;
    background-size: 63px 140px;
    background-repeat: no-repeat;
}
div.viewFourHEPictureSecond{
    width: 63px;
    border:dashed 1px green;
    height: 70px;
    border-top: none;
    background-position: 0px -70px;
    background-size: 63px 140px;
    background-repeat: no-repeat;
}
/*sechs HE 80*/
div.viewSixHEPictureFirst{
    width: 63px;
    border:dashed 1px green;
    height: 70px;
    border-bottom: none;
    background-size: 63px 210px;
    background-repeat: no-repeat;
}
div.viewSixHEPictureSecond{
    width: 63px;
    border:dashed 1px green;
    height: 70px;
    border-top: none;
    background-position: 0px -70px;
    background-size: 63px 210px;
    background-repeat: no-repeat;
}
div.viewSixHEPictureThird{
    width: 63px;
    border:dashed 1px green;
    height: 70px;
    border-top: none;
    background-position: 0px -140px;
    background-size: 63px 210px;
    background-repeat: no-repeat;
}
/*acht HE 80*/
div.viewEightHEPictureFirst{
    width: 63px;
    border:dashed 1px green;
    height: 70px;
    border-bottom: none;
    background-size: 63px 280px;
    background-repeat: no-repeat;
}
div.viewEightHEPictureSecond{
    width: 63px;
    border:dashed 1px green;
    height: 70px;
    border-top: none;
    background-position: 0px -70px;
    background-size: 63px 280px;
    background-repeat: no-repeat;
}
div.viewEightHEPictureThird{
    width: 63px;
    border:dashed 1px green;
    height: 70px;
    border-top: none;
    background-position: 0px -140px;
    background-size: 63px 280px;
    background-repeat: no-repeat;
}
div.viewEightHEPictureFourth{
    width: 63px;
    border:dashed 1px green;
    height: 70px;
    border-top: none;
    background-position: 0px -210px;
    background-size: 63px 280px;
    background-repeat: no-repeat;
}

/*zwei HE 140*/
div.viewTwoHEDeepPicture{
    width: 110px;
    border:dashed 1px green;
    height: 70px;
    background-repeat: no-repeat;
    background-size: 110px 70px;
}
div.viewTwoHEDeepPictureOver{
    width: 110px;
    border:solid 1px red;
    height: 70px;
    background-repeat: no-repeat;
    background-size: 110px 70px;
    opacity: 0.6;
}
/*vier HE 140*/
div.viewFourHEDeepPictureFirst{
    width: 110px;
    border:dashed 1px green;
    height: 70px;
    border-bottom: none;
    background-size: 110px 140px;
    background-repeat: no-repeat;
}
div.viewFourHEDeepPictureSecond{
    width: 110px;
    border:dashed 1px green;
    height: 70px;
    border-top: none;
    background-position: 0px -70px;
    background-size: 110px 140px;
    background-repeat: no-repeat;
}
/*sechs HE 140*/
div.viewSixHEDeepPictureFirst{
    width: 110px;
    border:dashed 1px green;
    height: 70px;
    border-bottom: none;
    background-size: 110px 210px;
    background-repeat: no-repeat;
}
div.viewSixHEDeepPictureSecond{
    width: 110px;
    border:dashed 1px green;
    height: 70px;
    border-top: none;
    background-position: 0px -70px;
    background-size: 110px 210px;
    background-repeat: no-repeat;
}
div.viewSixHEDeepPictureThird{
    width: 110px;
    border:dashed 1px green;
    height: 70px;
    border-top: none;
    background-position: 0px -140px;
    background-size: 110px 210px;
    background-repeat: no-repeat;
}
/*acht HE 140*/
div.viewEightHEDeepPictureFirst{
    width: 110px;
    border:dashed 1px green;
    height: 70px;
    border-bottom: none;
    background-size: 110px 280px;
    background-repeat: no-repeat;
}
div.viewEightHEDeepPictureSecond{
    width: 110px;
    border:dashed 1px green;
    height: 70px;
    border-top: none;
    background-position: 0px -70px;
    background-size: 110px 280px;
    background-repeat: no-repeat;
}
div.viewEightHEDeepPictureThird{
    width: 110px;
    border:dashed 1px green;
    height: 70px;
    border-top: none;
    background-position: 0px -140px;
    background-size: 110px 280px;
    background-repeat: no-repeat;
}
div.viewEightHEDeepPictureFourth{
    width: 110px;
    border:dashed 1px green;
    height: 70px;
    border-top: none;
    background-position: 0px -210px;
    background-size: 110px 280px;
    background-repeat: no-repeat;
}

div.items{

    height:230px;
    overflow-y: scroll;

}

div.menuCategory{
    width: 293px;
    background-color: #1FA500 ;

    margin: 10px;
    padding:5px;
    border-bottom: 12px solid black;
}

table.menuTable {
}
.menuTable td{
    vertical-align: top;
}


div.itemsList{
    position: relative;
    width:250px;
}

#set { clear:both; float:left; width: 368px; height: 120px; }
.draggable{
    text-align: center;
    display: inline-block;
    margin:0 10px;
    cursor: move;
    overflow: hidden;
    border:solid 1px green;
    border-radius: 5px;
    width: 30px;
    height: 60px;

}
.dragObject {

    display: inline-block;
    margin:0 10px;
    cursor: move;
    position: relative;
    overflow: hidden;
    border:solid 1px green;
    border-radius: 5px;
    width:250px;
}



.addRow {

    background-color: #1FA500;
    color: black;
    font-size: 18px;
    border:none;
    border-radius: 0px;
    width:500px;
    margin-left:270px;
    margin-right:270px;
    text-decoration:none;
    padding-top:7px;
    margin-top:7px;
    text-align:center;
    border-bottom: 7px solid #1FA500;
}
.addRow:hover {
    color: white;
    border-bottom: 7px solid black;

}

.deleteRow {
    text-align: center;
    background-color: #cc0000;
    color:white;
    width: 45px;
    text-align: center;
    height: 38px;
    text-align: center;
    cursor: pointer;
    border:none;
    margin-top:16px;
}
.deleteRow:hover {

    background-color: #fe1a00;
}


.deleteButton{
    margin-top:-70px;
    right: 20px;
    position: absolute;

}

div.sysboxxTable {
    display: table;
    background-size: 30px;
    line-height: 0;
    margin-top:10px;
    padding-bottom: 10px;
}

div.sysboxxTable > div {
    display: table-row;
}


div.content {
    display: table-cell;
}

div.sysboxxTableAll > div {
    display: table-row;

}
div.contentTableAll{
    display: table-cell;
    width:400px;
}
div.contentTableAllLeft{
    display: table-cell;
    padding-right:60px;
    padding-left: 20px;
}
div.contentTableAllRight{
    display: table-cell;
    padding-right: 20px;
    padding-left: 20px;
}
div.positions{
    margin-bottom: 10px;
    font-size: 10px;
    text-align:center;
}
.slider{
    border-radius: 5px; 
}
.sliderX{
    border-radius: 5px; 

}

div.information{
    height:130px;
    font-size: 15px;
    font-align:right;
    position: absolute;
    top:10px;
    right:5px;
    margin-bottom:-20px;
    width:500px;
    background-color:#CCC;
    border-radius:5px;
    border: solid 1px grey;
    padding-left:2px;
}

div.rack{
    width: 10px;
    height: 68px;
    background-color:#36373b;
    border:dashed 1px #36373b;
}
div.rackBack{
    width: 10px;
    height: 68px;
    background-color:#36373b;
    border:dashed 1px grey;
    opacity: 0.4;
}
div.leftRack3D{
    width: 10px;
    height: 70px;
    background-color:#36373b;
    border-left:dashed 1px green;
    border-right:none;
    left:-10px;
    position: absolute;

}
div.rightRack3D{
    width: 10px;
    height: 70px;
    background-color:#36373b;
    border-right:dashed 1px green;
    border-left:none;
    right:-10px;
    position: absolute
}

div.firstRackPosition{
    margin-bottom: 11px;
    font-size: 10px;
    text-align:center;
    color:#157200;

}

div.mainCategoryCaption{
    background-color: black;
    border-top-right-radius: 5px;
    color:white;
    height:30px;
    padding:5px;
    cursor:pointer;
    border-bottom: 12px solid #1FA500;

}
div.mainCategoryCaption:hover{
    background-color: #1FA500;
    border-bottom: 12px solid black;
}

div.arrow{
    position: absolute;
    width:40px;
    right: 25px;
    height: 40px;
    margin-top: -33px;
    background-size: 40px 40px;
    transform: rotate(180deg);
    background-repeat: no-repeat;
    background-image: url("../Bilder/Arrow.png"); 
}

div.arrowLeft{
    position: absolute;
    width:40px;
    height: 40px;
    right: 25px;
    margin-top: -33px;
    transform: rotate(270deg);
    background-size: 40px 40px;
    background-repeat: no-repeat;
    background-image: url("../Bilder/Arrow2.png"); 
}
.search{
    border: 1px solid #1FA500;
}
.details{
    background-color: black;
    border-top-right-radius: 5px;
    color:white;
    width:170px;
    margin:0px;
    margin-top:10px;
    padding:7x;
}
.details td{
    border:none;
    padding:5px;
}
.text-right{
    text-align: right ;
}
.capImage{
    width: 30px;
    height:70px;
    background-image: url("../Bilder/caption.png");
    background-size: 30px 70px;
    background-position: 0px 0px;
}
.capImageTwoLeft{
    width: 30px;
    height:70px;
    margin-left:15px;
    background-image: url("../Bilder/caption.png");
    background-size: 30px 70px;
    background-position: 0px 0px;
}
.capImageTwoRight{
    width: 30px;
    height:70px;
    margin-left:-15px;
    background-image: url("../Bilder/caption.png");
    background-size: 30px 70px;
    background-position: 0px 0px;
}

.capImageThreeLeft{
    width: 30px;
    height:70px;
    margin-left:30px;
    background-image: url("../Bilder/caption.png");
    background-size: 30px 70px;
    background-position: 0px 0px;
}
.capImageThreeRight{
    width: 30px;
    height:70px;
    margin-left:-30px;
    background-image: url("../Bilder/caption.png");
    background-size: 30px 70px;
    background-position: 0px 0px;
}
.capImageThreeMid{
    width: 30px;
    height:70px;
    background-image: url("../Bilder/caption.png");
    background-size: 30px 70px;
    background-position: 0px 0px;
}
.capImageFourLeft{
    width: 30px;
    height:70px;
    margin-left: 45px;
    background-image: url("../Bilder/caption.png");
    background-size: 30px 70px;
    background-position: 0px 0px;
}
.capImageFourLeftMid{
    width: 30px;
    height:70px;
    margin-left: 15px;
    background-image: url("../Bilder/caption.png");
    background-size: 30px 70px;
    background-position: 0px 0px;
}
.capImageFourRightMid{
    width: 30px;
    height:70px;
    margin-left: -15px;
    background-image: url("../Bilder/caption.png");
    background-size: 30px 70px;
    background-position: 0px 0px;
}
.capImageFourRight{
    width: 30px;
    height:70px;
    margin-left: -45px;
    background-image: url("../Bilder/caption.png");
    background-size: 30px 70px;
    background-position: 0px 0px;
}
.capImageFiveLeft{
    width: 30px;
    height:70px;
    margin-left: 60px;
    background-image: url("../Bilder/caption.png");
    background-size: 30px 70px;
    background-position: 0px 0px;
}
.capImageFiveLeftMid{
    width: 30px;
    height:70px;
    margin-left: 30px;
    background-image: url("../Bilder/caption.png");
    background-size: 30px 70px;
    background-position: 0px 0px;
}
.capImageFiveMid{
    width: 30px;
    height:70px;
    background-image: url("../Bilder/caption.png");
    background-size: 30px 70px;
    background-position: 0px 0px;
}
.capImageFiveRightMid{
    width: 30px;
    height:70px;
    margin-left: -30px;
    background-image: url("../Bilder/caption.png");
    background-size: 30px 70px;
    background-position: 0px 0px;
}
.capImageFiveRight{
    width: 30px;
    height:70px;
    margin-left: -60px;
    background-image: url("../Bilder/caption.png");
    background-size: 30px 70px;
    background-position: 0px 0px;
}

.capImageSide{
    width: 30px;
    height:70px;
    margin-left: 17px;
    background-image: url("../Bilder/caption.png");
    background-size: 30px 70px;
    background-position: 0px 0px;
}
.capImageTwoUp{
    width: 30px;
    height:70px;
    margin-left: 17px;
    margin-top:35px;
    background-image: url("../Bilder/caption.png");
    background-size: 30px 70px;
    background-position: 0px 0px;
}
.capImageTwoDown{
    width: 30px;
    height:70px;
    margin-top:-35px;
    margin-left: 17px;
    background-image: url("../Bilder/caption.png");
    background-size: 30px 70px;
    background-position: 0px 0px;
}

.inputCaption{
    width:400px;
    margin-left: 10px;
    border: 2px solid #1FA500;
    border-radius: 5px;
}

.deleteCap {
    text-align: center;
    background-color: #cc0000;
    color:white;
    width: 100px;
    text-align: center;
    height: 38px;
    text-align: center;
    cursor: pointer;
    border:none;
    margin-top:16px;
}
.deleteCap:hover {

    background-color: #fe1a00;
}
.deleteCapPos{
    margin-left: 310px;

}
.bigChoice{
    background-color: rgb(51,51,51);
    color:white;
    font-size: 30px;
    padding-left: 5px;
}
.smallChoice{
    background-color: rgb(51,51,51);
    color:white;
    font-size: 30px;
    padding-left: 5px;
}


input[type="radio"]{
    display:none;
}

input[type="radio"] + label
{
    background-image: url("../Bilder/radioOff.png");
    background-size: 30px 30px;
    height: 30px;
    width: 30px;
    cursor:pointer;
    display:inline-block;
    padding: 0 0 0 0px;
}

input[type="radio"]:checked + label
{
    background-image: url("../Bilder/radioOnWhite.png");
    background-size: 30px 30px;
    height: 30px;
    width: 30px;
    display:inline-block;
    padding: 0 0 0 0px;
}

div.bigTag{
    background-color: black;
    border-top-right-radius: 5px;
    color:white;
    height:30px;
    padding:5px;
    border-bottom: 12px solid #1FA500;

}
div.smallTag{
    background-color: black;
    border-top-right-radius: 5px;
    color:white;
    height:30px;
    padding:5px;
    cursor:pointer;
    border-bottom: 12px solid #1FA500;
}
div.bigRadioPos{
    font-size: 20px;
    text-align: left;

}
div.bigLabel{
    margin-bottom: 5px;
    margin-left: 0px ;
}
div.settings{
    position:absolute;
    top:57px;
    right:5px;
    color:white;
    background-color: black;
    border-bottom-left-radius: 5px;
    padding: 5px;
}
div.articleSummary{
    background-color: black;
    color:white;
    padding:5px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
div.articleSummaryCaption{
    background-color: black;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    color:white;
    height:35px;
    cursor:pointer;
    border-bottom: 6px solid #1FA500;
}
div.articleSummaryCaption:hover{
    background-color: #1FA500;
    border-bottom: 6px solid black;
}
div.articleSummaryCaptionActive{
    background-color: black;
    color:white;
    height:35px;
    cursor:pointer;
    border-bottom: 6px solid #1FA500;
}
div.articleSummaryCaptionActive:hover{
    background-color: #1FA500;
    border-bottom: 6px solid black;
}
div.arrowCap{
    width:30px;
    float: right;
    height: 30px;
    background-size: 30px 30px;
    transform: rotate(270deg);
    background-repeat: no-repeat;
    background-image: url("../Bilder/Arrow1.png"); 
}

div.arrowLeftCap{
    float: right;
    width:30px;
    height: 30px;
    background-size: 30px 30px;
    transform: rotate(270deg);
    background-repeat: no-repeat;
    background-image: url("../Bilder/Arrow2.png"); 
}
div.depthText{
    margin-left:5px;
    padding-top:2px;
    width:300px;
    text-align: right;
}
div.depthSet{
    margin-left:5px;
    padding-top:2px;
    text-align: right;
    width: 220px;
}
input[type="checkbox"]{
    display:none;
}

input[type="checkbox"] + label
{
    background-image: url("../Bilder/check.png");
    background-size: 30px 30px;
    height: 30px;
    width: 30px;
    cursor:pointer;
    display:inline-block;
    padding: 0 0 0 0px;
}

input[type="checkbox"]:checked + label
{
    background-image: url("../Bilder/check2.png");
    background-size: 30px 30px;
    height: 30px;
    width: 30px;
    display:inline-block;
    padding: 0 0 0 0px;
}
input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    border: 1px solid #000000;
    height: 36px;
    width: 16px;
    border-radius: 3px;
    background: #1FA500;
    cursor: pointer;
    margin-top: -14px; 
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d; 
}


input[type=range]::-moz-range-thumb {
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
    border: 1px solid #000000;
    height: 36px;
    width: 16px;
    border-radius: 3px;
    background: #1FA500;
    cursor: pointer;
}

input[type=range]::-ms-thumb {
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
    border: 1px solid #000000;
    height: 36px;
    width: 16px;
    border-radius: 3px;
    background: #1FA500;
    cursor: pointer;
}
input[type=range]::-webkit-slider-runnable-track {
    width: 100%;
    height: 8.4px;
    cursor: pointer;
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
    background: rgb(51,51,51);
    border-radius: 1.3px;
    border: 0.2px solid #010101;
}

input[type=range]:focus::-webkit-slider-runnable-track {
    background: rgb(51,51,51);
}

input[type=range]::-moz-range-track {
    width: 100%;
    height: 8.4px;
    cursor: pointer;
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
    background: rgb(51,51,51);
    border-radius: 1.3px;
    border: 0.2px solid #010101;
}

input[type=range]::-ms-track {
    width: 100%;
    height: 8.4px;
    cursor: pointer;
    background: transparent;
    border-color: transparent;
    border-width: 16px 0;
    color: transparent;
}
input[type=range]::-ms-fill-lower {
    background: rgb(51,51,51);
    border: 0.2px solid #010101;
    border-radius: 2.6px;
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]:focus::-ms-fill-lower {
    background: rgb(51,51,51);
}
input[type=range]::-ms-fill-upper {
    background: rgb(51,51,51);
    border: 0.2px solid #010101;
    border-radius: 2.6px;
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]:focus::-ms-fill-upper {
    background: rgb(51,51,51);
}
div.articleSummaryCaptionActiveNoHover{
    background-color: black;
    color:white;
    height:35px;
    border-bottom: 6px solid #1FA500;
}
div.headingList{
    background-color: black;
    color:white;
    height:35px;
    font-size: 27px;
    padding-left:5px;
    padding-bottom:4px;
    border-bottom: 6px solid #1FA500;
    border-top-right-radius: 5px;
}
div.listList{
    margin-top:15px;
    margin-left:20px;
    margin-bottom:70px;
}
div.rowDesc{
    margin-top: 15px;
}
div.rowDescSide{
    margin-top: 15px;
}
div.innerRowDesc{
    font-size: 10px;
    margin-top: 54px;
}
div.comments{
    display:table-row;
}
div.commentTable{
    width:600px;
    border: 2px solid #1FA500;
    margin-top: 20px;
    margin-left: 205px;
    display: table;
    border-collapse:collapse;

}
div.commentTableTd{
    display: table-cell;
    height: 20px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border-left: 1px solid #1FA500;
    border-right: 1px solid #1FA500;
    border-top: 1px solid #1FA500;
}

.pos {min-width:80px;
      margin-left: 0;
      font-size: 15px;
      background-color: white;
      padding:5px;}
.art {min-width:190px;
      font-size: 15px;
      background-color: white;
      margin-left: 0;
      padding:5px;}
.comm {width:330px;
       white-space:pre;
       margin-left: 0;
       font-size: 15px;
       background-color: white;
       padding:5px;}

.heading{
    font-size: 18px;
    color:white;
    background-color: black;
}
.articleInList{
    font-size:15px;
}

.sliderX[type=range][orient=vertical]
{
    writing-mode: bt-lr; /* IE */
    -webkit-appearance: slider-vertical; /* WebKit */

}
.sliderX[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    border: 1px solid #000000;
    width: 36px;
    height: 16px;
    border-radius: 3px;
    background: #1FA500;
    cursor: pointer;
    margin-top: -14px; 
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d; 
}


.sliderX[type=range]::-moz-range-thumb {
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
    border: 1px solid #000000;
    width: 36px;
    height: 16px;
    border-radius: 3px;
    background: #1FA500;
    cursor: pointer;
}

.sliderX[type=range]::-ms-thumb {
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
    border: 1px solid #000000;
    width: 36px;
    height: 16px;
    border-radius: 3px;
    background: #1FA500;
    cursor: pointer;
}
.sliderX[type=range]::-webkit-slider-runnable-track {
    height:  100%;
    width: 8.4px;
    cursor: pointer;
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
    background: rgb(51,51,51);
    border-radius: 1.3px;
    border: 0.2px solid #010101;
}

.sliderX[type=range]:focus::-webkit-slider-runnable-track {
    background: rgb(51,51,51);
}

.sliderX[type=range]::-moz-range-track {
    height:  100%;
    width: 8.4px;
    cursor: pointer;
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
    background: rgb(51,51,51);
    border-radius: 1.3px;
    border: 0.2px solid #010101;
}

.sliderX[type=range]::-ms-track {
    height:  100%;
    width: 8.4px;
    cursor: pointer;
    background: transparent;
    border-color: transparent;
    border-width: 16px 0;
    color: transparent;
}
.sliderX[type=range]::-ms-fill-lower {
    background: rgb(51,51,51);
    border: 0.2px solid #010101;
    border-radius: 2.6px;
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
.sliderX[type=range]:focus::-ms-fill-lower {
    background: rgb(51,51,51);
}
.sliderX[type=range]::-ms-fill-upper {
    background: rgb(51,51,51);
    border: 0.2px solid #010101;
    border-radius: 2.6px;
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
.sliderX[type=range]:focus::-ms-fill-upper {
    background: rgb(51,51,51);
}
.inputAdress{
    width:220px;
    border: 2px solid #1FA500;
    border-radius: 5px;
    margin:5px;
    color:black;

}
.zoom3d{
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);

}
.sliderX{
    margin-top:170px !important;
}

.responsiveThree{
    width:350px !important;


}
.ThreeRow{
    margin-top:20px;
    margin-bottom:20px;
}
@media (min-width: 1200px) {
    .responsiveThree{
        width:950px !important;
        margin-left:100px;

    }
    .zoom3d{
        -webkit-transform: scale(1.5);
        -moz-transform: scale(1.5);
        -ms-transform: scale(1.5);

    }
    .sliderX{
        margin-top:0px !important;
    }
    .ThreeRow{
        margin-top:170px;
        margin-bottom:250px;
    }
    .sliderColumn{
        margin-right: 0px !important;
    }
}

.imprintAdress{
    color:rgb(85,85,85);
    font-size: 15px;
}

.tableImprint{
    border-collapse: separate;
    border-spacing: 7px 10px;
    border-top: 2px solid #1FA500;
    font-size: 12px;
    margin-top: 20px;
    color:rgb(85,85,85)
}
.tableImprint td{
    padding:3px;
}

.bottom3DBig{
    height: 65px;
}
.bottom3DSmall{
    height: 61px;
}
.back3DBig{
    height: 139px;
}
.back3DSmall{
    height: 70px;
}