@charset "UTF-8"; /* ## ----------------------------------------------------------------------------- ## ## ## STYLE SHEET ## ## Style-Sheet-Definitionen | KONFIGURATOR ## ## SCHEME: __konfigurator__scheme__ ## AUTHOR: Carsten Zandecki, mediaMinds internet services ## URL: http://www.mediaminds.de ## */ @font-face { font-family: 'OpenSans'; src: url('../fonts/opensans/OpenSans-Light-webfont.eot'); src: url('../fonts/opensans/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/opensans/OpenSans-Light-webfont.woff') format('woff'), url('../fonts/opensans/OpenSans-Light-webfont.ttf') format('truetype'), url('../fonts/opensans/OpenSans-Light-webfont.svg#webfont') format('svg'); } @font-face { font-family: 'OpenSansRegular'; src: url('../fonts/opensans/OpenSans-Regular-webfont.eot'); src: url('../fonts/opensans/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/opensans/OpenSans-Regular-webfont.woff') format('woff'), url('../fonts/opensans/OpenSans-Regular-webfont.ttf') format('truetype'), url('../fonts/opensans/OpenSans-Regular-webfont.svg#webfont') format('svg'); } @font-face { font-family: 'PTSansBold'; src: url('../fonts/ptsans_bold/PTS75F-webfont.eot'); src: url('../fonts/ptsans_bold/PTS75F-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/ptsans_bold/PTS75F-webfont.woff') format('woff'), url('../fonts/ptsans_bold/PTS75F-webfont.ttf') format('truetype'); } @font-face { font-family: 'PTSans'; src: url('../fonts/ptsans_regular/PTS55F-webfont.eot'); src: url('../fonts/ptsans_regular/PTS55F-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/ptsans_regular/PTS55F-webfont.woff') format('woff'), url('../fonts/ptsans_regular/PTS55F-webfont.ttf') format('truetype'); } @font-face { font-family: 'PTSansCaptionBold'; src: url('../fonts/ptsanscaption_bold/PTC75F-webfont.eot'); src: url('../fonts/ptsanscaption_bold/PTC75F-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/ptsanscaption_bold/PTC75F-webfont.woff') format('woff'), url('../fonts/ptsanscaption_bold/PTC75F-webfont.ttf') format('truetype'); } @font-face { font-family: 'PTSansCaption'; src: url('../fonts/ptsanscaption_regular/PTC55F-webfont.eot'); src: url('../fonts/ptsanscaption_regular/PTC55F-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/ptsanscaption_regular/PTC55F-webfont.woff') format('woff'), url('../fonts/ptsanscaption_regular/PTC55F-webfont.ttf') format('truetype'); } /******************************************************************************* ## ## PRELOAD KONFIGURATOR RELEVANT FONTS ## */ @font-face { font-family: 'Bank Gothic'; src: url('../xkonf/fonts/bankgothic-md-bt-medium-webfont.eot'); src: url('../xkonf/fonts/bankgothic-md-bt-medium-webfont.eot?#iefix') format('embedded-opentype'), url('../xkonf/fonts/bankgothic-md-bt-medium-webfont.woff') format('woff'), url('../xkonf/fonts/bankgothic-md-bt-medium.ttf') format('truetype'), url('../xkonf/fonts/bankgothic-md-bt-medium-webfont.svg#webfont') format('svg'); } @font-face { font-family: 'Bauhaus Medium'; src: url('../xkonf/fonts/bauhaus-medium-webfont.eot'); src: url('../xkonf/fonts/bauhaus-medium-webfont.eot?#iefix') format('embedded-opentype'), url('../xkonf/fonts/bauhaus-medium-webfont.woff') format('woff'), url('../xkonf/fonts/bauhaus-medium.ttf') format('truetype'), url('../xkonf/fonts/bauhaus-medium-webfont.svg#webfont') format('svg'); } @font-face { font-family: 'Cinzel'; src: url('../xkonf/fonts/cinzel-regular-webfont.eot'); src: url('../xkonf/fonts/cinzel-regular-webfont.eot?#iefix') format('embedded-opentype'), url('../xkonf/fonts/cinzel-regular-webfont.woff') format('woff'), url('../xkonf/fonts/cinzel-regular.ttf') format('truetype'), url('../xkonf/fonts/cinzel-regular-webfont.svg#webfont') format('svg'); } @font-face { font-family: 'Daniel'; src: url('../xkonf/fonts/daniel-webfont.eot'); src: url('../xkonf/fonts/daniel-webfont.eot?#iefix') format('embedded-opentype'), url('../xkonf/fonts/daniel-webfont.woff') format('woff'), url('../xkonf/fonts/daniel.ttf') format('truetype'), url('../xkonf/fonts/daniel-webfont.svg#webfont') format('svg'); } @font-face { font-family: 'DIN Regular'; src: url('../xkonf/fonts/din-regular-webfont.eot'); src: url('../xkonf/fonts/din-regular-webfont.eot?#iefix') format('embedded-opentype'), url('../xkonf/fonts/din-regular-webfont.woff') format('woff'), url('../xkonf/fonts/din-regular.ttf') format('truetype'), url('../xkonf/fonts/din-regular-webfont.svg#webfont') format('svg'); } @font-face { font-family: 'Elemental End'; src: url('../xkonf/fonts/elemental-end-webfont.eot'); src: url('../xkonf/fonts/elemental-end-webfont.eot?#iefix') format('embedded-opentype'), url('../xkonf/fonts/elemental-end-webfont.woff') format('woff'), url('../xkonf/fonts/elemental-end.ttf') format('truetype'), url('../xkonf/fonts/elemental-end-webfont.svg#webfont') format('svg'); } @font-face { font-family: 'Existence Light'; src: url('../xkonf/fonts/existence-light-regular-webfont.eot'); src: url('../xkonf/fonts/existence-light-webfont.eot?#iefix') format('embedded-opentype'), url('../xkonf/fonts/existence-light-webfont.woff') format('woff'), url('../xkonf/fonts/existence-light.ttf') format('truetype'), url('../xkonf/fonts/existence-light-webfont.svg#webfont') format('svg'); } @font-face { font-family: 'Exmouth'; src: url('../xkonf/fonts/exmouth-webfont.eot'); src: url('../xkonf/fonts/exmouth-webfont.eot?#iefix') format('embedded-opentype'), url('../xkonf/fonts/exmouth-webfont.woff') format('woff'), url('../xkonf/fonts/exmouth.ttf') format('truetype'), url('../xkonf/fonts/exmouth-webfont.svg#webfont') format('svg'); } @font-face { font-family: 'Fibel Nord Kontur'; src: url('../xkonf/fonts/fibel_nord_kontur-webfont.eot'); src: url('../xkonf/fonts/fibel_nord_kontur-webfont.eot?#iefix') format('embedded-opentype'), url('../xkonf/fonts/fibel_nord_kontur-webfont.woff') format('woff'), url('../xkonf/fonts/fibel_nord_kontur.ttf') format('truetype'), url('../xkonf/fonts/fibel_nord_kontur-webfont.svg#webfont') format('svg'); } @font-face { font-family: 'Flex Display Thin'; src: url('../xkonf/fonts/flex-display-thin-webfont.eot'); src: url('../xkonf/fonts/flex-display-thin-webfont.eot?#iefix') format('embedded-opentype'), url('../xkonf/fonts/flex-display-thin-webfont.woff') format('woff'), url('../xkonf/fonts/flex-display-thin.otf') format('truetype'), url('../xkonf/fonts/flex-display-thin-webfont.svg#webfont') format('svg'); } @font-face { font-family: 'Monopoly'; src: url('../xkonf/fonts/monopoly-webfont.eot'); src: url('../xkonf/fonts/monopoly-webfont.eot?#iefix') format('embedded-opentype'), url('../xkonf/fonts/monopoly-webfont.woff') format('woff'), url('../xkonf/fonts/monopoly.ttf') format('truetype'), url('../xkonf/fonts/monopoly-webfont.svg#webfont') format('svg'); } @font-face { font-family: 'Old London'; src: url('../xkonf/fonts/oldlondon-webfont.eot'); src: url('../xkonf/fonts/oldlondon-webfont.eot?#iefix') format('embedded-opentype'), url('../xkonf/fonts/oldlondon-webfont.woff') format('woff'), url('../xkonf/fonts/oldlondon.ttf') format('truetype'), url('../xkonf/fonts/oldlondon-webfont.svg#webfont') format('svg'); } :root { --gralax-gold:#CBB16E; --gralax-gray:#3b3c3c; --gralax-black:#1b1c2c; --gralax-white:#F2F5FC; --gralax-blue:#3260AB; --gralax-angle-menu:skewX(-9deg); --gralax-angle-content:skewX(-2deg); --gralax-shadowbox: .1rem .3rem .6rem var(--gralax-white), -.1rem -.1rem 0.3rem var(--gralax-blue); --gralax-shadowhead: 0 .5rem .5rem var(--gralax-black); --gralax-radius:0.25rem; --gralax-line-height: 1.3rem; /* no definition in main theme so use this on custom styles */ --gralax-font-awesome:normal normal normal 1rem/1 FontAwesome; --gralax-mainmenu-height: 1rem; --gralax-logo: url('../xkonf/logos/schilderstyle_logo.png'); } /* body, p, ul, li {} */ body { padding:0; margin:0; } #mmkcon { /*width:980px;*/ width:1140px; background:#fff; font-family: OpenSans; font-size: 16px; color: #555555; padding:20px 0 20px 0; margin:0 auto; text-align:left; } /* ## ----------------------------------------------------------------------------- ## ## GENERAL ELEMENT/FORM CLASSES ## */ #mmkcon ul, #mmkcon li { /*display:block;*/ list-style-type:none; line-height:1.4em; } #mmkcon li { padding-left:0; } #mmkcon form { height:100%; } /* #mmkcon input { font-family: OpenSans; font-size:1em; border: 1px solid #aaa; padding:5px; color:#555; margin-top:5px; border-radius: 3px; font-family: OpenSans; outline:none; } */ #mmkcon input { font-family: OpenSans; font-size:1em; border: 1px solid #AAAAAA; padding:5px; color:#555555; margin-top:5px; border-radius: 3px; font-family: OpenSans; outline:none; } #mmkcon input:focus { background-color: #fff; border: 1px solid #0093DB; outline: none; box-shadow: 0 0 5px rgba(0,0,0,0.2); } #mmkcon input[type="file"] { display: none; } #mmkcon select { font-family: OpenSans; font-size:1em; border: 1px solid #AAAAAA; padding:4px; color:#555555; margin-top:5px; border-radius: 3px; font-family: OpenSans; outline:none; } #mmkcon select:focus { background-color: #fff; border: 1px solid #0093DB; outline: none; box-shadow: 0 0 5px rgba(0,0,0,0.2); } #mmkcon textarea { font-family: OpenSans; font-size:1em; border: 1px solid #AAAAAA; padding:5px; border-radius: 3px; color:#555555; margin-top:5px; } #mmkcon textarea:focus { background-color: #fff; border: 1px solid #0093DB; outline: none; box-shadow: 0 0 5px rgba(0,0,0,0.2); } #mmkcon .inputInactive { background-color: #ddd; } #mmkcon .inputInactive:focus { background-color: #ddd; } /* #mmkcon .noborder { border:0px; } #mmkcon .sndbutton { font-size:0.938em; border:0px; background: #076633; color: #fff; width:120px; height:46px; font-weight:bold; } #mmkcon .formspacer { clear:both; padding:1%; } #mmkcon .osndButton { display:block; font-size:0.938em; border:0px; background: #076633; color: #fff; height:26px; padding: 14px 10px 6px 10px; font-weight:bold; } #mmkcon a.osndButton { text-decoration:none; color:#fff; } #mmkcon #emailError { background: #aa0000; padding:2%; color:#fff; } #mmkcon #emailOk { background: #2fac66; padding:2%; color:#fff; } #mmkcon .elemTitle { float:left; display:inline; margin-right:15px; font-weight:bold; width:90px; } #mmkcon .elem { float:left; display:inline; margin-right:0; } #mmkcon .elem2 { float:left; display:inline; margin-left:15px; } */ #textFontList { position:absolute; z-index:99; padding:3px; overflow-y:scroll; width:200px; height:150px; border:1px solid #ccc; border-radius:3px; background:#fff; } #textFontList a.fontSelList { text-decoration:none; display:block; background:#fff; color: #555555; font-size:1.125em; padding:4px; } #textFontList a.fontSelList:hover { text-decoration:none; background: #0093DB; color: #fff; } #textFontListClose { float:right; font-weight:bold; font-size:1.125em; cursor:pointer; border-radius:50%; background: #0093DB; color:#fff; width:22px; height:24px; text-align:center; margin-top:8px; } #mmkcon .sm { margin-top:0px; font-size:0.875em; text-align:center; } #mmkcon .sm { display:inline-block; margin-top:4px; /*font-family:Arial;*/ font-size:0.875em; text-align:center; line-height:14px; } #mmkcon .smprice { margin-top:0px; font-size:0.875em; } #mmkcon small { margin-top:0px; font-size:0.875em; } #schild { border-radius: 0; } #mmkcon .fixInput { width:40px; font-size:1em; padding:4px; margin-left:5px; } /* ################################################################################ ## ## BUTTONS IN FORMULAREN // SUCHFELDER DIMENSIONEN // SPECIAL CLASSES ## */ #mmkcon .apbutton, .apbutton:visited { cursor: pointer; display: inline-block; position: relative; border-radius:3px; text-decoration: none; border:0px; } /* SIZES */ #mmkcon .small.apbutton { font-size: 11px; } #mmkcon .medium.apbutton { font-size: 13px; padding:7px; border-radius:50%; } #mmkcon .mediumicon.apbutton { font-size: 13px; padding:3px; box-shadow: none; border:none; } #mmkcon .large.apbutton { font-size: 14px; font-family:OpenSansRegular; border-radius:3px; padding: 6px; position:relative; top:0px;} /* NAV BUTTONS + FUNCTIONS */ #mmkcon #sideNav { padding:0 0 0 0; float:left; width:auto; margin:0 30px 0 0; } #mmkcon .large.apbutton:hover { background: #0093DB; color:#fff; } #mmkcon .orange.apbutton.niForms { background: #0093DB url('../icons/nav_forms.png') 7px 9px no-repeat; color:#fff; padding: 7px 0 8px 34px; border:1px solid #0093DB; width:143px; margin-bottom:5px; } #mmkcon .gray.apbutton.niForms { background: #f0f0f0 url('../icons/nav_forms.png') 7px -50px no-repeat; padding: 7px 0 8px 34px; color:#777; border:1px solid #ccc; width:143px; margin-bottom:5px; } #mmkcon .orange.apbutton.niColors { background: #0093DB url('../icons/nav_colors.png') 7px 9px no-repeat; color:#fff; padding: 7px 0 8px 34px; border:1px solid #0093DB; width:143px; margin-bottom:5px; } #mmkcon .gray.apbutton.niColors { background: #f0f0f0 url('../icons/nav_colors.png') 7px -50px no-repeat; padding: 7px 0 8px 34px; color:#777; border:1px solid #ccc; width:143px; margin-bottom:5px; } #mmkcon .orange.apbutton.niText { background: #0093DB url('../icons/nav_text.png') 7px 9px no-repeat; color:#fff; padding: 7px 0 8px 34px; border:1px solid #0093DB; width:143px; margin-bottom:5px; } #mmkcon .gray.apbutton.niText { background: #f0f0f0 url('../icons/nav_text.png') 7px -50px no-repeat; padding: 7px 0 8px 34px; color:#777; border:1px solid #ccc; width:143px; margin-bottom:5px; } #mmkcon .orange.apbutton.niImages { background: #0093DB url('../icons/nav_images.png') 7px 9px no-repeat; color:#fff; padding: 7px 0 8px 34px; border:1px solid #0093DB; width:143px; margin-bottom:5px; } #mmkcon .gray.apbutton.niImages { background: #f0f0f0 url('../icons/nav_images.png') 7px -50px no-repeat; padding: 7px 0 8px 34px; color:#777; border:1px solid #ccc; width:143px; margin-bottom:5px; } #mmkcon .orange.apbutton.niCutforms { background: #0093DB url('../icons/nav_cutforms.png') 7px 9px no-repeat; color:#fff; padding: 7px 0 8px 34px; border:1px solid #0093DB; width:143px; margin-bottom:5px; } #mmkcon .gray.apbutton.niCutforms { background: #f0f0f0 url('../icons/nav_cutforms.png') 7px -50px no-repeat; padding: 7px 0 8px 34px; color:#777; border:1px solid #ccc; width:143px; margin-bottom:5px; } #mmkcon .orange.apbutton.niFixations { background: #0093DB url('../icons/nav_fixations.png') 7px 9px no-repeat; color:#fff; padding: 7px 0 8px 34px; border:1px solid #0093DB; width:143px; margin-bottom:5px; } #mmkcon .gray.apbutton.niFixations { background: #f0f0f0 url('../icons/nav_fixations.png') 7px -50px no-repeat; padding: 7px 0 8px 34px; color:#777; border:1px solid #ccc; width:143px; margin-bottom:5px; } #mmkcon .orange.apbutton.niComponents { background: #0093DB url('../icons/nav_components.png') 7px 9px no-repeat; color:#fff; padding: 7px 0 8px 34px; border:1px solid #0093DB; width:143px; margin-bottom:5px; } #mmkcon .gray.apbutton.niComponents { background: #f0f0f0 url('../icons/nav_components.png') 7px -50px no-repeat; padding: 7px 0 8px 34px; color:#777; border:1px solid #ccc; width:143px; margin-bottom:5px; } #mmkcon .orange.apbutton.niMaterials { padding: 7px 6px 7px 6px; margin-right:5px; } #mmkcon .gray.apbutton.niMaterials { padding: 7px 6px 7px 6px; margin-right:5px; } #mmkcon .btsize.apbutton { width:26px; height:26px; padding:0; margin:0; } #mmkcon .large_btsize.apbutton { width:50px; height:50px; padding:0; margin:0; margin-bottom:3px; } #mmkcon .large_clsize.apbutton { width:68px; height:64px; padding:0 0 0 0; margin:0 0 5px 0; } #mmkcon .center_btsize.apbutton { /*width:44px; height:44px;*/ margin:0; /*margin-bottom:3px;*/ padding:1px; } #mmkcon .large_partsize.apbutton { width:68px; height:68px; padding:0; margin:0; margin-bottom:3px; } /* BUTTON IMAGE POSITON */ #mmkcon .funcicon { position:relative; top:2px; margin:0 auto; } #mmkcon .large_funcicon { position:relative; top:2px; margin:0 auto; } /* COLORS */ #mmkcon .orange.apbutton { background: #0093DB; color:#fff; border:1px solid #0093DB; } #mmkcon .gray.apbutton { background: #f0f0f0; /* opacity:0.5;*/ color:#777; border:1px solid #ccc; } #mmkcon .imgKat.apbutton { width:80px; height:30px; } #mmkcon .grad.apbutton { background: linear-gradient(0deg, #dddddd,#ffffff); border:1px solid #ccc; } #mmkcon .gradSelect.apbutton { background: linear-gradient(0deg, #dddddd,#ffffff); border:2px solid #0093DB; } #mmkcon .part.apbutton { background: transparent; border:1px solid #ccc; } #mmkcon .partSelect.apbutton { background: transparent; border:2px solid #0093DB; } /*#mmkcon .strengthbg { border-top:1px solid #ccc; position:relative; top:4px; height:19px; padding:0 2px 2px 2px; z-index:99; background:rgba(255,255,255,0.9); color:#333; }*/ #mmkcon .strengthbg { position:relative; top:5px; height:19px; padding:0 2px 2px 2px; z-index:99; text-align:center; width:100%; font-size:14px; font-weight:bold; } /* FORMS */ #mmkcon .round.apbutton { border-radius:10%; } /* ## ----------------------------------------------------------------------------- ## ## KONFIGURATOR STYLES ## ## */ #mmkcon .konfpanel { float:left; /*width:763px;*/ width:923px; height:283px; padding:10px; text-align:left; border:1px solid #e1e1e1; border-radius:3px; font-size:0.875em; } #mmkcon .panelTitle { font-weight:bold; padding:0px 0 7px 0; margin:0 0 10px 0; border-bottom: 1px solid #DDDDDD; } #mmkcon h1.panelTitle { font-size:1.125em; font-weight:bold; padding:0px 0 7px 0; margin:0 0 10px 0; color: #0093DB; border-bottom: 1px solid #DDDDDD; } #mmkcon .ptSecond { padding:5px 0 7px 0; } #mmkcon .selBox { display:table-cell; text-align:center; vertical-align:middle; width:60px; height:60px; padding:5px; margin:4px; border-radius:3px; border:1px solid #fff; } #mmkcon .selBox a { display:block; text-decoration:none; font-size:0.75em; } #mmkcon .selActive { border:2px solid #0093DB; padding:5px; } #mmkcon .objEdit { position:absolute; background: #fff; width:159px; padding:10px; height:560px; margin:-20px 0 0 -120px; z-index:40; text-align:center; box-shadow: 0 0 15px rgba(100,100,100,0.2); text-align:left; display:none; } #mmkcon .objEditTitle { margin:20px 0 10px 0; font-weight:bold; } #mmkcon .objListLayersEdit { position:absolute; background: #fff; width:159px; padding:10px; height:560px; margin:-20px 0 0 -120px; z-index:41; text-align:center; box-shadow: 0 0 15px rgba(100,100,100,0.2); text-align:left; display:none; } #mmkcon .objListLayersEditTitle { margin:20px 0 10px 0; font-weight:bold; } #mmkcon #infobar { clear:both; display: block; font-size:14px; color:#555555; padding:10px; background: #ef8419; border-radius:3px; border: 1px solid #DDDDDD; user-select:none; } /* BUTTON NAV STYLES */ #mmkcon .leftNav { float:left; width:30px; padding-top:15px; } #mmkcon .rightNav { float:left; width:32px; padding-top:15px; text-align:right; } #mmkcon .leftImgNav { float:left; width:30px; padding-top:64px; } #mmkcon .rightImgNav { float:left; width:32px; padding-top:64px; text-align:right; } #mmkcon .leftColorNav { float:left; width:30px; padding-top:92px; } #mmkcon .rightColorNav { float:left; width:32px; padding-top:92px; text-align:right; } #mmkcon .leftPartNav { float:left; width:30px; padding-top:36px; } #mmkcon .rightPartNav { float:left; width:32px; padding-top:36px; text-align:right; } #mmkcon .leftImgKatNav { float:left; width:30px; padding-top:5px; } #mmkcon .rightImgKatNav { float:left; width:32px; padding-top:5px; text-align:right; } /* SLIDER FIX CONTAINERS */ #mmkcon .formBorderBox { float:left; display:block; margin-left:2px; /*width:364px;*/ width:87.7%; } #mmkcon .colorBox { float:left; display:block; margin-left:2px; /*width:485px;*/ width:90%; height:210px; } #mmkcon .imageNavBox { float:left; display:block; margin-left:2px; /*width:485px;*/ width:90%; height:50px; } #mmkcon .imageBox { float:left; display:block; margin-left:2px; /*width:485px;*/ width:90%; height:160px; } #mmkcon .cutBox { float:left; display:block; margin-left:2px; /*width:485px;*/ width:90%; height:210px; } #mmkcon .fixationBox { float:left; display:block; margin-left:2px; /*width:685px;*/ width:90%; height:210px; } #mmkcon .componentsBox { float:left; display:block; margin-left:2px; /*width:685px;*/ width:90%; height:210px; } #mmkcon .clipNav { width:50px; height:73px; margin-right:6px; text-align:center; } #mmkcon .clipColNav { width:70px; margin-right:4px; text-align:center; height:210px; } #mmkcon .clipImgNavKat { width:80px; margin:3px 6px 0 0; text-align:center; height:60px; } #mmkcon .clipImgNav { width:68px; margin-right: 6px; text-align:center; height:150px; } #mmkcon .clipCutNav { width:50px; margin-right:6px; text-align:center; height: 160px; } #mmkcon .clipFX { float:left; width:68px; margin-right:7px; height:106px; text-align:center; } #mmkcon .clipFXBlock { /* width:685px; */ width:645px; height:210px; } #mmkcon .clipCP { float:left; width:68px; margin-right:7px; height:106px; text-align:center; } #mmkcon .clipCPBlock { /* width:685px; */ width:645px; height:210px; } #mmkcon .propTable { line-height:1.3em; font-size:0.875em; padding:0; border-spacing:0; margin-top:5px; } #mmkcon .zubehoerDesc { display:none; } /* #mmkcon .clipPartNav { width:92px; text-align:center; } */ /* #mmkcon .clipPartNav { width:68px; text-align:center; } */ /* TEXT TMP */ #mmkcon .sym { font-size:32px; } #mmkcon .symdesc { display:block; height:36px; margin-top:0px; } #symtable td { background: #fff; padding:2px; } #symtable td:hover { background: #e5e5e5; cursor:pointer; } /* COLORS */ #mmkcon .coltext { font-family:Arial, no-serif; line-height:1.0em; font-size:0.875em; } /* VORLAGEN */ #mmkcon .loadSignLink{ display:none; background: #0093DB; position:relative; z-index:99; top: -60px; padding-top:20px; cursor:pointer; width:100%; text-align:center; height:40px; margin-bottom:-80px; border-radius: 3px; } #mmkcon .loadSignBlock { float:left; border:1px solid #ddd; border-radius:5px; } #mmkcon .loadSignBlock:hover .loadSignLink{ display : block; } #mmkcon .loadSignBlock a { color:#fff; text-decoration:none; font-weight:bold; } /* ## ----------------------------------------------------------------------------- ## ## KUNDENKONTO SITE STYLES ## ## */ #mmkcon .kknav { float:left; width:165px; margin-right:30px; font-size:0.875em; color:#0093DB; line-height:1.4em; } #mmkcon .kknav p { margin:0 0 15px 0; padding:0; } #mmkcon .kknav a { color: #555555; text-decoration:none; } #mmkcon .kknav a:hover { font-weight:bold; } #mmkcon .kknav ul { text-align:left; margin:0 10px 25px 15px; padding:0; list-style-type: none; } #mmkcon .kknav li { display:block; padding:5px 0 5px 0px; text-align:left; } #mmkcon .nblock { padding:10px; } #mmkcon .tblock { border-radius:3px; background:#fff; border: 1px solid #ddd; padding:15px; font-size:1em; } #mmkcon .tline { border-top:1px solid #dddddd; } #mmkcon .bline { border-bottom:1px solid #dddddd; } #mmkcon .customerno { position:relative; top:-20px; width:950px; color: #aaaaaa; text-align:right; font-size:0.875em; } #mmkcon .kkcon { float:left; /*width:783px;*/ width:943px; font-size: 0.875em; line-height:1.4em; color:#555555;} #mmkcon .kkcon h1 { font-size: 1.250em; color:#0093DB; font-weight:bold; margin:0 0 10px 0; padding:0; } #mmkcon .kkcon h2 { font-size: 1.250em; color: #555555; font-weight:bold; margin:0 0 10px 0; padding:0; } #mmkcon .block { width: 95%; border-radius: 3px; margin-top:20px; border: 1px solid #dddddd; background: #f9f9f9; padding: 2%; text-align:left; } #mmkcon .kkcon a { color: #0093DB; text-decoration:none; } #mmkcon .kkcon a:after { content: " » "; font-size:1.375em; } #mmkcon .btIcon { position:relative; top:1px; left:2px; font-size:1.75em; line-height:10px; margin-right:2px; } #mmkcon .btIconNoText { position:relative; top:1px; left:0; font-size:1.75em; line-height:10px; } #mmkcon .formTitle { width:250px; height:35px; text-align:right; padding-right:20px; } #mmkcon .formTitleNorm { width:90px; height:35px; padding-right:20px; } #mmkcon .formData { height:35px; } #mmkcon hr { border:0; margin:0; padding:0; height:1px; background:#dddddd; } /* ADMIN TABLE STYLES */ #mmkcon table.admin { border-collapse:collapse; } #mmkcon table.admin, th.admin, td.admin { border: 1px solid #ddd; } #mmkcon th.admin, td.admin { padding: 8px; } #mmkcon th.admin { color:#fff; background: #0093DB; } #mmkcon tr.admin:nth-child(even) { background-color: #fff } #mmkcon table.admin a { color: #0093DB; text-decoration:none; } #mmkcon table.admin a:after { content: ""; font-size:1.375em; } #mmkcon .adcolor { float:left; display:block; width:20px; height:20px; border:1px solid #ddd; border-radius:3px; margin-right:2px; } /* } */ /* ## ----------------------------------------------------------------------------- ## ## WARENKORB STYLES ## ## */ #mmkcon .kkfull { /*width:980px;*/ width:1140px; font-size:0.875em; } /* #mmkcon .kkfull.block { font-size:14px; } */ #mmkcon .kkfull h2 { font-size: 1.250em; color: #555555; font-weight:bold; margin:0 0 20px 0; padding:0; } #mmkcon .kkfull a { color: #0093DB; text-decoration:none; } #mmkcon .kkfull a:after { content: " » "; font-size:1.375em; } #mmkcon .wktab ul { text-align:left; display:inline; margin: 0 10px 0 0; padding:0; list-style-type:none;} #mmkcon .wktab li { display:inline; font-family:OpenSansRegular; font-size: 14px; padding:6px; margin:0; } #mmkcon .wktab li.active { display:inline; background: #0093DB; color: #fff; border-radius:3px 3px 0 0; border: 1px solid #0093DB; } /* ############################################################################ ### ### SYSTEM MESSAGES ### */ #mmkcon .panel { background: #fff; font-size:13px; border-radius: 5px; box-shadow: 0 0 8px 0 #ccc; float: left; height: auto; margin:0 0 20px 0; text-align:left; } #mmkcon .panel100 { width: 100%; padding: 12px; } #mmkcon .msg { display:block; padding-left:54px; } #mmkcon .msgOk { clear:both; display: block; font-size:14px; color:#fff; background: #95b122 /*#a5c425*/ url('../icons/msgOk_w.svg') no-repeat; background-size: 42px 42px; background-position: 12px 12px; min-height:42px; } #mmkcon .msgError { clear:both; display: block; font-size:14px; color:#fff; background: #bb0000 url('../icons/msgError_w.svg') no-repeat; background-size: 42px 42px; background-position: 12px 12px; min-height:42px; } #mmkcon .msgWarn { clear:both; display: block; font-size:14px; color:#fff; background: #ef8419 /*ffbb00*/ url('../icons/msgWarn_w.svg') no-repeat; background-size: 42px 42px; background-position: 12px 12px; min-height:42px; } #mmkcon .msgErrorSmall { clear:both; /*width:935px;*/ width:1096px; border-radius:3px; display: block; padding:10px 5px 5px 40px; margin: 15px 0 5px 0; font-size:0.875em; color:#fff; background: #bb0000 url('../icons/msgError_w.svg') no-repeat; background-size: 24px 24px; background-position: 8px 8px; min-height:24px; } /* #mmkcon .infobar { width:968px; padding:5px 5px 5px 5px; margin: 10px 0 15px 0; border:1px solid #ddd; border-radius:3px; background:#ffe984; font-size:0.875em; } */ #mmkcon .infobar { /*width:968px;*/ width:1129px; padding:5px 5px 5px 5px; margin: 10px 0 15px 0; border:1px solid #ddd; border-radius:3px; color:#fff; background: #95b122; font-size:0.875em; user-select:none; } #mmkcon .serientextbar { clear:both; /*width:935px;*/ width:1096px; border-radius:3px; display: block; padding:10px 5px 5px 40px; margin: 10px 0 5px 0; font-size:0.875em; color:#fff; background: #673086 url('../icons/msgSerientext_w.svg') no-repeat; background-size: 19px 19px; background-position: 11px 10px; min-height:24px; } #mmkcon .tooltip { position: relative; z-index:99; display: inline-block; border-bottom: 1px dotted #0093DB; } #mmkcon .tooltip .tooltiptext { cursor:pointer; font-size: 14px; visibility: hidden; width: 400px; background-color: #0093DB; color: #fff; text-align: center; border-radius: 3px; padding: 8px; position: absolute; z-index: 1; bottom: 150%; left: 50%; margin-left: -207px; box-shadow:0 0 10px rgba(0,0,0,0.4); } #mmkcon .tooltip .tooltiptext::after { content: ""; position: absolute; top: 99%; left: 50%; margin-left: -10px; margin-top: -2px; border-width: 10px; border-style: solid; border-color: #0093DB transparent transparent transparent; } #mmkcon .tooltip:hover .tooltiptext { visibility: visible; } /* -------------------------------------------------------------------------- */ #topline { display:block; width:100%; height:4px; background: #4265ae; } #headline { position:relative; z-index:99; width:100%; height:140px; margin:0 auto; background: #fff; box-shadow: 0 0 22px rgba(106,106,106,.5) /*shadow*/ } #headarea { width:940px; height:110px; padding:11px 40px 11px 0; margin:0 auto; /*background: #3acccf;*/ text-align:right; } #logo { float: left; position: relative; z-index: 5; top: -6px; } #logoxy { width:314px; height:122px; } #menuarea { float:left; width: 626px; } #menuarea:after { clear:both; } /* ############################################################################ ### ### SYSTEM WINDOWS ### */ .sysWin { width:460px; font-family: OpenSans; font-size: 16px; color: #555555; padding:20px 0 20px 0; margin:0 auto; text-align:left; font-size: 0.875em; } .sysWin h1 { font-size:1.125em; font-weight:bold; padding:0px 0 7px 0; margin:0 0 10px 0; color: #0093DB; border-bottom: 1px solid #DDDDDD; } .sysWin button { font-size: 14px; font-family:OpenSansRegular; border-radius:3px; padding: 6px; position:relative; top:0px; background: #0093DB; color:#fff; border:1px solid #0093DB;} .sysWin a { text-decoration:none; font-size: 14px; font-family:OpenSansRegular; border-radius:3px; padding: 6px; position:relative; top:0px; background: #0093DB; color:#fff; border:1px solid #0093DB;} .sysWinBlock { width: 95%; border-radius: 3px; margin-top:20px; border: 1px solid #dddddd; background: #f9f9f9; padding: 2%; text-align:left; } .sysWin small { font-size: 0.875em; } .sysWin input { font-family: OpenSans; font-size:1em; border: 1px solid #AAAAAA; padding:5px; color:#555555; margin-top:5px; border-radius: 3px; font-family: OpenSans; outline:none; } .sysWin input:focus { background-color: #fff; border: 1px solid #0093DB; outline: none; box-shadow: 0 0 5px rgba(0,0,0,0.2); } .sysWin input[type="file"] { display: none; } .sysWin label { font-size: 14px; font-family:OpenSansRegular; border-radius:3px; padding: 6px; position:relative; top:0px; background: #0093DB; color:#fff; border:1px solid #0093DB;} .sysWin select { font-family: OpenSans; font-size:1em; border: 1px solid #AAAAAA; padding:4px; color:#555555; margin-top:5px; border-radius: 3px; font-family: OpenSans; outline:none; } .sysWin select:focus { background-color: #fff; border: 1px solid #0093DB; outline: none; box-shadow: 0 0 5px rgba(0,0,0,0.2); } .sysWin textarea { font-family: OpenSans; font-size:1em; border: 1px solid #AAAAAA; padding:5px; border-radius: 3px; color:#555555; margin-top:5px; } .sysWin textarea:focus { background-color: #fff; border: 1px solid #0093DB; outline: none; box-shadow: 0 0 5px rgba(0,0,0,0.2); } .txtZeile { width:104px; } .loaderError { color: #cc0000; } .sysWintooltip { position: relative; z-index:99; display: inline-block; border-bottom: 1px dotted #0093DB; } .sysWintooltip .tooltiptext { cursor:pointer; font-size: 14px; visibility: hidden; width: 400px; background-color: #0093DB; color: #fff; text-align: left; border-radius: 3px; padding: 8px; position: absolute; z-index: 1; bottom: 150%; left: 95%; margin-left: -390px; box-shadow:0 0 10px rgba(0,0,0,0.4); } .sysWintooltip .tooltiptext::after { content: ""; position: absolute; top: 99%; left: 95%; margin-left: -10px; margin-top: -2px; border-width: 10px; border-style: solid; border-color: #0093DB; } .sysWintooltip:hover .tooltiptext { visibility: visible; } /* ############################################################################ ### ### KLARNA PAYEMENT STYLES ### */ #mmkbackend .pmKlarnaRow { position:relative; /*top:-28px;*/ padding: 8px 16px; font-size:12px; font-family:arial; color: #000; overflow: hidden; background-color: #fff; cursor: pointer; border-bottom: 1px solid #dfdfdf; } #mmkbackend .pmKlarnaInnerRow { margin: 25px 0 0 125px; } #mmkbackend .pmKlarnaRow:hover { background-color: #f9f9f9; } #mmkbackend .pmKlarnaIcon { display:table-cell; vertical-align:middle; width: 125px; padding-right:45px; } #mmkbackend .pmKlarnaImage { display:block; max-width:150px; max-height:45px; width:100%; } #mmkbackend .pmKlarnaName { display:table-cell; vertical-align:middle; } #mmkbackend .pmKlarnaCheckMark { background-image: url("https://www.paypalobjects.com/webstatic/ppplus/icons/checkmark.png"); background-repeat: no-repeat; background-position: right; height: 50px; width: 25px; position: relative; top: -50px; } } #mmkbackend #klarna-pay-now-main { min-width:200px; } #scrollbar1 { height: 100vh; width:100%; margin:20px auto 20px; position: relative; } #scrollbar1 .viewport { height: 100vh; overflow:hidden; position:relative; top: 0; /*margin-bottom:130px;*/ /*background: #dedede;*/ } #scrollbar1 .overview { list-style:none; position:absolute; left:0; top: 0px; margin:0 0 0; padding: 0 0 180px 0; } #scrollbar1 .scrollbar { background: #777; /*url(../icons/bg-scrollbar-track-y.png) no-repeat 0 0; */ border-radius:4px; position:absolute; background-position:0 0; right: -15px; top: 0px; width: 10px; } #scrollbar1 .track { background:transparent /* url(../icons/bg-scrollbar-trackend-y.png) no-repeat 0 100%; */ height:100%; width:10px; position:relative; padding:0 1px; } #scrollbar1 .thumb { background: transparent url(../icons/bg-scrollbar-thumb-y.png) no-repeat 50% 100%; height:20px; width:10px; cursor:pointer; overflow:hidden; position:absolute; top:0; left: 0px; } #scrollbar1 .thumb .end { background: #777 url(../icons/bg-scrollbar-thumb-y.png) no-repeat 50% 0; overflow:hidden; height:5px; width: 10px; } #scrollbar1 .disable { display:none; } .noSelect { user-select:none; -o-user-select:none; -moz-user-select:none; -khtml-user-select:none; -webkit-user-select:none; } /* ############################################################################ ### ### USERMENU NAV STYLES ### */ #mmkmenu, #mmkRespMenu { /*background: var(--gralax-blue); border-radius:4px;*/ font-family: PTSans; box-sizing:border-box; right: 20px; position: absolute; } #mmkmenu .wkBlock, #mmkRespMenu .wkBlock { float:left; display:block; background:transparent; width:145px; text-align:left; } #mmkmenu .wkIcon, #mmkRespMenu .wkIcon { display:block; position:relative; margin:0 10px 0 0; float:left; width:45px; height:45px; transform: var(--gralax-angle-menu); border-radius: var(--gralax-radius); /*50%;*/ background: url(https://schilderstyle.de/konfigurator/icons/backend_basket.svg) no-repeat center/contain; background-color: var(--gralax-blue); /*var(--gralax-gold);*/ /*#777*/; background-size:60%; } #mmkmenu .wkTextPanel, #mmkRespMenu .wkTextPanel { font-family: PTSans; position:relative; font-size: 15px; font-weight:bold; color: var(--gralax-white); /*var(--gralax-gold);*/ letter-spacing:1px; margin:14px 0 0 0; } #mmkmenu .wkCircle, #mmkRespMenu .wkCircle { box-sizing: border-box; font-family: PTSans; position: absolute; font-size:15px; font-weight:bold; background: #f00; border-radius: 50%; top: -8px;left: 29px; width: 24px; height: 24px; padding: 2px 2px; text-align: center; color: #fff; } #mmkmenu .usIcon, #mmkRespMenu .usIcon { display:block; margin:0 10px 0 0; float:left; width:45px; height:45px; transform: var(--gralax-angle-menu); border-radius: var(--gralax-radius); /*50%*/; background: url(https://schilderstyle.de/konfigurator/icons/backend_user.svg) no-repeat center/contain; background-color: var(--gralax-blue); /*var(--gralax-gold)*/; /*#777*/; background-size:60%; } #mmkmenu .usLoggedText, #mmkRespMenu .usLoggedText { font-family: PTSans; min-width:120px; color: var(--gralax-white); /*var(--gralax-gold);*/ max-width:200px; margin:10px 20px 0 0; white-space: nowrap; overflow:hidden; font-size:15px; letter-spacing:1px; line-height:1.0em; text-align:left;} #mmkmenu .usText, #mmkRespMenu .usText { font-family: PTSans; max-width:120px; color: var(--gralax-white); /*var(--gralax-gold);*/ margin:14px 15px 0 0; white-space: nowrap; overflow:hidden; letter-spacing:1px; font-size:15px; text-align:left; } #mmkmenu .userPanel { box-sizing: border-box; display: none; border:3px solid var(--gralax-white)/*#fff*/; transform: skewX(9deg); /*transform: var(--gralax-angle-menu);*/ border-radius: 0 0 4px 4px; position: absolute; top: 58px; left:13px /*-25px*/; z-index: 997; background: var(--gralax-white)/*#fff*/; box-shadow: 0 12px 10px rgba(0,0,0,0.5); width:240px; } #mmkRespMenu .userPanel { box-sizing: border-box; display: none; border:3px solid var(--gralax-white)/*#fff*/; transform: skewX(0deg); /*transform: var(--gralax-angle-menu);*/ border-radius: 0 0 4px 4px; position: absolute; top: 58px; left:13px /*-25px*/; z-index: 997; background: var(--gralax-white)/*#fff*/; box-shadow: 0 12px 10px rgba(0,0,0,0.5); width:240px; } #mmkmenu .userPanelContent, #mmkRespMenu .userPanelContent { padding: 12px 0 0 0; text-align:left; border-top:1px solid #aaa; } #mmkmenu .userPanelLoggedContent, #mmkRespMenu .userPanelLoggedContent { font-family:PTSans; padding: 12px; text-align:left; font-size:15px; } #mmkmenu .showUserLoggedPanel, #mmkmenu .showUserPanel, #mmkRespMenu .showUserLoggedPanel, #mmkRespMenu .showUserPanel { cursor:pointer; float:left; background:transparent /*#fff*/; position:relative } #mmkmenu .userPanelRegLink a, #mmkRespMenu .userPanelRegLink a { font-family:PTSans; display:block; padding:10px 0 10px 42px; text-align:left; border-top:1px solid #AAAAAA; color: var(--gralax-blue) /*#0093db*/; text-decoration:none; background: url('../icons/user_reg.png') 8px 11px no-repeat; } #mmkmenu .userPanelRegLink a:hover, #mmkRespMenu .userPanelRegLink a:hover { color:var(--gralax-white) /*#fff*/; background: var(--gralax-blue) /*#0093db*/ url('../icons/user_reg_w.png') 8px 11px no-repeat; } #mmkmenu .userPanelLostPW a, #mmkRespMenu .userPanelLostPW a { font-family:PTSans; display:block; padding:10px 0 10px 42px; text-align:left; border-top:1px solid #AAAAAA; color: var(--gralax-blue) /*#0093db*/; text-decoration:none; background: url('../icons/user_lpw.png') 9px 11px no-repeat; } #mmkmenu .userPanelLostPW a:hover, #mmkRespMenu .userPanelLostPW a:hover { color:var(--gralax-white) /*#fff*/; background: var(--gralax-blue) /*#0093db*/ url('../icons/user_lpw_w.png') 9px 11px no-repeat; } #mmkmenu .userPanelKontoLink a, #mmkRespMenu .userPanelKontoLink a { font-family:PTSans; display:block; padding:10px 0 10px 42px; text-align:left; border-top:1px solid #AAAAAA; color: var(--gralax-blue) /*#0093db*/; text-decoration:none; background: url('../icons/konto.png') 9px 11px no-repeat; } #mmkmenu .userPanelKontoLink a:hover, #mmkRespMenu .userPanelKontoLink a:hover { color:var(--gralax-white) /*#fff*/; background: var(--gralax-blue) /*#0093db*/ url('../icons/konto_w.png') 9px 11px no-repeat; } #mmkmenu .userPanelOrdersLink a, #mmkRespMenu .userPanelOrdersLink a { font-family:PTSans; display:block; padding:10px 0 10px 42px; text-align:left; border-top:1px solid #AAAAAA; color: var(--gralax-blue) /*#0093db*/; text-decoration:none; background: url('../icons/orders.png') 9px 11px no-repeat; } #mmkmenu .userPanelOrdersLink a:hover, #mmkRespMenu .userPanelOrdersLink a:hover { color:var(--gralax-white) /*#fff*/; background: var(--gralax-blue) /*#0093db*/ url('../icons/orders_w.png') 9px 11px no-repeat; } #mmkmenu .userPanelLogoutLink a, #mmkRespMenu .userPanelLogoutLink a { font-family:PTSans; display:block; padding:10px 0 10px 42px; text-align:left; border-top:1px solid #AAAAAA; color: var(--gralax-blue) /*#0093db*/; text-decoration:none; background: url('../icons/logout.png') 9px 11px no-repeat; } #mmkmenu .userPanelLogoutLink a:hover, #mmkRespMenu .userPanelLogoutLink a:hover { color:var(--gralax-white) /*#fff*/; background: var(--gralax-blue) /*#0093db*/ url('../icons/logout_w.png') 9px 11px no-repeat; } #mmkmenu .loginLoader, #mmkRespMenu .loginLoader { box-sizing:border-box; font-family: PTSans; float:left; display:none; color:#cc0000; padding:14px 10px 10px 10px; } #mmkmenu .loginInfo, #mmkRespMenu .loginInfo { box-sizing:border-box; font-family: PTSans; position:relative; font-size:15px; background:url('https://schilderstyle.de/konfigurator/icons/ajax-loader.gif') 4px 0 no-repeat; background-size:18px; padding-left:30px; color: #444; } #mmkmenu .loginFailed, #mmkRespMenu .loginFailed { font-family: PTSans; font-size:15px; color:#cc0000; display:none; } #mmkmenu input, #mmkRespMenu input { box-sizing: border-box; padding: 8px; font-size: 15px; font-family: PTSans; border-radius: 3px; border: 1px solid #888; } #mmkmenu .loginButton, #mmkRespMenu .loginButton { float:right; margin:4px 8px 15px 0; color: var(--gralax-white)/*#fff*/; outline:none; width:auto; cursor: pointer; display: inline-block; letter-spacing:0px; position: relative; font-size: 15px; font-family: PTSansCaption; padding: 8px 16px; border-radius: 3px; text-decoration: none; transform: var(--gralax-angle-menu); background-color: var(--gralax-blue)/*#0093db*/; border: 1px solid #0093db; } #mmkmenu .sm, #mmkRespMenu .sm { font-size:12px; } /* ############################################################################ ### ### BACKEND STYLES ### */ /* LAYOUT */ #mmkbackend { box-sizing:border-box; } #mmkbackend #navHeader { display:block; position:fixed; z-index:105; font-family:PTSans; font-size:14px; height:70px; width:100%; background: #fff; color: #444; box-shadow:0 0 15px rgba(0,0,0,0.7); user-select: none; } #mmkbackend #navHeader .sm { font-size:12px; } #mmkbackend #navHeader .topButton { display:inline-block; padding:17px 8px 0 0; } #mmkbackend #backlogo { float:left; width:250px; width:25%; } /** position: relative; z-index: 5; } **/ #mmkbackend .headerlogo { height:70px; margin-left:20px; } #mmkbackend #topnav { float:left; display:block; width:40%; margin:0 auto; } #mmkbackend #usernav { float:right; display:block; width:35%; position:relative; } #mmkbackend .mobilenav { } /* MOBILE NAVI */ #mmkbackend #mobilebox { position:absolute; z-index:99; right:20px; width:100%; text-align:right; } #mmkbackend .mobilebutton { background: url('../icons/mobilemenu.png') 0 0 no-repeat; width:42px; height:42px; background-size:42px 42px; margin-top:13px; display:block; float:right;} #mmkbackend #mobilemenu { display:none; font-size:18px; position:relative; width:100%; height:auto; background:#fff; left:0px;color:#fff; border-top:2px solid #0093db; border-bottom:2px solid #0093db; } #mmkbackend #mobilemenu a { font-family: PTSans; font-weight:normal; width:100%; padding:4% 2%; display:block; color: #0093db; text-align:center; border-bottom:1px solid #e5e5e5; text-decoration:none; } #mmkbackend #mobilemenu a:hover { color: #fff; background: #0093db; } #mmkbackend #mobilemenu .sep { font-family:OpenSans; font-weight:bold; display:block; background:#04200f; color:#fffbc1; padding:4%; text-align:center; } #mmkbackend #navTools { display:block; position:fixed; z-index:98; width:80px; background: #777; color: #fff; /*#30383d;*/ height:100vh; top:0; padding-top:100px; font-size:12px; font-family:PTSans; } #mmkbackend #navTools a { font-size:12px; color:#fff; } #mmkbackend #sellspace { display:block; letter-spacing:1px; color: #444; font-family:PTSans; font-size:15px; position:relative; box-sizing: border-box; margin:0 auto; padding-top:109px; } #mmkbackend #workspace { display:block; letter-spacing:1px; position:relative; box-sizing: border-box; width:auto; line-height:1.4em; /*height:100vh;*/ padding: 94px 25px 0 125px; background: rgba(255,255,255,1); /*background: #0c0;*/ overflow:hidden; color: #444; font-family:PTSans; font-size:16px; } /** #mmkbackend #workspace .sm { font-size:12px; } **/ #mmkbackend .sm { font-size:13px; } #mmkbackend #workspace ul { padding-top:5px; } #mmkbackend #workspace li { padding: 0 0 7px 0; } #mmkbackend #workspace .listsm { font-size:13px; padding-left: 10px; letter-spacing:0.4pt; } #mmkbackend h1 { color: #0093db; font-family:PTSans; font-size:28px; line-height:1.2em; } #mmkbackend h2 { color: #444; font-family:PTSans; font-size:22px; margin-top:5px; line-height:1.2em; } #mmkbackend h3 { color: #444; font-family:PTSans; font-size:20px; line-height:1.2em; } #mmkbackend p { color: #444; font-family:PTSans; font-size:16px; margin-bottom:25px; line-height:1.5em; } #mmkbackend a { color: #0093db; font-family:PTSans; font-size:16px; } #mmkbackend a:hover { text-decoration:none; } #mmkbackend .trennlinie { height:1px; background: #aaa; margin: 20px 0 20px 0; border:0; } #mmkbackend .customerPanel { background-color: #fff; box-shadow: 0 0 5px rgba(0,0,0,0.3); border-radius:4px; padding:20px 25px; min-height:440px; margin-bottom:25px!important; } #mmkbackend .basketPanel { background-color: #fff; box-shadow: 0 0 5px rgba(0,0,0,0.3); border-radius:4px; padding:20px 25px; margin-bottom:25px!important; } #mmkbackend .basketAddressPanel { background-color: #fff; box-shadow: 0 0 5px rgba(0,0,0,0.3); border-radius:4px; padding:20px 25px; min-height:720px; margin-bottom:25px!important; } #mmkbackend .searchblock { clear:both; display: block; padding: 20px; margin: 25px 0; background:#fafafa; border-radius:4px; border:1px solid #ddd; } #mmkbackend .searchblockAddress { clear:both; display: block; padding: 20px; margin: 25px 0 5px; background:#fafafa; border-radius:4px; border:1px solid #ddd; } #mmkbackend .block { display: block; padding: 20px; margin: 25px 0; } #mmkbackend .fspace { width:100%; margin:8px 0 15px; } #mmkbackend .flabel { padding:16px 0; } #mmkbackend .fspaceWK { width:100%; margin:4px 0 4px; } #mmkbackend .flabelWK { padding:14px 0 8px; } #mmkbackend .priceBlock { display:inline-block; margin-left:20px; width:100px; } #mmkbackend .sumRow { padding:15px 5px; } #mmkbackend .priceCell{ float:right; } #mmkbackend .footer { position:relative; margin-top:50px; z-index:999; padding: 5px 15px; bottom:0px; background: #777; text-align:left; color:#fff; font-family:PTSans; font-size:14px; } #mmkbackend .footer a { text-decoration:none; color:#fff; font-size:14px; } /* BASKET STUFF */ #mmkbackend .wkStepBar { width:96%; height:5px; position:absolute; z-index:99; top:165px; margin:0 auto; left:2% } #mmkbackend .wkState0 { background: linear-gradient(to left, #ccc 100%, #a5c425 0%); } #mmkbackend .wkState25 { background: linear-gradient(to left, #ccc 69.75%, #a5c425 31.25%); } #mmkbackend .wkState50 { background: linear-gradient(to left, #ccc 43%, #a5c425 57%); } #mmkbackend .wkState75 { background: linear-gradient(to left, #ccc 25%, #a5c425 75%); } #mmkbackend .wkState100 { background: #a5c425; } #mmkbackend .wkStepContainer { width:96%; position:absolute; top:119px; z-index:100; font-size:13px; left:2%; } #mmkbackend .wkStep { float:left; width:25%; text-align:center; } #mmkbackend .wkStep a { text-decoration:none; color:#444; font-size:13px; font-weight:bold;} #mmkbackend .wkStep a:hover { text-decoration:underline; } #mmkbackend .wkStepBlock { width:80px; height:80px; } #mmkbackend .wkStepBlockLast { float:right; width:80px; height:80px;} #mmkbackend .wkStep1 { background: url('../icons/wkStep1Inavtive.png') no-repeat; } #mmkbackend .wkStep1Active { background: url('../icons/wkStep1Active.png') no-repeat; } #mmkbackend .wkStep2 { background: url('../icons/wkStep2Inactive.png') no-repeat; margin-left:12.5%; } #mmkbackend .wkStep2Reached { background: url('../icons/wkStep2Reached.png') no-repeat; } #mmkbackend .wkStep2Active { background: url('../icons/wkStepActive.png') no-repeat; } #mmkbackend .wkStep3 { background: url('../icons/wkStep3Inactive.png') no-repeat; margin-left:25%; } #mmkbackend .wkStep3Reached { background: url('../icons/wkStep3Reached.png') no-repeat; } #mmkbackend .wkStep3Active { background: url('../icons/wkStepActive.png') no-repeat; } #mmkbackend .wkStep4 { background: url('../icons/wkStep4Inactive.png') no-repeat; } #mmkbackend .wkStep4Reached { background: url('../icons/wkStep4Reached.png') no-repeat; } /** #mmkbackend .wktab { text-align:left; margin: 0 0 0 0; padding:0; list-style-type:none;} #mmkbackend .wktab li { display:inline; font-family:PTSans; font-size: 16px; padding: 0px 10px 0 10px; margin:0; } #mmkbackend .wktab .active { display:inline; background: #0093db; color: #fff; border-radius: 4px; border: 1px solid #0093db; padding:8px 12px; } **/ #mmkbackend .wkStepDone { font-weight:bold; } /* JBOX MODAL OVERWRITES */ #mmkback .sysModal { display:block; max-width: 420px; } #mmkback .sysWin { font-family: PTSans; font-size: 16px; color: #444; text-align: left; margin: 15px 10px; padding:0; letter-spacing:1px;} #mmkback .sysWin .panelFull.apbutton { float:right; width:auto; background-color:#0093db; border:1px solid #0093db; font-size: 15px; font-family: PTSansCaption; padding: 8px 16px; outline:none; letter-spacing:1px; margin-bottom:5px; text-align:left; border-radius:4px; cursor:pointer; } #mmkback .sysTitle { font-weight: bold; color: #0093db; padding-bottom: 10px; border-bottom: 1px solid #ccc; } #mmkback #jBox-overlay { background: rgba(0,0,0,0.4); } #mmkback .jBox-closeButton-box .jBox-closeButton { top: -8px; right: -10px; width: 36px; height: 36px; background: #fff; border-radius: 50%; } #mmkback .jBox-closeButton-box .jBox-closeButton svg { width: 14px; height: 14px; margin-top: -7px; margin-right: -7px; } #mmkback .jBox-hasTitle.jBox-Modal.jBox-closeButton-box .jBox-closeButton { background: #fafafa; } /* BUTTONS */ #mmkbackend .apbutton { color: #fff; cursor: pointer; display: inline-block; letter-spacing:0px; position: relative; font-size: 15px; font-family: PTSansCaption; padding: 8px; border-radius: 3px; text-decoration: none; } #mmkbackend .apbutton.active { background-color:#0093db; border:1px solid #0093db; } #mmkbackend .nTitle { font-size:11px; font-family: PTSans; margin-bottom:5px; } #mmkbackend .panelFull.apbutton { width:100%; background: transparent; border:1px solid #aaa; letter-spacing:1px; margin-bottom:5px; text-align:left; } #mmkbackend .panelFull.apbutton:hover { background: #0093db; border:1px solid #0093db; } #mmkbackend .panelFull.apbutton.active { background-color:#0093db; border:1px solid #0093db; } #mmkbackend .panelFull.apbutton.linkstyle { display:block; width:100%; text-decoration:none; font-size:15px; } #mmkbackend .panelFull.apbutton.linkfree { display:block; text-decoration:none; text-align:center; } #mmkbackend .buttonTopSpacer { margin-top:5px; } #mmkbackend .buttonAligner { float:left; width:auto!important; margin-left:10px; } #mmkbackend .panelFull.apbutton.stdButton { width:auto; padding: 8px 16px; outline:none; margin-bottom:0; } #mmkbackend .panelFull.apbutton.funcButton { float:right; width:auto; padding: 8px 16px; outline:none; margin-bottom:0; } #mmkbackend .panelFull.apbutton.closeButton { position:relative; outline:none; top:-4px; border-radius:50%; width:24px; height:23px; padding:0; text-align:center; font-weight:bold; background: url('../icons/close_bt.png') 6px 5px no-repeat; background-size:10px; } #mmkbackend .panelFull.apbutton.closeButton:hover { background: #0093db url('../icons/close_bt.png') 6px 5px no-repeat; background-size:10px; } /* TABS */ #mmkbackend .tabButton.apbutton { width:auto; float:left; margin-right:5px; outline:none; } #mmkbackend .tabActive.apbutton { background: #0093db; color:#fff; border:1px solid #0093db; outline:none; } #mmkbackend .tabGray.apbutton { background: #f0f0f0; /* opacity:0.5;*/ color:#777; border:1px solid #ccc; outline:none; } #mmkbackend .tabGray.apbutton:hover { color: #fff; } #mmkbackend .tabContent {} #mmkbackend .tabContentActive { display:block; } #mmkbackend .tabContentInactive { display:none; } #mmkbackend .amazonLoginButton { float:right; position:relative; margin-right:10px; top:-2px; } /* TABLE STYLES */ #mmkbackend .admin, .adminL, .adminR { border-collapse:collapse; border: 1px solid #ddd; } #mmkbackend th.admin, td.admin { padding: 8px; text-align:center; } #mmkbackend th.adminTop, td.adminTop { padding: 0; text-align:left; vertical-align:top; } #mmkbackend th.adminL, td.adminL { padding: 8px; text-align:left; } #mmkbackend th.adminR, td.adminR { padding: 8px; text-align:right; } #mmkbackend th.admin, th.adminL, th.adminR { color:#fff; background: #0093db; /*#0093DB;*/ } #mmkbackend tr.admin:nth-child(even) { background-color: #fff } #mmkbackend .checkcol { display:flex; } #mmkbackend table.admin a { color: #0093DB; text-decoration:none; } #mmkbackend table.admin a:after { content: ""; font-size:1.375em; } #mmkbackend .adcolor { float:left; display:block; width:20px; height:20px; border:1px solid #ddd; border-radius:3px; margin-right:2px; } /* COLS */ #mmkbackend .colMax { max-width:1140px; } #mmkbackend .col100 { float:left; margin:0; width:100%; } #mmkbackend .col75 { float:left; margin:0; display:block; width:72.083333333%; } #mmkbackend .col50 { float:left; margin:0; display:block; width:47.083333333%; } #mmkbackend .col66 { float:left; margin:0; display:block; width:63.7499999934%; } #mmkbackend .col33 { float:left; margin:0; display:block; width:30.41666666634%; } #mmkbackend .gold12 { float:left; margin:0; display:block; width:35.2799344590105125%; } #mmkbackend .gold21 { float:left; margin:0; display:block; width:58.8867322089894833%; } #mmkbackend .col25 { float:left; margin:0; display:block; width:22.0833333335%; } #mmkbackend .col20 { float:left; margin:0; display:block; width:17.916666666%; } #mmkbackend .col16 { float:left; margin:0; display:block; width:14.583333326666%; } #mmkbackend .space2 { float:left; display:block; margin-right: 5.833333333333%; } #mmkbackend .space3 { float:left; display:block; margin-right: 4.37500000049%; } #mmkbackend .space4 { float:left; display:block; margin-right: 3.88888888866%; } #mmkbackend .space5 { float:left; display:block; margin-right: 2.6041666666%; } #mmkbackend .space6 { float:left; display:block; margin-right: 2.5%; } .col100 { float:left; width:100%; } .col50 { float:left; width:47.5%; } .col25 { float:left; width:22.5%; } .space50 { margin-left:5%; } .space25 { margin-left:3.33333333333333%; } .right { text-align:right; } /* ## ## BACKEND OBJEKTE ICON NAVIGATION (LINKS) ## */ @-o-keyframes fadeIt { 0% { background-color: rgba(32,47,108,0.0); } 50% { background-color: rgba(32,47,108,0.5); } 100% { background-color: #202f6c; } } @keyframes fadeIt { 0% { background-color: rgba(32,47,108,0.0); } 50% { background-color: rgba(32,47,108,0.5); } 100% { background-color: #202f6c; } } /** #eyecon .objNaviSpace { height:20px; } **/ #mmkbackend .navPanel { user-select: none; display:none; position:absolute; z-index:98; font-size:14px; left:80px; top:0px; padding:74px 20px 20px 20px; height:100vh; width:280px; background:#555555; /*#ccc;*/ letter-spacing:1px; } #mmkbackend #navTools .navPanel a {font-size:15px; } #mmkbackend #navTools .menuLink { text-decoration:none; } #mmkbackend #navTools .menuLinkActive { background: #555; } #mmkbackend .navPanelTitle { padding:20px 0 0 0; font-family: PTSansCaption; font-size:14px; text-transform: uppercase; text-align:left; font-weight:normal; } #mmkbackend .navPanelSubTitle { padding:20px 0 0 0; font-family: PTSansCaption; font-size:13px; text-align:left; } #mmkbackend .noTopSpacer { padding:0; margin-top:5px!important; } #mmkbackend .navPanelBlock { margin-top:20px; /*background:#202629;*/ } #mmkbackend .dotted { border-radius:3px; border:2px dashed #3a444a; } /** #eyecon .lightbg { background: #30383d; } **/ #mmkbackend .navPanelSeparator { margin-top:20px; height:5px; background: url('../icons/backend_separator.png') repeat-x; } #mmkbackend .navButton { margin: 0 auto; cursor:pointer; /*height:54px;*/ /*background:rgba(34,37,49,0.4);*/ padding:10px 0; text-align:center; user-select: none; } #mmkbackend .navButton img { width:40px; height:40px; display:block; margin:0 auto 7px auto; } #mmkbackend .navButton.active { background: #555; } #mmkbackend .navButton:hover { cursor:pointer; background-color: #555; /*#202f6c;*/ /*background:rgba(0,0,0,0.6); */ /** background-image:none !important; -o-animation: fadeIt 500ms ease-in; animation: fadeIt 500ms ease-in; **/ } #mmkbackend .buttonGroup { display:table-row; width:100%; text-align:left; } /* LOADER */ #mmkLoad { position:relative; width:210px; height:25px; margin:auto; } .mmkLoadInfo { width:100%; color: #ccc; font-size:12px; margin-top:25px; text-align:left; } .mmkLoad { position:absolute; top:0; background-color: #0093db; width:20px; height:20px; animation-name:bounce_mmkLoad; -o-animation-name:bounce_mmkLoad; -ms-animation-name:bounce_mmkLoad; -webkit-animation-name:bounce_mmkLoad; -moz-animation-name:bounce_mmkLoad; animation-duration:1.5s; -o-animation-duration:1.5s; -ms-animation-duration:1.5s; -webkit-animation-duration:1.5s; -moz-animation-duration:1.5s; animation-iteration-count:infinite; -o-animation-iteration-count:infinite; -ms-animation-iteration-count:infinite; -webkit-animation-iteration-count:infinite; -moz-animation-iteration-count:infinite; animation-direction:normal; -o-animation-direction:normal; -ms-animation-direction:normal; -webkit-animation-direction:normal; -moz-animation-direction:normal; transform:scale(.3); -o-transform:scale(.3); -ms-transform:scale(.3); -webkit-transform:scale(.3); -moz-transform:scale(.3); border-radius:13px; -o-border-radius:13px; -ms-border-radius:13px; -webkit-border-radius:13px;-moz-border-radius:13px; } #mmkLoad_1 { left:0; animation-delay:0.6s; -o-animation-delay:0.6s; -ms-animation-delay:0.6s; -webkit-animation-delay:0.6s; -moz-animation-delay:0.6s; } #mmkLoad_2 { left:26px; animation-delay:0.75s; -o-animation-delay:0.75s; -ms-animation-delay:0.75s; -webkit-animation-delay:0.75s; -moz-animation-delay:0.75s; } #mmkLoad_3 { left:52px; animation-delay:0.9s; -o-animation-delay:0.9s; -ms-animation-delay:0.9s; -webkit-animation-delay:0.9s; -moz-animation-delay:0.9s; } #mmkLoad_4 { left:79px; animation-delay:1.05s; -o-animation-delay:1.05s; -ms-animation-delay:1.05s; -webkit-animation-delay:1.05s; -moz-animation-delay:1.05s; } #mmkLoad_5 { left:105px; animation-delay:1.2s; -o-animation-delay:1.2s; -ms-animation-delay:1.2s; -webkit-animation-delay:1.2s; -moz-animation-delay:1.2s; } #mmkLoad_6 { left:131px; animation-delay:1.35s; -o-animation-delay:1.35s; -ms-animation-delay:1.35s; -webkit-animation-delay:1.35s; -moz-animation-delay:1.35s; } #mmkLoad_7 { left:157px; animation-delay:1.5s; -o-animation-delay:1.5s; -ms-animation-delay:1.5s; -webkit-animation-delay:1.5s; -moz-animation-delay:1.5s; } #mmkLoad_8 { left:184px; animation-delay:1.64s; -o-animation-delay:1.64s; -ms-animation-delay:1.64s; -webkit-animation-delay:1.64s; -moz-animation-delay:1.64s; } @keyframes bounce_mmkLoad{ 0%{ transform:scale(1); background-color: #0093db; } 100%{ transform:scale(.3); background-color:rgb(255,255,255); } } @-o-keyframes bounce_mmkLoad{ 0%{ -o-transform:scale(1); background-color: #0093db; } 100%{ -o-transform:scale(.3); background-color:rgb(255,255,255); } } @-ms-keyframes bounce_mmkLoad{ 0%{ -ms-transform:scale(1); background-color: #0093db; } 100%{ -ms-transform:scale(.3); background-color:rgb(255,255,255); } } @-webkit-keyframes bounce_mmkLoad{ 0%{ -webkit-transform:scale(1); background-color: #0093db; } 100%{ -webkit-transform:scale(.3); background-color:rgb(255,255,255); } } @-moz-keyframes bounce_mmkLoad{ 0%{ -moz-transform:scale(1); background-color: #0093db; } 100%{ -moz-transform:scale(.3); background-color:rgb(255,255,255); } } /* FORMS */ /* */ #mmkbackend input { box-sizing: border-box; padding:8px; font-size:15px; font-family:PTSans; border-radius:3px; border:1px solid #888; } #mmkbackend select { box-sizing: border-box; padding:8px; font-size:15px; font-family:PTSans; border-radius:3px; border:1px solid #888; } #mmkbackend textarea { box-sizing: border-box; padding:8px; font-size:15px; font-family:PTSans; border-radius:3px; border:1px solid #888; } /* Customize checkbox */ #mmkbackend .container { display: block; position: relative; padding-left: 30px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; line-height:1.3em; } #mmkbackend .container input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; } #mmkbackend .checkmark { position: absolute; top: 0; left: 0; height: 24px; width: 22px; background-color: #fff; border-radius:3px; border:1px solid #888; } #mmkbackend .container:hover input ~ .checkmark { background-color: #fff; } #mmkbackend .container input:checked ~ .checkmark { background-color: #0093db; border:1px solid #0093db; } #mmkbackend .checkmark:after { content: ""; position: absolute; display: none; } #mmkbackend .container input:checked ~ .checkmark:after { display: block; } #mmkbackend .container .checkmark:after { left: 7px; top: 4px; width: 7px; height: 12px; border: solid white; border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } /* Customize radiobox */ #mmkbackend .bulletmark { position: absolute; top: 2px; left: 0; height: 21px; width: 21px; background-color: #fff; border-radius: 50%; border:1px solid #888; } #mmkbackend .container:hover input ~ .bulletkmark { background-color: #fff; border:1px solid #888; } #mmkbackend .container input:checked ~ .bulletmark { background-color: #0093db; } #mmkbackend .bulletmark:after { content: ""; position: absolute; display: none; } #mmkbackend .container input:checked ~ .bulletmark:after { display: block; } #mmkbackend .container .bulletmark:after { top: 5px; left: 5px; width: 9px; height: 9px; border-radius: 50%; background: white; } #mmkbackend .checkContainerForm { top:14px; padding:2px 0 0 35px; } #mmkbackend .checkContainer { top:-11px; padding-left:0px; } /** #mmkbackend .buttonLayer { display:block; margin-top:40px; float:right; width:100%; } **/ /*BEZEICHNER*/ #mmkbackend .optMM::after { content: 'mm'; position:absolute; margin: 15px -35px 0; } #mmkbackend .optEUR::after { content: '\20AC'; position:absolute; margin: 15px -18px 0; } #mmkbackend .optEURTABLE::after { content: '\20AC'; position:absolute; margin: 8px -18px 0; } #mmkbackend .optKG::after { content: 'kg'; position:absolute; margin: 15px -25px 0; } #mmkbackend .optPROZ::after { content: '%'; position:absolute; margin: 15px -21px 0; } #mmkbackend .optPROZTABLE::after { content: '%'; position:absolute; margin: 8px -21px 0; } #mmkbackend .optPX::after { content: 'px'; position:absolute; margin: 15px -26px 0; } /* ERROR MESSAGES */ #mmkbackend .panel { box-sizing: border-box; background: #fff; font-size:13px; border-radius: 5px; box-shadow: 0 0 8px 0 #ccc; float: left; height: auto; margin:0 0 20px 0; text-align:left; } #mmkbackend .panel100 { width: 100%; padding: 12px; } #mmkbackend .msg { display:block; padding-left:54px; } #mmkbackend .msgOk { clear:both; display: block; font-size:16px; color:#fff; background: #95b122 /*#a5c425*/ url('../icons/msgOk_w.svg') no-repeat; background-size: 42px 42px; background-position: 12px 12px; min-height:42px; } #mmkbackend .msgError { clear:both; display: block; font-size:16px; color:#fff; background: #bb0000 url('../icons/msgError_w.svg') no-repeat; background-size: 42px 42px; background-position: 12px 12px; min-height:42px; } #mmkbackend .msgWarn { clear:both; display: block; font-size:16px; color:#fff; background: #ef8419 /*ffbb00*/ url('../icons/msgWarn_w.svg') no-repeat; background-size: 42px 42px; background-position: 12px 12px; min-height:42px; } /* LISTS */ #mmkbackend #orderpanel { display:block; position:absolute; z-index:97; top:0px; padding:93px 20px 20px 20px; box-sizing:border-box; left:80px; width:280px; background: #f5f5f5; height:100vh; font-size:14px; overflow-y:auto;} #mmkbackend .orderblock { border:1px solid #888; border-radius:5px; padding:10px; margin-bottom:7px; } #mmkbackend .materialrow { padding:10px; border-radius:5px; border:1px solid #aaa; } #mmkbackend .articlerow { border-radius:5px; padding:10px; } #mmkbackend .articlerow:hover { cursor:pointer; background:#f5f5f5; } #mmkbackend .articledetails { border-top:1px solid #aaa; margin-top:5px; font-weight:normal; padding-top:15px; } #mmkbackend .articleactive { background:#f5f5f5; font-weight:bold; border:1px solid #aaa; } #mmkbackend .previewImg { display: none; /*position:relative; top:-40px; left: -120px; z-index:99; */ } #mmkbackend a:hover + .previewImg { display: block; } /** SST HACKS FOR WP WEBSITE */ .header-search-popup { margin-top:30px; } /** SETS SEARCH POPUP LOWER to ensure Login Button are visible */ /* RESPONSIVE */ @media only screen and (max-width : 480px) { .mobile-logo { max-width:50%!important; } /*SST HACK FOR RESP*/ .logo img, .mobile-logo img { max-width: none; } #mmkmenu { position:relative; right:auto;} #mmkRespMenu { position:relative; right:-30px;} #mmkbackend #topnav { display:none; } /* NAVIGATION */ #mmkbackend #backlogo { width: 135px; } #mmkbackend .headerlogo { height: 40px; margin: 18px 0 0 10px; } #mmkbackend #navTools { position: relative; width: 100%; height: 103px; top: 40px; /*padding-top: 100px;*/ float:left; } #mmkbackend #navTools .menuLink { text-decoration: none; width:62px; } #mmkbackend #navTools .menuDesc { display:none; } #mmkbackend .navPanel { width:100%; min-width:218px; top:95px; left:0px; height:auto; padding:10px 25px 25px 25px; } #mmkbackend .navButton img { width:32px; height:32px; display:block; margin:0 auto 7px auto; } #mmkbackend .navButton { padding: 16px 0 8px; top: -68px; position: relative; float:left; width:50px; } #mmkbackend #usernav { margin-right: 50px; width:auto;} #mmkmenu .userPanel { left:-90px; } #mmkRespMenu .userPanel { left:-160px; } #mmkRespMenu .usIcon { width:35px; } #mmkRespMenu .wkIcon { width:35px; } #mmkmenu .wkBlock, #mmkRespMenu .wkBlock { width:auto; } #mmkmenu .wkTextPanel, #mmkRespMenu .wkTextPanel { display:none; } #mmkmenu .usText, #mmkRespMenu .usText { display:none; } #mmkmenu .usLoggedText, #mmkRespMenu .usLoggedText { display:none; } #mmkbackend #mobilebox { width:auto; right:10px; } #mmkbackend .mobilebutton { width: 36px; height: 36px; background-size: 36px 36px; margin-top: 18px; } #mmkbackend #mobilemenu { display:none; position:absolute; z-index:99; top: 70px; padding-top: 0px; } /* FORMS */ #mmkbackend .flabel { padding:4px 0; } /* MODAL */ #mmkback .sysModal { display: block; width:auto; max-width: 250px; } /* CONTENT */ #mmkbackend h1 { font-size:26px; } #mmkbackend #workspace { padding:50px 15px 15px 15px; } #mmkbackend .block { padding:0; } #mmkbackend .workFilesArea { display:none; } #mmkbackend .amazonLoginButton { float:right; position:relative; margin:10px 0 0 0; } /* SPECIAL DESIGN CLASSES SM */ #mmkbackend .kkEditButton { text-align:left; margin-top:25px; } #mmkbackend .kkForceLeft { text-align:left; } #mmkbackend .marginTopSM { margin-top:15px; } /* TABLE HIDERS */ #mmkbackend .hideSM { display:none; } #mmkbackend .tableScrollX { overflow-y:scroll; padding-bottom:35px; } #mmkbackend .classicTable { display:none; } /* COLS */ #mmkbackend .colMax { padding: 4%; width:100%; } #mmkbackend .col75 { width:100%; } #mmkbackend .col66 { width:100%; } #mmkbackend .col50 { width:100%; } #mmkbackend .col33 { width:100%; } #mmkbackend .col25 { width:100%; } #mmkbackend .col20 { width:100%; } /* BASKET */ #mmkbackend .pmKlarnaInnerRow { margin: 25px 0 0 0; } } @media only screen and (min-width : 481px) and (max-width : 768px) { .mobile-logo { max-width:55%!important; } /*SST HACK FOR RESP*/ .logo img, .mobile-logo img { max-width: none; } #mmkmenu { position:relative; right:auto;} #mmkRespMenu { position:relative; right:-30px;} #mmkbackend #topnav { display:none; } /* NAVIGATION */ #mmkbackend .navPanel { width:auto; min-width:218px; } #mmkbackend #mobilemenu { display:none; position:absolute; z-index:99; top: 70px; padding-top: 0px; } #mmkbackend #navTools { position: relative; width: 100%; height: 125px; top: 40px; /*padding-top: 100px;*/ float:left; } #mmkbackend .navPanel { width:100%; min-width:218px; top:125px; left:0px; height:auto; padding:10px 25px 25px 25px; } #mmkbackend .navButton { padding: 16px 0 16px; top: -69px; position: relative; float:left; width:80px; } #mmkbackend #usernav { margin-right: 50px; width:auto;} #mmkmenu .userPanel { left:-90px; } #mmkRespMenu .userPanel { left:-130px; } #mmkmenu .wkBlock, #mmkRespMenu .wkBlock { width:auto; } #mmkmenu .wkTextPanel, #mmkRespMenu .wkTextPanel { display:none; } #mmkmenu .usText, #mmkRespMenu .usText { display:none; } #mmkmenu .usLoggedText, #mmkRespMenu .usLoggedText { display:none; } #mmkbackend #mobilebox { width:auto; right:10px; } #mmkbackend .mobilebutton { width: 36px; height: 36px; background-size: 36px 36px; margin-top: 18px; } #mmkbackend #mobilemenu { display:none; position:absolute; z-index:99; top: 70px; padding-top: 0px; } /* FORMS */ #mmkbackend .flabel { padding:4px 0; } /* MODAL */ #mmkback .sysModal { display: block; width:auto; max-width: 320px; } /* CONTENT */ #mmkbackend h1 { font-size:26px; } #mmkbackend #workspace { padding:50px 15px 15px 15px; } #mmkbackend .block { padding:0; } #mmkbackend .workFilesArea { display:none; } /* SPECIAL DESIGN CLASSES SM */ #mmkbackend .kkEditButton { text-align:left; margin-top:25px; } #mmkbackend .kkForceLeft { text-align:left; } #mmkbackend .marginTopSM { margin-top:15px; } /* TABLE HIDERS */ #mmkbackend .hideSM { display:none; } #mmkbackend .tableScrollX { overflow-y:scroll; margin-bottom:25px; } #mmkbackend .classicTable { display:none; } /* COLS */ #mmkbackend .colMax { padding: 2.5%; width:100%; } #mmkbackend .col75 { width:100%; } #mmkbackend .col66 { width:100%; } #mmkbackend .col50 { width:100%; } #mmkbackend .col33 { width:100%; } #mmkbackend .col25 { width:100%; } #mmkbackend .col20 { width:100%; } /* BASKET */ #mmkbackend .pmKlarnaInnerRow { margin: 25px 0 0 0; } } @media only screen and (min-width : 600px) and (max-width : 768px) { .mobile-logo { max-width:33%!important; } /*SST HACK FOR RESP*/ .logo img, .mobile-logo img { max-width: none; } #mmkbackend #topnav { display:none; } /* NAVIGATION */ #mmkbackend .navPanel { width:50%; min-width:218px; } #mmkbackend #mobilebox { } #mmkbackend #mobilemenu { display:none; position:absolute; z-index:99; top: 70px; padding-top: 0px; } } @media only screen and (min-width : 769px) and (max-width : 1023px) { #mmkbackend #topnav { width:50%;} #mmkmenu, #mmkRespMenu { position:relative; right:auto; } /* NAVIGATION */ #mmkbackend #backlogo { width: 220px; } #mmkbackend .headerlogo { height: 55px; margin: 8px 0 0 10px; } #mmkbackend #usernav { margin-right: 10px; width:auto;} #mmkmenu .userPanel, #mmkRespMenu .userPanel { left:-130px; } #mmkmenu .wkBlock, #mmkRespMenu .wkBlock { width:auto; } #mmkmenu .wkTextPanel, #mmkRespMenu .wkTextPanel { display:none; } #mmkmenu .usText, #mmkRespMenu .usText { display:none; } #mmkmenu .usLoggedText, #mmkRespMenu .usLoggedText { display:none; } /* CONTENT */ #mmkbackend .respTable { display:none; } #mmkbackend .workFilesArea { display:none; } /* SPECIAL DESIGN CLASSES SM */ #mmkbackend .kkEditButton { text-align:left; margin-top:25px; } #mmkbackend .marginTopSM { margin-top:15px; } /* TABLE HIDERS */ #mmkbackend .hideL { display:none; } /* COLS */ #mmkbackend .col75 { width:100%; } #mmkbackend .col50LSpace { width: 52.5%; margin-right:2.5%; } #mmkbackend .col50L { width:45%; margin:0; text-align:left; } #mmkbackend .col50SpecL { width: 100%; } #mmkbackend .col25L { width:45%; } /* HIDE ELEMENTS */ #mmkbackend #mobilebox { display:none; } #mmkbackend #mobilemenu { display:none; position:absolute; left: -9999px; } } @media only screen and (min-width : 1024px) and (max-width : 1279px) { /* NAVIGATION */ #mmkbackend #backlogo { /*width: 240px;*/ width:23%; } #mmkbackend .headerlogo { height: 62px; margin: 4px 0 0 10px; } #mmkbackend #topnav { width:38%; } #mmkbackend #usernav { width:38%; } #mmkmenu .wkBlock, #mmkRespMenu .wkBlock { width:auto; } #mmkmenu .wkTextPanel, #mmkRespMenu .wkTextPanel { display:none; } /* CONTENT */ #mmkbackend .respTable { display:none; } #mmkbackend .respWorkfiles { display:none; } /* TABLE HIDERS */ #mmkbackend .hideXL { display:none; } /* COLS */ #mmkbackend .col75 { width:100%; } #mmkbackend .col50SpecL { width: 100%; } #mmkbackend .col50LSpace { width: 52.5%; margin-right:2.5%; } /* HIDE ELEMENTS */ #mmkbackend #mobilebox { display:none; } #mmkbackend #mobilemenu { display:none; position:absolute; left: -9999px; } } @media only screen and (min-width : 1280px) and (max-width : 1439px) { /* COLS */ #mmkbackend .col50SpecL { width: 100%; } #mmkbackend .col50LSpace { width: 52.5%; margin-right:2.5%; } #mmkbackend .col50L { width:45%; margin:0; text-align:left; } /* HIDE ELEMENTS */ #mmkbackend #mobilebox { display:none; } #mmkbackend #mobilemenu { display:none; position:absolute; left: -9999px; } #mmkbackend .respTable { display:none; } #mmkbackend .respWorkfiles { display:none; } } @media only screen and (min-width : 1440px) { /* HIDE ELEMENTS */ #mmkbackend #mobilebox { display:none; } #mmkbackend #mobilemenu { display:none; position:absolute; left: -9999px; } #mmkbackend .respTable { display:none; } #mmkbackend .respWorkfiles { display:none; } } /* ############################################################################ ### ### SPINNER ### */ /* .spinner { height: 60px; width: 60px; margin: 94px auto 0 auto; position: relative; -webkit-animation: rotation .8s infinite linear; -moz-animation: rotation .8s infinite linear; -o-animation: rotation .8s infinite linear; animation: rotation .8s infinite linear; border-left: 6px solid rgba(0, 174, 239, .15); border-right: 6px solid rgba(0, 174, 239, .15); border-bottom: 6px solid rgba(0, 174, 239, .15); border-top: 6px solid rgba(0, 174, 239, .8); border-radius: 100%; } @-webkit-keyframes rotation { from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(359deg); } } @-moz-keyframes rotation { from { -moz-transform: rotate(0deg); } to { -moz-transform: rotate(359deg); } } @-o-keyframes rotation { from { -o-transform: rotate(0deg); } to { -o-transform: rotate(359deg); } } @keyframes rotation { from { transform: rotate(0deg); } to { transform: rotate(359deg); } } */ /* ############################################################################ ### ### SPINNER2 ### */ .loader2 { display: inline-block; position: relative; width: 64px; height: 64px; } .loader2 div { position: absolute; top: 27px; width: 11px; height: 11px; border-radius: 50%; background: #0093DB; animation-timing-function: cubic-bezier(0, 1, 1, 0); } .loader2 div:nth-child(1) { left: 6px; animation: lds-ellipsis1 0.6s infinite; } .loader2 div:nth-child(2) { left: 6px; animation: lds-ellipsis2 0.6s infinite; } .loader2 div:nth-child(3) { left: 26px; animation: lds-ellipsis2 0.6s infinite; } .loader2 div:nth-child(4) { left: 45px; animation: lds-ellipsis3 0.6s infinite; } @keyframes lds-ellipsis1 { 0% { transform: scale(0); } 100% { transform: scale(1); } } @keyframes lds-ellipsis3 { 0% { transform: scale(1); } 100% { transform: scale(0); } } @keyframes lds-ellipsis2 { 0% { transform: translate(0, 0); } 100% { transform: translate(19px, 0); } } /** INLINE BUTTON LOADER **/ .loader3 { display: inline-block; position: relative; width: 64px; height: 0px; } .loader3 div { position: absolute; top: -10px; width: 11px; height: 11px; border-radius: 50%; background: #fff; animation-timing-function: cubic-bezier(0, 1, 1, 0); } .loader3 div:nth-child(1) { left: 6px; animation: lds-ellipsis1 0.6s infinite; } .loader3 div:nth-child(2) { left: 6px; animation: lds-ellipsis2 0.6s infinite; } .loader3 div:nth-child(3) { left: 26px; animation: lds-ellipsis2 0.6s infinite; } .loader3 div:nth-child(4) { left: 45px; animation: lds-ellipsis3 0.6s infinite; } @keyframes lds-ellipsis1 { 0% { transform: scale(0); } 100% { transform: scale(1); } } @keyframes lds-ellipsis3 { 0% { transform: scale(1); } 100% { transform: scale(0); } } @keyframes lds-ellipsis2 { 0% { transform: translate(0, 0); } 100% { transform: translate(19px, 0); } } /* ## ----------------------------------------------------------------------------- ## ## CLEAR STYLES ## */ .clear { clear:both; } .group:after { content: ""; display: table; clear: both; }