/*  
Theme Name: UT Transport i Norr
Theme URI: http://utt.se
Description: Theme for UT Transport i Norr
Author: Carl Papworth
Author URI: http://carlpapworth.com
Version: 1
*/

/*colors
	UTlight:	#53BFEB;
	UTdark:		#0074BC;
	UThl:		#95d5ef;
	UTdarker:	#004C7C;		
	MisoGray:	#3E3E3F;
*/
	
/*fonts*/
@font-face {font-family: 'Miso-Chunky';src: url('fonts/27A6F3_1_0.eot');src: url('fonts/27A6F3_1_0.eot?#iefix') format('embedded-opentype'),url('fonts/27A6F3_1_0.woff') format('woff'),url('fonts/27A6F3_1_0.ttf') format('truetype');}
@font-face {font-family: 'Miso-Bold';src: url('fonts/27A6F3_2_0.eot');src: url('fonts/27A6F3_2_0.eot?#iefix') format('embedded-opentype'),url('fonts/27A6F3_2_0.woff') format('woff'),url('fonts/27A6F3_2_0.ttf') format('truetype');}
@font-face { font-family: Frutiger; src: url('FrutigerRoman.otf');}
@font-face { font-family: Frutiger; font-weight: bold; font-style: normal; src: url('fonts/FrutigerBoldCn.otf');}
@font-face { font-family: Frutiger; font-wieght: normal; font-style: italic; src: url('fonts/FrutigerLightItalic.otf');}
@font-face { font-family: Frutiger; font-wieght: light; font-style: normal; src: url('fonts/FrutigerLTStd-Light.otf');}

html {}
* { 
	margin: 0;
	padding: 0;
	transition: all .2s linear;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -o-transition: all .2s linear;	
}

body { font: 16px/1.4 Frutiger, verdana, serif; font-weight: 400; color: #2D2A2B; background: url(images/asfaltBG.png); margin-bottom: -10px;
}

article, aside, figure, footer, header, nav, section { display: block; }

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.clearfix {
	display: inline-block;
}
 
html[xmlns] .clearfix {
	display: block;
}
 
* html .clearfix {
	height: 1%;
}

h1 {
font-family: Miso-Bold;
color: #3E3E3F;
font-size: 46px;
font-weight: 100;
text-transform: uppercase;
letter-spacing: 0.05em;
}

h2 {
font-family: Miso-Bold;
color: #3E3E3F;
font-size: 2.25em;
line-height: 1;
text-transform: uppercase;
letter-spacing: 0.05em;
font-weight: 100;
}

h3 {
font-family: Miso-Bold;
font-size: 1.5em;
line-height: 0.9;
font-weight: 100;
text-transform: uppercase;
letter-spacing: 0.05em;
}

h4 {
font-family: frutiger;
font-size: 16px;
line-height: 1.2;
font-weight: bold;
}

a:link {
color: #004C7C ;
font-weight: bold !important;
text-decoration: none;
}

a:hover {
color: #95d5ef !important;
cursor: pointer!important;
}

a:visited {
color: #2D2A2B;
}

a:active {
color: #004c7c;
}

p:empty {
	display: none;
}

#pageWrap {
width: 100%;
min-height: calc(100vh - 260px);
margin-bottom: 0px;
text-align: center;
}

#pageWrap > * {
	text-align: left;
}

.author {
	width: auto;
	font-size: 0.9em;
	margin: 10px 0px;
	font-weight: 100 !important;
}

.author p{
	float: left;
	padding-top: 5px;
	border-top: 2px solid currentColor;
}
/*-----------------------------------Header-----------------------------------*/

header {
width: 100%;
height: 100px;
position: fixed;
background-image: url(images/milkBG.png);
z-index: 1000;
padding: 5px 0 10px 0;
}

#logo {
position: relative;
float: left;
width: 162px;
margin: 10px -20px 36px 36px;
}

#logo img {
width: 70%;
}

#title {
font-family: Miso-Bold;
top: 10px;
color: #3E3E3F;
font-size: 46px;
height: 90px;
line-height: 90px;	
vertical-align: middle;
text-transform: uppercase;
letter-spacing: 0.05em;
position: relative;
float: left;
}

.chunky {
position: relative;
font-size: 0.95em;
font-family: Miso-Chunky!important;
top: -1%;
letter-spacing: 0.08em;
}

.lowercase {
text-transform:lowercase!important;
}

#qoute {
float: none;
}

#contact {
font-family: Miso-Bold;
top: 10px;
color: #3E3E3F;
font-size: 46px!important;
height: 90px;
line-height: 28px;
padding: 12px 0 0 0;	
vertical-align: middle;
text-transform: uppercase;
letter-spacing: 0.05em;
position: relative;
float: right;
margin-right: 36px;
}

#contact h2 {
font-size: 28px!important;
text-align: right;
padding: 2px 0;
}

#contact img {
max-height: 24px;
width: auto;
padding: 0 10px;
float: left;
}

#contact a {
color: #3E3E3F!important;
text-transform: lowercase;
}

#contact a:hover {
color: #4DBEEE !important;
}

/*-----------------------------------aside-----------------------------------*/
aside {
position: fixed;
top: 179px;
float: left;
color: #ffffff;
font-family: Miso-Bold;
text-transform: uppercase;
letter-spacing: 0.025em;
font-size: 16px;
background-image: url(images/milkBG.png);
margin: 0px 20px 20px 0px;
padding: 20px 0px 10px 0px;
z-index: 800;
-moz-border-radius-bottomright: 20px;
border-bottom-right-radius: 20px;
-moz-border-radius-topright: 20px;
border-top-right-radius: 20px;
z-index: 2000;
}

#menu-huvudmeny {
margin: 0px 36px 20px 36px;
}


#menu-huvudmeny li {
list-style: none;
margin: 0 0 10px 0;
}

#menu-huvudmeny a {
font-family: Miso-Bold;
color: #3E3E3F;
font-size: 24px;
text-transform: uppercase;
letter-spacing: 0.05em;
font-weight: 100;
}

#menu-huvudmeny .current-menu-item a {
color: #0074BC!important;
border-bottom: 3px solid #0074BC;
}


/*
#menu-huvudmeny li:nth-child(1) a {
color: #0074BC!important;
border-bottom: 3px solid #0074BC;
}
*/

#menu-huvudmeny li a {
position: relative;
z-index: 2001;
display: block;
border-bottom: 1px solid #3E3E3F;
}

#menu-huvudmeny ul li a:hover {
color: #4DBEEE!important;
}

#responsContact, #navHamburger {
	display: none;
}

/*-----------------------------------Splash-----------------------------------*/
.splash {
position: relative;
margin-top: -60px;
width: 100%;
height: auto;
z-index: 100;
display: block;
z-index: -1;
vertical-align: bottom;
overflow: hidden;
}

.splash img {
position: relative;
width: 100%;
z-index: -1;
vertical-align: bottom;
}

.bumper {
position: relative;
min-height: 50px;
width: 100%;
height: 100px !important;
background: #0074BC;
height: auto;
margin-top: -45px;
z-index: 500;
}

.noSplash {
	margin-top: 116px; 
}
/*-----------------------------------BLOG-----------------------------------*/

.blog {
position: relative;
min-height: 50px;
width: 100%;
height: 230px !important;
background: #0074BC;
height: auto;
margin-top: -45px;
padding: 6px 0px 30px 0px;
z-index: 500;
}

.blogContent {
width: 940px;
height: 100%;
margin: 10px auto 10px auto;
overflow: hidden;
}

.blogContent h2 {
color: #fefefe!important;
/* color: #2D2A2B!important; */
margin: 0px 0 0 0;
/* float: left; */
}

.blogContent .post {
position: relative;
float: left;
width: calc(25% - 30px);
height: calc(100% - 20px - 50px);
background: #95d5ef;
border-radius: 10px;
padding: 8px;
margin: 0px 10px 20px 0px;
color: #3E3E3F;
z-index: 500;
overflow: hidden;
}

.blogContent .post img.puffBild {
	width: calc(100% + 16px);
	margin-left: -8px;
}

.blogContent .post p {
padding: 0 0 4px 0;
color: #3E3E3F;
}

.blogContent .post h3 {
color: #3E3E3F;
line-height: 1.0 !important;
margin-top: 4px;
}

.blogDate {
font-weight: bold;
color: #3E3E3F;
}

.blog a {
font-size: 0.9em;
color: #eeeeee!important;
padding: 0px;
z-index: 501;
}

.blog a:hover {
color: #4DBEEE !important;
cursor: pointer !important;
}


.blogLinks {
position: absolute;
bottom: 30px;
width: 200px;
display: none;
}

.blogLinks li {
list-style: none;
padding: 0 0 16px 0;
}


.blogLinks li {
color: #eeeeee!important;
position: absolute;
z-index: 1000;
width: auto;
}

.blogLinks li:after {
content: '▶';
position: relative;
float: right;
display: block;
margin: -1px 0 0 6px;
top: 1px;
}

.blogScroll {
position: absolute;
width: 940px;
text-align: right;
margin: 10px auto 0px auto;
bottom: 20px;
}

.blogScroll li {
list-style: none;
}

.scrollEnd {
display: none;
font-size: 0.9em;
color: #fefefe;
margin: 10px 0 0 0; 
}

.scrollEnd li {
display: block;
width: 20px;
float: right;
}

.scrollEnd {
display: none;
font-size: 0.9em;
color: #fefefe !important;
margin: 10px 0 0 0; 
}

.blogContent .post:hover {
	background: #004C7C !important;
}

.blogContent .post:hover p, .blogContent .post:hover h3, .blogContent .post:hover a, .blogContent .post:hover .blogDate {
	color: #fefefe !important;
}
.blogContent .post:hover .blogLinks {
	display: block !important;
}

.blogContent .post:hover img.puffBild {
	opacity: 0.5 !important;
}

input, textarea, text {
font-family: frutiger;
padding: 2px 10px;
font-size: 14px;
min-height: 18px;
border-radius: 8px;
border: 2px inset;
margin-bottom: 10px;
}

input:focus, textarea:focus, text:focus {
	border-color: #95d5ef !important;
	outline: none;
	border: 2px solid;
}

textarea {
padding: 10px;
}

input[type='checkbox'] {
	height: 28px;
	width: 28px;
}

#submit, #wp-submit, .btn {
font-family: miso;
font-weight: bold;
text-transform: uppercase;
letter-spacing: 0.05em;
font-size: 1.5em;
width: auto;
height: auto;
background: #0074BC;
color: #ffffff;
padding: 10px 14px 6px 14px;
border-radius: 8px;
border: none;
margin-top: 6px;
}

#submit:hover, #wp-submit:hover, .btn:hover {
background: #95d5ef;
color: #2D2A2B;
cursor: pointer;
}


/*-----------------------------------Main-Content--------------------------------*/
#mainWrap {
width: 100%;
height: auto;
background: url(images/asfaltBG.png);
z-index: 400;
}

#mainContent {
position: relative;
width: 940px;
min-height: 610px;
padding: 10px 10px 60px 10px;
z-index: 500;
margin: 0 auto;
z-index: 400;
}

/*-----------------------------------Content-----------------------------------*/
.columns {
width: 100%;
padding: 10px 0;
margin: 0 0 30px 0;
-webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;
-webkit-column-gap: 20px;
-moz-column-gap: 20px;
column-gap: 20px;
}

.contentCon, .contentCon2 {
width: 100%;
margin: 10px auto;
height: auto;
}

.contentCon h2 {
	padding-top: 10px;
}

.leftCon {
	width: calc(50% - 10px) !important;
	float: left;
	margin-right: 10px;
}

.rightCon {
	width: calc(50% - 10px);
	float: right;
}

.contentCon .contentText {
float: left;
width: calc(40% - 10px);
height: 100%;
margin: 0 20px 20px 0px;
}

.contentText p {
margin: 0px 0px 10px 0px !important;
padding: 0px !important;
}

.contentCon img {
max-width: 100% !important;
width: calc(60% - 10px);
margin-left: 0px;
margin-top: 10px;
margin-bottom: 20px;
float: right;
height: auto;
border-radius: 10px;
}

.leftCon .contentText, .rightCon .contentText, .leftCon img, .rightCon img {
width: 100% !important;
border: none !important;
}

.contentCon:nth-child(even) {	
	border-top: solid 3px #0074BC;
	padding-top: 20px;	
}

.leftCon:nth-child(even), .rightCon:nth-child(even) {	
	border-top: none !important;
	padding-top: none !important;
}

.contentCon:nth-child(even) .contentText {
float: right;
margin: 0 0px 40px 20px;
}
.contentCon:nth-child(even) img {
float: left;
}



.contentCon ul li {
width: 340px;
margin: 0px 0 0 0px;
padding: 10px 10px 0 24px;
list-style: none;
font-family: frutiger;
font-size: 1em;
line-height: 1.2;
font-weight: bold;
top: -10px;
}

.contentCon li:before {
content:'\00b7';
vertical-align: middle;
font-size: 60px;
color: #0074BC;
line-height: 10px;
padding: 0px 10px 0 0px;
margin: 0 0 0 -26px;
}


/*undersidor*/
.pageContent {
}

.pageContent p {
}

.pageContent a {
}

.columns {
}

.widget {
}

/*kunder*/
img.kund {
}

/*jobba*/
#hiring {
}

#hiring ul li {
}

#hiring ul li a {
}

#hiring ul li a p {
}

#hiring img {
}

/*-----------------------------------Archive-----------------------------------*/

#mainContent.archive {
	margin-top: 20px !important;
}

#archivebumper {
margin-top: 116px;	
}

.archive:visited {
	color: #2D2A2B;
}


.archive #archiveWrap {
	width: calc(60% - 10px);
	margin-top: 20px;
	margin-right: 20px;
}

.archive h2 {
	padding-bottom: 5px;
	margin-bottom: 20px;
	border-bottom: 3px solid #0074BC;
}

/*
.archive #archiveWrap .post {
	position: relative;
	padding: 20px 40px 40px 40px;
	margin-bottom: 20px;
	border-bottom: 3px solid #0074BC;
	display: block !important
}
*/


.archive #archiveWrap .post {
	position: relative;
	padding: 40px;
	margin-bottom: 20px;
	display: block !important;
	background: #fff;
/* 	border-radius: 10px; */
}


.archive #archiveWrap .post h3 {
	width: 100%;
	padding-bottom: 5px;
	margin-bottom: 10px;
	border-bottom: 2px solid #0074BC;
}

.archive #archiveWrap .post .postDate {
	position: absolute;
	top: 20px;
	right: 40px;
	font-size: 0.9em;
	font-weight: bold;
}

.archive #archiveWrap .post h3 a {
	font-size: 1.2em;
	letter-spacing: 0.02;
	width: calc(100% - 140px);
	display: block;
}

.archive #archiveWrap .post .meta {
	font-weight: bold;
	font-size: 0.9em;
	padding-bottom: 5px;
	margin-bottom: 10px;
	border-bottom: 1px solid #0074BC;
}

.archive #archiveWrap .post img {
	max-width: 100%;
	height: auto;
	margin: 10px 0px;
	border-radius: 5px;
}


.archive #archiveNav {
	margin-top: 20px;
	float: right;
	width: calc(40% - 10px);
}


.archive #archiveNav .archiveNavCon {
	margin-top: 0px;
	float: right;
	width: calc(100% - 40px);
	background: #fff;
	padding: 20px;
/* 	border-radius: 10px; */
}

.archive #archiveNav h3 {
	margin-top: 14px;
	margin-bottom: 20px;
	letter-spacing: 0.02;
	border-bottom: 3px solid #0074BC;
}

.archive #archiveNav ul li {
	list-style: none;
	position: relative;
	padding: 8px 0px;
	border-bottom: solid 1px #0074BC;
}

.archive #archiveNav .archiveDate {
	position: absolute;
	font-weight: bold;
	font-size: 0.8em;
	width: 120px;
	right: 0;
	top: 8px;
	text-align: right;
}

.archive #archiveNav h4 {
	padding-right: 130px;
	line-height: 1em;
}

.archive #archiveNav h3 a {
	font-size: 0.6666em;
	line-height: 0.5em;
}


#toTop {
	position: fixed;
	right: 100px;
	height: 0;
	width: 0;
	bottom: 120px;
	padding: 40px;
	background: #fff;
	text-align: center;
	border-radius: 10px;
	cursor: pointer;
	
}

#toTop h2{
		font-family: arial;
		margin-left: 2px;
		color: #0074BC;
		border-bottom: none;
		-moz-transform: rotate(-90deg);
		-webkit-transform: rotate(-90deg);
		-o-transform: rotate(-90deg);
		transform: rotate(-90deg);
}

#toTop:hover{
	background: #95d5ef;
}

#toTop:hover h2{
	color: #fff;
}



/*-----------------------------------UserLogIn-----------------------------------*/
.userLogIn {
	width: 40%;
	background: #fff;
	padding: 40px;
}

.userLogIn .logInForm {
	margin-top: 20px;
}

.userLogIn .logInForm label {
	width: calc(50% - 10px);
	margin-right: 20px;
	display: block;
	float: left;
}


.userLogIn  .logInForm input {
	width: calc(50% - 10px);
	display: block;
}


#rememberme {
	width: auto;
	float: left;
	margin-right: 10px;
	margin-top: -4px;
}

#wp-submit {
	float: right;
}

/*-----------------------------------footer-----------------------------------*/

footer {
position: relative;
width: 100%;
height: 100px;
padding: 0px 0px;
background: #3E3E3F;
z-index: 100;
}

#footerWrap {
position: relative;
width: 940px;
height: 60px;
left: 50%;
padding: 24px 10px 0px 10px;
margin: 0 0 -10px -490px;
}

.footerBlock {
position: relative;
width: 280px;
height: 40px;
float: left;
padding: 0px 20px 10px 10px;
margin: 0 0px 0 0;
border-right: solid 2px #ffffff;
}

#footerLogo {
position: relative;
vertical-align: middle;
}

#footerLogo Img {
position: relative;
float: left;
width: 100%;
height: auto;
margin: -10px 0px 0px 0;
}

#footerLogo h3 {
position: relative;
color: #ffffff!important;
height: 100%;
float: left;
font-size: 23px;
line-height: 42px;
vertical-align: middle;
}

#footerContact li {
width: 100%;
line-height: 1.2em;
color: #ffffff;
height: auto;
margin: 0px 20px;
list-style: none;
}

#footerContact li a {
color: #ffffff;
}

#footerContact li a:hover {
color: #4DBEEE;
}

#copywright {
position: relative;
color: #ffffff;
left: 0px;
margin: 0px 0px -16px 0px;
border-right: none;
float: right;
text-align: right;
padding: 0px 0px 14px 10px;
vertical-align: bottom;
}

/*
#copySymbol {
float: right;
text-align: right;
}
*/
/*typography */


/*-----------------------------------hide Anonymous-----------------------------------*/
/*
.comment-form-anonym {
	display: none;
}
*/