html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, .overlaycaption, figure, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;}

ol, ul {list-style: none;}
:focus {outline: 0;}

html {height: 100%;font-size: 100%;-webkit-text-size-adjust: 100%;position: relative;}
body {font-family: courier, arial, monospace;letter-spacing: 0;font-size: 18px;font-weight: 300;line-height: 24px;text-align: left;color: #4d4d4d;position: relative;background: #e8e8e8;height: 100%;}

div h1:first-child, div h2:first-child, div h3:first-child, div h4:first-child, div h5:first-child, div h6:first-child {margin-top: 0px !important;}
	
::selection {background: #0d0d0d;color: #ffffff;}

h1, h2, h3, h4, h5, h6 {font-weight: 700;color: #4d4d4d;}
h2 {font-size: 24px;line-height: 80px;}
h3 {font-size: 18px;font-weight: 300;line-height: 24px;}

div h1, div h2, div h3, div h4, div h5, div h6 {margin-top: 30px;}

img, object, video {max-width: 100%;height: auto;display: inline-block;margin: 0;vertical-align: top;}
img {width: auto;max-width: 100%;border: 0;-ms-interpolation-mode: bicubic;}

article, aside, details, .overlaycaption, figure, footer, header, hgroup, menu, nav, section, dialog {display: block;}

i, dfn, em {font-style: italic;}
a {text-decoration: none;cursor: pointer;-webkit-tap-highlight-color: rgba(0, 0, 0, 0.0);}
p {/* margin-top: 20px; */}
p a {color: #0d0d0d;position: relative;}				

.page-loader-inner {width: 200px;height: 1px;position: absolute;top: 50%;margin-top: -10px;left: 50%;margin-left: -100px;text-align: center;}
#page-loader {position: fixed;width: 100%;height: 100%;background: #0d0d0d;z-index: 100001;}
.text-light {color: #ffffff;}

header.sticky-header .header-inner {padding-top: 15px;padding-bottom: 5px;}
.header-inner {padding: 20px 20px;}
.clearfix {height: 1%;}
.clearfix:after {content: "";display: block;clear: both;visibility: hidden;font-size: 0;height: 0;}

nav#main-nav {position: fixed;top: 0px;right: 0px;width: 100%;height: 100%;z-index: 100000;overflow: hidden;display: none;}
nav#main-nav .nav-inner {max-height: 80%;position: relative;z-index: 100001;opacity: 0;}
nav#main-nav .nav-inner ul {list-style: none;text-align: center;margin: 0 auto;}
div ul:first-child, li ul:first-child {margin-top: 0px;}
nav#main-nav .nav-inner ul li {margin: 0 20px;padding: 0;position: relative;display: inline-block;}
ul li:first-child, ol li:first-child {margin-top: 0px;}
ul li, ol li {margin-top: 10px;}
nav#main-nav .nav-inner ul li:hover > a, nav#main-nav .nav-inner ul li.current-menu-item > a {opacity: 1;}

ul {margin-top: 20px;margin-left: 15px;list-style: disc;}

.open-nav {display: block;background: transparent;width: 20px;height: 20px;position: relative;transition: all 300ms ease;z-index: 100003;}
.sticky-header .open-nav {height: 20px;margin-top: 5px;}
.menu {position: relative;}
.sticky-header .open-nav span, .open-nav.nav-dark span {background-color: #0d0d0d;}

div .socialmedia-widget:first-child {margin: 0;}


.open-nav span {display:inline-block;position:absolute;left:50%;top:50%;bottom:auto;right:auto;transform:translateX(-50%)translateY(-50%);width:18px;height:2px;background-color:#ffffff;}
.open-nav span:before, .open-nav span:after {content: '';width: 100%;height: 100%;position: absolute;background-color: #ffffff;right: 0;transform: translateZ(0);backface-visibility: hidden;transition: transform .2s, background .2s;-webkit-transition: -webkit-transform .2s, background .2s;}

.open-nav span.is-clicked {background-color: transparent;}
.sticky-header .open-nav span:before, .sticky-header .open-nav span:after, .open-nav.nav-dark span:before, .open-nav.nav-dark span:after {background-color: #0d0d0d;}

.open-nav span.is-clicked:before, .open-nav span.is-clicked:after {background-color: #ffffff;}
.open-nav span.is-clicked:before {transform: translateY(0) rotate(45deg);}

.open-nav span.is-clicked:after {transform: translateY(0) rotate(-45deg);}
.open-nav span:before {transform: translateY(-6px) rotate(0deg);}

.open-nav:hover span:before {transform: translateY(-8px) rotate(0deg);}
.open-nav:hover span:after {transform: translateY(8px) rotate(0deg);}

.sticky-header .open-nav span.is-clicked:before, .sticky-header .open-nav span.is-clicked:after {background-color: #ffffff;}

nav#main-nav .nav-inner ul li a {display: inline-block;font-weight: 700;font-size: 18px;letter-spacing: 0.1em;line-height: 40px;color: #ffffff;text-decoration: none;text-transform: uppercase;transition: all 100ms linear;opacity: 0.70;filter: alpha(opacity=70);}
nav#main-nav .nav-social {position: absolute;z-index: 100001;bottom: 100px;left: 0;width: 100%;text-align: center;opacity: 0;transition: all 200ms 0.1s ease;}
nav#main-nav .nav-bg {background: #0d0d0d;position: absolute;top: 0px;right: 0px;width: 100%;height: 100%;opacity: 0.95;-webkit-backface-visibility: hidden;backface-visibility: hidden;}

.imgoverlay .overlaycaption {width: 100%;height: 100%;position: absolute;top: 0;left: 0;z-index: 2;}
.imgoverlay {position: relative;overflow: hidden;display: block;max-width: 100%;text-align: center;}
.imgoverlay > a {z-index: 2;position: absolute;top: 0;left: 0;width: 100%;height: 100%;text-indent: -9999px;}
.imgoverlay.overlay-dark .overlaycaption .overlay-name, .imgoverlay.overlay-dark .overlaycaption .alttitle {color: #ffffff;}
.imgoverlay .overlaycaption .overlay-name {font-family: 'Roboto';font-size: 48px;line-height: 1.2em;letter-spacing: 2px;text-shadow: 0px 0px 40px #0000006e;}
.imgoverlay .overlaycaption .overlay-name, .imgoverlay .overlaycaption .alttitle, .imgoverlay .overlaycaption .separator, .imgoverlay .overlaycaption .separator-small {color: #ffffff;margin: 0;position: absolute;top: 50%;left: 0;width: 100%;transition: all 400ms ease;transform: translate3d(0, -50%, 0);}

.left-float {float: left;}

.socialmedia-widget {margin: 20px 0 0 0;padding: 0;list-style: none;}
.socialmedia-widget li {display: inline-block;background: transparent;padding: 0px;margin: 0 12px 0 0;position: relative;height: 18px;line-height: 18px;}
.socialmedia-widget li a {font: normal normal normal 12px / 1 FontAwesome;font-size: 20px;text-rendering: auto;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;line-height: 18px;color: #0d0d0d;}
.text-light .socialmedia-widget li a, .overlay-dark .socialmedia-widget li a {color: #ffffff;}
.socialmedia-widget li:last-child {margin: 0;}

.socialmedia-widget li.instagram a:before { content: "\f16d"; }
.socialmedia-widget li.instagram:hover a { color: #95604b; }
.socialmedia-widget li.linkedin a:before { content: "\f0e1"; }
.socialmedia-widget li.linkedin:hover a { color: #81d3fd; }
.socialmedia-widget li.facebook a:before { content:"\f09a"; }
.socialmedia-widget li.facebook:hover a { color: #446ebf; }

footer {padding: 100px 0;transition: all 400ms 0.2s ease;}
.loading-end footer .footer-inner {opacity: 1;}
footer #backtotop {text-align: center;font-size: 11px;font-weight: 700;text-transform: uppercase; letter-spacing: 0.2em;color: #0d0d0d;width: 56px;height: 20px;line-height: 20px;position: absolute;top: 50%;margin-top: -10px;left: 50%;margin-left: -27px;}
footer .copyright {font-size: 12px;line-height: 40px;}
.fixed-header-content, .default-header-content {transition: all 300ms 0.4s ease;opacity: 0;}

.loading-end .fixed-header-content, .loading-end .default-header-content {opacity: 1;}

.portfolio {text-decoration: underline;text-decoration-thickness: 1px;font-weight: 200;text-underline-offset: 5px;}

.alttitle {font-weight: 300; margin-top: 10px;}
.title-minimal {letter-spacing: 0.15em;}

#default-logo {position: absolute;top: 0;left: 0;}
#logo {font-family: 'Helvetica', sans-serif;font-weight: 600;line-height: 29px;font-size: 28px;}
#logo #fixed-logo {font-family: 'Helvetica', sans-serif;font-weight: 600;line-height: 29px;}
#logo a {color: #0d0d0d;max-height: 100%;}
header #logo {max-width: 100%;height: 40px;transition: all 200ms ease;position: relative;}
#fixed-logo {opacity: 0;}

.sticky-header #fixed-logo {opacity: 1;}
.sticky-header #default-logo {display: none;}

.language-option {cursor: auto;margin-right:2px;}
.selected {cursor: default;font-weight: bold;}

.language-selector {font-family: 'roboto narrow', sans-serif;font-size: 14px;padding-top: 0px !important;padding-bottom: 10px !important;position: relative;display: flex;}

#page-content {overflow: hidden;margin: 0;min-width: 1080px;position: relative;}

#lightbox {display: none;position: fixed;top: 0;left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.85); justify-content: center; align-items: center; z-index: 200000; cursor: pointer;}
.hidden {display: none;}

#lightbox-image {max-width: 90%;max-height: 90%;}

.section-inner {padding-top: 80px;}

header {background: transparent; width: 100%; z-index: 100000; position: absolute; top: 0; left: 0; transition: none;}

header.sticky-header #logo {height: 30px;}
.sticky-header {position: fixed;left: 0;background: rgba(232, 232, 232, 0.9); transition: margin 300ms ease;}
.wrapper {width: 1080px;margin: 0 auto;}				
.align-center {text-align: center;}
.wrapper:after, .wrapper-small:after {content: "";display: block;clear: both;visibility: hidden;font-size: 0;height: 0;}

.spacer {width: 100%;display: block;}	
.spacer.spacer-mini { height: 15px; }
.spacer.spacer-small { height: 40px; }
.spacer.spacer-medium { height: 80px; }
.spacer.spacer-big { height: 120px; }

.separator span, .separator-small span { background: #5acae6 !important; }
.colored { color: #5acae6; }
p a:hover:after { background: #5acae6; }
.pace .pace-progress { background: #5acae6;}
[data-bigletter]:before { color: #5acae6; }
.visible[data-bigletter]:before {opacity: 0.2;}
nav#main-nav .nav-inner ul li:hover > a, nav#main-nav .nav-inner ul li.current-menu-item > a { color: #5acae6; }
nav#main-nav [data-bigletter]:before { color: #ffffff; }
.skill .skill-bar .skill-active { background: #5acae6; }
footer #backtotop:after { background: #5acae6; }
.filter li a:after { background: #5acae6; }
figure.imgoverlay.overlay-border > a { border-color: #5acae6; }

footer .footer-inner {position: relative;transition: all 200ms 0.2s ease;opacity: 0;}
footer .socialmedia-widget {margin-top: 0px;}

.masonry.masonry-spaced {width: calc(120% - 40px);margin-left: 20px;margin-bottom: -20px;}

.j-filter {margin: 0;padding: 0;list-style: none;}				
.j-filter li a {display: block;position: relative;font-weight: 400;letter-spacing: 0.2em;color: #0d0d0d;line-height: 20px;padding-left: 0.1em;}
.j-filter li {padding: 0 20px 10px 0;margin: 0;display: inline-block;}

.align-center .j-filter li {padding: 0 10px 10px 10px;}

.right-float {float: right;}

.gallery-grid {
	position: relative;
	width: 100%;
	margin: 0 auto;
	width: calc(100% - 40px);
	/* padding: 0 20px; */
	padding-bottom: 20px; /* Ger utrymme för den sista raden om det behövs */
/*	box-sizing: border-box; */
}
.gallery-item {
	position: absolute;
	/* Bredden sätts dynamiskt av JavaScript */
	transition: top 0.1s ease, left 0.1s ease;
}

.gallery-item img {
	display: block;
	width: 100%;
	height: auto;
}



.link-anim {margin: 0;padding: 0;list-style: none;}
.link-anim li {padding: 0 20px 10px 0;margin: 0;	display: inline-block;}	
.align-center .link-anim li { padding: 0 10px 10px 10px; }
.link-anim li a {display: block;position: relative;font-weight: 400;/*	text-transform: uppercase; */letter-spacing: 0.2em;color: #0d0d0d;line-height: 20px;padding-left: 0.1em;}
.text-light .filter li a { color: #ffffff; }
.link-anim li a:after {content:"";position: absolute;bottom: 0;left: 50%; margin-left: -0%;width: 0%;height: 1px;background: #0d0d0d;transition: all 200ms ease;}
.text-light .link-anim li a:after { background: #ffffff; }
.link-anim li a:hover:after, .link-anim li a.active:after {width: 100%;margin-left: -50%;}