* {
margin: 0;
padding: 0;
} body {
font-family: 'Open Sans', serif;
background: #FFF;
font-size: 14px;
line-height: 18px;
color: #444;
overflow-y:scroll;
}
a:link, a:visited {
color: black;
text-decoration: none;
}
a:hover{
text-decoration: underline;
} 
a img {
border: none;
}
h1 a {
text-decoration: none!important;
}
#container {
max-width: 1920px;
margin: auto;
margin-top: 66px;
}
article, #projekt-single {
padding: 20px;
padding-bottom: 200px;
}
#projekt-single {
padding-bottom: 20px;
} .the-content.hidden {
display: none;
}
.entry-content p {
margin: 10px 0;
}
.grid {
min-height: 100%;
opacity: 0;
transition: .5s;
}
.grid-item { float: left;
}
.grid-image {
padding: 10px;
}
.grid-item img {
width: 100%;
height: auto;
}
.grid-sizer,
.grid-item { width: 33.3333%; }
.clear {
clear: both;
height: 0px;
overflow: hidden;
}
.left {
float: left;
}
.left.fifty {
width: 45%;
margin-right: 5%;
}
.right {
float: right;
}
.right.fifty {
width: 45%;
margin-left: 5%;
}
#wrapper {
min-height: 100%;
min-height: calc(100vh - 100px);
}
#main {overflow:auto;	padding-top: 66px;
padding-bottom: 100px;}
footer#footer {
padding: 20px;
color: #666;
background: white;
position: relative;
margin-top: -100px;
height: 59px;
clear: both;
border-top: 1px solid #EEE;
display: block;
}
footer#footer li {
list-style-type: none;
display: block;
padding: 0;
}
#header {
border-bottom: 1px solid #EEE;
position: fixed;
width: 100%;
top: 0px;
z-index: 9999;
background: white;
} 
.admin-bar #header {
top: 32px;
}
#logo {
padding: 18px 20px 17px 20px;
width: 140px;
float: left;
}
#logo img {
height: 25px;
width: auto;
}
#menu {
float: right;
display: inline-block;
height: 65px;
}
#menu ul, #menu li {
list-style: none; }
#menu li, #menu li a {
display: inline-block;
height: 66px;
}
#menu li a {
height: 65px;
padding: 0 50px;
line-height: 65px;
background: white;
transition: .25s;
}
#menu li a:hover {
background: #eeeeee;
text-decoration: none;
}
#menu li.current-menu-item a {
background: #840d11;
color: #FFF;
} #menu a:hover {  border-bottom-color: #666;
}
.menselect {
border-bottom-color: #666!important;
}
#welcome {
margin: auto;
overflow: hidden;
position:relative;
width: 100%;
padding-bottom:40%;
height:0;
opacity: 1;
background: black;
}
.slide {
width:100%;
height:100%;
position: absolute;
cursor: pointer;
}
.slide-img {
width: 100%;
max-height: 545px;
overflow: hidden;
background: black;
}
.slide-img img {
width: 100%;
height: auto;
}
#welcome h3 {
font-size: 42px;
background: black;
color: white;
text-transform: uppercase;
position: absolute;
padding: 5px;
font-weight: 600;
left: 20px;
bottom: 100px;z-index: 2;
}
#welcome span {
background-color: white;
color: black;
display: block;
position: absolute;
bottom: 60px;
left: 20px;
padding: 10px 10px;
z-index: 1;
font-size: 18px; font-weight: normal;
z-index: 2;
}
#ashitaka {
width: 100%;
background: white;
margin-top: -20px;
position: relative;z-index: 99;
}
.wrapo {
padding: 50px 50px 200px 50px;
}
#ashitaka h2 {
font-weight: normal;
font-size: 36px;
line-height: 46px;
color: white; display: inline;
padding: 3px 10px;
color: black;
}
#ashitaka span {
margin-top: 20px;
display: block;
font-size: 18px;
}
#projects {
position: relative;
}
#project-page #projects {
background: #eeeeee;
}
.items {
float:left;
width:calc(70% - 20px);
padding: 10px;
}
.news-section {
float:left;
width:calc(30% - 20px);
padding: 10px;
padding-left:0;
}
.item.newsie {
width:100%;
}
.items::after {
content: '';
display: block;
clear:both;
height:0;
overflow:hidden;
}
.item {
width: 25%;float: left;overflow: hidden;
position: relative;
background: black;
}
.item {
width: calc(33% - 20px);
margin: 10px 10px 10px 10px;
}
.item img {
position: absolute;
z-index: 0;
top: 0;
left: 0;
width: auto;
height: auto;
max-height: 150%;
max-width: 150%;
min-height: 100%;
min-width: 100%; bottom: 0;
right: 0;
margin: auto;
}
.item.start h4 {
position: absolute;
display: block;
bottom: 0px;
left: 0px;
font-size: 12px;
color: white;
background: none!important;
padding: 10px;
z-index: 2;
width: 100%;
font-weight: bold;
} 
.item.start h5 {
position: absolute;
width: 100%;
height: 120%;
font-size: 18px;
color: black;
text-align: left;
background-color: white;
font-weight: normal;
top: 0px;
left: 0px;
margin-right: 20px;
text-transform: uppercase;
line-height: 22px;
} 
.item.start h5 b {
font-weight: bold;
display: block;
padding: 20px;
}
.item.start h5 span {
color: #7c7c7c;
padding: 0px 20px 20px 20px;
font-size: 14px;
display: block;
}
.item.start h4 {
display: none;
}
.item h4 {
position: absolute;
display: block;
bottom: 0px;
left: 0px;
font-size: 12px;
color: white;
padding: 10px;
z-index: 2;
width: 100%;
font-weight: bold;
} 
.item h4.inactive {
background-color: rgba(0, 0, 0, 0.5)
}
.item a {
display: block;
width: 100%;
padding-bottom: 62%;
}
.title {
padding: 0px 50px 50px 50px;
color: black;
font-size: 18px;
}
.title a {
font-size: 14px;
margin-left: 20px;
}
#menu-replacer {
display: none;
float: right;
font-size: 18px;
margin-top: 24px;
margin-right: 20px;
cursor: pointer;
color: #840d11;
}
.vanster {
width: 46%;
margin-right: 2%;
float: left;
}
.hoger {
float: right;
margin-left: 2%;
width: 46%;
padding-top: 0px;
position: relative;
}
#projekt-single .vanster {
width: 33%;
margin: 0;
}
#projekt-single .hoger {
width: 63%;
margin: 0;
margin-top: -10px;
}
.hoger h2 {
width: auto;
}
.tumman {
display: inline-block;
margin-bottom: 20px;
margin-right: 20px;
}
.tumman img {
padding: 3px;
border: 1px solid #AFAFAF;
} #projekt-page, #medarbetare-page {
padding: 0px!important;
} 
.hoger img {
max-width: 100%;
height: auto;
}
.categories {
font-size: 14px;margin-top: 0px;line-height:22px;
margin-bottom: 24px;
}
.categories a, .categories span {
display: inline-block;
padding: 3px 18px 5px 18px;
background-color: #EEE;
border-radius: 3px;
margin-right: 10px;
margin-top: 10px;
transition: .25s;
}
.categories span {
color: #7c7c7c;margin-right: 10px;
padding-left: 0;
}
.categories a.active {
background-color: #840d11;
color: white;
}
.categories a:hover {
text-decoration: none;
opacity: 0.3;
}
.categories a.active:hover {
opacity: 1;
}
h1 { font-family: 'Open Sans', sans-serif;
font-size: 2em;
line-height: 1em;
font-weight: bold;
color: #444;
margin-bottom: 24px;
}
h1 span {
color: #7c7c7c!important;
font-family: 'Open Sans', sans-serif;
font-size: 14px;
text-transform: uppercase;
}
.worker {
width: 25%;
float: left;
overflow: hidden; position: relative;
background: #fff;
min-height: 300px;
max-height: 600px;
}
.worker img {
width: 100%;
height: auto;
filter: url(//hmxwarkitekter.se/wp-content/themes/blankslate/filters.svg#grayscale); filter: gray; -webkit-filter: grayscale(1); }
.iframe-rwd  {
position: relative;
padding-bottom: 65.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.iframe-rwd iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
#target {
height: 0px;
overflow: hidden;
width: 0px;
}
.nine { }
.image_container {
margin-top: 0px;
}
.nivo-controlNav {
position: absolute;
width: 100%;
top: -60px;
}
.ten { }
.leaving {
padding-top: 60px;
}
.leaving .nivo-controlNav {
top: 0px!important;
}
.item.start h5 b {
padding:20px 20px 10px 20px;
}
.menu-open {
display: none;
}
@media (min-width: 1531px){ .worker {
width: 20%;
}
.nine, .ten {
display: block;
}
.item.start h5 b {
padding:20px 20px 10px 20px;
}
.worker {
height:400px!important;
}
}
@media (min-width: 1171px) and (max-width: 1530px){
.worker {
width: 20%;
height: 400px;
}
.nine, .ten {
display: block;
}
.item.start h5 b {
padding:20px 20px 10px 20px;
}
}
@media screen and (max-width: 1170px){
.item, .worker {
width: 33%;
width: calc(50% - 20px);
}
.nine {
display: none;
}
.ten {
display:none;
}
.item.start h5 b {
padding:20px 20px 10px 20px;
}
.item.start h5 span {
font-size: 12px;
}
.grid-sizer, .grid-item {
width: 50%;
}
}
@media screen and (max-width: 860px){
.nine, .ten {
display: block;
}
.item, .worker {
width: 50%;
}
.item {
width: calc(100% - 20px);
}
#menu-replacer {
display: block;
}
.left.fifty {
width: 100%;
margin: 0;
float: right;
margin-bottom: 20px;
}
.right.fifty {
width: 100%;
margin: 0;
}
#welcome h3 {
font-size: 24px;
}
#welcome span {
font-size: 14px;
}
.item-img { }
.menu-open {
display: block;
position: absolute;
width: 25px;
height: 20px;
right: 26px;
top: 26px;
z-index: 100;
cursor: pointer;
}
.menu-open span {
display: block;
border-bottom: 2px solid #840d11;
height: 0;
margin-bottom: 5px;
transition: .5s ease;
}
.active.menu-open span:nth-child(1) {
opacity: 0;
}
.active.menu-open span:nth-child(2) {
transform: rotate(-45deg);
}
.active.menu-open span:nth-child(3) {
transform: rotate(45deg);
margin-top: -7px;
}
#menu {
display: none;
position: fixed;
width: 100%;
height: 100%;
background: white;
z-index: 99;
top: 65px;
}
.admin-bar #menu {
top: 97px;
} #menu li, #menu li a {
display: block;
width: 100%;
text-align: center;
padding: 0;
text-transform: uppercase;
font-size: 18px;
}
#projekt-single .vanster, #projekt-single .hoger {
float: none;
width: 100%;
}
#projekt-single .hoger {
margin-top: 25px;
}
}
@media screen and (max-width: 520px){
.grid-sizer, .grid-item {
width: 100%;
}
.leaving {
padding-top:0px;
}
.item.start h5 {
height: auto;
}
.item.newsie {
background-color: transparent!important;
}
.item h4 {
font-size: 12px!important;
}
.newsie h5 {
height: auto!important;
overflow: hidden;
padding: 15px 0px 35px 0px;
}
.newsie a {
height: 100%;
}
.item, .worker {
width: 100%;
margin: 0px;
}
.item-img {
width: 100%!important;
}
#menu {
display: none;
}
#menu-replacer {
display: block;
}
.left.fifty {
width: 100%;
margin: 0;
float: right;
margin-bottom: 20px;
}
.right.fifty {
width: 100%;
margin: 0;
}
#welcome h3 {
font-size: 14px;
bottom: 5px;
}
#welcome span {
font-size: 10px;
bottom: 35px;
padding: 3px;
}
.wrapo {
padding: 20px;
}
#ashitaka {
margin-top: 0px;
} 
#ashitaka h2 {
font-size: 24px;
padding: 0px;
}
.vanster {
width: 100%;
margin: 0%;
float: none;
margin-bottom: 20px;
}
.hoger {
width: 100%;
margin: 0%;
float: none;
}
.slider-wrapper.theme-default {
margin-top: 60px;
}
.items {
width:calc(100% - 20px);
float: none;
padding-top: 0px;
}
.item {
margin-bottom: 10px;
}
.news-section {
width:calc(100% - 20px);
float: none;
padding-top: 0px;
}
}