@charset "utf-8";
/* CSS Document */

#sub_menu ul.l-1{
	border-radius:5px;
	margin:0 20px;
	list-style:none;
	padding:10px 0;
}

#sub_menu ul{
	list-style:none;
	padding:0;
	margin:0;
}

#sub_menu ul.l-1 li{
	margin:0px;
}

#sub_menu a,
#sub_menu span{
	font-size: 14px;
	font-family: "roboto";
	font-weight: 500;
}

#sub_menu ul.l-1 li a,
#sub_menu ul.l-1 li span{
	display:block;
	padding:5px 10px 5px 20px;
	color: #fff;
	border-radius: 3px;
}

#sub_menu ul.l-1 > li > a,
#sub_menu ul.l-1 > li > span.a-like{
	line-height:1em;
	color: #fff;
}

#sub_menu ul.l-1 li a:hover,
#sub_menu ul.l-1 li span:hover{
	background-color: #175c81;
}


#sub_menu ul.l-1 li.l-1 > a,
#sub_menu ul.l-1 li.l-1 > span.a-like{
	color:#fff;
}

#sub_menu ul.l-1 li.l-2 a,
#sub_menu ul.l-1 li.l-2 span{
	color:#fff;
	padding-left:30px;
	background-position:18px -95px;
}

#sub_menu ul.l-1 li.l-3 > a,
#sub_menu ul.l-1 li.l-3 > span.a-like{
	padding-left:40px;
	font-weight:normal;
	background-position:28px -95px;
}

#sub_menu ul.l-1 li.l-4 > a,
#sub_menu ul.l-1 li.l-4 > span.a-like{
	padding-left:50px;
	font-weight:normal;
	background-position:38px -95px;
}

.breadcrumb{
	background:#1A3145;
	padding:10px 20px;
}

.breadcrumb ul{
	list-style:none;
	padding:0;
	margin:0;
}

.breadcrumb ul li{
	margin:0;
	display:inline;
}

.breadcrumb ul li a{
	color:#fff;
	font-size:14px;
	padding:0 0 0 40px;
	background:url('../../webroot/_design/ui.png') 17px -95px no-repeat;
	background-size:168px 420px;
	-ms-behavior: url("/backgroundsize.min.htc");
}

.breadcrumb ul li#start a{
	padding:0;
	background:none;
}

#sub_menu ul.l-1 li.l-1.parent > a,
#sub_menu ul.l-1 li.l-1.parent > span.a-like{
	/*background-image:url('../../webroot/_design/ui.png');*/
	background-position:10px -95px;
	background-repeat:no-repeat;
	background-size:168px 420px;
	-ms-behavior: url("/backgroundsize.min.htc");
}

#sub_menu ul.l-1 li.l-2.parent > a,
#sub_menu ul.l-1 li.l-2.parent > span.a-like{
	/*background-image:url('../../webroot/_design/ui.png');*/
	background-position:20px -95px;
	background-repeat:no-repeat;
	background-size:168px 420px;
	-ms-behavior: url("/backgroundsize.min.htc");
}

#sub_menu ul.l-1 li.l-3.parent > a,
#sub_menu ul.l-1 li.l-3.parent > span.a-like{
	/*background-image:url('../../webroot/_design/ui.png');*/
	background-position:30px -95px;
	background-repeat:no-repeat;
	background-size:168px 420px;
	-ms-behavior: url("/backgroundsize.min.htc");
}

#sub_menu ul.l-1 li.parent.selected > a,
#sub_menu ul.l-1 li.parent.selected > span.a-like{
	background:url('../../webroot/_design/ui.png') 8px -117px no-repeat #39a5da;
	color:#fff;
	background-size:168px 420px;
	-ms-behavior: url("/backgroundsize.min.htc");
}

#sub_menu ul li .selected > a,
#sub_menu ul li .selected > a:hover,
#sub_menu .selected > a,
#sub_menu .selected > a:hover,
#sub_menu ul li .selected > span,
#sub_menu ul li .selected > span:hover,
#sub_menu .selected > span,
#sub_menu .selected > span:hover{
	color:#fff !important;
	background-color:#39a5da !important;
}

#sub_menu ul.l-1 ul.l-2,
#sub_menu ul.l-1 ul.l-3,
#sub_menu ul.l-1 ul.l-4{
	visibility:hidden;
	opacity:0;
	transition:none;
}
#sub_menu ul.l-1 ul.l-2 a,
#sub_menu ul.l-1 ul.l-2 span{
	line-height:0em;
	padding-top:0;
	padding-bottom:0;
	transition:padding, line-height .1s;
	-webkit-transition:padding, line-height .1s;
}
#sub_menu ul.l-1 li.selected > ul.l-2,
#sub_menu ul.l-1 li.active > ul.l-2,
#sub_menu ul.l-1 li.selected > ul.l-3,
#sub_menu ul.l-1 li.active > ul.l-3,
#sub_menu ul.l-1 li.selected > ul.l-4,
#sub_menu ul.l-1 li.active > ul.l-4{
	visibility:visible;
	opacity:1;
	transition:opacity .1s;
	-webkit-transition:opacity .1s;
}

#sub_menu ul.l-1 .active > ul > li > a,
#sub_menu ul.l-1 .active > ul > li > span.a-like{
	line-height:1em;
	padding-top:5px;
	padding-bottom:5px;
}


#sub_menu .l-1.active > a,
#sub_menu .l-1.active > span.a-like{
	background-position:8px -117px !important;
}

#sub_menu .l-2.active > a,
#sub_menu .l-2.active > span.a-like{
	background-position:18px -117px !important;
}

#sub_menu .l-3.active > a,
#sub_menu .l-3.active > span.a-like{
	background-position:28px -117px !important;
}

nav#access a{
	color: #3b3b3b;
	font-family: "roboto";
	font-weight: 500;
}

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (min-width: 767px) {
	
	#branding .dropdownmenu li.l-1.p-66 > span.icon{
		background-position:-56px -234px;
		width:15px;
		height:11px;
		top:20px;
		right:24px;
	}

	.dropdownmenu .p-66 > a{
		text-indent:-10px;
	}

	/*.dropdownmenu .p-66:hover a{
		background-color: #1A3145 !important;
		color: #FFFFFF !important;
		background-image:inherit !important;
	}*/
	/*
	#branding .dropdownmenu:hover .selected a::after{
	    border-color: -moz-use-text-color transparent #FFFFFF;
		border-style: none solid solid;
		border-width: 0 5px 5px;
		bottom: 0;
		content: "";
		left: 50%;
		margin: 0 0 0 -3px;
		position: absolute;
		display:block !important;
	}
	*/
	#branding .dropdownmenu{
		position:absolute;
		right:0;
		bottom:0;
		z-index:10;
	}
	
	.dropdownmenu ul{
		margin:0;
		padding:0;
		list-style:none;
	}
	
	#branding .dropdownmenu li{
		list-style:none;
		margin:0;
	}
	
	#branding .dropdownmenu li.l-1{
		float:left;
		padding:0 0 0 4px;
		margin:0;
		position:relative;
	}
	
	#branding .dropdownmenu li.l-1 > a,
	#branding .dropdownmenu li.l-1 > span.a-like{
		display:block;
		background-color:#ddd;
		padding:0px 5px 0 0;
		text-align:center;
		font-weight: 500;
		line-height:50px;
		text-transform:uppercase;
		text-decoration:none;
		color:#3b3b3b;
		font-family: "roboto";
		border-radius:5px 5px 0 0;
		font-size:17px; 
	}
	
	#branding .dropdownmenu .p-73 > a,
	#branding .dropdownmenu .p-73 > span.a-like{
		width:105px;
	}
	
	#branding .dropdownmenu .p-112 > a,
	#branding .dropdownmenu .p-112 > span.a-like{
		width:110px;
	}
	
	#branding .dropdownmenu .p-122 > a,
	#branding .dropdownmenu .p-122 > span.a-like{
		width:265px;
	}
	
	#branding .dropdownmenu .p-66 > a,
	#branding .dropdownmenu .p-66 > span.a-like{
		width:128px;
	}
	
	#branding .dropdownmenu li.l-1 > span.icon{
		background:url('../../webroot/_design/ui.png') 0 -58px no-repeat;
		background-size:168px 420px;
		height:9px;
		width:8px;
		display:block;
		position:absolute;
		top:22px;
		right:25px;
		pointer-events:none;
	}
	
	html.translated-ltr #branding .dropdownmenu li.l-1 > span.icon{
		display:none;
	}

	#branding .dropdownmenu ul.l-2{
		display:none;
		position:absolute;
		background:#fff;
		padding:5px;
		z-index:10;
		left:4px;
		min-width:280px;
	}
	
	#branding .dropdownmenu .p-66 ul.l-2{
		left:auto;
		right:0;
	}
	
	#footer .menubar{
		margin:0 0 20px;
		padding:0;
	}
	
	#footer .menubar li{
		list-style:none;
		display:inline;
	}
	
	#footer .menubar li a,
	#footer .menubar li span.a-like{
		padding:0 5px;
	}
	
	#menu_overlay{
		position:fixed;
		height:100%;
		width:100%;
		background:rgba(0,0,0,.7);
		z-index:9;
		left:0;
		top:0;
		visibility:hidden;
		opacity:0;

		-webkit-transition: all 0.5s;
		-moz-transition: all 0.5s;
		-ms-transition: all 0.5s;
		-o-transition: all 0.5s;
		transition: all 0.5s;
	}	
	#menu_overlay.active{
		visibility: visible;
		opacity: 1;
	}
	#branding li.l-2{
		background:#eee;
		margin-bottom:5px;
		padding-bottom:10px;
	}
	
	#branding li.l-2:last-child{
		margin-bottom:0px;
	}
	
	#branding li.l-2 > a,
	#branding li.l-2 > span.a-like{
		background:#006eac;
		color:#fff;
		/*text-shadow:#1A3145 0 -1px 0;-*/
		font-family: "roboto";
		display:block;
		line-height:1em;
		font-size:16px;
		font-weight:500;
		padding:7px 10px;
	}
	
	#branding li.l-3 a:hover,
	#branding li.l-3 span.a-like:hover{
		background-color:#3b3b3b;
		color: #fff;
	}
	
	#branding li.l-3.parent{
		margin:10px 0;
		padding-bottom:10px; 
		border-bottom:1px solid #ddd;
	}

	#branding li.l-3.parent:last-child{
		padding-bottom:0;
		border-bottom:0;
		margin-bottom:0;
	}

	#branding li.l-3 > a,
	#branding li.l-3 > span.a-like{
		display:block;
		font-size:12px;
		line-height:1em;
		padding:5px 10px;
		font-family: "roboto";
		font-weight: 400;
	}
	
	#branding li.l-3:first-child > a,
	#branding li.l-3:first-child > span.a-like{
		margin-top:5px;
	}
	
	#branding li.l-4 > a,
	#branding li.l-4 > span.a-like{
		display:block;
		font-size:12px;
		line-height:1em;
		padding:5px 10px;
	}
	
	#branding li.l-5 > a,
	#branding li.l-5 > span.a-like{
		display:block;
		font-size:12px;
		line-height:1em; 
		padding:3px 10px 3px 20px;
	}
	
	#branding li.l-1:hover ul.l-2{
		display:block;
	}

	span.a-like{
		cursor:default;
	}

	li.l-3 span.a-like{
		color:#3b3b3b;
		display:block;
		font-size:17px !important; 
		line-height:1em;
		font-weight:bold;
		padding:6px 10px 2px;
	}


	li.l-3 span.a-like:hover{
		background-color:transparent !important;
		box-shadow:none !important;
		color: #3b3b3b !important;
	}

	li.l-4 > span.a-like:hover{
		color:#305C81 !important;
	}

	#branding .dropdownmenu li.l-2 > span.a-like:hover{
		color:#fff !important;
	}

	/* RESA (63) DROPDOWN */
	#branding .p-73 ul.l-2{
		display:none;
	}
	
	#branding .p-73{
		padding-left:80px !important;
	}
	
	#branding .dropdownmenu li.l-1.active > a,
	#branding .dropdownmenu li.l-1.active > span.a-like,
	#branding .dropdownmenu li.l-1.selected > a,
	#branding .dropdownmenu li.l-1.selected > span.a-like{
		background-color:#1A3145;
		background-image:none;
		color:#fff;
		position:relative;
	}
	/*
	#branding .dropdownmenu li.l-1.selected > a::after,
	#branding .dropdownmenu li.l-1.selected > span.a-like::after,
	#branding .dropdownmenu li.l-1.active > a::after,
	#branding .dropdownmenu li.l-1.active > span.a-like::after{
		content:"";
		position:absolute;
		left:50%;
		margin:0 0 0  -3px;
		bottom:0;
		border-top:0;
		border-left:transparent 5px solid;
		border-right:transparent 5px solid;
		border-bottom:#fff 5px solid;
	}*/

	#branding .dropdownmenu li.l-1:hover > a,
	#branding .dropdownmenu li.l-1:hover > span.a-like,
	#branding .dropdownmenu:hover li.l-1.active:hover > a,
	#branding .dropdownmenu:hover li.l-1.active:hover > span.a-like,
	#branding .dropdownmenu li.l-1:hover > a,
	#branding .dropdownmenu li.l-1:hover > span.a-like{
		background:#012b44;
		color:#fff;
	}
	
	#branding .dropdownmenu:hover a::after, 
	#branding .dropdownmenu:hover span.a-like::after{
		display:none;
	}


	#branding .dropdownmenu:hover li.l-1.active > a,
	#branding .dropdownmenu:hover li.l-1.active > span.a-like,
	#branding .dropdownmenu:hover li.l-1.selected > a,
	#branding .dropdownmenu:hover li.l-1.selected > span.a-like{
		background-color: #DDDDDD;
		color:#305C81;
	}
	
	#branding .p-73 ul.l-2{
		left:-240px;
		width:955px;
		height:305px; 
		padding:5px 0 0 5px;
	}
	
	#branding .p-73 ul.l-2 li.p-100{
		width:245px;
	}
	
	#branding .p-73 li.l-2{
		width:230px; 
		float:left;
		margin:0 5px 5px 0;
	}
	
	#branding li.p-111,
	#branding li.p-109{
		padding:0 0 0 50px;
		position:relative;
	}
	
	#branding .p-73 .l-3 > span.icon{
		background-image:url('../../webroot/_design/ui.png');
		background-size:168px 420px;
	-ms-behavior: url("/backgroundsize.min.htc");
		position:absolute;
		width:30px;
		height:28px;
		left:17px;
		top:10px;
	}
	
	/* SÖK RESA */
	#branding li.p-111 span.icon{
		background-position:0px -142px;
	}
	
	/* BILJETTER & PRISER */
	#branding li.p-109 span.icon{
		background-position:0px -170px;
	}

	/* RESMÅL & DAGSTURER*/
	#branding li.p-141{position:relative;}
	#branding li.p-141 > span.icon{
		background-image:url('../../webroot/_design/ui.png');
		background-size:168px 420px;
		-ms-behavior: url("/backgroundsize.min.htc");
	background-position:1px -199px;
		position:absolute;
		width:123px;
		height:28px;
		left:55px;
		bottom:21px;
		pointer-events: none;
	}

	/* TRAFIKUPPLYSN */
	
	#trafikupplysn{
		float:left;
		font-size:22px;
		position:relative;
		font-weight:bold;
	}

	#trafikupplysn span.icon{
		background:url('../../webroot/_design/ui.png');
		background-size:168px 420px;
		-ms-behavior: url("/backgroundsize.min.htc");
		background-position:-208px -148px;
 		width:25px;
		position:absolute;
		height:46px;
		left:20px;
		top:13px;
	}

	#trafikupplysn a{
		display:block;
		padding:20px 0px 20px 60px;
	}

	#trafikupplysn a span{
		font-size:9px;
		display:block;
		font-weight:normal;
	}
	
	.wrapper-li-1{
		width:485px !important;
		float:left;
	}
	
	.wrapper-li-2{
		width:235px !important;
		float:left;
	}
	
	#branding .wrapper-li-2 li.l-2 > a,
	#branding .wrapper-li-2 li.l-2 > span.a-like{
		background:#ffca00;
		color:#002c46;
	}
	
	#branding .wrapper-li-2 li.l-2 > span.a-like:hover{
		color:#002C46 !important;
	}

	.wrapper-li-2 li.l-2 > span.a-like:hover{ 
		color:#a75500 !important;
	}
	
	#branding li.l-2 > .js-link-text,
	#branding .wrapper-li-2 li.l-2 > .js-link-text{
		font-size:14px;
		font-weight:normal;
		text-align:center;
		font-style:italic;
		font-family:"roboto";
		font-weight: 100;
		color:#3b3b3b;
		background:none;
		text-shadow:none;
		display:block;
		padding:22px 20px 14px;
		line-height:1.4em;
	}

	#branding li.l-2.p-79 > .js-link-text{
		height:64px;
	}

	#branding li.l-2.p-141 > .js-link-text{
		height:130px;
	}

	#branding li.l-2 > .js-link-text:hover{
		color:#fff;
	}

	.no-child:hover{
		background-color:#3b3b3b !important;
	}

	.no-child:hover .js-link-text{
		color: #fff !important; 
	}

	#branding li.p-141:hover > span.icon{
		background-image: url('fix-picta.png');
		background-position: 0 0;
		background-size: 119px auto; 
		-ms-behavior: url("/backgroundsize.min.htc");
	background-repeat: no-repeat;
	}

	/* /RESA (63) DROPDOWN */

}

@media only screen and (min-width: 768px) and (max-width: 959px) {
	
	#branding .dropdownmenu li.l-1.p-66 > span.icon{
		background-position:-56px -234px;
		width:15px;
		height:11px;
		top:20px;
		right:16px;
	}

	.dropdownmenu .p-66 a{
		text-indent:-15px;
	}


	
	
	
	#branding .dropdownmenu li.l-1 > span.icon{
		right:16px;
	}
	
	#branding .dropdownmenu li.l-1 > a,
	#branding .dropdownmenu li.l-1 > span.a-like{
		font-size:14px;
	}

	#branding .dropdownmenu .l-1.p-73 > a,
	#branding .dropdownmenu .l-1.p-73 > span.a-like{
		width:79px;
	}
	
	#branding .dropdownmenu .l-1.p-112 > a,
	#branding .dropdownmenu .l-1.p-112 > span.a-like{
		width:84px;
	}
	
	#branding .dropdownmenu .l-1.p-122 > a,
	#branding .dropdownmenu .l-1.p-122 > span.a-like{
		width:218px;
	}
	
	#branding .dropdownmenu .l-1.p-66 > a,
	#branding .dropdownmenu .l-1.p-66 > span.a-like{
		width:99px;
	}

	.wrapper-li-1{
		width:383px !important;
		float:left;
	}
	
	.wrapper-li-2{
		width:190px !important;
		float:left;
	}
	
	#branding .p-73 ul.l-2 li.p-100{
		width:188px;
	}
	
	#branding .p-73 li.l-2{
		width:185px;
	}	

	#branding li.p-141 > span.icon{
		left: 30px;
	}

	#branding .p-73 ul.l-2 {
		left: -176px;
		width: 763px;
	}

	#trafikupplysn{
			font-size:18px;
	}

	#trafikupplysn a span {
		font-size: 8px;
	}

}

@media only screen and (max-width: 767px) {

	#sub_menu{
		display:none;
	}

	#branding .dropdownmenu ul{
		list-style:none;
		margin:0;
		padding:0;
	}

	#branding .dropdownmenu ul.menu.l-1{
		display:none;
		position:absolute;
		padding:10px !important; 
		right:-20px;
		margin:0;
		padding:0;
		top:66px;
		background:#305C81;
		z-index:10;
		width:300px !important;
		box-shadow:rgba(0,0,0,.7) 0 20px 20px;
	}
	
	#branding .dropdownmenu li.l-1{
		display:block;
		width:auto;
		text-align:left;
		padding:0;
		margin:0;
		float:none;
	}

	#branding .dropdownmenu li.l-1 > a,
	#branding .dropdownmenu li.l-1 > span.a-like{
		font-size:20px;
	}
	
	#branding .dropdownmenu li.l-2 > a,
	#branding .dropdownmenu li.l-2 > span.a-like{
		font-size:16px;
	}

	#branding .dropdownmenu li.l-3 > a,
	#branding .dropdownmenu li.l-3 > span.a-like{
		font-size:16px;
		color:#bfd5e8 !important;
	}

	#branding .dropdownmenu li.l-4 > a,
	#branding .dropdownmenu li.l-4 > span.a-like{
		font-size:13px;
		color:#bfd5e8 !important;
	}


	#branding .dropdownmenu li.l-1 a,
	#branding .dropdownmenu li.l-1 span.a-like{
		color:#fff;
		background-color:transparent;
		display:block;
		padding:20px 20px;
		font-weight:bold;
		margin:0;
		border-bottom:1px #436786 solid !important;
	}
	
	#branding .dropdownmenu li.l-1:last-child a,
	#branding .dropdownmenu li.l-1:last-child span.a-like{
		border-bottom:none !important;
	}
	
	#branding .dropdownmenu li.l-1:hover ul.l-2,
	#branding .dropdownmenu li.l-1 ul.l-2{
		-moz-transition:none;
		margin:0;
		padding:0;
	}
	
	#branding .dropdownmenu li.l-1 ul.l-2{
		display:block;
		visibility:visible;
		position:relative;
		top:auto;
		right:auto;
		border-radius:0;
		
		-moz-transition:none;
	}
	
	#branding .dropdownmenu li.l-2 > a,
	#branding .dropdownmenu li.l-2 > span.a-like,
	#branding .dropdownmenu li.l-1:hover li.l-2 > a,
	#branding .dropdownmenu li.l-1:hover li.l-2 > span.a-like
	{
		padding-left:30px !important;
	}

	#branding .dropdownmenu li.l-3 > a,
	#branding .dropdownmenu li.l-3 > span.a-like,
	#branding .dropdownmenu li.l-1:hover li.l-3 > a,
	#branding .dropdownmenu li.l-1:hover li.l-3 > span.a-like
	{
		padding-left:40px !important;
	}

	#branding .dropdownmenu li.l-4 > a,
	#branding .dropdownmenu li.l-4 > span.a-like,
	#branding .dropdownmenu li.l-1:hover li.l-4 > a,
	#branding .dropdownmenu li.l-1:hover li.l-4 > span.a-like
	{
		padding-left:50px !important;
	}

	
	#branding .dropdownmenu li.l-1 ul.l-3{
		display:block;
		visibility:visible;
		position:relative;
		top:auto;
		right:auto;
		border-radius:0;
		
		-moz-transition:none;
	}
	
	#branding .dropdownmenu li.l-1:hover ul.l-2{
		margin:0;
	}
	
	#branding .dropdownmenu li.l-1 ul.l-2,
	#branding .dropdownmenu li.l-1 ul.l-3,
	#branding .dropdownmenu li.l-1 ul.l-4{
		display:none;
	}
	
	#branding .dropdownmenu li.l-1.active > ul.l-2,
	#branding .dropdownmenu li.l-2.active > ul.l-3,
	#branding .dropdownmenu li.l-3.active > ul.l-4{
		display:block;
	}
	
	#branding .dropdownmenu{
		background: none repeat scroll 0 0 #305C81;
		border-radius: 5px;
		top: 50%; 
		color: #FFFFFF;
		height: 45px;
		right: 10px;
		line-height: 50px;
		margin: -22px 0 0 0px;
		position: absolute;
		text-align: center;
		width: 45px;
		z-index:10;
	}
	
	#branding .dropdownmenu #button{
		background: none repeat scroll 0 0 #305C81;
		border-radius: 3px;
		top: 50%;
		color: #FFFFFF;
		height: 45px;
		right: 0px;
		line-height: 50px;
		margin: -22px 0 0 0px;
		position: absolute;
		text-align: center;
		width: 45px;
		z-index:10;
	}
		
	#branding .dropdownmenu #button::after{
		content:"";
		display:block;
		height:3px;
		border-top:9px double #8dacc5;
		border-bottom:3px solid #8dacc5;
		width:20px;
		position:absolute;
		left:50%;
		top:50%;
		margin:-7px -10px;
	}
	
	#branding .dropdownmenu li.l-1 ul.l-2 a,
	#branding .dropdownmenu li.l-1 ul.l-2 span.a-like{
		padding:10px 20px;
		
		-moz-transition:none;
	}
	
	.a-like{
		display:none;
	}

}

