html {
margin: 0px;
padding: 0px;
width: 100%;
height: 100%;
}
body {
margin: 0px;
padding: 0px;
overflow-x: hidden;
overflow-y: scroll;
}
#site-head {
position: relative;
display: block;
width: 100%;
padding-bottom: 3%;
background-color: rgb( 45, 45, 45);
background-color: rgba( 100, 100, 100, 0.5);
opacity: 0.0;
transition-duration: 2000ms;
}
.menu-main-item-first-span {
position: fixed;
display: inline-block;
margin: 0px;
margin-left: 80%;
margin-top: 3%;
max-width: 10%;
z-index: 10000;
}
.menu-main-item-span {
position: fixed;
display: grid;
justify-content: center;
justify-items: center;
margin: 0px;
padding: 10px;
margin-left: 80%;
margin-top: 20%;
max-width: 20%;
box-sizing: content-box;
border-width: 8px;
border-style: solid;
border-radius: 10px;
border-color: white;
background-color: black;
z-index: 10000;
opacity: 0.7;
}
.menu-main-item-span:hover {
cursor: pointer;
}
.menu-main-item-last-span {
position: relative;
display: inline-block;
margin: 0px;
margin-right: 3%;
/* margin-right: 3%; */
margin-top: 3%;
}
.menu-main-item-font-wrappper-box {
position: relative;
display: table;
/* background-color: darkblue; */
margin: 0px;
width: auto;
height: auto;
}
.menu-main-item-font-box {
position: relative;
display: table-cell;
box-sizing: content-box;
background-color: black;
margin: 0px;
border-width: 8px;
border-style: solid;
border-radius: 10px;
border-color: white;
font-family: Arial Bold;
font-size: 140%;
font-weight: bolder;
color: rgb( 240, 240, 240);
letter-spacing: 0.2em;
margin: 3px;
padding: 0.4em;
padding-bottom: 0.4em;
padding-top: 0.6em;
width: 100%;
cursor: default;
opacity: 0.7;
}
.menu-main-item-font-box:hover {
border-color: white;
}
.menu-main-item-hyperlink {
color: rgb( 240, 240, 240);
text-decoration-style: solid;
text-decoration: none;
}
.submenu-layer {
display: none;
position: fixed;
margin: 0px;
margin-top: 0px;
padding: 0px;
width: 350%;
height: 100%;
background-color: transparent;
background-color: rgba( 0, 0, 0, 0);
border-style: solid;
border-width: 5px;
border-color: black;
border-right-style: none;
border-left-style: none;
font-family: sans-serif;
font-size: 190%;
font-weight: bold;
letter-spacing: 0.2em;
color: transparent;
transition-duration: 1000ms;
z-index: 2;
opacity: 0.0;
}
#submenu-closing-x-image {
position: absolute;
display: block;
margin: 0px;
}
#submenu-closing-x-image-highlighted {
position: absolute;
display: block;
margin: 0px;
}
#submenu-closing-x-image-box {
position: absolute;
display: block;
margin: 0px;
/* margin-left: 90%; */
margin-top: 20px;
opacity: 0.0;
}
.submenu-layer-menuitem-start {
display: block;
position: absolute;
margin: 0px;
margin-left: 0px;
margin-top: 130px;
padding: 0px;
color: black;
}
.submenu-layer-menuitem-galery {
display: block;
position: absolute;
margin: 0px;
margin-left: 0px;
margin-top: 200px;
padding: 0px;
color: black;
}
.submenu-layer-menuitem-aboutme {
display: block;
position: absolute;
margin: 0px;
margin-left: 0px;
margin-top: 270px;
padding: 0px;
color: black;
}
.submenu-layer-menuitem-contact {
display: block;
position: absolute;
margin: 0px;
margin-left: 0px;
margin-top: 340px;
padding: 0px;
color: black;
}
.submenu-layer-menuitem-impress {
display: block;
position: absolute;
margin: 0px;
margin-left: 0px;
margin-top: 410px;
padding: 0px;
color: black;
}
.submenu-layer-menuitem-datenschutz {
display: block;
position: absolute;
margin: 0px;
margin-left: 0px;
margin-top: 480px;
padding: 0px;
color: black;
}
.submenu-layer-menuitem-upload-image {
display: block;
position: absolute;
margin: 0px;
margin-left: 0px;
margin-top: 340px;
padding: 0px;
color: black;
}
.submenu-layer-menuitem-shop-properties {
display: block;
position: absolute;
margin: 0px;
margin-left: 0px;
margin-top: 410px;
padding: 0px;
color: black;
}
.submenu-layer-menuitem-logout {
display: block;
position: absolute;
margin: 0px;
margin-left: 0px;
margin-top: 480px;
padding: 0px;
color: black;
}
.submenu-item-hyperlink-logout:hover {
text-decoration: underline;
cursor: pointer;
}
/* submenu-items: */
.submenu-item-hyperlink-galery, .submenu-item-hyperlink-galery:visited {
color: inherit;
text-decoration: none;
cursor: default;
}
.submenu-item-hyperlink-aboutme, .submenu-item-hyperlink-aboutme:visited {
color: inherit;
text-decoration: none;
cursor: default;
}
.submenu-item-hyperlink-contact, .submenu-item-hyperlink-contact:visited {
color: inherit;
text-decoration: none;
cursor: default;
}
.submenu-item-hyperlink-impress, .submenu-item-hyperlink-impress:visited {
color: inherit;
text-decoration: none;
cursor: default;
}
.submenu-item-hyperlink-datenschutz, .submenu-item-hyperlink-datenschutz:visited {
color: inherit;
text-decoration: none;
cursor: default;
}
.submenu-item-hyperlink-logout, .submenu-item-hyperlink-logout:visited {
color: inherit;
text-decoration: none;
cursor: default;
}
#highscore-list-box {
position: absolute;
display: block;
background-color: darkblue;
background-color: rgba( 70, 70, 70, 0.9); /* rgba( 0, 100, 170, 0.7); */
width: 50%;
height: 60%;
margin: 0px;
padding: 0px;
text-align: center;
font-family: sans-serif;
font-size: 100%;
font-style: normal;
font-weight: lighter;
color: bisque;
border-color: silver;
border-style: solid;
border-width: thin;
border-radius: 10px;
opacity: 0.0;
z-index: 10;
transition-duration: 1000ms;
}
#highscore-list-entries-wrapper-box {
position: relative;
display: block;
width: auto;
height: auto;
padding-left: 10%;
padding-right: 10%;
padding-top: 3%;
padding-bottom: 3%;
}
.highscore-list-single-entry-box {
position: relative;
display: block;
width: auto;
height: auto;
text-align: left;
margin: 0px;
padding: 0px;
padding-top: 10px;
padding-bottom: 10px;
border-bottom-style: solid;
border-bottom-width: thin;
border-bottom-color: silver;
}
.highscore-name-box {
position: relative;
display: inline-block;
width: 35%;
height: auto;
text-align: left;
margin: 0px;
padding: 0px;
padding-right: 50%;
}
.highscore-score-value-box {
position: relative;
display: inline-block;
width: auto;
height: auto;
text-align: left;
margin: 0px;
padding: 0px;
}
.viewportSizedWindow_image {
max-height: 90%;
max-width: 100%;
box-shadow: 2px 2px 15px 2px black;
}
.paintings-layer {
display: grid;
justify-content: center;
justify-items: center;
position: absolute;
width: 100%;
}
.paintingLayer_noPaintingsYetInfoBox {
display: flex;
flex-direction: column;
position: relative;
width: 100%;
align-content: center;
align-items: center;
margin-top: 15%;
padding: 2%;
background-color: white;
font-family: sans-serif;
font-size: 120%;
color: gray;
}
.about-me-layer-flexbox {
display: flex;
flex-direction: column;
align-items: center;
align-content: center;
position: relative;
width: 100%;
}
.about-me-layer-column {
display: block;
position: relative;
width: 100%;
}
.paintings-layer_rows {
display: block;
position: absolute;
width: 100%;
}
.paintingElement-outerDivWrapper, .paintingElement-outerDivWrapper_rows {
display: inline-block;
width: 25%;
height: auto;
margin-left: 5%;
}
.paintingElement-outerDivWrapper {
width: 100%;
margin-left: 0px;
}
.desktop_imageWrapper, .desktop_imageWrapper_rows {
display: inline-block;
position: relative;
margin-bottom: 50px;
width: 100%; /* 310px was a good static value */
height: auto;
}
.desktop_imageWrapper_rows {
margin-left: 5%;
}
.desktop_imageElement {
display: block;
position: relative;
max-width: 100%;
border-style: solid;
border-width: 5px;
border-color: white;
border-radius: 8px;
box-shadow: 2px 2px 15px 2px black;
box-sizing: border-box;
transition-duration: 200ms;
}
.desktop_imageElement:hover {
max-width: 100%;
border-style: solid;
border-width: 5px;
border-color: white;
border-radius: 8px;
box-shadow: 2px 2px 55px 2px black;
cursor: pointer;
}
.mobile_imageWrapper {
display: inline-block;
position: relative;
width: 100%;
height: auto;
margin-bottom: 100px;
background-color: transparent;
}
.mobile_imageElement {
width: 100%;
max-width: 100%;
margin-bottom: 20px;
box-shadow: 2px 2px 55px 2px black;
}
.mobile_imageElement:hover {
cursor: pointer;
}
.paintingElement_imageWrapperWrapper_forLink {
display: block;
position: relative;
width: auto;
height: auto;
}
.paintingInfos {
display: block;
position: relative;
margin-top: 20px;
margin-bottom: 10px;
padding-left: 2%;
padding-right: 2%;
width: 96%;
font-family: sans-serif;
font-size: 100%;
line-height: 170%;
color: gray;
background-color: transparent;
}
.viewportSizedWindow_arrow:hover {
cursor: pointer;
}
.viewportSizedWindow-closing-x-image-box:hover {
cursor: pointer;
}
.viewportSizedWindow_imageUpload_uploadButton {
display: inline-block;
position: relative;
margin-top: 2%;
margin-bottom: 2%;
margin-left: 2%;
padding: 10px;
max-width: 90%;
border-style: solid;
border-width: medium;
border-color: black;
border-radius: 8px;
background-color: white;
color: black;
font-family: sans-serif;
font-size: 100%;
}
.viewportSizedWindow_imageUpload_uploadButton:hover {
background-color: black;
color: white;
border-color: white;
cursor: pointer;
}
.viewportSizedWindow_imageUpload_rotateImage {
display: inline-block;
opacity: 0.7;
}
.viewportSizedWindow_imageUpload_rotateImage:hover {
opacity: 1.0;
cursor: pointer;
}
.viewportSizedWindow_imageUpload_paintingData_dataItemBox {
display: flex;
flex-direction: column;
align-content: center;
align-items: center;
margin-bottom: 3%;
width: 100%;
}
.viewportSizedWindow_imageUpload_label {
display: inline-block;
font-family: sans-serif;
font-size: 120%;
color: black;
margin-top: 2%;
padding-right: 5%;
}
.editPaintingButton {
display: inline-block;
position: relative;
margin-right: 5%;
padding-left: 2%;
padding-right: 2%;
font-family: sans-serif;
font-size: 80%;
text-decoration-line: underline;
text-decoration-color: black;
color: black;
}
.editPaintingButton:hover {
cursor: pointer;
}
.standardinput {
display: inline-block;
position: relative;
margin-top: 2%;
margin-bottom: 2%;
padding: 10px;
max-width: 90%;
border-style: solid;
border-width: medium;
border-color: black;
border-radius: 8px;
background-color: white;
color: black;
font-family: sans-serif;
font-size: 100%;
}
.subSubMenuItem_outerDiv {
display: block;
position: absolute;
margin: 0px; margin-left: 0px;
padding: 0px;
width: auto;
height: auto;
transition-duration: 1500ms;
transition-timing-function: ease;
}
.subSubMenuItem_innerDiv {
display: block;
position: relative;
width: auto;
height: auto;
color: inherit;
text-decoration: none;
cursor: default;
font-family: sans-serif;
font-size: 190%;
font-weight: bold;
letter-spacing: 0.2em;
}
.subSubMenuItem_innerDiv_admin {
display: block;
position: relative;
width: auto;
height: auto;
color: inherit;
text-decoration: none;
cursor: default;
font-family: sans-serif;
font-size: 110%;
font-weight: bold;
letter-spacing: 0.2em;
}
#sub-submenu-closing-x-image {
position: absolute;
display: block;
margin: 0px;
}
#sub-submenu-closing-x-image-highlighted {
position: absolute;
display: block;
margin: 0px;
}
#sub-submenu-closing-x-image-box {
position: absolute;
display: block;
margin: 0px;
/*margin-left: 90%;*/
margin-top: 20px;
opacity: 0.0;
}
.shoppingCart_shippingTimeBlock {
display: block;
position: relative;
width: 100%;
margin-top: 1%;
text-align: end;
font-weight: normal;
font-family: sans-serif;
font-size: 100%;
color: green;
}
.shoppingCart_entryRow, .shoppingCart_shippingCostsRow, .shoppingCart_umsatzsteuerHinweisRow {
display: block;
position: relative;
width: 98%;
height: auto;
padding-bottom: 2%;
margin-bottom: 5%;
border-bottom-style: solid;
border-bottom-width: thin;
border-bottom-color: black;
}
.shoppingCart_shippingCostsRow, .shoppingCart_umsatzsteuerHinweisRow {
text-align: end;
font-weight: bolder;
font-family: sans-serif;
font-size: 100%;
color: black;
}
.shoppingCart_umsatzsteuerHinweisRow {
font-size: 90%;
font-weight: normal;
}
.shoppingCart_paintingImage {
display: block;
position: relative;
margin-right: 5%;
margin-bottom: 3%;
width: 50%;
}
.shoppingCart_paintingInfos, .shoppingCart_price, .shoppingCart_deleteEntry {
display: block;
position: relative;
width: 98%;
margin-bottom: 3%;
/*margin-right: 5%;*/
font-family: sans-serif;
font-size: 120%;
color: black;
}
.shoppingCart_deleteEntry {
margin-right: 0px;
width: auto;
}
.shoppingCart_price {
font-weight: bolder;
}
.shoppingCart_deleteEntry {
font-size: 80%;
text-decoration: underline;
text-decoration-color: black;
}
.shoppingCart_deleteEntry:hover {
cursor: pointer;
}
.note {
font-family: sans-serif;
font-size: 80%;
color: black;
}
.delivery-address, .agb_widerrufsbelehrung_infoWrapper {
display: block;
font-family: sans-serif;
font-size: 100%;
margin-top: 75px;
padding-top: 10px;
padding-bottom: 10px;
width: 100%;
border-bottom-style: solid;
border-bottom-color: dimgray;
border-bottom-width: thin;
border-top-style: solid;
border-top-color: dimgray;
border-top-width: thin;
color: black;
}
.agb_widerrufsbelehrung_infoWrapper {
color: green;
}
.address-row {
display: block;
padding-top: 1%;
}
.address-row-location {
display: block;
padding-top: 2%;
}
.paying_options_header {
margin-top: 75px;
margin-bottom: 75px;
font-family: sans-serif;
font-size: 120%;
color: black;
}
.common_single_textline {
margin-top: 12px;
}
.agb_widerrufsbelehrung_link {
color: green;
}
.shopProperties_contentTypeBox {
display: block;
padding: 2%;
margin-bottom: 3%;
border-style: solid;
border-color: gray;
border-width: medium;
border-radius: 5px;
}
.sublabel {
display: flex;
flex-direction: column;
align-content: center;
align-items: center;
margin-bottom: 2%;
font-family: sans-serif;
font-size: 100%;
color: dimgray;
}