/*
Theme Name: Norlines
Theme URI: https://hclnordic.no
Author: HCL Nordic AS
Author URI: https://hclnordic.no
Description: Theme for Norlines
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: norlines

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

@import "vdm-styles.css";

/* home page */

#home-body{
	overflow-x: hidden;
    font-family: 'Open Sans', sans-serif;
}
.logo-header{
    height: 78px;
	width: auto;
	/*max-width: 270px;
    max-height: 100px;*/
}
.footer-layout{
    letter-spacing: 1px;
}
.footer-middle{
	margin: auto 7%;
}
.footer-links{
	margin: auto 20%;
    font-size: 13.5px;
    font-weight: 300;
    padding: 20px 5px;
}
.footer-seperator{
	border-bottom: 1px solid #fff;
}
#footer-section{
    font-size: 13px;
	margin-bottom: 10px;
	color: dimgrey;
	font-weight: 400;
}
.footer-media-links{
	width: 75%;
    margin: 0 auto;
}
.footer-nav-link{
    font-size: 12px;
	color: black;
	font-weight: normal;
}

.page-footer{
	border-top: 1px solid #e2e7ed;
}

/* main menu*/

#main-menu{
	display: none;
	background-color: #dde3ea;
	padding: 1% 6% 6% 6%;
}
#log-in{
	display: none;
	background-color: #dde3ea;
}
.menu-link-mypage, .menu-link-search{
	color: #02173a;
}
.menu-link-mypage:hover, .menu-link-search:hover{
	color: #02173a;
}
.menu-link-menu, .menu-link-login{
	color: #02173a !important;
}
.menu-link-menu:hover, .menu-link-login:hover{
	cursor: pointer;
	color: #02173a;
}
.menu-container ul{
	padding-inline-start: 10px !important;
}
.menu-container ul li{
	list-style: none;
}
.menu-container ul li a{
	text-decoration: none;
}
.menu-container .menu li ul li ul li:before{
	content: "\f105";
	color: #4c6e92;
	font-family: "Font Awesome 5 Free";
	display: inline-flex;
	padding-right: 5px;
	vertical-align: middle;
	font-weight: 600;
	align-items: center;
	font-size: 0.9em;
	padding-left: 20px;
}
.menu-container .menu li ul{
	padding-left: 0px;
}
.menu li a{
	color: #4c6e92;
}
.sub-menu{
	padding: 20px 0px;
}
.close-button-login, .close-button-menu{
	font-size: 15px;
	color: white;
}
.menu-container ul li ul li ul{
	display: none;
}
/*.sub-menu .menu-item-has-children .sub-menu{
	display: none;
}
.sub-menu .menu-item-has-children > a:hover{
	color: red;
	position:absolute;
	display: block;
}
*/
#home-column-1-title{
	background-color: #3a6084;
	color: white;
	font-size: 25px;
	text-align: center;
	border-right: 1px solid #ffffff;
}
#home-column-2-title{
	background-color: #3a6084;
	color: white;
	font-size: 25px;
	text-align: center;
	text-decoration: underline;
}
#home-column-1-container, #home-column-2-container{
	background-color: #e2e7ed;
}
#home-column-1-container .textwidget{
	padding: 5%;
}
#home-column-2-container .textwidget{
	padding: 5%;
}
.biz-container{
	width: 102%;
    position: absolute;
    top: 690px;
}
.biz-type-1{
	padding:50px;
}
.sporing-label, .send-from-label{
	color: black;
    font-size: 20px;
    padding-right: 25px;
    font-weight: 500;
	text-align: right;
}
.sendingsnumber{
	margin-bottom: 5px;
    font-size: 14px;
	color: black;
}
.from{
	margin-bottom: 5px;
    font-size: 12px;
	color: black;
}
.sendingsnumber-input, .postnumber-input{
	height: 26px;
    width: 180px;
    font-size: 0.9em;
    border: none;
	padding: 0.7em;
}
.find-shipping, .find-post-number{
	margin-top: 10px;
    font-size: .9em;
    letter-spacing: 0.02em;
	width: 135px;
	border-radius: .25rem;
}
.header-nav{
	position: absolute;
    z-index: 10;
    width: 100%;
}
.tracking-link:hover{
	text-decoration: none;
}
.post-header-text{
	font-size: 1.6em;
	color: white;
	background-color: #e2e7ed;
	text-transform: uppercase;
}
.post-container{
	background-color: #e2e7ed;
	/*min-height: calc(100vh - 440px);*/
    display: grid !important;
    grid-template-columns: repeat(3, 350px);
    grid-column-gap: 35px;
    grid-row-gap: 20px;
    width: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
	padding-bottom: 50px;
}
.post-category-layout{
	height: 275px;
    background-color: #fff;
    -webkit-box-shadow: 0 2px 1px -1px rgba(0,0,0,.2), 0 1px 1px 0 rgba(0,0,0,.14), 0 1px 3px 0 rgba(0,0,0,.12);
    box-shadow: 0 2px 1px -1px rgba(0,0,0,.2), 0 1px 1px 0 rgba(0,0,0,.14), 0 1px 3px 0 rgba(0,0,0,.12);
    min-width: 358px;
    position: relative;
}
.post-category{
	font-size: 13px;
    padding: 5px 0px 1px 15px;
    color: white;
	background-color: #e71f15;
	white-space: nowrap;
	text-transform: uppercase;
}
.post-title{
	padding: 15px 0px 15px 15px;
    font-size: 18px;
    letter-spacing: 0.02em;
	font-weight: 600;
}
.post-content-box{
	font-size: 15px;
    padding-left: 15px;
    padding-bottom: 10px;
   	height: 90px;
}
.post-link{
	padding-left: 15px;
    font-size: 15px;
    font-weight: 400;
}
.post-link a, .post-link a:hover{
	color: #e71f15;
	text-decoration: none;
	text-transform: uppercase;
}
.post-link-icon{
	font-size: 11px;
    padding-left: 5px;
}
.owl-nav{
	text-align: right !important;
    padding-right: 15px;
	margin-top:0px !important;
    color: grey;
    font-weight: lighter;
	position: relative;
    top: -5px;
}
.contact-page-container, .aboutus-layout, .page-layout{
	background-color: #e2e7ed;
}
.aboutus-label{
	font-size: 17px;
	letter-spacing: normal;
	color: #3a6084;
}
.aboutus-text{
	font-size: 14px;
    color: dimgrey;
	text-align: justify;
}
.breadcrumbs{
	letter-spacing: 0.06em;
}
#breadcrumbs span{
    font-size: 14px;
}
#breadcrumbs span a {
	color: #385f85;
    text-decoration: underline;
}
.page-seperator{
	color: #e71f15;
    padding-right: 4px;
    font-size: 11px !important;
}
.breadcrumb_last{
	color: #385f85;
}
.content-small {
    height: 82px;
    overflow:hidden;
}
.content-big {
    height: auto;
}
.read-more-image{
	margin-right: 1px;
    height: 11px;
}
.read-more-text{
	text-decoration: none;
    color: #4a4a4a;
    font-size: 14px;
    opacity: 0.5;
}
.read-more a, .read-more a:hover{
	text-decoration: none;
}
.page-content{
	color: #385f85;
    font-size: 14px;
}
.environment-page-text{
	padding-left: 20.5%;
	margin-bottom: 3rem !important;
}
.transpose-text{
	-webkit-transform: rotate(-90.0deg);
	padding-right: 0px !important;
	padding-left: 0px !important;
	color: #EE2427;
	text-transform: uppercase;
    font-size: 17px;
    white-space: nowrap;
	/*margin-top: 6%;*/
}
.margin-large{
	margin-top: 22%;
}
.margin-small{
	margin-top: 6%;
}
.margin-medium{
	margin-top: 9%;
}
.menu-page-container{
	height: 165px;
	padding: 15px;
	margin-bottom: 50px;
}
.menu-page-url:hover{
	text-decoration: none;
}
.menu-page-title{
	min-height: 50px;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 600;
	word-break: break-word;
}
.menu-page-description{
	font-size: 12px;
    line-height: 1.29;
    letter-spacing: 0.8px;
	height: 100px;
}
.menu-page-container:hover{
	color:#ffffff;
	background-color:#e71f15;
}
.menu-page-container a:hover{
	text-decoration: none;
}
.menu-page-circle{
	position: relative;
	top: -20px;
	left: 80%;
	background-color: white;
	height: 35px;
	width: 35px;
	border-radius: 150px;
	display: flex;
	justify-content: center;
	color: black;
	align-items: center;
}
.arrow-color{
	color: #d0021b;
}
.color-selected{
	color:#ffffff;
	background-color:#e71f15;
}
.color-regular{
	color:#02173a;
	background-color:#d9dee5;
}
.close-icon{
	font-size: 6px;
    color: #b1b1b1;
}
.video-layer, .close-button-layer{
	display: none;
}
.social-icon-layer{
	padding:0px 15px;
}
.social-icon-layer{
	padding-bottom: 30px;
}
.social-links a, .social-links a:hover {
	color: dimgrey;
	text-decoration: none;
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.map-layer{
	font-size: 13px;
}
.contact-form{
	border: 1px solid lightgrey;
	background-color: #e2e7ed;
	height: 50px;
}
.content-layer{
	font-size: 15px;
	color: #02173a;
	padding: 25px 15px;
}
.image-layer{
	padding: 25px 15px;
}
.page-header{
	background-color: #e2e7ed;
	width: 100vw;
    max-width: 1200px;
	padding: 30px 45px;
    margin: 0 auto;
	position: absolute;
    bottom: 0;
}
.position-left{
	left: calc((100vw - 1200px)/2);
}
.map-search{
	border-radius: .25rem;
}
.page-title{
	font-size: 25px;
	padding-left: 0px !important;
}
.page-excerpt{
	font-size: 20px;
	font-weight: 400;
	padding-left: 0px !important;
}
.page-button{
	font-size: .7em;
	letter-spacing: 0.02em;
	border: solid 1px lightgrey;
	width: 170px;
    line-height: 30px;
	cursor: pointer;
	color: #02173a;
}
.button-red{
	color: white;
	background-color: #e71f15;
}
.button-links a:hover{
	text-decoration: none;
}
form#loginform p label{
	display: block;
}
.login-username label, .login-password label{
	color: #4a4a4a;
	font-size: 14px;
}
form#loginform p{
	text-align: left;
}
#user_login, #user_pass{
	width: 320px;
    background-color: white;
    border: none;
    padding: 5px;
}
.login-submit{
	text-align: left;
}
.login-submit input{
	width: 172px;
  	height: 32px;
  	border: solid 1.2px #e62016;
	font-size: 12px;
	color: #e71f15;
}
.login-text-layout{
	padding-bottom: 50px;
}
.login-text p{
	font-size: 15px;
	color: #3a6084;
}
.login-remember label{
	color: #3a6084;
	font-size: 13px;
}
.login-remember label input{
	width: 15px;
    height: 15px;
	border-radius: 0px;
}
.contact-email, .contact-email:hover{
	color: #e62016;
	text-decoration: none;
}
.login-forget, .login-forget:hover{
	color: #e62016;
	font-size: 13px;
	text-decoration: none;
}
.mypage-layout{
    width: 215px;
    height: 157px;
}
.mypage-layout:hover, .practical-layout:hover{
	color:#ffffff;
	background-color:#e71f15;
}
.mypage-circle {
    position: relative;
    top: -12px;
    left: 74%;
    background-color: white;
    height: 35px;
    width: 35px;
    border-radius: 150px;
    display: flex;
    justify-content: center;
    color: black;
    align-items: center;
}
.mypage-title {
    font-size: 14px;
    letter-spacing: 0.8px;
    height: 150px;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	font-weight: 600;
	text-transform: uppercase;
}
.customer-name{
	color: #4a4a4a;
    font-size: 18px;
}
.customer-number{
	color: #4a4a4a;
    font-size: 15px;
}
.log-out a, .log-out a:hover{
	color: #4a4a4a;
    font-size: 13px;
	text-decoration: none;
}
.layout-height{
	min-height: 325px;
}
.page-background-color{
	background-color: #e2e7ed;
}
.basic-content{
	color: #02173a;
	font-size: 14px;
}
#practical-info-dataset-1{
	margin-bottom: 15px;
}
.practical-info-link, .practical-info-link:hover{
	color: #6c6c6c;
    font-size: 16px;
    font-weight: normal;
	text-decoration: none;
}
.practical-info-title{
	color: #231f20;
    text-transform: uppercase;
    font-size: 18px;
    font-weight: normal;
}
.vertical-title{
	writing-mode: vertical-rl;
    transform: rotate(180deg);
    text-align: right;
    white-space: nowrap;
    line-height: 2rem;
	color: #EE2427;
    font-size: 17px;
    text-transform: uppercase;
}
.forgot-password-title, .reset-password-title{
	margin-bottom: 10px;
    color: #4a4a4a;
    font-size: 18px;
    font-weight: 600;
}
.lostpassword-button, #resetpass-button{
    width: 172px;
    height: 32px;
    border: solid 1.2px #e62016;
    font-size: 12px;
    color: #e71f15;
}
#pass1, #pass2{
	background-color: white;
    border: none;
    padding: 5px;
}
.sporing-input{
	height: 40px;
    width: 100%;
    font-size: 1em;
    border: none;
    padding: 0.7em;
}
.find-shipping-layer{
	margin-top: 29px;
}
.track-shipping{
/*    background-color: #e2e7ed;
    border-color: #e71f15;
    color: #e71f15;
	width: 135px;
*/
	height: 38px;
	font-size: 1em;
	letter-spacing: 0.02em;
	white-space: nowrap;
}
.sending-number{
	color: #EE2427;
}
.btn{
	cursor: pointer;
}

a.click-here{
	color: #EE2427;
}
.sporing{
	min-height: 220px;
}
.sporing-result{
	color: #5F5F5F;
    font-size: 15px;
}

.btn-danger, .btn-outline-danger:hover{
	background-color: #EE2427 !important;
	border-color: #EE2427 !important;
}
.btn-outline-danger{
	border-color: #EE2427 !important;
}
.top-menu{
	display: flex;
  	justify-content: center;
  	align-items: center;
	white-space: nowrap;
}
.footer-text{
	text-align: left;
}
.search-postnumber{
	text-align: right;
}
.search-postnumber label{
	font-size: 15px;
}
#radiusSelect, #locationSelect{
	border: 1px solid white;
	height: 25px;
	width: 100%;
}
.delivery-signature{
	padding-left: 5px;
	color: #EE2427;
	cursor: pointer;
	text-decoration: underline;
	background: none;
    border: none;
}

/* complaint form */
.label{
	font-size: 16px;
	text-transform: uppercase;
	color: #333;
	transition: color 0.5s;
}
.form-title{
	text-transform: uppercase;
    color: #6c6c6c;
    font-weight: 600;
    font-size: 20px;
    margin-bottom: 20px;
}
.content-env{
	font-size: 15px;
    color: #02173a;
}

/* blog page */
.blog-title{
	padding: 5px 0px;
    font-size: 25px;
}
.blog-sub-title{
	color: #bebebe;
}
.related-category-post{
	display: inline-block;
    width: 35%;
    margin: 10px;
}
.blog-content{
	font-size: 15px;
    color: #02173a;
}
.related-posts-headline{
	font-size: 15px;
	font-weight: 400;
    text-transform: uppercase;
	margin-left: 10px;
}
.related-category-post a, .related-category-post a:hover {
    text-decoration: none;
    font-size: 0.7em;
    color: grey !important;
}
.related-category-post img {
    border-radius: 5px;
}
.link-button button, .link-button button:hover {
    border-radius: 47px;
    background-color: #e71f15;
    border: none;
    color: white;
    padding: 13px 31px;
    text-align: left;
    text-decoration: none;
    font-size: 19px;
    margin: 20px -16px;
    cursor: pointer;
    width: 100%;
    position: relative;
    z-index: 1;
}
.link-button-text {
    display: inline-block;
    vertical-align: middle;
    width: 65%;
}
.link-button-arrow {
    display: inline-block;
    vertical-align: middle;
    text-align: right;
    width: 33%;
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (max-width: 768px){
	.position-left{
		left: 0;
	}
	.top-menu{
		display: unset;
	}
	.post-container{
		display: unset !important;
		padding-bottom: 20px;
	}
	.post-category-layout{
		min-width: unset;
	}
	.biz-container{
		width: unset;
    	position: unset;
	}
	.lang-flag {
		max-height: 20px;
	}
}

/* Extra small devices (phones, 576px and down) */
@media only screen and (max-width: 576px) {
	.n2-ss-swipe-element{
		height: 400px !important;
	}
	.logo{
		text-align: center;
	}
	.top-menu{
		display: unset;
		margin-bottom: 10px;
	}
	.post-container{
		display: unset !important;
		padding-bottom: 20px;
	}
	.post-category-layout{
		min-width: unset;
	}
	.biz-container{
		width: unset;
    	position: unset;
	}
	.social-media-title{
		text-align: center;
	}
	.social-links{
		text-align: center;
    	white-space: nowrap;
	}
	.footer-links{
		text-align: center !important;
	}
	.footer-text{
		text-align: unset;
	}
	.sporing-label, .send-from-label{
		text-align: center;
	}
	.sendingsnumber, .search-sendingnummer, .shipping-layer{
		text-align: center;
	}
	.image-layer img{
		width: 100%;
		height: auto;
	}
	.video iframe{
		width: 100%;
		height: auto;
	}

	.track-shipping {
		/*background-color: #e2e7ed;
		border-color: #e71f15;
		color: #e71f15;
		*/
		width: 100%;
		height: 40px;
		font-size: 1em;
		letter-spacing: 0.02em;
		margin-bottom: 20px;
		white-space: nowrap;
	}

	.sendingsnumber-input, .postnumber-input{
		width: 70%;
	}
	.find-shipping, .find-post-number {
		margin-top: 10px;
		font-size: .9em;
		letter-spacing: 0.02em;
		width: 70%;
		height: 26px;
		border-radius: .25rem;
	}
	.search-postnumber{
		text-align: center;
	}
	.add-padding {
		padding-top: 10px;
	}
	.map-search{
		width: 100%;
		height: 40px;
		border-radius: .25rem;
	}
	.search-postnumber label{
		width: 100%;
		margin-bottom:0px !important;
	}
	#addressInput_storeSearch, #searchButton{
		width: 100%;
		height: 40px;
	}
	#radiusSelect, #locationSelect{
		width: 100%;
		border: 1px solid white;
		height: 40px;
	}
	.lang-flag {
		max-height: 20px;
	}
}

/* Mobile menu CSS */

.mobile-menu{
	margin-left: 0 !important;
	margin-right: 0 !important;
}

.mobile-menu .sub-item{
	display: none;
	z-index: 2;
	width: 100vw;
	border-bottom: 1px solid gray;
}

.mobile-menu .menu-item a{
	color: white !important;
	cursor: pointer;
    text-transform: uppercase;
}

.mobile-menu .menu-item{
	text-align: left;
    color: white;
    line-height: 30px;
}

.chosen-menu{
	text-decoration: underline;
	font-weight: 700;
	color: #EE2427;
}
.page-box{
	height: 200px;
}

.required-field{
	color: red;
    padding-left: 10px;
	font-size: 16px;
}
.footer-title, .footer-address, .footer-postal-address,
.footer-useful-links, .footer-phone{
	color: black;
}
.contact-box{
    padding: 50px 100px !important;
    border-radius: 5px;
    background-position: center;
    background-size: contain;
    background-repeat-y: no-repeat;
}

.contact-box {
    color: white !important;
    line-height: 12px;
}


.main-menu-mobile-sidebar{
    top: 0px;
    left: 0px;
    background-color: #d0021b;
    z-index: 1002;
    position: fixed !important;
    display: block;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    margin: 0px;
    width: 100vw !important;
    height: 100vh !important;
    padding-top: 10vh;
    overflow-y: scroll;
}

@media only screen and (max-width: 992px) {
	#main-menu{
		padding: 0;
	}
	.mypage-layout{
		width: 100%;
	}
	.page-box{
		height: 200px;
	}
	.transpose-text{
		-webkit-transform: unset;
		margin: 0 0 20px 20px;
	}
	.vertical-title{
		display: none;
	}
	.page-button{
		width: unset;
		margin: 10px 0;
	}
	.image-layer img{
		width: 100%;
		height: auto;
	}
    .service-image img{
        width: 100%;
        height: auto;

    }
    .breadcrumbs{
        display: none;
    }

    .contact-box{
        padding: 10px 20px !important;
        background-position: center;
        background-size: cover;
        background-repeat-y: no-repeat;
        border-radius: 0;
    }
    .contact-box {
        line-height: 18px;
    }
	.lang-flag {
		max-height: 20px;
	}
}
.lang-flag {
    max-height: 20px;
}
.post-block{
	height: 210px;
}

/* Large devices (laptops/desktops, 992px and up) */
/*@media only screen and (min-width: 992px) {
}*/

/* Extra large devices (large laptops and desktops, 1200px and up) */
/*@media only screen and (min-width: 1200px) {
}*/

.service-layer{
	font-size: 15px;
	color: #02173a;
	padding: 0px 15px 25px;
}
.label-sub{
	font-size: 14px;
    color: #333;
    transition: color 0.5s;
}
