@import url("https://use.typekit.net/eku6mnn.css");

body {
  font-family: "freight-sans-pro", "Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
  background: #fff;
  font-size: 15px;
  font-variant-numeric: lining-nums;
}

.headers {
  font-size: 32px;
  font-weight: normal;
  letter-spacing: 0;
  text-align: left;
  margin-left: 310px;
  margin-top: 37px;
  color: #000;
}

.components-container {
	max-width: 1128px;
  width: auto;
}

@media (max-width: 768px) {
 .components-container .less-padding {
 		padding: 0;
	}
  
  .main-container section {
  	margin: 0 0 10px 0;
  }
}


  
/**
 * Spinner
 */

#spinner > div:before {
  content: '';
	position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.5);
}

#spinner > div {
	zoom: 0.3;
  z-index: 10 !important;
}

.spinner-color {
  color: #FFDC14;
}


/**
 * Slideout menu
 */

.slideout-menu {
  background-color: #F8F8F8;
  box-shadow: none;
  border-right: 1px solid #D8D8D8;
}

.slideout-menu .image-holder {
  height: 81px;
  padding-top: 26px;
}

#officeimage {
  background: url('https://ntexinrikes.se/app/uploads/2020/12/ntex_logotype_RGB.png');
  position: relative;
  overflow: hidden;
  width: auto;
  height: 38px;
  padding-left: 220px;
  box-sizing: border-box;
  background-size: 100%;
}

.slideout-menu .border-separator {
  margin: 0 30px 15px;
  width: auto;
  border-bottom-color: #ECECEC;
}

.slideout-menu .navigation-menu:before {
	content: "KUNDPORTAL";
  color: #000;
  margin-left: 30px;
  font-size: 17px;
  font-weight: bold;
  letter-spacing: 1.23px;
}

.slideout-menu .navigation-menu ul {
	margin-top: 10px;
}

.slideout-menu .navigation-menu ul li a {
  text-transform: none;
  padding: 9px 30px 10px 30px;
  letter-spacing: 0;
  font-size: 18px;
  font-weight: 600;
}

.slideout-menu .navigation-menu ul li a:hover {
  background-color: #ECECEC;
}

.slideout-menu .navigation-menu ul li.menu-click-color a:hover {
  background-color: #FCB000;
}

.slideout-menu .navigation-menu ul li a .glyphicon {
  margin-right: 8px;
  margin-top: 3px;
  font-size: 14px;
}

.menu-click-color a {
  background-color: #FFDC14;
}

.slideout-menu .navigation-menu li:last-child:before,
.slideout-menu .navigation-menu li.Users:after {
  content: "";
  display: block;
  position: relative;
  width: auto;
  margin: 0 30px 18px;
  border-bottom: 2px solid #ECECEC;
}

.slideout-menu .navigation-menu li.Users:after {
  margin-top: 16px;
}

.slideout-menu .glyphicon-plus:before {
  content: "\e164";
}

.reference-container {
  background-color: #ECECEC;
}

.reference-holder {
  padding: 20px 33px;
}

.reference-container label {
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1.5px;
  margin-bottom: 5px;
  color: #585858;
}

.reference-text,
.reference-customer {
  font-size: 18px;
  font-weight: bold;
  line-height: 22px;
  letter-spacing: 0;
  text-transform: none;
  color: #585858;
}

.reference-customer {
	font-weight: normal;
}



/**
 * Main container
 */

.main-container {
  padding-top: 100px;
}

@media (max-width: 1250px) {
 
  .container .main-container {
		padding-top: 80px;
  }
}

@media (max-width: 768px) {
  .main-container {
  	padding: 15px;
	}
}


/**
 * Navbar
 */

.navbar-fixed-top {
	z-index: 10;
}

.navbar-default .navbar-link {
  text-transform: none;
}

.navbar-toggle {
	padding: 20px 15px;
}

#toggle-menu {
	margin-right: 10px;
}

.navbar .menu-container span {
  font-size: 16px;
  letter-spacing: 1px;
  font-family: "freight-sans-pro";
  text-transform: uppercase;
  font-weight: 600;
  padding-left: 7px;
  top: 4px;
  position: relative;
}

.border-wrapper {
  border: 0;
  background: #ECECEC;
  width: auto;
  height: 42px;
}

.border-wrapper h6 {
  margin: 14px 0 15px 0;
}

@media (min-width: 768px) {
  .navbar-header {
    margin-top: 32px;
  }
}


/**
 * Columns
 */

@media (max-width: 768px) {
  .row {
  	margin-left: 0;
    margin-right: 0;                 
  }
  
  [class^="col-"] {
    padding-left: 0;
    padding-right: 0;
  }
}



/**
 * Panels
 */

.panel {
  background-color: #F8F8F8;
  box-shadow: none;
}

.panel-primary {
  border-color: #DADADA;
}

.panel-title {
  text-transform: none;
  font-size: 18px;
  font-weight: bold;
  letter-spacing: 0;
  text-align: left;
  color: #000;
}

.panel-primary > .panel-heading {
  padding: 10px 16px;
  border-bottom: 1px solid #E40521;
}

.panel-body {
  padding: 16px;
}


/**
 * Buttons
 */

.priceSummary .btn,
.btn,
.btn-preview-custom,
.btn:focus {
  color: #585858;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0.94px;
  padding: 10px 20px;
  background-color: #FFCD00;
  border: 0;
}

.btn:focus,
.btn:active,
.btn-preview-custom:hover {
  color: #585858;
  padding: 10px 20px;
	outline: 0 !important;
}

.btn:focus,
.btn:hover {
  color: #585858;
  background-color: #FCB000 !important;
}

.btn .glyphicon {
  margin-right: 6px;
  font-size: 14px;
}

.glyphicon-floppy-disk:before {
  content: "\e161";
}


/**
 * Input fields
 */

.form-control {
  border-color: #DADADA;
  padding: 4px 8px;
	font-size: 17px;
  letter-spacing: 0;
  -webkit-appearance: none;
}

.mandatory {
  background-color: #fff;
}

.input-group-btn {
  vertical-align: top;
}

.input-group .btn {
  padding: 5px 10px;
  border-radius: 0;
  background-color: #FFDC14;
  border: 2px solid #DADADA;
  border-left: 0;
  box-sizing: border-box;
}

.input-group .form-control.ui-autocomplete-input {
  border-right: 0;
  margin-bottom: 0px;
}

select.form-control {
  height: 34px;
  -webkit-appearance: none;
  -webkit-border-radius: 0px;
  background-image: url("data:image/svg+xml;utf8,<svg width='25px' height='16px' viewBox='0 0 9 16' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'><g stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'><g id='Beställ' transform='translate(-837.000000, -577.000000)' fill='#000000'><g transform='translate(314.000000, 261.000000)'><g transform='translate(119.000000, 307.000000)'><g transform='translate(404.000000, 9.000000)'><polygon points='4.5 16 0 10 9 10'></polygon><polygon transform='translate(4.500000, 3.000000) rotate(-180.000000) translate(-4.500000, -3.000000) ' points='4.5 6 0 0 9 0'></polygon></g></g></g></g></g></svg>");
  background-position: 100% 50%;
  background-repeat: no-repeat;
}

.styled-select {
	height: 56px;
  
}

.styled-select select.form-control {
	height: 100%;
  font-size: 22px;
  width: 100% !important;
  background-color: #ECECEC;
  padding: 12px 22px 12px 22px;
  border: 0;
  box-shadow: none;
  background-image: url("data:image/svg+xml;utf8,<svg width='50px' height='6px' viewBox='0 0 11 6' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'><g stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'><g transform='translate(-957.000000, -641.000000)' fill='#626262'><g transform='translate(449.000000, 616.000000)'><polygon points='513.5 31 508 25 519 25'></polygon></g></g></g></svg>");
  background-position: 100% 50%;
  background-repeat: no-repeat;
}

input[type="radio"], 
input[type="checkbox"] {
  -webkit-appearance: none;
  height: 22px;
  width: 22px;
  background-color: #fff;
  border: 2px solid #DADADA;
  margin: 0;
}

input[type="checkbox"]:active {
  background-color: #ECECEC;
}

input[type="checkbox"]:checked:after {
  font-family: 'Glyphicons Halflings';
  content: "\e013";
  border: 0;
  display: block;
  text-align: center;
  position: relative;
  top: 1px;
}

label {
  color: #585858;
	font-size: 17px;
  font-weight: 600;
  letter-spacing: 0;
}

label.error {
	position: relative;
  font-size: 15px;
  font-weight: normal;
}

.control-label {
  padding: 5px 0;
}

.addr-bottom-padding {
  padding-bottom: 4px;
}

/**
 * Tables
 */

.table-responsive-custom {
  background-color: #ECECEC;
  margin-right: 0;
  padding: 6px 45px 6px 10px;
}

.table-responsive-custom .fixed-col.cell-margin {
	margin-top: 7px;
}

.table {
  margin-bottom: 0;
}

.table-responsive-custom .table-bordered {
  border: 0;
}

.table-responsive-custom td {
	padding-bottom: 11px !important;
}

.table-bordered th {
	background-color: #ECECEC;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0;
  color: #585858;
}

.table td .form-control {
  margin-bottom: 0;
}


/**
 * K-filters
 */

.k-primary,
.k-list>.k-state-selected {
	background: #FFDC14 !important;
  color: #585858 !important;
  border-color: #FCB000 !important;
}

.k-primary:hover {
	background-color: #FCB000 !important;
}

.k-grid-header th.k-header .k-icon {
	position: relative;
  vertical-align: top;
  top: 2px;
}

/**
 * K-grids
 */

.grid-headers {
  color: #000;
  text-transform: none;
  letter-spacing: 0;
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 10px;
}

.k-grid-header th.k-header {
  background: #ECECEC;
  border-bottom: 1px solid #E40521;
  text-transform: none;
  text-align: left;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0;
  padding: 8px;
}

.k-grid-header .k-header>.k-link, 
.k-header, .k-treemap-title {
	color: #585858;
}

.k-header>.k-grid-filter, 
.k-header>.k-header-column-menu {
	padding: 0;
  margin: 0;
}

.k-grid td {
	padding: 6px 8px;
}

.k-pager-wrap {
  background: none;
}

.k-state-selected {
	background-color: #FFDC14;
  background-image: none;
}

.k-grid td.k-state-selected:hover, 
.k-grid tr.k-state-selected:hover {
	background-color: #FCB000;
}

.k-pager-numbers .k-link,
.k-pager-numbers .k-state-selected {
  background: none;
  border-radius: 0;
  border-style: none;
  color: #585858;
  vertical-align: middle;
	font-size: 15px;
  line-height: 15px;
  min-width: 10px;
  box-sizing: border-box;
  margin: 0 5px;
}

.k-pager-numbers .k-state-selected {
  border-bottom: 2px solid #E40521;
}

.k-pager-info {
	padding-top: 1px;
}

.k-grid-pager .k-icon:before {
	color: #000;
}

.kendoselect tbody tr:hover {
  background-color: #E3E3E3;
}

.k-webkit .k-pager-numbers .k-link.k-pager-nav {
	padding: 7px 10px;
}

.k-webkit .k-pager-numbers .k-state-selected {
	border-radius: 0;
}


/**
 * UI-Autocomplete
 */

.ui-autocomplete {
	padding: 0;
  overflow-y: auto;
}

.ui-autocomplete .ui-menu-item {
  font-size: 15px;
	font-weight: normal;
  padding: 7px 9px;
}

.ui-autocomplete .ui-state-focus {
	border: none;
  background: #FFDC14;
}

.ui-menu .ui-state-focus, 
.ui-menu .ui-state-active {
	margin: 0;
}

.ui-widget-content {
  border-radius: 0;
	background: #fff;
  box-shadow: 0 5px 10px rgba(0,0,0,.2);
}

.ui-widget {
	font-family: "Open Sans","Helvetica Neue", Helvetica, Arial, sans-serif;
}


/**
 * Datepicker
 */
.datepicker {
	border-radius: 0;
}

.datepicker table tr td.active:hover, .datepicker table tr td.active:hover:hover, .datepicker table tr td.active.disabled:hover, .datepicker table tr td.active.disabled:hover:hover, .datepicker table tr td.active:active, .datepicker table tr td.active:hover:active, .datepicker table tr td.active.disabled:active, .datepicker table tr td.active.disabled:hover:active, .datepicker table tr td.active.active, .datepicker table tr td.active:hover.active, .datepicker table tr td.active.disabled.active, .datepicker table tr td.active.disabled:hover.active, .datepicker table tr td.active.disabled, .datepicker table tr td.active:hover.disabled, .datepicker table tr td.active.disabled.disabled, .datepicker table tr td.active.disabled:hover.disabled, .datepicker table tr td.active[disabled], .datepicker table tr td.active:hover[disabled], .datepicker table tr td.active.disabled[disabled], .datepicker table tr td.active.disabled:hover[disabled] {
	background: #FFDC14;
  color: #333;
  text-shadow: none;
  letter-spacing: 0;
}


/**
 * Toasts
 */

#toast-container>.toast {
	font-size: 18px;
  letter-spacing: 0;
  font-weight: 600;
  box-shadow: none;
}

#toast-container>.toast-warning {
  background: #E40521 !important;
}

#toast-container>.toast-success {
  background: #009B8F !important;
}

.toast:before {
  font-family: 'Glyphicons Halflings';
  font-size: 12px;
  position: absolute;
  left: 22px;
  top: 21px;
}

.toast-warning:before {
  content: "\e101";
  
}

.toast-success:before {
  content: "\e084";
}

/**
 * Modals
 */
.modal-title-custom {
  text-transform: none;
  font-size: 18px;
  font-weight: bold;
  letter-spacing: 0;
  text-align: left;
  color: #000;
  padding: 8px 0;
}


/**
 * Login
 */

.loginbox-container {
	max-width: 692px;
}

.loginbox-container img {
  width: 100%;
	max-width: 500px;
	max-height: 125px;
}

.login-box {
	background: transparent;
}

.login-box > .panel-body {
  background: #fff;
	padding: 48px 60px 54px 60px;
}

@media (max-width: 768px) {
  .login-box > .panel-body {
	  padding: 20px;
  }
}

#loginform .input-group-addon {
  position: absolute;
  z-index: 100;
  height: 100%;
  line-height: 66px;
  width: 45px;
  padding: 0;
  background: transparent;
  border: 0;
}

#loginform .input-group {
	width: 100%;
}

#loginform .form-control-login {
  display: block;
	font-size: 22px;
	padding-left: 45px;
  border: 2px solid #DADADA;
}


.login-label {
	margin-bottom: 12px;
  font-size: 17px;
}

.powered-by {
	background: none;
  position: relative;
}

#loginbox .panel {
	background: none;
}

#loginbox .btn-default {
	border: 0;
  border-radius: 40px;
  padding: 18px 10px;
  font-size: 18px;
  letter-spacing: 1.06px;
}

@media (max-width: 849px) {
	.bottom-buffer-login {
    display: block;
    padding: 20px;
  }
}

/**
 * Order page
 */

#validationform {
	margin-left: 8px;
}

@media (max-width: 1250px) {
	#validationform {
		margin-left: 0px;
	}
}

.priceSummary {
  float: none;
  width: 1160px;
  letter-spacing: 0;
}

.priceSummary .col-md-5 {
  width: auto;
  float: right;
}

.priceSummary .col-md-7 {
  float: right;
}

.priceSummary:before {
  content: "Prisberäkning";
  float: left;
  font-size: 32px;
  font-weight: normal;
  letter-spacing: 0;
  position: relative;
  margin-left: 24px;
  color: #000;
}

#order-wrapper .priceSummary:before {
  content: "Beställ";
  float: left;
  font-size: 32px;
  font-weight: normal;
  letter-spacing: 0;
  position: relative;
  margin-left: 24px;
  color: #000;
}

.priceSummary .income {
	text-shadow: none;
  margin-right: 5px;
  border-bottom: 2px solid #FFDC14;
}

.priceSummary h6 {
  font-size: 17px;
	font-weight: bold;
  margin: 12px 0 0;
  padding: 0 5px;
}

.priceSummary h6 .right-buffer {
  font-size: 17px;
	font-weight: normal;
}

.welcome-text {
  font-size: 17px;
  letter-spacing: 0;
  color: #585858;
  padding: 16px 26px 24px;
}
.welcome-text p {
  margin-bottom: 0;
}

#dynamic-content-holder {
  column-width: auto;
  column-gap: 0;
}

#dynamic-content {
	padding: 0;
}

#dynamic-content .dynamic > * {
  width: 50%;
  padding-left: 8px;
  padding-right: 8px;
  float: left;
}

#dynamic-content .dynamic > #service {
  padding-left: 0;
  padding-right: 0;
  margin-left: 8px;
  margin-right: 8px;
  float: none;
  display: block;
  width: auto;
}

@media (max-width: 767px) {
  #dynamic-content .dynamic > * {
		width: 100%;
    padding: 0;
  }
  
  #dynamic-content .dynamic > #service {
		margin-left: 0;
    margin-right: 0;
  }
}

#info .col-md-6:first-child {
  width: 160px;
}

#deliveryoptions .row {
  margin-bottom: 12px;
}

#deliveryoptions .col-md-11 {
  padding-left: 5px;
}

.bottom-buffer-large .col-md-12 {
  padding: 7px;
}

@media (max-width: 767px) {
	.long-word-spacing {
    text-align: left;
	}
  .nopadding-left {
    padding: 0;
  }
}

@media (min-width: 768px) {
  #receiver .col-md-1.col-sm-1.label-padding,
  #sender .col-md-1.col-sm-1.label-padding {
    padding-right: 0;
    text-align: right;
  }

  #receiver .col-md-2.col-sm-2.label-padding:nth-child(3),
  #sender .row .col-md-2.col-sm-2.label-padding:nth-child(3) {
    text-align: right;
  }
}

/**
 * Userform
 */
#userform .panel-body>.form-group {
	margin-top: 20px;
}