@font-face {
  font-family: 'DINPro-Regular';
  font-style: normal;
  font-weight: 100;
  src:url(../fonts/DINPro-Regular.ttf);
}
@font-face {
  font-family: 'DINPro-Regular';
  font-style: normal;
  font-weight: 100;
  src:url(../fonts/DINPro-Regular.otf);
}

@font-face {
  font-family: 'DINPro-Regular';
  font-style: normal;
  font-weight: 100;
  src:url(../fonts/DINPro-Regular.eot);
}

@font-face {
  font-family: 'DINPro-Bold';
  font-style: normal;
  font-weight: 100;
  src:url(../fonts/DINPro-Bold.ttf);

}

form {
    position:relative;
    height:100%;
    height: auto;
}
html{float:left;width:100%;height:100%}
body {height:100%; background:#f2f5f8; background-size:100% !important; font-size: 1em; margin: 0; padding: 0px;font-family:DINPro-Regular !important;float:left;width:100%;background-repeat:no-repeat !important;}


/* centrerar hela paketet */
#centrering { width: 100%; margin-right: auto; margin-left: auto; margin-top: 2px; }


/* logotypes */

#logobox_is {

    top: 0px;
    z-index: 10;
    background-color: rgba(255,255,255,0.6);
    float: right;
    margin: 50px 0px 50px 40px;
    position: relative;
    right: 0px;
    max-width: 25%;

}
#logobox_is img {
    padding: 20px;
    max-width: 194px;
}

#varukorg_p {    

    z-index: 10;
    margin-right: auto;
    margin-left: 0px;
    float: right;
    text-transform: uppercase;

}
#logobox_is_1 { border: 0px solid #000000; float:left; top: 0px; z-index: 1; width: auto; height: 150px; background-color: #FFFFFF; margin-right: auto; margin-left: 0px;}


/* översta boxen */
#topbox { width: 960px; height: 166px; background-color: #FFFFFF; margin-right: auto; margin-left: auto; border: 1px solid #6699FF; z-index: 11;}
#topbox div { border-color: #000000; }


/* håller i varukorgen */
#vkcontainer { border: 0px solid #000000; margin-bottom: 0px; width: 960px; height:150px; min-height:150px; float: right; background-color: transparent; }

/* varukorg uppe */

#varukorg_p div {width: auto; padding: 0px; border:0px solid #000000;}


/* vågrät meny */
#topmeny { border: 0px solid #6699FF; width: 960px; height: 0px; background-color: #FFFFFF; margin-top: 5px; margin-right: auto; margin-left: auto; text-align: center; color: #FFFFFF; font: 65% Verdana, Helvetica, sans-serif; font-weight: bold; word-spacing: 7em;}
#topmeny div {padding: 0px; border: 0px solid; border-color: #FFFFFF;}

#topmeny a:link{color: #ffffff; text-decoration: none;}
#topmeny a:visited{color: #ffffff; text-decoration: none;}
#topmeny a:hover{color: #FFCC66; text-decoration: none;}
#topmeny a#current{background: #FFCC66; color: #000000; text-decoration: none;}



/* lodrät meny */

#meny{
	width: 100%;
	margin: 0;
	padding: 0;
	list-style-type: none;
	font: 85% Verdana, Helvetica, sans-serif;
	letter-spacing: 0.1em;}

#meny li{margin-bottom: 0.25em;}

#meny a{
	display: block;
	width: auto;
	height:100%;
	background: #339966;
	padding: 0.25em;
	text-decoration: none;
	border: 1px solid #FFFFFF;
}
#meny a:link{color: #ffffff;}
#meny a:visited{color: #ffffff;}
#meny a:hover{background: #33CC66;}
#meny a#current{background: #339966; color: #000000;}







#meny_s{
	width: 100%;
	margin: 0;
	padding: 0;
	list-style-type: none;
	font: 80% Verdana, Helvetica, sans-serif;
	letter-spacing: 0.1em;}

#meny_s li{margin-bottom: 0.25em;}

#meny_s a{
	display: block;
	width: auto;
	height:100%;
	background: #ee0000;
	padding: 0.25em;
	text-decoration: none;
	font-weight: bold;
	border: 1px solid #FFFFFF;
}
#meny_s a:link{color: #CCFFFF;}
#meny_s a:visited{color: #CCFFFF;}
#meny_s a:hover{background: #ff0000;}
#meny_s a#current{background: #ff0000; color: #000000;}










/* sökbox */
#sokbox {width: auto; padding: 0.25em; border: 1px solid; border-color: #FF0000; margin-bottom: 0.25em;}

/* nyhetsbox */
#nyhetsbox  {width: auto; padding: 0.25em; background: #C0C0C0; border: 0px solid; border-color: #00FF00; margin-bottom: 0.25em;
	     font: 80% Verdana, Helvetica, sans-serif; color: #FFFFFF;}


/* håller i kolumnerna */
#container { margin:0px auto; width: 1200px; height: auto; position: relative; background: transparent; border: 0px; z-index: 11; margin-top: 0px;clear:both;}

/* vänstra kolumnen innehåller menyn */
#kolumn1 {float: left; width: 100%; padding: 4px; border: 0px solid; border-color: #FFFFFF; z-index: 1;}



/* mitten kolumnen */
#kolumn2 {  width:100%;float:left; height: auto; padding: 8px; z-index: 22; position: relative;    padding: 20px;
    background: #fff; } 

/* mitten kolumnen */
#kolumn2kontakt {
    width: 100%;
    height: auto;
    z-index: 22;
    position: relative;
    float: left;
    padding:20px;
}

#kolumn2kontakt iframe {
    width:100%;
}
/* mitten kolumnen */
#kolumn2index {float: left; width: 514px; height: auto; background: #FFFFFF; padding: 8px; border-right: 0px solid #000000; border-left: 0px solid #000000; z-index: 1;} 

/* mitten kolumnen */
#kolumn2foretaget {float: left; width: 514px; height: auto; background: #FFFFFF; padding: 8px; border-right: 0px solid #000000; border-left: 0px solid #000000; z-index: 1;} 

/* mitten kolumnen dold bara för att hålla höjden... */


#mitten_h { overflow:hidden;float: left; width: 100%; height: auto;  background: #FFFFFF;  margin: 10px 0px;  z-index: 100; padding:0px 0px 0px 0px;} 


/* håller i kolumnerna INFOSIDA , 498px bredd från start */
#infocontainer {float: left; width: 80%; height: auto;padding:40px 0px 40px 100px; }

/* mitten kolumnen INFOSIDA w 320px,pad 4px */
#infobild {float: left; width: 20%; height: auto;margin-top:50px; } 
#infobild img {width:100%;}


/* håller i dom två/tre högra kolumnerna INFOSIDA 175px*/
#infocontainer2 {float: left; width: 60%; height: auto; }

/* mitten kolumnen INFOSIDA */
#infotext1 {float: left; width: 100%; height: auto;margin: 40px 10px;} 

/* mitten kolumnen INFOSIDA */
#infotext2 {float: left; width: 92px; height: auto; padding: 2px; text-align: right; border: 0px solid #000000;} 

/* mitten kolumnen INFOSIDA */
#infotext3 {float: right; width: 161px; height: auto; padding: 2px; text-align: left; border: 0px solid #000000;} 


form {

    width: 100%;
    float: left;
    box-sizing: border-box;
    overflow-wrap: normal;
    overflow-x: hidden;

}


/* mitten kolumnen INFOSIDA */
#infoprodukttext {float: left; width:60%; height: auto; padding: 8px;font-size:130%;color:#444444;overflow-wrap: break-word;} 





/* håller i kolumnerna länksida */
#lankcontainer {float: left; width: 448px; height: auto; border: 0px solid #000000; margin-left: 30px; }

	
/* mitten kolumnen LANKSIDA */
#lankleft {float: left; width: 180px; height: auto; padding: 2px;} 

/* mitten kolumnen LANKSIDA */
#lankright {float: left; width: 180px; height: auto; padding: 2px; text-align: left;} 
	







/* högra kolumnen */
#kolumn3 {float: left; width: 100%;  position: relative; z-index: 222;background:#f2f5f8;}
#kolumn3 tr {display:inline;float:left;}
/* SidBox */
.SidBox {
    width: 100%;
    float: left;
    background: #f2f5f8;
    padding:15px;
}

.SidBox .top-menu {

    float: right;

}

.SidBox .top-menu .bread_dark {

    width: auto;
    float: left;
    color: #034ea2;
    font-size: 15px;
    margin:0px 20px;
}

/* SidRubBox */
.SidRubBox {width: 164px; padding: 2px; border: 1px solid; border-color: #000000; background: #FE0002; margin-bottom: 0.25em;
	font: bold 90% Verdana, Helvetica, sans-serif; color: #FFFFFF;}


/* limpan */


#limpa {
    width: 100%;
    float: left;
    background: #f2f5f8;
    margin-right: auto;
    margin-left: auto;
    letter-spacing: 0.1em;
    color: #FFFFFF;
    z-index: 1;
    margin-top:10%;
    background-repeat: no-repeat;
    background-position:left bottom;
    border-top:1px solid #eee;
     padding-top: 180px;
    position:relative;
    bottom:0px;
    border-top:1px solid #d9dcdf;

}

#limpa img {
    max-width:100%;
    position:absolute;
    bottom:0px;
}
#limpa div {

    border: 0px solid;
    border-color: #FFFFFF;
    z-index: 1;
    text-align: left;

}

#limpa p {

    color:#fff;
    position:relative;
}



#limpa a:link{color: #ffffff; text-decoration: none;}
#limpa a:visited{color: #ffffff; text-decoration: none;}
#limpa a:hover{color: #FFCC66; text-decoration: none;}
#limpa a#current{background: #FFCC66; color: #000000; text-decoration: none;}





/* Allmänn text stil */

H1 { color: #034ea2;text-transform:uppercase;border-bottom:5px solid #034ea2;padding-bottom:10px;}
P{ color: #444444;}




 a:link{color: #444444;text-decoration:none;}
 a:visited{color: #444444;text-decoration:none;}
 a:hover{color: #000000;}





/*gammalt */


.bread_dark  { color: #444444; font-weight: normal;width:100% }

.bread_dark_start  { color: #444444; font-size: 13px;  font-style: inherit; font-weight: normal }


.header_dark {
    font-size: 140%;
    padding: 20px 20px;
    background: #f2f5f8;
    color: #034ea2;
    width: 100%;
}


.formrutor {
	height: 20px;
	width: auto;
	border: 1px solid #CCCCCC;
	font-size: 10px;
	line-height: normal;
	color: #444444;
}
.formrutor_nr {
	height: 16px;
	width: auto;
	border: 1px solid #CCCCCC;
	font-size: 10px;
	line-height: normal;
	color: #444444;
}


.formrutor_dd {
	height: 20px;
	width: auto;
	border: 1px solid #CCCCCC;
	font-size: 17px;
	line-height: normal;
	color: #444444;
}




.formrutor_korg     { color: #000066; font-size: 10px;  line-height: normal; width: auto; height: 15px; border: solid 1px #cccccc }


.formrutor_korg_kn     { color: #000066; font-size: 10px;  line-height: normal; width: auto; height: 18px; border: solid 1px #cccccc }


.formtext {
	font-size: 10px;
	line-height: normal;
	color: #444444;
}


.formtext_meny {
	font-size: 12px;
	line-height: normal;
	color: #444444;
}


.formtext_dark {
	font-size: 10px;
	line-height: normal;
	color: #444444;
}



.formtext_korg {
	font-size: 8px;
	line-height: normal;
	color: #444444;
}




/* New CSS LOGIN */

.login-form {

    width: 40%;
    display: block;
    margin: 0px auto;
    margin-top: 15%;
    background: #fff;

}

.login-form img {

	width:100%;
	
}



/* CONTAINER */

.container { 

    max-width:1200px;
    margin:0px auto;
    clear:both;
}

/* RANDOM  */

#output_history_Lbl table tr td:first-child {
    display:none;
}

#output_history_Lbl {

    float:left;
}
    #output_history_Lbl b {
        font-size: 200%;
        padding: 0px;
        display: block;
        color:#034ea2;
    }
#info_Lbl {

    font-size: 150%;
    padding: 20px 0px 0px;
    display: block;

}


/* WELCOME TEXT BPX  */


.welcome {
    float:left;
    max-width: 70%;
    padding:50px 0px;

}

.inner-welcome {

    background:rgba(255,255,255,0.8);
    padding:40px 20px;
}


/* ¨SORTING */

.sorting {

    float: left;
    width: 100%;
    padding: 0px 0px 10px;
    margin: 10px 0px 40px;
    text-align: center;
    box-sizing: border-box;
    border-bottom: 2px solid #eee;

}

.sorting li {

    display:inline-block;
    margin:0px;
    color:#6f6f6f;
    background:#fff;
    text-transform:uppercase;
    width:16.3%;
    border:1px solid #eee;
    font-size:13px;
    position:relative;
    margin:10px 0px;
}

.sorting li a {padding:10px 0px;display:block;}

.active {

    background:#034ea2 !important;
    color:#fff !important;
    
}

.active a {color:#fff;}
.active:before, active:after {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 9px 0 9px;
    border-color: #034ea2 transparent transparent transparent;
    -webkit-transform: rotate(360deg);
    top: 36px;
    content: '';
    position: absolute;
    left: -1px;
    right: 0;
    margin: 0 auto;
    width: 0;
    height: 0;
}


/* PRODUCT PAGE */

.product-container {

    float: left;
    width: 100%;
    position: relative;
    background: #fff;
    margin: 40px 0px !important;

}

.product-inner {

    padding: 0px 100px !important;
    float: left;

}

.price {

    float: right;
    width: 35%;
    text-align: center;
    color: #034ea2;
    text-transform: uppercase;

}

.price #logobox_is_1 {

    float:left;
    width:100%;
    height:auto;

}
.price p {text-decoration:line-through;margin-bottom:0px;}
.price #pris_Lbl {
    font-weight: 800;
    font-size: 300%;
}

#infotext1 span {

    clear:both;
    display:block;
    margin-bottom:5px;
}

#infotext1 tr {

    float:left;
    width:50%;
}

#infotext1 td, .addprod td {width:100%;float:left;}
#infotext1 input, .addprod input {padding:0px 5px;width:auto;height:40px;text-align:center;}
#infotext1 select {
    width: 100%;
    height: 40px;
    -webkit-appearance: none;
    position: absolute;
    background: transparent;
    padding: 0px 10px;
    text-transform: uppercase;
    font-weight: 400;
}

.dropdown-size {width:100%;float:left;position:relative;}
.dropdown-size:before {
    content: "\f107";
    font-family: FontAwesome;
    position: absolute;
    right: 0;
    top: 0;
    background: #034ea2;
    height: 100%;
    width: 45px;
    text-align: center;
    color: #fff;
    vertical-align: middle;
    height: 40px;
    line-height: 38px;
}

.dropdown-sizet {width:100%;float:left;position:relative;}
.dropdown-sizet:before {
    content: "\f107";
    font-family: FontAwesome;
    position: absolute;
    right: 0;
    top: 0;
    background: #034ea2;
    height: 100%;
    width: 45px;
    text-align: center;
    color: #fff;
    vertical-align: middle;
    height: 40px;
    line-height: 38px;
}

#infotext1 #skicka_Btn, .addprod #skicka_Btn {

    border: 0;
    padding: 14px 30px;
    color: #fff;
    font-weight: normal;
    font-size: 13px;
    display: inline;
    display: inline-block;
    text-align: center;
    margin: 0;
    cursor: pointer;
    outline: 0;
    transition: box-shadow 200ms;
    background: #034ea2;
    text-transform: uppercase;
    height: auto;
    margin-top:20px;
    clear:both;
    float:left;

}

.addprod {
    width:60%;
    padding:0px 10px;
}
.addprod input {

    width: auto;
    text-align: center;
    padding: 0px 5px;
    float:left;
    height:40px;
    margin:0px;
}
#storlek_Pnl {
    float: left;
    margin-left: 20px;
    margin-bottom:25px;
    width:43%;
}
.antal-input {
    float:left;
}

#storlek_Pnl span, .addprod span {
    display: block;
    clear: both;
    margin-bottom: 5px;
}

#storlek_Pnl select {
    width: 100%;
    height: 40px;
    -webkit-appearance: none;
    position: absolute;
    background: transparent;
    padding: 0px 10px;
    text-transform: uppercase;
    font-weight: 400;
    font-size:90%;
}

#storlek_Pnl {
    float: left;
    margin-bottom: 25px;
    width: 50%;
    /*margin: 0px;*/
}
#storlek_Pnl select {
    width: 100%;
    height: 40px;
    -webkit-appearance: none;
    -moz-appearance: none;
    position: relative;
    background: transparent;
    padding: 0px 10px;
    text-transform: uppercase;
    font-weight: 400;
    float: left;
    font-size: 90%;
}

/*ie10 hide select arrow*/
#storlek_Pnl select::-ms-expand {
    display: none;
}






#tillagg_0_Pnl {
    float: left;
    margin-left: 20px;
    margin-bottom:25px;
    width:100%; //43%
}
.antal-input {
    float:left;
}

#tillagg_0_Pnl span, .addprod span {
    display: block;
    clear: both;
    margin-bottom: 5px;
}

#tillagg_0_Pnl select {
    width: 100%;
    height: 40px;
    -webkit-appearance: none;
    position: absolute;
    background: transparent;
    padding: 0px 10px;
    text-transform: uppercase;
    font-weight: 400;
    font-size:90%;
}

#tillagg_0_Pnl {
    float: left;
    margin-bottom: 25px;
    width: 50%;
    /*margin: 0px;*/
}
#tillagg_0_Pnl select {
    width: 100%;
    height: 40px;
    -webkit-appearance: none;
    -moz-appearance: none;
    position: relative;
    background: transparent;
    padding: 0px 10px;
    text-transform: uppercase;
    font-weight: 400;
    float: left;
    font-size: 90%;
}

/*ie10 hide select arrow*/
#tillagg_0_Pnl select::-ms-expand {
    display: none;
}







/*ie9 hide select arrow*/
/*ie9-only media query*/
/*@media screen and (min-width:0) and (min-resolution: .001dpcm) { 
    #storlek_Pnl .dropdown-size {
        position:relative;
        display:inline-block;
        z-index:0
    }
    #storlek_Pnl select {
        z-index:1;
    }
    .dropdown-size:before {
        z-index: 5;
    }
}*/




/* TOP-MENU */

.top-header {

    font-size:80%;
    float:left;
    width:100%;
    height:40px;
    background:#f2f5f8;
}

.top-header .container,.right,.dropdown {

    height:100%;

}

.right {

    float:right;
    padding:0px;
    margin:0px;
    position:relative;
}

.right li {

    float:left;
    list-style-type:none;
    margin-right:15px;
}

.right li:first-child {

    margin-top: 5px;
    float: left;
    width: 25px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    color:#034ea2;
    font-size:200%;
}

.dropdown {
    background-color: #034ea2;
    margin-top: 5px;
    float: left;
    width: 25px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    color: #fff;
    position: relative;
}
.dropdown:before {
    content: '';
    position: absolute;
    left: -5px;
    top: 8px;
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-right: 5px solid #034ea2;
}

.cart-icon:hover .dropdown ul {

    display:block;
}


/*.right:hover  .dropdown ul {

    display:block;
}*/

.right:hover {
    background: #fff;
    border-bottom: 3px solid #034ea2;
    padding-left: 12px;

}

.dropdown ul {

    position: absolute;
    z-index: 9999999999999999999999;
    width: 300px;
    left: -380px;
    top: 20px;
    text-align: left;
    padding: 0px;
    width: 400px;
    font-size: 80%;
    display:none;
    padding-top: 30px;
}

.dropdown ul:before {
    margin-right: 10px;

    content: '';
    top: 10px;
    right: 11px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 20px 20px 0 0;
    border-color: transparent #fff transparent transparent;
    position: absolute;

}

.dropdown ul.active {
    display:block;
    position: relative;
}

.dropdown ul li {

    width:100% !important;
    text-align:left;
    padding:10px 20px;

}

.dropdown ul span {

    float:left;
    overflow:hidden;
    background-color: #fff;
    -webkit-box-shadow: 0 0 2px 1px rgba(60,60,60,.2);
    box-shadow: 0 0 2px 1px rgba(60,60,60,.2);

}

.dropdown ul select {

    float: left;
    clear: both;
    width: 100%;
    margin: 20px 0px;
    height: 40px;
    font-size: 150%;
    position:relative;
}


.dropdown ul input {

    border: 0;
    padding: 14px 30px;
    color: #fff;
    font-weight: normal;
    font-size: 13px;
    display: inline;
    display: inline-block;
    text-align: center;
    margin: 0;
    cursor: pointer;
    outline: 0;
    transition: box-shadow 200ms;
    background: #034ea2;
    text-transform: uppercase;
    height: auto;
    float:left;
}

.dropdown ul li:first-child {

    border-bottom: 5px solid;
    margin-bottom: 0px;
    text-align: left;
    text-transform: uppercase;
    float: left;
    padding-bottom: 40px;
}
.dropdown ul li #varukorg_p {
    z-index: 10;
    margin-right: auto;
    margin-left: 0px;
    text-transform: uppercase;
    width: 100%;
    float: left;
    position: relative;
    display: block;
}

.top-menu {
    float:left;
    position:relative;
    padding:10px 0px;
}

.top-menu .formrutor {

    width: auto;
    border: none;
    font-size: inherit;
    height: 100%;
    text-transform: uppercase;
    background: transparent;
    color:#034ea2;
    cursor:pointer;
}
.top-menu ul {
    padding:0px;
    margin:0px;
}

.top-menu ul li {

    float:left;
    list-style-type:none;
    text-transform:uppercase;
    color:#111;
    margin-right:20px;
    color:#034ea2;
    border-bottom:1px solid transparent
}

.top-menu ul li:lastchild:hover {
    border-bottom:1px solid #034ea2;
}

/* MENU */

.logo {

    float:left;
    padding:20px 0px;
    width:20%;
    margin-top:10px;
}

.logo a img {
    border:none;
}

select::-ms-expand {
    display: none;
}
.menu-container {
    float:left;
    width:100%;
    position:relative;
    height:100px;
    background:#fff;
}

.menu-container .container {
    height:100%;
}

.main-menu {
    float:right;
    height:100%;
    font-size:110%;
}

.main-menu ul {
    height:100%;
    margin:0px;
    padding:0px;
}

.main-menu ul li {
    height:100%;
    display:table;
    float:left;
    padding:0px 20px;   
    border-bottom:3px solid transparent;
}
.main-menu li:hover {

    border-bottom:3px solid #034ea2;

}
.main-menu ul li a {

    display:table-cell;
    vertical-align:middle;
    text-transform:uppercase;
}


.clearfix:before,
.clearfix:after {
   content: " "; /* 1 */
   display: table; /* 2 */
}

.clearfix:after {
clear: both;
}



.main-content {

    position:relative;
    float:left;
    width:100%;

}

.main-inner {

    float:left;
    width:100%;
    background:#fff;
    padding:0px 20px;
    border:1px solid #eee;
}

/* hela korgen   */

.varukorg-info {
    float: left;
    width: 70%;
    margin-bottom: 20px;
}
.add-remove {
    float: left;
    width: 70%;
    margin-top:20px;

}
#varukorg_Pnl {
    clear: both;
    margin: 40px 0px;
    float: left;
    width: 100%;
}
.varukorg-img {
    float: left;
    width: 20%;
    text-align: center;
    margin:20px;
}

/* Produkter  */

#produktnamn_Lbl {

    clear: both;
    display: block;
    margin-bottom: 20px;
    font-weight: 800;
    font-size:150%;

}
.product {

    float:left;
    width:20%;
    text-align:center;
    margin:20px 0px;
    padding:0px;
    min-height:310px;
}

.product span {

    float:left;
    width:100%;
}
.product-inner-main {
    
    padding:20px 40px;
    float:left;
    width:100%;

}

.product-inner-main:hover {

    background:#ffff;
     -webkit-box-shadow: 0 0 2px 1px rgba(60,60,60,.2);
    box-shadow: 0 0 2px 1px rgba(60,60,60,.2);

}

.product img {

    margin:0px auto;
    display:block;
}

.product-name {

    float:left;
    width:100%;
    margin:10px 0px;
    white-space: pre-wrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.product-price-original {

    text-decoration: line-through;
    font-size:80%;
}
.product-price {

    color:#034ea2;
    font-weight:800;
    font-size:140%;
}


*, *:before, *:after {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}



.teams {
    display: block;
    list-style: none;
    padding: 0;
    float: left;
    width: 100%;
    margin: 40px 0px;
}

.teams .box {
    transform: skew(0deg);
    float: none;
    display: inline-block;
    width: 19%;
    padding:0px 0px 20px 0px;
}

.teams .box:hover {

    background:#fff;
    cursor:pointer;

}

.teams .box .article-card {
    padding: 20px 20px 0 20px;
    font-size: .8125em;
    text-align: center;
}

.teams .box .article-card .product-image {
    margin-bottom: 20px;
}
.article-card img {
    max-width:70%;
    max-height:130px;
}
.product-name {
    margin: 15px 0px 5px;
    font-family: 'DINPro-regular';
}


.header {
    position: relative;
    z-index: 9999999;
    background: #fff;
    padding: 20px;
    overflow: hidden;
    float: left;
    width: 100%;
    height: 100px;
    clear: both;
}

.header .left {
    float: left;
    list-style-type: none;
}
.header .right {
    float: right;
    list-style-type: none;
    display:table;
}

.header .right .btn {

    background: #034ea2;
    margin-right: 2px;
    display: table-cell;
    color: #fff;
    cursor: pointer;
    padding: 10px 30px;
    position: relative;
    text-align: center;
    text-transform: uppercase;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-family: dinProBold,Arial,Sans-Serif;
    font-size: 15px;
    vertical-align: middle;

}

.header li {

    list-style-type:none;

}

.hide {

    display:none;

}

.show {

    display:block;
    position:absolute;
}


.ledare_form {
    z-index: 11;
    width: 100%;
    height:100%;
    background: rgba(0,0,0,0.5);
}

.ledare_form .ledare_inner {

    margin: 0px auto;
    position: relative;
    display: block;
    width: 500px;
    top: 30%;
    padding:20px 0px;

}
.ledare_inner_container {

    float:left;
    position:relative;
    background:#fff;
    padding:20px 0px;
}

.login-info {

    padding:0px 30px;
}

.login-info p {

    float:left;
    margin:0px 0px 0px 0px;
}

.ledare_inner_container .submit-login {

    font-size: 15px;
    margin: 10px 0px;
    padding: 10px;
    width: 100%;
    float: left;
    background: #034ea2;
    color: #fff;
    cursor: pointer;
    padding: 10px 30px;
    position: relative;
    text-align: center;
    text-transform: uppercase;
    font-family: dinProBold,Arial,Sans-Serif;
    height:50px;

}

.ledare_inner_container input {

    font-size: 15px;
    line-height: normal;
    height: 40px;
    margin: 10px 0px;
    padding: 10px;
    border: solid 1px #aaa;
    outline: 0;
    width: 100%;
    float: left;

}
.ledare_form .login-form {
    width: 100%;
    display: block;
    margin: 0px auto;
    margin-top: 15%;
    background: #fff;
    margin: 0px auto;
}

.ledare_form h3 {

    width: 100%;
    text-align: left;
    text-transform: uppercase;
    color: #034ea2;
    border-bottom: 3px solid #034ea2;
    padding: 0px 10px 20px 30px;
    font-size: 170%;
    margin:0px 0px 20px 0px;

}

.close {

    float: right;
    margin-right: 10px;
    border-radius: 50%;
    border: 1px solid #034ea2;
    padding: 10px;
    width: 43px;
    text-align: center;
    font-size: 70%;
    margin-top: -5px;

}

.close:hover {

    cursor:pointer;
    background:#034ea2;
    color:#fff;
}


.indrag {

    margin-bottom:20px;
}

.total {

    padding: 0px;
    margin: 20px 0px;
    width: 100%;
    float: left;
    text-transform: uppercase;
    font-weight: 800;
    font-size:140%;
}
.total li {

    list-style-type:none;
    float:left;
    width:33%;
    color:#034ea2;
    text-align:right;
}

#kortbox {

        width: 30px;
    height: 30px;
    float: left;

}

#klarnabox {

        width: 30px;
    height: 30px;
    float: left;

}

.kort{

    font-size: 200%;
    width: 15%;
    float: left;
}
input[type="radio"] {
      width: 25px;
    height: 25px;
    float: left;
}
#steg,#steg2,#skicka,#steg3_2,#steg2_1 {
    height:auto;
    width: auto;
    border: 1px solid #CCCCCC;
    font-size: 10px;
    line-height: normal;
    color: #444444;
    background: #034ea2;
    margin-right: 2px;
    display: block;
    color: #fff;
    cursor: pointer;
    padding: 10px 30px;
    position: relative;
    text-align: center;
    text-transform: uppercase;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-family: dinProBold,Arial,Sans-Serif;
    font-size: 15px;

}

.redankund {

    width: auto;
    font-size: 20px;
    line-height: normal;
    color: #444444;
    text-align: left;
    text-transform: uppercase;
    border: none;
    margin: 40px 0px;
    float: left;
    width: 20%;
}

.redankundtext {

    font-size: 20px;
    line-height: normal;
    color: #444444;
}

.uppgifter {

    margin:40px 0px;
}

.uppgifter input {

    padding: 10px;
    margin: 0;
    border: 1px solid #aaa;
    outline: 0;
    width: 100%;
    margin-bottom: 15px;

}

.uppgifter td {

    font-size:20px;
}



.uppgifter_n {

    margin:20px 0px;
}

.uppgifter_n input {

    padding: 10px;
    margin: 0;
    border: 1px solid #aaa;
    outline: 0;
    margin-bottom: 15px;

}

.uppgifter_n td {

    font-size:14px;
}


#antal_Txt {

    padding: 0px 5px;
    width: 40px !important;
    height: 40px;
    float: left;
    text-align: center;
    font-size: 110%;

}

 .addmore {

    height: 40px;
    text-align: center;
    background: #034ea2;
    color: #fff !important;
    float: left;
    width: 40px;
    display:table;
    cursor: pointer;
}

.addmore span {
        cursor: pointer;
    display:table-cell !important;
    vertical-align:middle;
}

#fritext_Pnl,#tillagg_0_Pnl {

    float: left;
    margin-left: 10px;
}

#tillagg_0_Pnl select {

    height: 40px;
    font-size: 90%;
    width: 100%;

}

#fel_Lbl {

    text-align: left;
    margin: 40px 0px;

}
/*
#tillagg_1_Dd {

    width:50% !important;
}
*/
.registrerad-epost{

    margin:40px 0px;
}

.registrerad-epost td {

       border: none;
    font-size: 20px;
    width: auto;
    float: left;

}

.registrerad-epost input {

    height: 40px;
    float: left;
    margin-left: 20px;

}

.registrerad-epost #kundnr_Btn {
        height: auto;
    width: auto;
    border: 1px solid #CCCCCC;
    font-size: 10px;
    line-height: normal;
    color: #444444;
    background: #034ea2;
    margin:0px;
    display: block;
    color: #fff;
    cursor: pointer;
    padding: 10px 30px;
    position: relative;
    float: left;
    text-align: center;
    text-transform: uppercase;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-family: dinProBold,Arial,Sans-Serif;
    font-size: 15px !important;
    border: 1px solid #333;
}

#panel_kundnr .formtext {

    font-size:20px;
}

#pkgs_Pnl {

    float: left;
    clear: both;
    margin: 40px 0px;
    width:100%;
}

#produkt_1_Pnl,#produkt_2_Pnl,#produkt_3_Pnl,#produkt_4_Pnl,#produkt_5_Pnl,#produkt_6_Pnl,#produkt_7_Pnl {

    float:left;
    margin-right:0px;
    width: 100%;
    margin:20px 0px;
}

#infotext1 #produkt_1_Pnl select,#infotext1 #produkt_2_Pnl select,#infotext1 #produkt_3_Pnl select,#infotext1 #produkt_4_Pnl select,#infotext1 #produkt_5_Pnl select,#infotext1 #produkt_6_Pnl select,#infotext1 #produkt_7_Pnl select {
	
	min-width: 200px;
    height: 40px;
    -webkit-appearance: listbox;
    background: transparent;
    padding: 0px 10px;
    text-transform: uppercase;
    font-weight: 400;
    font-size:90%;
}

#infotext1 #produkt_1_Pnl tr,#infotext1 #produkt_2_Pnl,#infotext1 #produkt_3_Pnl tr,#infotext1 #produkt_4_Pnl tr,#infotext1 #produkt_5_Pnl tr,#infotext1 #produkt_6_Pnl tr,#infotext1 #produkt_7_Pnl tr {

	min-width: 250px;
}

.mobile-menu {
    display:none;
}


#action_andra,#action_tabort,#kassa {
    height: auto;
    width: auto;
    border: 1px solid #CCCCCC;
    font-size: 10px;
    line-height: normal;
    color: #444444;
    background: #034ea2;
    margin-right: 2px;
    display: block;
    color: #fff;
    cursor: pointer;
    padding: 10px 30px;
    position: relative;
    text-align: center;
    text-transform: uppercase;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-family: dinProBold,Arial,Sans-Serif;
    font-size: 15px;
    float:right;

}


@media all and (max-width: 1025px) {
    #container {
    max-width: 1200px;
    width:auto;

}
    .sorting li {
    width: 25%;
}
    .welcome {
    float: left;
    max-width: 65%;
    padding: 50px 0px;
}
    .teams .box {
    width: 32%;

}
    .main-menu {
        display:block;
        font-size: 80%;

    }
    .logo {
        float: left;
        padding: 30px 20px;
        width: 30%;
        margin-top: 10px;
    }
    .logo img {width:100%;}

    .top-header {
        padding: 0px 20px;
    }

    .product {
        width: 33%;
    }
    .product-inner {
    padding: 0px 10px !important;
    float: left;
}
 input , select {
     border-radius:0px;
     -webkit-appearance:none;
 }
}

/*tablet landscape*/

@media only screen
and (max-device-width : 1024px) 
and (orientation : landscape) {

}

/*phone*/
@media all and (max-width: 767px) {

    .teams .box {
        width: 50%;
        font-size: 70%;
        float: left;
        display: block;
        min-height: 170px;
        padding: 5px;
    }
    .teams .box .article-card {
        background: #fff;
        padding: 10px 0px;
        float: left;
        width: 100%;
    }
    .teams .box .article-card .product-image {
        min-height: 125px;
        width: 100%;
        margin-bottom.0px;
    }
    .product-image img {
        width: 90px;
    }

    .product-image .small-image {
        max-width:25%;
    }

    .product-image .small-image-new {
        max-width:50%;
    }


    .ledare_form .ledare_inner {
        margin: 0px auto;
        position: relative;
        display: block;
        width: 500px;
        top: 20%;
        padding: 20px 0px;
        float: left;
        width: 100%;
        font-size:70%;
    }

    .ledare_inner_container {
        float: left;
        position: relative;
        background: #fff;
        padding: 20px 0px;
        width: 100%;
    }

    .close {
        width: 38px;
    }



    .right {
        float: right;
        padding: 0px;
        margin: 0px;
        position: relative;
        height: initial;
        display: block !important;
        margin-right: 0px !important;
    }
    .header .left {
        float: left;
        list-style-type: none;
        padding: 0px;
        margin: 0px;
        width: 50%;
    }
    .left img {
        max-width: 100%;
        margin-top: 5px;
    }
    .header {
        padding: 10px;
        float: left;
        width: 100%;
        height:auto;
    }

    .header .right .btn {
        display: block;
        padding: 10px;
        text-overflow: ellipsis;
        font-size: 8px;
    }


.menu-container {
    float: left;
    width: 100%;
    position: relative;
    height: auto;
    background: #fff;
    padding: 20px 20px;
}
.logo {
    float: left;
    padding: 0px 0px;
    width: 70%;
    margin-top: 0px;
}

    .logo img {
        width:100%;
    }

    .sorting li {
        width: 50%;
    }
    .product {
    float: left;
    width: 50%;
    text-align: center;
    margin: 20px 0px;
    padding: 0px;
    min-height: 200px;
}
    .product-inner-main {
    padding: 0px;
    float: left;
    width: 100%;
}

    .welcome {
    display: none;

}

    #logobox_is {
    z-index: 10;
    background-color: transparent;
    float: left;
    margin: 0px;
    position: relative;
    width: 100%;
    max-width:100%;
    text-align: center;
}
    #logobox_is img {
    padding: 20px;
    width: 50%;
    display: inline-block;
    margin: 0px auto;
}
.mobile-menu {
    display: block;
    float: left;
    width: 30%;
    text-align: right;
    display: table;
    height: 100%;
    font-size: 150%;
    margin-top: -1px;
}

    .main-menu {
        float: right;
        height: 100%;
        font-size: 110%;
        display: none;
        margin-top:10px;
    }

    #container {

        max-width:1200px;
        width:100%;
    }

    .product-inner {
    padding: 0px 0px !important;
    float: left;
}
    .product img {
    margin: 0px auto;
    display: block;
    max-width: 60%;
    max-height:100px;
}

    #infobild {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 50px;
}

    #infobild img {
    width: 40%;
    margin: 0px auto;
    display: block;
}

    #infocontainer {
    float: left;
    width: 100%;
    height: auto;
    padding: 0px;
    text-align: center;
}

    #infoprodukttext {
    float: left;
    width: 100%;
    height: auto;
    padding: 8px;
    font-size: 90%;
    color: #444444;
    overflow-wrap: break-word;
}

    .price {
    float: left;
    width: 100%;
    text-align: center;
    color: #034ea2;
    text-transform: uppercase;
}

    #infotext1 {
    float: left;
    width: 100%;
    height: auto;
    margin: 40px 0px;
    padding: 0px 20px;
}
    .antal-input {
    float: left;
    width: 50%;
}

#infocontainer2 {
    float: left;
    width: 100%;
    height: auto;
}

    .total {
        font-size: 60%;
    }
    .header_dark {
    font-size: 80%;
    padding: 20px 20px;
    background: #f2f5f8;
    color: #034ea2;
    width: 100%;
}
   #
    .bread_dark td {
        font-size:8px;
    }
    .total li {
    list-style-type: none;
    float: left;
    width: 33%;
    color: #034ea2;
    text-align: center;
}
    .main-menu li {
    height: 100%;
    display: block;
    float: left;
    padding: 0px 20px;
    border-bottom: 3px solid transparent;
    width: 100%;
    margin: 10px 0px;
}

    .top-menu {
    float: left;
    position: absolute;
    padding: 10px 0px;
    font-size: 90%;
    width: 80%;
}

    .top-menu li:first-child {
        display:none;
    }
    .top-header {
    font-size: 80%;
    float: left;
    width: 100%;
    height: 40px;
    background: #f2f5f8;
    padding: 0px 0px 0px 20px;
}

    .dropdown ul {
    position: relative;
    z-index: 9999999999999999999999;
    width: 300px;
    left: 0px;
    top: 20px;
    text-align: left;
    padding: 0px;
    font-size: 80%;
    padding-top: 30px;
    position: absolute;
    left: -280px;
    right: 0px;
}
    .addprod {
    width: 100%;
    padding: 0px 10px;
}
    .uppgifter td {
    font-size: 20px;
    float: left;
    width: 50%;
}
    #steg, #steg2, #steg3_2, #skicka, #steg2_1 {

    font-size: 10px;

}

    .varukorg-img {
    width: 100%;

}
    .varukorg-kassa {
        margin-top:30px;
    }

    #action_andra, #action_tabort {
    height: 40px;
    width: 27.8%;
    background: #034ea2;
    margin-right: 1px;
    display: block;
    color: #fff;
    margin-left: 1px;
    cursor: pointer;
    padding: 10px 10px;
    position: relative;
    text-align: center;
    text-transform: uppercase;
    text-overflow: inherit;
    overflow: hidden;
    white-space: nowrap;
    font-family: dinProBold,Arial,Sans-Serif;
    font-size: 10px;
    float: left;
    border: none;
}


.closedtimes {
    width: 100% !important;
    padding: 30px;
    height: auto;
    background: #fff;
    text-align: center;
    margin: 0px auto;
    margin-top: 20%;
    font-size: 60% !important;
}

}