/*div.logo_image {
    background-image: url('../image/logo.png'); 
    width: 366px; 
    height: 60px;
}*/
div.logo_image {
	padding-top: 10px;
}
div.logo_image:before {
	content: url('../image/retailer/conmodo.jpg');
	
}
a {
	color: #333333;
}
div.category_select a {
	color: black;
}
div.category_select a span {
	background-image:url(../image/right_arrow_no_border.gif);
	padding-left: 15px;
  	background-position: left;
  	background-repeat: no-repeat;
  	/*background-size: 16px 16px;*/
}
div.category_select a span.selected {
	background-image:url(../image/checked_no_border.gif);
	padding-left: 15px;
  	background-position: left;
  	background-repeat: no-repeat;
  	font-weight: bold;
  	
  	/*background-size: 16px 16px;*/
}
.help a span{
	display: inline-block;
    background-color:#EEEEEE;
    color: black;
    padding: 2px;
    margin-top: 2px;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 2px;
    border-left-width: 4px;
    border-left-color: var(--primary);
    border-left-style: solid;
	width: 100%;
}
.help p {
	padding-left: 5px;
    padding-right: 2px;	
}
div.result_table span {
	color: #888888;
	font-size: 80%;
}
.wizard h4 span.wizard_header {
	background-color: transparent;
	color: var(--primary);
}
input.error {
	border-color: red;
}

.test:hover {
	background-color: grey;
}

.datatable_sums td {
	font-weight: bold;
}

.paypageTable {
	
}

.paypageTable th {
	font-weight: bold;
}

.paypageTable .price {
	text-align: right;
}

.paypageTable .mvaTable {
	position: relative;
	right:0px;
	top:0px;
}

/* ============================== */
/* ! "buttons" with text and icon   */
/* ============================== */
.iconTextButton, .iconTextButton:link, .iconTextButton:visited, .iconTextButton:hover, .iconTextButton:active {
	color: black;
	cursor: default;
	margin: 1px;
	border: 0;
	padding-left: 1px;
	padding-right: 2px;
	text-decoration: none;
	/* to avoid text-selection on mouse-click-and-drag:*/
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background-color: transparent;
}

a.iconTextButton:active {
	border-width: 1px;
	border-style: solid;
	border-right-color: #C4C8C0;
	border-bottom-color: #C4C8C0;
	border-left-color: #505050;
	border-top-color: #505050;
	margin: 0;
}

.iconTextButton:hover {
	border-width: 1px;
	border-style: solid;
	border-right-color: #505050;
	border-bottom-color: #505050;
	border-left-color: #C4C8C0;
	border-top-color: #C4C8C0;
	margin: 0;
}

.iconTextButton .imageSpan {
	width: 16px;
	height: 16px;
	border: none;
	vertical-align: -2px;
	display: inline-block;
	background-color: transparent;
	background-repeat: no-repeat;
}

/* ============================== */
/* ! Elements showing up on mouseover of parent   */
/* ============================== */
.labelInTitleShowOnMouseover {
	font-size: 11px;
	font-weight: normal;
	float: right;
	padding-left: 20px;
	padding: 5px;
	visibility: hidden;
}
h4:hover .labelInTitleShowOnMouseover {
	visibility: visible;
}
.labelInTitleShowOnMouseover div {
	display: inline;
	vertical-align: top;
}

.parentForShowOnParentHover {
	
}
.showOnParentHover {
	visibility: hidden;
}
.parentForShowOnParentHover:hover .showOnParentHover {
	visibility: visible;
}

/* ============================== */
/* ! EditableLabels   */
/* ============================== */
.editableLabel {
	cursor: pointer;
}

.editableLabel:hover {
	text-decoration: underline;
	font-weight: bold;
}

input.editableLabelEditor {
	height: 18px;
	width: 120px;
}
.editableMultiLineLabel {
	cursor: pointer;
}


/* ============================== */
/* ! Ajax veil   */
/* ============================== */
.veil {
	background:url(../image/transparent.gif) repeat scroll 0 0 transparent;
}
/* ============================== */
/* ! Layout for desktop version   */
/* ============================== */

	body {
	}
	/*img {
		max-width: 100%;
	}*/
/* ============================== */
/* Assorted                       */
/* ============================== */
label:hover {
	cursor: pointer;
}

.vexStepNavigation {
	text-align: right; 
	padding-top: 5px; 
	padding-bottom: 10px;
}


/* ============================== */
/* Feedback                       */
/* ============================== */
.vexStepNavigation ul.feedbackPanel {
	list-style: none;
}
li.feedbackPanelERROR {
	color: red;	
}
span.feedbackPanelERROR {
	color:black;
	border-bottom: 2px solid red;
}
li.feedbackPanelWARNING {
	color: orange;	
}
span.feedbackPanelWARNING {
	color:black;
	border-bottom: 2px solid orange;
}
li.feedbackPanelINFO {
	color: blue;	
}
span.feedbackPanelINFO {
	color:black;
	border-bottom: 2px solid blue;
}
.feedbackNoBullets ul {
	list-style: none;
}

/* ============================== */
/* Footer                           */
/* ============================== */
.footer {
	background-color: var(--primary);
}

div.footer a {
	color: var(--primary-inverse);
	display: inline-block;
	margin-right: 1px;
	padding-right: 7px;
	padding-left: 3px;
	padding-top: 3px;
	height: 24px;
	text-decoration: none;
	border-right: 1px;
	border-left: 1px;
	border-style: solid;
	border-color: var(--primary);
}
div.footer div span {
	display: inline-block;
	height: 27px;
}
div.footer a:hover {
	background-color: #375b66;
	border-right: 1px;
	border-left: 1px;
	border-style:dotted;
	border-color: var(--primary-inverse);
}
.left {
	float: left;
}
.right {
	float: right;
}

.payment-logos {
    float: right;
    margin-top: 2px;
}
div.footer input[type="text"] {
	margin-top: 2px;
}
div.footer input[type="submit"] {
	margin-top: 2px;
}
div.footer img {
	width: 20px;
	height: 20px;
	/*vertical-align:text-bottom;
	margin-right: 0px;
	padding-left: 2px;*/
	margin-top: -2px;
}
div.footer .coolMenu img {
	margin-top: -5px;
}

/* ============================== */
/* Menu                           */
/* ============================== */
.menu {
	background-color: var(--menu-background-color);
	color: var(--menu-color);    	
}
.menu * {
	color: var(--menu-color);
}

/*div.menu a {
	color: var(--primary-inverse);
	display: inline-block;
	margin-right: 1px;
	padding-right: 7px;
	padding-left: 3px;
	padding-top: 3px;
	height: 24px;
	text-decoration: none;
	border-right: 1px;
	border-left: 1px;
	border-style: solid;
	border-color: var(--primary);
}
div.menu div span {
	display: inline-block;
	height: 27px;
}
div.menu a:hover {
	background-color:var(--primary);
	border-right: 1px;
	border-left: 1px;
	border-style:dotted;
	border-color: var(--primary-inverse);
}
.left {
	float: left;
}
.right {
	float: right;
}
div.menu input[type="text"] {
	margin-top: 2px;
}
div.menu input[type="submit"], div.menu input[type="button"] {
	margin-top: 2px;
}
div.menu img {
	width: 20px;
	height: 20px;
	margin-top: -2px;
}
div.menu .coolMenu img {
	margin-top: -5px;
}*/

/* ============================== */
/* Drop-down menu                 */
/* ============================== */


/*.menu li {
	margin-left: 0px;
}
.coolMenu,
.coolMenu ul {
    list-style: none;
    color: var(--primary-inverse);
}
.coolMenu li a {
	display: block;
    text-decoration: none;
}

.coolMenu div {
    position: absolute;
    display: none;
	z-index: 999;
}
.coolMenu li:hover div {
    display: block;
}

.coolMenu:hover {
    background-color: var(--primary);
}
.coolMenu > li > a {
    color: #fff;
    font-weight: bold;
}*/
 
/* Submenu
------------------------------------------*/
/*.coolMenu div {
    background: var(--primary);
}
.coolMenu ul li a {
    color: #FFFFFF;
    margin: 0;
    border: 0;
}
.coolMenu ul li:hover a {
    background: var(--primary);
}
.retailers_company {
	font-weight: bold;
	padding-left: 21px;	
}
.coolMenu ul {
	margin-bottom: 0px;
}
ul.coolMenu div a, ul.coolMenu div a:hover {
	border-right: 1px;
	border-left: 1px;
	border-style: solid;
	border-color: var(--primary); 	
}
ul.coolMenu div img {
	width: 16px;
	height: 16px;
	padding-left: 0px;
	padding-right: 2px;
}*/

.coolMenu div {
	background-color: var(--menu-background-color);
}
 
/* ============================== */
/* Wizard                         */
/* ============================== */

.wizard h4 {
	background-color:var(--heading-background-color);
	color: var(--heading-color);
}
h4.empty{
	color: #888888;
}
.wizard h4 a {
	color: #000000;
    
    padding: 3px;
}
.wizard h4 span {
	color: var(--primary-inverse);
    background-color: var(--heading-icon-background-color);
    padding: 3px;
}
.wizard h5 {
  color: var(--primary);
  margin-bottom: 2px;
  margin-top: 10px;
}
.wizard td, th{
        padding: 2px;
}
/*.wizard a {
	text-decoration: none;
}*/
.wizard a:hover {
	color: var(--primary-hover);
	text-decoration: underline;
}

h4.directLink {
	margin-bottom: 6px;
    border-left: 4px solid #d6dbf3;
}

h4.directLink div.info {
	padding-left: 15px;
    font-size: smaller;
    background-color: transparent;
    color: initial;
}

h4.directLink div.info div {
    font-size: smaller;
    background-color: transparent;
    color: initial;
}

.ordregang div.serviceplace {
	padding-left: 30px;
}
.ordregang div.dealer {
	padding-right: 30px;
}

.ordregang div div {
	border-radius: 5px;
	padding: 3px;
	margin-bottom: 7px;
	margin-top: 7px;
	/*background-color: #EEEEEE;*/
	background-color: var(--message-background-color-service);
}
.ordregang div.dealer div{
	background-color: var(--message-background-color-dealer);
}
.ordregang div.newMessage, .ordregang div.newMessage div {
	background-color: var(--message-background-color-newMessage);
}
@media only screen and (prefers-color-scheme:light) {
	.ordregang div.newMessage textarea:not([data-theme]) {
		background-color: white;
	}
}

/* ============================== */
/* DataTable navigation           */
/* ============================== */
div.navigatorLabel,span.goto {
	display:none;
}

tfoot tr {
	border-width: 1px 0px 0px 0px;
	border-color: #CCCCCC;
	border-style: solid;
}
tfoot .navigation a, tfoot .navigation span {
	display: inline-block;
	height: 20px;                        
	width:  36px;
  	background-position: center;
  	background-repeat: no-repeat;
  	background-size: 16px 16px;
  	/* Hide the text. */
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
tfoot span.goto {
	height: 0px;
	width:  0px;
	/* Hide the text. */
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
tfoot span.first {
	background-image:url(../image/first_grey.png);
}
tfoot a.first {
	background-image:url(../image/first.png);
}
tfoot span.prev {
	background-image:url(../image/previous_grey.png);
}
tfoot a.prev {
	background-image:url(../image/previous.png);
}
tfoot span.next {
	background-image:url(../image/next_grey.png);
}
tfoot a.next {
	background-image:url(../image/next.png);
}
tfoot span.last {
	background-image:url(../image/last_grey.png);
}
tfoot a.last {
	background-image:url(../image/last.png);
}
@media (min-width: 1001px) {
	tfoot div.navigator div {
		text-align: center;
	}
}



/* ============================== */
/* Tables                         */
/* ============================== */
tr.selected_row {
	background-color: #DDD;
}
table.ordersearch_wide tr input {
	width: 100%;
}
table.ordersearchtable th {
	font-size: 15px;
}
.select2-container {
	width: 100%;
}
/*table.datatable th.5percent {
	width: 5%;
}
table.datatable th.10percent {
	width: 10%;
}*/
table.datatable {
	margin-top: 10px;
}
table.datatable thead {
	border-bottom: 2px solid black;
}

table.datatable thead th{
	background-color: var(--primary-inverse);
}
table.datatable th span{
	width: 100%;
	margin-right: 2px;
	/*color: black;*/
	font-weight: bold;
}
table.datatable th a span{
	display:inline-block;
	background-image:url(../image/up_down_arrow_black.png);
	background-size:16px 16px;
	background-repeat:no-repeat;
	padding-left: 11px;
	background-position: -4px 0px;
}
table.datatable tbody th a {
	background-color: var(--primary-inverse);
	display:inline-block;
	width: 100%;
}
table.datatable th:hover {
    background-color: var(--secondary-hover);
	color:var(--primary-inverse);
}
table.datatable th:hover a span {
	color:var(--primary-inverse);
	background-image:url(../image/up_down_arrow_white.png);
}
		
table.datatable th.wicket_orderUp a span {
		background-image:url(../image/up_arrow_black.png);
      }
table.datatable th.wicket_orderUp:hover a span {
		background-image:url(../image/up_arrow_white.png);
      }
table.datatable th.wicket_orderDown a span {
		background-image:url(../image/down_arrow_black.png);
		
      }
table.datatable th.wicket_orderDown:hover a span {
		background-image:url(../image/down_arrow_white.png);
		
      }
table.datatable {
	width: 100%;
}
table.datatable tbody tr {
	border-color: #DDDDDD;
	border-width: 1px 0px 1px 0px;
	border-style: solid;
}
table.datatable tbody tr:last-child {
	border-width: 0px 0px 0px 0px;
}
table.datatable tbody tr:hover {
	background-color: var(--table-hover);
	cursor: pointer;
}
hr:last-child {
	display:none;
}
.navigator a {
	filter: invert(var(--invert-color-filter));
}


div.filters div {
	padding: 2px;
	margin: 2px;
	background-color: #EEEEEE;
	color: black;
	border-radius: 4px;
	font-weight: bold;
	float: left;
	cursor: pointer;
	border: 1px solid transparent;
}
div.filters div:hover {
	border: 1px outset #666666
}

div.filters div.selected {
	background-color: var(--primary);
	color: var(--primary-inverse);
}

.advancedSearch {
	display: none;
}

.advancedSearch>div:not(.switchToSimpleSearch, .switchToAdvancedSearch) {
	display: block;
}
	
.advancedSearch.show {
	display: block;
}

.simpleSearch {
	display: block;
}

.switchToSimpleSearch, .switchToAdvancedSearch {
	display: inline-block;
}
.simpleSearch.hide, .switchToSimpleSearch.hide {
	display: none;
}

.pay_logo.klarna {
	margin-left: 10px;
	height: 48px;
}

.pay_logo.vipps {
	margin-left: 10px;
	height: 48px;
}

@media (max-width: 600px) {
	.pay_logo {
		width: 48px;
	}
}

@media (min-width: 1001px) {
	.advancedSearch {
		display: block;
	}
	.advancedSearch>div:not(.switchToSimpleSearch, .switchToAdvancedSearch) {
		display: flex;
	}
	
	.simpleSearch, .switchToAdvancedSearch, .switchToSimpleSearch {
		display: none;
	}
}

@media (min-width: 1001px) {
	.packagesSearch {
		display: flex;
	}
	.packagesSearch article {
		height: 100%;
	}
}

/*To get word wrapping of long lines in pre-tags*/
pre {
 white-space: pre-wrap;       /* css-3 */
 white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
 white-space: -pre-wrap;      /* Opera 4-6 */
 white-space: -o-pre-wrap;    /* Opera 7 */
 word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

/*wicket debugbar:*/
#wicketDebugBar {
	top: 27px;
}

a.buyback {
	text-decoration: underline;
}

/* Select2 dropdown, remove some wasted space */
.select2-results li {
	margin-left: 2px;
}

/*Select2 dropdown disabled color*/
.select2-container-disabled .select2-default {
	color: #999 !important;
}
/*Select2 dropdown not-disabled color*/
.select2-default {
	color: #333 !important;
}
.select2-drop {
	color: var(--primary);
	background-color: var(--primary-inverse);
}

/* ============================= */
/* ! General                     */
/* ============================= */
input[type="radio"] {
	vertical-align: middle; 
	margin: 0px; 
	margin-left: 5px; 
	margin-right: 3px;
}
input[type="radio"]:hover {
	cursor: pointer;
}


/* ============================= */
/* ! Layout for mobile version   */
/* ============================= */

@media handheld, only screen and (max-width: 767px) {

	body {
		margin-bottom: 30px;
	}

}


/* ========================================== */
/* ! Provide higher res assets for iPhone 4   */
/* ========================================== */

@media only screen and (-webkit-min-device-pixel-ratio: 2) { 

	/*.header .logo {
		background: url(../img/logo@2x.jpg) no-repeat;
		background-size: 212px 303px;
	}*/

}

