/*********************************************************************************
**********************************************************************************
    Svenskalag Ppopup CSS
    - svenskalag.popup.html
**********************************************************************************
*********************************************************************************/

@font-face {
	font-family: "Inter";
	src: url("/fonts/Inter-Bold-slnt=0.ttf") format("truetype");
	font-weight: bold;
	font-style: normal;
}

@font-face {
	font-family: 'Inter';
	src: url("/fonts/Inter-Regular-slnt=0.ttf") format("truetype");
	font-weight: normal;
	font-style: normal;
}


/* Body */
.svlag-popup-body {
	margin: 0;
	padding: 0;
	min-width: 320px;
	min-height: 97vh;
	background: #f5f5f5;
	display: block !important;
	overflow-y: scroll;
}

/* Container */
.svlag-popup-container {
	position: relative;
	min-height: 100vh;
	transition: left 0.3s ease;
	left: 0;
}

/* Defaults */
.svlag-popup-body {
	font-family: "Roboto", sans-serif;
	font-style: normal;
	font-size: 14px;
	color: #444;
	-webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */
}

	.svlag-popup-body * {
		box-sizing: border-box;
	}

	.svlag-popup-body h1 {
		font-size: 1.3em;
		font-weight: 500;
		text-overflow: ellipsis;
		white-space: nowrap;
		overflow: visible;
	}

	.svlag-popup-body h2 {
		margin: 34px 15px 7px 15px;
		font-size: 18px;
		font-weight: 700;
		text-overflow: ellipsis;
		white-space: nowrap;
		overflow: visible;
		color: #555;
	}

		.svlag-popup-body h1 small,
		.svlag-popup-body h2 small {
			font-weight: normal;
			font-size: 1em;
			color: #777;
			text-transform: initial;
			display: inline;
			color: #555;
		}



	.svlag-popup-body figure {
		display: inline-block;
		margin: 0;
		padding: 0;
		text-align: center;
	}


/* Popup Top - including header and navigation */
.svlag-popup-top {
	position: fixed;
	top: 0;
	width: 100%;
	color: #fff;
	z-index: 100;
	box-shadow: 0 5px 10px rgb(0 0 0 / 12%);
}

/* Popup Header - including title and actions */
.svlag-popup-header {
	display: flex;
	width: 100%;
	background: #298ccd;
}

	.svlag-popup-header > div {
		flex: 1;
		display: flex;
		justify-content: center;
		flex-direction: column;
		align-items: center;
		vertical-align: middle;
		height: 60px;
	}

		.svlag-popup-header > div:first-child {
			justify-content: flex-start;
			flex-direction: row;
			text-align: left;
		}

		.svlag-popup-header > div:last-child {
			justify-content: flex-end;
			flex-direction: row;
			text-align: right;
		}

	.svlag-popup-header h1 {
		margin: 2px 0 0 0;
		line-height: 110%;
		font-size: 19px;
		text-overflow: ellipsis;
		overflow: hidden;
		white-space: nowrap;
		letter-spacing: -0.3px;
	}

	.svlag-popup-header p {
		margin: 2px 0 0 0;
		line-height: 110%;
		font-size: 13px;
		text-overflow: ellipsis;
		overflow: hidden;
		white-space: nowrap;
	}



/* Popup header buttons (close/save) */
.svlag-popup-header-btn,
.svlag-popup-header-btn:link,
.svlag-popup-header-btn:visited {
	padding: 0px 15px;
	color: #fff;
	line-height: 60px;
	height: 60px;
	font-family: inherit;
}

	.svlag-popup-header-btn:hover {
		color: #82c4ef;
		text-decoration: none;
	}

	.svlag-popup-header-btn.disabled {
		opacity: 0.4;
		cursor: default;
		color: #fff;
	}

/* Close */
.svlag-popup-close {
	float: left;
}

.svlag-popup-close {
	font-size: 0;
}

	.svlag-popup-close:after {
		content: '\f104';
		font-family: FontAwesome;
		font-size: 36px;
		font-weight: 300;
	}

/* Save */
.svlag-popup-save {
	float: right;
}

.svlag-popup-save {
	font-size: 17px;
	font-weight: 300;
	background: none;
	border: 0;
	cursor: pointer;
	outline: none;
}



/* Top: Navigation */
.svlag-popup-navigation {
	margin: 0;
	overflow: hidden;
	height: 42px;
	line-height: 42px;
	position: relative;
	background-color: #FFF;
	font-size: 13px;
}

	.svlag-popup-navigation:after {
		content: '';
		display: block;
		height: 100%;
		width: 30px;
		position: absolute;
		top: 0px;
		right: 0;
	}

	.svlag-popup-navigation ul {
		margin: 0;
		padding: 0;
		overflow: scroll;
		overflow-y: hidden;
		list-style: none;
		white-space: nowrap;
	}

	.svlag-popup-navigation li {
		margin: 0;
		padding: 0;
		display: inline-block;
		text-align: center;
	}

.two-tabs li {
	width: 50%;
}

.three-tabs li {
	width: 33%;
}

.svlag-popup-navigation li a {
	padding: 0 15px;
	display: inline-block;
	color: #444;
	min-width: 100%;
}

	.svlag-popup-navigation li a:hover {
		background: #f5f5f5;
	}

	.svlag-popup-navigation li a.active {
		box-shadow: inset 0 -2px 0 0 #298ccd;
		color: #298ccd;
	}

		.svlag-popup-navigation li a.active:hover {
			background: #fff;
		}

.svlag-popup-navigation li span {
	display: none;
}

.svlag-popup-navigation li img {
	vertical-align: middle;
	border: 1px solid #ccc
}




/* Content Wrapper */
.svlag-popup-content {
	padding: 0px;
	padding-top: 85px;
	overflow-x: hidden !important;
}
/* Content: Add extra top padding for navigation */
.svlag-popup-body.top-tabs .svlag-popup-content {
	padding-top: 131px;
}
/* tab-content: Hidden by default */
.svlag-popup-body.top-tabs .svlag-popup-tab-content {
	display: none;
}

/* Default panel */
.svlag-popup-panel {
	border-top: solid 1px #ddd;
	border-bottom: solid 1px #ddd;
	margin-bottom: 28px;
	padding: 22px 15px 25px 15px;
	background: #fff;
}

/* Default padding */
.svlag-popup-padding {
	padding: 0 15px 0 15px;
}

/* Panel top border-colors */
.svlag-popup-panel.svlag-mint {
	border-top: 10px solid #c2f3ca;
}

.svlag-popup-panel.svlag-lemon {
	border-top: 10px solid #f2eebb;
}

.svlag-popup-panel.svlag-sky {
	border-top: 10px solid #d7e8f8;
}

.svlag-popup-panel.svlag-danger {
	border-top: 10px solid #ffebeb;
}



/*************************
Status message
 .info | .success | .warning | .error  
***************************/
.svlag-popup-alert {
	margin: 0px;
	padding: 10px 15px;
	border-top: solid 1px rgba(0,0,0,0.05);
	background: #fff;
	color: #fff;
	position: relative;
	font-size: 13px !important;
	line-height: 130%;
}

	.svlag-popup-alert i {
		font-size: 16px;
	}

	.svlag-popup-alert span {
		padding-left: 18px;
		display: inline-block;
	}

	.svlag-popup-alert a:link {
		color: #fff;
	}

	.svlag-popup-alert.info {
		background: #cbe3f2;
		color: #298ccd;
	}

		.svlag-popup-alert.info a, .svlag-popup-alert.info a:link {
			color: #298ccd;
		}

	.svlag-popup-alert.success {
		background: #3ba970;
	}

	.svlag-popup-alert.warning {
		background: #f2b736;
		/*        color: #6f5f0b;*/
	}

	.svlag-popup-alert.error {
		background: #eb445a;
	}
	/* Icon */
	.svlag-popup-alert::before {
		display: block;
		line-height: 1.2em;
		width: 20px;
		position: absolute;
		font-family: fontawesome;
		font-size: 16px;
		vertical-align: middle;
		margin-top: -2px;
	}

	.svlag-popup-alert.info::before {
		content: '\f05a ';
	}



	.svlag-popup-alert.success::before {
		content: '\f058 ';
	}

	.svlag-popup-alert.warning::before {
		content: '\f071 ';
	}

	.svlag-popup-alert.error::before {
		content: '\f05e ';
	}

	.svlag-popup-alert.error.warning-icon::before {
		content: '\f071 ';
	}




	/*.svlag-popup-alert.info.svff {
        padding-top:4px;
        padding-bottom:4px;
    }*/

	.svlag-popup-alert.info.svff::before {
		content: none;
	}

	.svlag-popup-alert.info.svff span {
		padding-left: 3px;
		vertical-align: middle;
		padding-top: 1px;
	}

	.svlag-popup-alert.info.svff > img {
		height: 36px;
		vertical-align: middle;
	}


/*************************
Branding
***************************/
.svlag-pop-branding {
	padding: 25px 0px 25px 0px;
	text-align: center;
}

	.svlag-pop-branding img {
		width: 140px;
		margin: 0 auto;
	}



/*************************
Utility classes
***************************/
/* Grid system */
.grid {
}

.grid-100 {
	width: 100% !important;
}

.grid-80 {
	width: 80% !important;
}

.grid-75 {
	width: 75% !important;
}

.grid-70 {
	width: 70% !important;
}

.grid-60 {
	width: 60% !important;
}

.grid-50 {
	width: 50% !important;
}

.grid-40 {
	width: 40% !important;
}

.grid-30 {
	width: 30% !important;
}

.grid-25 {
	width: 25% !important;
}

.grid-20 {
	width: 20% !important;
}

.grid-10 {
	width: 10% !important;
}


/* Display classes */
.hide {
	display: none !important
}

.left {
	float: left !important
}

.right {
	float: right !important
}

.inline-block {
	display: inline-block !important
}

.desktop-only {
	display: none !important;
}

.list-style-none {
	list-style: none;
	padding: 0;
	margin: 0;
}

.clickable, .pointer {
	cursor: pointer;
}

/* Clearfix: clear floats */
.clearfix:before, .clearfix:after {
	display: table;
	content: " ";
}

.clearfix:after {
	clear: both;
}

hr {
	border-top: 1px solid #ddd;
	margin: 0px 0px 0px 0px;
	height: 0;
	border: 0;
}


/* Text */
.text-small {
	font-size: 0.85em;
}

.text-bold {
	font-weight: bold;
}

.text-muted {
	color: #999;
}

.text-center {
	text-align: center;
}

.text-left {
	text-align: left;
}

.text-right {
	text-align: right;
}


/* Links */
a:link, a:visited {
	text-decoration: none;
	color: #247bb4;
}

a:hover, a:active {
	color: #3791cc;
}


/* Rotate */
.fa-rotate-180 {
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	transform: rotate(180deg);
}

/* No Select */
.noselect {
	-webkit-touch-callout: none; /* iOS Safari */
	-webkit-user-select: none; /* Safari */
	-khtml-user-select: none; /* Konqueror HTML */
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* Internet Explorer/Edge */
	user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */
}


/*************************
Dialog 
***************************/
.svlag-pop-dialog {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 100;
	overflow: auto;
}

.svlag-pop-dialog-overlay {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.7);
	z-index: -1;
	cursor: pointer;
}


.svlag-pop-dialog-content {
	width: 90%;
	max-width: 500px;
	background: #fff;
	margin: 5% auto;
	z-index: 120;
	box-shadow: 0 10px 20px 2px rgba(0,0,0,0.15);
	border-radius: 3px;
	padding: 20px 15px;
	overflow: auto;
}

	.svlag-pop-dialog-content h2 {
		margin: 0px;
		white-space: normal;
	}

	.svlag-pop-dialog-content p {
		line-height: 1.4em;
	}

.svlag-pop-dialog-actions {
	text-align: right;
	margin-top: 10px;
	width: 100%;
}

	.svlag-pop-dialog-actions p,
	.svlag-pop-dialog-actions form {
		margin: 0;
	}

	.svlag-pop-dialog-actions a {
		margin-left: 2px;
	}





/* Lists */
.svlag-popup-content ul,
.svlag-popup-content ol,
.svlag-pop-dialog ul,
.svlag-pop-dialog ol {
	line-height: 1.4em;
}

.svlag-popup-content li, .svlag-pop-dialog li {
	margin-bottom: 5px;
}

	.svlag-popup-content li:last-child, .svlag-pop-dialog li:last-child {
		margin-bottom: 0;
	}


.list-full-width {
	margin: 1em -15px;
	padding: 0;
	list-style: none;
	border-top: 1px solid #eee;
}

	.list-full-width li {
		padding: 10px 15px 10px 35px;
		border-bottom: 1px solid #eee;
		position: relative;
	}

		.list-full-width li:before {
			content: '\f05a';
			display: inline-block;
			font-family: FontAwesome;
			position: absolute;
			left: 15px;
			top: 11px;
		}

		.list-full-width li.icon-warning:before {
			content: '\f071';
		}

		.list-full-width li.icon-check:before {
			content: '\f00c';
		}

		.list-full-width li.icon-plus-circle:before {
			content: '\f055';
		}

		.list-full-width li.icon-minus-circle:before {
			content: '\f056';
		}




/*********************************
Small Phones (iPhone < 5)
**********************************/
@media (max-width: 340px) {
	.xs-hidden {
		display: none !important;
	}

	/* Grid system */
	.grid {
	}

	.grid-100,
	.grid-80,
	.grid-75,
	.grid-70,
	.grid-60,
	.grid-50,
	.grid-40,
	.grid-30,
	.grid-25,
	.grid-20,
	.grid-10 {
		width: 100% !important;
	}
}



/*********************************
All modern mobile devices.
https://bjango.com/articles/min-device-pixel-ratio/
**********************************/
@media (-webkit-min-device-pixel-ratio: 1.2) {
	.svlag-popup-body {
		font-size: 16px;
	}

	.svlag-popup-header .svlag-button {
		padding: 0px 15px 0px 10px; /* Mindre vänstermarginal i mobilversion */
	}

	.svlag-popup-body h1 {
		font-size: 1.2em;
	}
}


/*********************************
Popups bigger than 600px
**********************************/
@media (min-width: 600px) {

	.desktop-only {
		display: inherit !important;
	}

	.mobile-only {
		display: none !important;
	}
}