/* # Hide elements ================================================ */ .hide-for-mobile { display: none;} .hide-for-screen { display: block;} .floatLeft {float: left;} /* .floatLeft is being used on: =========================== - Notification in modal_shopcart */ /* SPRÅKFLAGG -------------------------------------------------------------------------------- */ #languageWrapper { padding:12px; background-color:#333; } a.languageFlag { margin-right:12px; margin-top:13px; } a.languageFlag:hover { } /* # Layout ================================================ */ /* Change webpage topnavigation -------------------------------------------------------------------------------- */ .change-webpage { font-family:Arial, Helvetica, sans-serif; font-size:12px; height:40px; background-color:#transparent; width:970px; margin:0 auto 0 auto; padding:15px 0 0 0; } .change-webpage .button { } .change-webpage .button a { color:#666; float:left; text-decoration:none; padding:10px 20px; } .change-webpage .button a:hover { color:#333; } .change-webpage .button-active a { color:#666; float:left; text-decoration:none; padding:10px 20px; border-top: 1px solid #999; border-right: 1px solid #999; border-left: 1px solid #999; border-bottom-width:3px; border-bottom-style:solid; border-bottom-color:#EAEAEA; background-color:#EAEAEA; } .change-webpage .button-active a:hover { color:#333; } /* Generell Layout */ /*body { background: white; overflow-x: hidden; }*/ body { background: #EAEAEA; } #logo { height: 80px; width: auto; padding: 10px 10px 5px 10px; } .box-inner-article-wrapper img { width: 100%; height:auto; padding:0px; margin:0px; } .outer-container { width: 100%; min-width: 240px;} .header { position: relative;} /* To position .modal_shopcart! */ .header { min-width:97.2%; border-bottom: 1px rgba(255,255,255,0.1) solid; margin: 2px 0 0 0; padding: 0 0 6px 10px;} .header img { max-width: 200px;} .content-container { width: 100%; background-color: #FFF; } .productView-right { background-color: #F2F2F2; border: 1px solid #CCC; margin-bottom: 15px; margin-top: 0px; } .left-container { width: 100%;} .right-container { width: 100%; margin: 10px 0 0 0;} .right-container img { max-width: 100%;} .content-wrapper { padding: 0px 20px 60px 20px; background: white; } .front-right-container { width: 100%; height: auto; text-align: center;} .shortcut-image { display: none; box-shadow: none; width: 30%; padding: 25px 0; margin: 0 0 0 10px; float: left; text-align: center;} .shortcut-image img { width: 100%;} .shortcut-image-mobile {display: block; box-shadow: none; width: 30%; padding: 25px 0; margin: 0 0 0 10px; float: left; text-align: center;} .shortcut-image-mobile img {width: 100%; min-width: 110px; max-width: 150px;} .front-article {box-shadow: none; width: 93.9%; height: 131px; padding: 20px; margin: 10px 0 0 5px; float: left; text-align: left; } /* Toppnavigasjon på forside */ .toppnav-mobil-container form { padding: 0px 0px 0px 0px; margin: 5px 10px 5px 10px; width:95%; line-height: 40px; } .toppnav-mobil-container select { font-size:16px; font-weight:normal; padding: 0px 0px 0px 9px; margin: 0px 0px 5px 0px; width:100%; color:#FFF; background-color:#333333; } .toppnav-mobil-container option { font-size:16px; font-weight:normal; padding: 9px 9px 9px 9px; margin: 0px 0px 5px 0px; width:100%; color:#FFF; background-color:#333333; } /* Mobile header */ .mobile-header-background { width:100%; height:100px; background-image: url(../gfx/mobile_header_background.png); background-position: left top; overflow:hidden; } .mobile-header-backbutton { } .mobile-header-logo { margin:0px 0px 0px 10px; float:left; } .mobile-header-call { margin:0px 0px 0px 0px; float:right; } .mobile-header-search { margin:0px 0px 0px 0px; float:right; } .mobile-header-menu { margin:0px 9px 0px 9px; float:right; } /* FOOTER ------------------------------------------------------------------------------------------------------ */ .footer { margin: 15px 0px 50px 0px; text-align:center; } .footer strong { color: #666; } .footer, .footer a { font-size: 14px; color: #666; line-height: 18px; } .footer a { color: #666; } .footer a:hover { color: #000; } .footer-underside { margin: 15px 0px 50px 0px; text-align:center; } .footer-underside strong { color: #666; } .footer-underside, .footer-underside a { font-size: 14px; color: #666; line-height: 18px; } .footer-underside a { color: #666; } .footer-underside a:hover { color: #000; } /* Klarna Info Icons - Footer */ a.klarna_invoice-icon, a.klarna_account-icon { transition: all 0.25s ease-in-out; margin: 0 0 10px 0;} a.klarna_invoice-icon {width: 75px; height: 30px; background: url('../gfx/sprite_klarna.png'); background-position: 0 30px; display: inline-block;} a.klarna_invoice-icon:hover {background: url('../gfx/sprite_klarna.png'); background-position: 0 0;} a.klarna_account-icon {width: 75px; height: 30px; background: url('../gfx/sprite_klarna.png'); background-position: 76px 30px ; display: inline-block;} a.klarna_account-icon:hover {background: url('../gfx/sprite_klarna.png'); background-position: 76px 0 ; display: inline-block;} /* .footer-container {margin: 10px 0 0 0; text-align: center; border-top: 2px #eff3eb dotted; padding: 10px; font-size: 11px;color: #CCC;} .footer-container a {color: #CCC; font-size:11px;} .footer-container a:hover { color: #FFF; text-decoration: underline; } */ /* Toolbar */ .toolbar-container {background: #333;} ul.toolbar {display: block; width: 100%; overflow: hidden; height: 45px; margin: 0; border-bottom: 1px rgba(255,255,255,0.1) solid;} ul.toolbar li {float: left; list-style: none; margin: 0;} ul.toolbar li a {color: white; padding: 30px 25px;} ul.toolbar li a span {display: none;} /* Item on website: Navigation -> Call Icon */ ul.toolbar li a#call {background: url('../gfx/toolbar/call.png') 10px 37px no-repeat;} ul.toolbar li a#call:hover {background: #222 url('../gfx/toolbar/call.png') 10px 37px no-repeat;} /* Item on website: Navigation -> Info Icon */ ul.toolbar li a#info {background: url('../gfx/toolbar/info.png') 8px 36px no-repeat; display: none;} ul.toolbar li a#info:hover {background: #222 url('../gfx/toolbar/info.png') 8px 36px no-repeat;} /* Item on website: Navigation -> Message Icon */ ul.toolbar li a#message {background: url('../gfx/toolbar/message.png') 5px 27px no-repeat;} ul.toolbar li a#message:hover {background: #222 url('../gfx/toolbar/message.png') 5px 27px no-repeat;} /* Item on website: Navigation -> Back arrow */ ul.toolbar li a#backarrow {background: url('../gfx/toolbar/backarrow.png') 10px 37px no-repeat;} ul.toolbar li a#backarrow:hover {background: #222 url('../gfx/toolbar/backarrow.png') 10px 37px no-repeat;} /* Item on website: Navigation -> Search */ ul.toolbar li a#search-toggleMobile {background: url('../gfx/toolbar/sokefelt.png') 10px 37px no-repeat;} ul.toolbar li a#search-toggleMobile:hover {background: #222 url('../gfx/toolbar/sokefelt.png') 10px 37px no-repeat;} /* Item on website: Navigation -> Meny (textblock) */ ul.toolbar li#navigate-float {float: right;} ul.toolbar li a#navigate:hover {background: #222 ;} ul.toolbar li a#navigate span {display: inline-block; padding: 16px 0 0 0;} /* ---- Navigasjon ---- */ ul.navigation {text-align: left; font-family: "Helvetica Neue", "Arial", sans-serif; display: none; margin: 0 0 10px 0; overflow-x: hidden;} ul.navigation li {list-style: none; margin: 0; } ul.navigation li a {display: block; background: white url('../gfx/sprite_nav_arrow.png') 97% -20px no-repeat; color: black; font-weight: normal; text-decoration: none; padding: 10px 0 10px 10px; border-bottom: 1px #eee solid;} ul.navigation ul li a {padding: 10px 0 10px 10px;} ul.navigation ul ul li a {padding: 10px 0 10px 20px;} ul.navigation a.art_current {color: white; background: #282828; } ul.navigation a.art_current#frontpageCurrent { color: white; background: #282828;} ul.navigation a.art_current:hover { color: white; background: #282828;} /* Used a sprite for the arrow */ ul.navigation li a:hover {color: white; background: #282828; } ul.navigation li a:active {color: white; background: #282828;} /* Kategoribobler */ ul.navigation#mobile-hide-subpages ul {display: none;} #subnavigation {overflow: hidden; width:100%;background:transparent } #subnavigation ul {display: block; margin: 8px 0 0 5px;} #subnavigation ul li { float: left; margin: 3px 5px 7px 5px; list-style: none; } #subnavigation ul li a{display:inline-block; padding: 5px 10px; background: #f5f5eb; border-radius: 10px; color: #444; text-decoration: none; font-weight: bold; font-size: 12px;} #subnavigation ul li a:hover { color: white; background: #7d7c7c;} #subnavigation ul li a:focus { color: white; background: #333;} #subnavigation ul li a:active { color: white; background: #333;} ul.navigation-frontpage {text-align: left; font-family: "Helvetica Neue", "Arial", sans-serif; display: block; margin: 0 0 10px 0; overflow-x: hidden;position: relative;} ul.navigation-frontpage li {margin: 0;} ul.navigation-frontpage li a {display: block; background: white url('../gfx/sprite_nav_arrow.png') no-repeat 95% -18px; color: black; font-weight: normal; text-decoration: none; padding: 12px 0 10px 10px; border-bottom: 1px #eee solid; font-size: 16px;} ul.navigation-frontpage ul li a { padding: 8px 0 8px 20px;} ul.navigation-frontpage ul ul li a { padding: 8px 0 8px 40px;} ul.navigation-frontpage a.art_current {background: red url('../gfx/sprite_nav_arrow.png') 95% 5px no-repeat; color: white;} ul.navigation-frontpage li a:hover {color: white; background: #282828;} ul.navigation-frontpage li a:active {color: white; background: #282828;} ul.navigation-frontpage li a:visited { } /* Handlekurv */ .header {position: relative;} /* To position .modal_shopcart! */ .modal_shopcart { background: #FFF; padding-top: 12px; padding-bottom: 10px; padding-left:15px; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #CCC; box-shadow: 5px 5px 5px #999; } .modal_shopcart ul { position: absolute; margin: 0 0 0 60px; top: 0px; color: black; width: 162px; left: -12px; font-family: "Aller Regular", sans-serif; } .modal_shopcart ul li { list-style: none; font-size: 12px; line-height: 14px;} .modal_shopcart ul li h3 { font-size: 16px; margin: 0 0 1px 0; padding: 0; font-family: "Aller Regular", sans-serif;} .modal_shopcart a { color: black;} .modal_shopcart a:hover { color: #000000; text-decoration: underline; font-weight: bold; } .modal_shopcart ul li a span.modal-mobile-counter {display: none;} .modal_shopcart_counter {display: none; position: absolute; margin: 13px 0 13px 8px; width:50px; height:51px; padding: 22px 0 0; background: url('../gfx/basket.png') 0 0 no-repeat; text-align: center; left: -10px; top: -15px;} .modal_shopcart_counter h4 {position: relative; width: auto; display: inline; color: white; margin: 0; padding: 0; font-family: "Aller Regular", sans-serif;} /* Notification - shoppingcart */ span.mpCart_quantity {background: #e4421c; display: inline-block; text-align: center; padding: 9px 5px; line-height: 0; border-radius: 6px; font-size: 11px; color: white; font-family: "Arial", sans-serif; position: relative; bottom: 2px;} span.mpCart_quantity_empty {background: #444 !important; color: #ccc !important;} .modal_shopcart ul li h3 {position: relative; display: inline-block;} .modal_shopcart ul li span {position: relative; display: inline-block; bottom: auto !important ;} .floatLeft#quantity_position {position: relative; top: 3px; left: -5px;} /* Søkefelt */ a.close-searchbox {display: block; text-decoration: none; text-align: center; margin: 10px 0 0 0; font-weight: bold;} .search-box#mobile-search {width: 100%; height: auto; padding: 10px 10px 10px 0px; background: white; border-bottom: 5px #333333 solid; display: none; } .search-box#mobile-search input[type="search"] {padding: 9px 9px; background: white; border: 1px #ccc solid; width: 65%;} .search-box#mobile-search input[type="submit"] {padding: 9px 9px; background: white; border: 1px #ccc solid; width: 15%;} .search-box#mobile-search input[type="search"]:hover, .search-box#mobile-search input[type="search"]:focus {outline: none;} .search-box#mobile-search input[type="search"]:hover {background: #f5f5f5; color: #5c5c5c;} .search-box#mobile-search input[type="submit"]:hover {background: #f5f5f5; color: #5c5c5c;} .search-box#mobile-search input {border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -o-border-radius: 3px; -ms-border-radius: 3px;} @media screen and (max-width: 969px) { .snarveier { margin-left:18px; } /* Snarveier forside */ .snarvei_forside1 { float:left; margin: 0px 10px 0px 20px; } a .snarvei_forside1 { opacity: 0.9; width:50%; height:auto; } a:hover .snarvei_forside1 { opacity: 1.0; } .snarvei_forside2 { float:left; } a .snarvei_forside2 { opacity: 0.9; width:50%; height:auto;} a:hover .snarvei_forside2 { opacity: 1.0; } } @media screen and (max-width: 600px) { /* Snarveier forside */ .snarvei_forside1 { } a .snarvei_forside1 { opacity: 0.9; width:50%; height:auto; } a:hover .snarvei_forside1 { opacity: 1.0; } .snarvei_forside2 { float:left; } a .snarvei_forside2 { opacity: 0.9; width:50%; height:auto; } a:hover .snarvei_forside2 { opacity: 1.0; } } @media screen and (max-width: 300px) { /* Snarveier forside */ .snarvei_forside1 { } a .snarvei_forside1 { opacity: 0.9; width:100%; float:none; } a:hover .snarvei_forside1 { opacity: 1.0; } .snarvei_forside2 { float:none; } a .snarvei_forside2 { opacity: 0.9; width:100%; float:none; } a:hover .snarvei_forside2 { opacity: 1.0; } }