Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- /*
- Theme Name: Konstdepartementet
- Description:
- Author: Viktor Nilsson
- Author URI: http://www.nilssonviktor.com
- Version: 0.22
- */
- 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, img, ins, kbd, q, s, samp,
- small, strike, strong, sub, sup, tt, var,
- b, u, i, center,
- dl, dt, dd, ol, ul, li,
- fieldset, form, label, legend,
- table, caption, tbody, tfoot, thead, tr, th, td,
- article, aside, canvas, details, embed,
- figure, figcaption, footer, header, hgroup,
- menu, nav, output, ruby, section, summary,
- time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;}
- article, aside, details, figcaption, figure,
- footer, header, hgroup, menu, nav, section {display: block;}
- body { line-height: 1;}
- /* vanlig reset ovan */
- body {
- font-family: 'Maison Neue', 'Helvetica Neue', Arial, Helvetica, sans-serif;
- font-size: 1em;
- font-weight: 300;
- color: #000;
- width: 100%;
- background: #FFF;
- }
- .page {
- width: 1200px;
- margin: 0 auto;
- text-align: center;
- justify-content: center;
- }
- ul {
- list-style: none;
- }
- a {
- text-transform: uppercase;
- text-decoration: none;
- color: #000;
- }
- .screen-reader-text {
- border: 0;
- clip: rect(1px, 1px, 1px, 1px);
- clip-path: inset(50%);
- height: 1px;
- margin: -1px;
- overflow: hidden;
- padding: 0;
- position: absolute;
- width: 1px;
- word-wrap: normal !important;
- }
- .screen-reader-text:focus {
- background-color: #eee;
- clip: auto !important;
- clip-path: none;
- color: #444;
- display: block;
- font-size: 1em;
- height: auto;
- left: 5px;
- line-height: normal;
- padding: 15px 23px 14px;
- text-decoration: none;
- top: 5px;
- width: auto;
- z-index: 100000; /* Above WP toolbar. */
- }
- #wpadminbar { display:none !important;}
- /*
- ========================================
- HEADER
- ========================================
- */
- header {
- margin: 28px 0;
- }
- .mainNav,
- .mainNav ul {
- display: flex;
- justify-content: space-between;
- align-items: center;
- line-height: 17px;
- }
- .mainNav .logo {
- display: flex;
- }
- .mainNav .logo img {
- height: 40px;
- width: auto;
- }
- .mainNav div {
- display: flex;
- align-items: center;
- }
- .mainNav li {
- margin-left: 25px;
- }
- header ul a:hover {
- color: #000;
- text-decoration: underline;
- }
- /*
- ========================================
- SUB-MENU
- ========================================
- */
- .subNav {
- margin: 12px 0;
- }
- .subNav ul {
- display: flex;
- justify-content: flex-end;
- }
- .subNav ul li {
- margin-left: 30px;
- }
- .subNav ul li a {
- text-transform: none;
- color: #9B9B9B;
- font-family: "Maison Neue";
- line-height: 19px;
- }
- .subNav ul li.active a {
- color: #000;
- }
- .subNav ul li a:hover {
- color: #000;
- }
- /*
- ========================================
- INTRO
- ========================================
- */
- .intro {
- display: flex;
- height: 400px;
- position: relative;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- }
- .intro::after {
- content: "";
- background: linear-gradient( rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4) ), url('https://images.unsplash.com/photo-1432847712612-926caafaa802?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=3900&q=80');
- background-position: center center;
- background-size: cover;
- opacity: 1;
- top: 0;
- left: 0;
- bottom: 0;
- right: 0;
- position: absolute;
- z-index: -1;
- }
- .intro h1 {
- padding: 0 60px;
- font-size: 2.25em;
- font-weight: bold;
- line-height: 1.3;
- text-align: center;
- color: #FFF;
- margin-bottom: 40px;
- }
- .intro .button {
- padding: 15px 25px;
- font-size: 1em;
- font-weight: bold;
- border: 2px solid #FFF;
- cursor: pointer;
- text-transform: uppercase;
- outline:none;
- background: #FFF;
- color: #000;
- }
- .intro .button:hover {
- background: transparent;
- color: #FFF;
- }
- /*
- ========================================
- EXPAND
- ========================================
- */
- .filter {
- padding: 0 35px;
- letter-spacing: 0.13px;
- }
- .filter ul {
- display: flex;
- padding: 38px 0;
- }
- .filter ul li {
- margin-right: 25px;
- cursor: pointer;
- font-size: 1em;
- }
- .filter ul li.open {
- opacity: 0.3;
- }
- .filter ul li svg {
- margin-left: 2px;
- margin-bottom: 3px;
- height: 4px;
- width: auto;
- }
- .filter li.open svg {
- transform: rotate(180deg);
- }
- .filterChoices {
- width: 100%;
- background: #FFF;
- }
- .filterChoices div {
- display: none;
- }
- .filterChoices div.open {
- display: block;
- }
- .filterChoices ul {
- padding-top: 0;
- flex-direction: column;
- align-items: flex-start;
- flex-wrap: wrap;
- max-height: 340px;
- }
- .filterChoices ul li {
- font-size: 0.782em;
- line-height: 2;
- color: #7b7b7b;
- font-weight: bold;
- letter-spacing: 1px;
- }
- .filterChoices ul li:hover {
- text-decoration: underline;
- color: #000;
- cursor: pointer;
- }
- /*
- ========================================
- ITEM
- ========================================
- */
- .chosenFilters {
- width: 100%;
- display: flex;
- flex-wrap: wrap;
- padding: 0 35px;
- }
- .chosenFilters .param {
- padding: 10px 20px;
- background: #F7F7F7;
- border-radius: 20px;
- color: #7b7b7b;
- font-size: 0.782em;
- margin-right: 20px;
- margin-bottom: 35px;
- cursor: pointer;
- font-weight: bold;
- letter-spacing: 1px;
- }
- .chosenFilters .param:hover {
- background: transparent;
- }
- .items {
- display: flex;
- padding: 35px;
- background: #F7F7F7;
- justify-content: space-between;
- flex-wrap: wrap;
- }
- .items .item {
- width: 250px;
- height: 395px;
- background: white;
- margin-bottom: 50px;
- text-align: left;
- line-height: 17px;
- box-sizing: border-box;
- position: relative;
- overflow: hidden;
- text-transform: none;
- }
- .items .item .img {
- background-position: center center;
- background-size: cover;
- width: 100%;
- height: 195px;
- }
- .items .item .content {
- padding: 0 15px;
- }
- .items .item .content h2 {
- font-weight: bold;
- margin-top: 15px;
- height: 34px;
- }
- .items .item .content h3 {
- color: #7b7b7b;
- margin-top: 10px;
- }
- .items .item .content .line {
- width: 100px;
- height: 1px;
- background-color: #000;
- margin: 15px 0;
- }
- .items .item .content p {
- font-size: 0.782em;
- }
- .items .item:hover {
- cursor: pointer;
- border-bottom: #000 4px solid;
- }
- /*
- ========================================
- SUBPAGE
- ========================================
- */
- /*
- ========================================
- SUBPAGE-INTRO
- ========================================
- */
- .comment {
- max-width: 700px;
- margin: 0 auto;
- margin-bottom: 40px;
- line-height: 1.3;
- font-size: 0.85em;
- padding: 20px 40px;
- color: #333;
- border: 1px solid #ddd;
- position: relative;
- text-align: left;
- }
- .icon {
- position: absolute;
- top: 10px;
- left: 10px;
- width: 18px;
- height: 18px;
- opacity: 0.3;
- }
- .subpage-intro {
- display: flex;
- height: 200px;
- position: relative;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- }
- .subpage-intro::after {
- content: "";
- background: linear-gradient( rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4) ), gray;
- background-position: center center;
- background-size: cover;
- opacity: 1;
- top: 0;
- left: 0;
- bottom: 0;
- right: 0;
- position: absolute;
- z-index: -1;
- }
- .subpage-intro h1 {
- font-size: 2.25em;
- font-weight: bold;
- line-height: 1.3;
- text-align: center;
- color: #fff;
- }
- .subpage-content {
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- padding: 63px 35px;
- text-align: left;
- }
- .subpage-img {
- background-position: center center;
- background-size: cover;
- height: 424px;
- width: 640px;
- margin-bottom: 64px;
- }
- .subpage-content h2 {
- font-size: 1.5em;
- font-weight: bold;
- margin-top: 70px;
- margin-bottom: 35px;
- }
- .subpage-content h2 span {
- font-weight: bold !important;
- }
- .subpage-content b {
- font-weight: bold !important;
- }
- .subpage-content em {
- font-style: italic !important;
- display: block;
- margin: 0 auto;
- max-width: 800px;
- margin-bottom: 40px;
- font-size: 1.1em;
- }
- .subpage-content em span {
- font-weight: 300 !important;
- }
- .subpage-content p {
- font-size: 1em;
- line-height: 1.5;
- margin-bottom: 20px;
- }
- .subpage-content p a {
- text-transform: none;
- text-decoration: underline;
- }
- .subpage-content ul {
- font-size: 1em;
- line-height: 1.5;
- margin: 0 60px;
- padding-top: 30px;
- margin-bottom: 60px;
- list-style-type: none;
- }
- .subpage-content ul li {
- margin-bottom: 20px;
- }
- .subpage-content ul li::before {
- content: "\2219"; /* Add content: \2022 is the CSS Code/unicode for a bullet */
- font-size: 1em;
- color: black;
- font-weight: bold;
- display: inline-block; /* Needed to add space between the bullet and the text */
- width: 1em; /* Also needed for space (tweak if needed) */
- margin-left: -1em; /* Also needed for space (tweak if needed) */
- }
- /*
- ========================================
- ACTIVITYPAGE-INTRO
- ========================================
- */
- .activity-intro {
- display: flex;
- height: 485px;
- position: relative;
- padding: 35px;
- text-align: left;
- flex-direction: column;
- }
- .activity-intro::after {
- content: "";
- /* background: linear-gradient( rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4) ), #FFF; */
- /* url('https://images.unsplash.com/photo-1432847712612-926caafaa802?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=3900&q=80') */
- background: #FFF;
- background-position: center center;
- background-size: cover;
- opacity: 1;
- top: 0;
- left: 0;
- bottom: 0;
- right: 0;
- position: absolute;
- z-index: -1;
- }
- .activity-intro h2 {
- font-size: 35px;
- font-weight: bold;
- margin-bottom: 13px;
- }
- .activity-intro h3 {
- font-size: 30px;
- color: #2c2c2c;
- margin-bottom: 15px;
- }
- .activity-intro h4 {
- font-size: 18px;
- color: #333;
- margin-bottom: 45px;
- }
- .activity-intro div {
- display: flex;
- font-size: 18px;
- flex-direction: row;
- width: 100%;
- margin-bottom: 20px;
- }
- .activity-intro-item {
- font-weight: bold;
- }
- .activity-intro div ul {
- margin-right: 20px;
- }
- .activity-intro div ul li {
- margin-bottom: 36px;
- height: 20px;
- }
- .activity-intro button,
- .activity-other button, .acf-form-submit input[type=submit] {
- margin: 0 auto;
- padding: 15px 20px;
- font-size: 1em;
- font-weight: bold;
- border: 2px solid #000;
- cursor: pointer;
- text-transform: uppercase;
- outline: none;
- background: transparent;
- color: #000;
- }
- .activity-intro button:hover,
- .activity-other button:hover {
- background: transparent;
- color: #2c2c2c;
- }
- .activity-intro .premiums {
- position: absolute;
- right:35px;
- width: 100px;
- display:flex;
- flex-direction:column;
- align-items: center;
- }
- .activity-intro .premiums p {
- text-align: center;
- color: #77c;
- font-size: 12px;
- font-weight:bold;
- text-transform: uppercase;
- margin-bottom:5px;
- }
- .activity-intro .premiums svg {
- width: 100%;
- }
- /*
- ========================================
- ACTIVITYPAGE-CONTENT
- ========================================
- */
- .activity-content {
- background: #F7F7F7;
- text-align: left;
- justify-content: left;
- padding: 48px 35px;
- }
- .activity-content h2 {
- font-size: 20px;
- font-weight: bold;
- letter-spacing: 0.13px;
- margin-bottom: 24px;
- text-align: left;
- }
- /*
- ========================================
- ACTIVITYPAGE-BACKGROUND
- ========================================
- */
- .activity-background p {
- font-size: 16px;
- /* font-size: 0.782em; */
- letter-spacing: 0.11px;
- line-height: 27px;
- margin-bottom: 35px;
- }
- /*
- ========================================
- ACTIVITYPAGE-VIDEO
- ========================================
- */
- .activity-video {
- text-align: center;
- }
- .activity-video iframe {
- width: 100%;
- height: 400px;
- max-width: 800px;
- }
- /*
- ========================================
- ACTIVITYPAGE-GALLERY
- ========================================
- */
- .activity-gallery-items {
- padding: 0 4px;
- display: flex;
- background: #F7F7F7;
- text-align: left;
- justify-content: space-between;
- flex-direction: row;
- flex-wrap: wrap;
- }
- .activity-gallery-item {
- width: 250px;
- height: 250px;
- box-sizing: border-box;
- margin-bottom: 40px;
- overflow: hidden;
- }
- .activity-gallery-item a {
- width: 100%;
- height: 100%;
- display: block;
- }
- .activity-gallery .img {
- background-position: center center;
- background-size: contain;
- width: auto;
- height: 100%;
- }
- /*
- ========================================
- ACTIVITYPAGE-CONTACT
- ========================================
- */
- .activity-contact {
- margin: 68px 0;
- }
- /*
- ========================================
- ACTIVITYPAGE-OTHER
- ========================================
- */
- .activity-other {
- text-align: center;
- }
- .activity-other h2 {
- text-align: left;
- margin-bottom: 168px;
- }
- /*
- ========================================
- CREATE-ACTIVITY
- ========================================
- */
- form {
- background: #F7F7F7;
- padding: 25px;
- }
- form div {
- text-align: left;
- }
- .acf-field p.description {
- font-style: italic;
- font-size: 0.85em;
- line-height: 1.3;
- color: #777;
- margin-top: 10px !important;
- }
- /*
- ========================================
- CREATE-ACTIVITY TEXTAREA
- ========================================
- */
- textarea {
- overflow-y: scroll;
- max-height: 120px;
- resize: none !important;
- }
- /*
- ========================================
- CREATE-ACTIVITY CHECKBOX
- ========================================
- */
- .acf-checkbox-list input[type=checkbox] {
- position: absolute;
- left: -9999px;
- }
- .acf-checkbox-list label::before {
- content: "";
- display: inline-block;
- height: 16px;
- width: 16px;
- border: 1px solid #000;
- background: #fff;
- margin-left: 16px;
- }
- .acf-checkbox-list .selected::after {
- content: "";
- height: 6px;
- width: 8px;
- border-left: 2px solid #000;
- border-bottom: 2px solid #000;
- transform: rotate(-52deg);
- pointer-events: none;
- position: absolute;
- left: 6px;
- margin-top: 4px;
- }
- .acf-checkbox-list label {
- position: relative;
- cursor: pointer;
- padding-left: 28px;
- }
- .acf-checkbox-list label::before,
- .acf-checkbox-list label::after {
- position: absolute;
- }
- .acf-checkbox-list label::before {
- left: -14px;
- }
- /*
- ========================================
- CREATE-ACTIVITY BUTTON
- ========================================
- */
- .acf-form-submit {
- display: flex;
- justify-content: center;
- margin: 60px 0 50px;
- }
- /*
- ========================================
- LOGIN
- ========================================
- */
- .page-id-87 h3 {
- font-weight: bold;
- margin: 0 auto;
- text-align: left;
- width: 28%;
- }
- form[name='loginform'] {
- display: flex;
- flex-direction: column;
- margin: 0 auto;
- width: 28%;
- }
- form[name='loginform'] .login-username label,
- form[name='loginform'] .login-password label {
- display: none;
- }
- form[name='loginform'] .login-username input,
- form[name='loginform'] .login-password input {
- box-sizing: border-box;
- margin-bottom: 20px;
- padding: 5px;
- width: 100%;
- font-size: 14px;
- }
- form[name='loginform'] .login-remember {
- margin: 5px;
- font-size: 14px;
- color: #777;
- }
- form[name='loginform'] .login-remember label,
- form[name='loginform'] .login-remember input {
- cursor: pointer;
- }
- .page-id-87 .register-me {
- font-size: 0.9em;
- }
- .page-id-87 .register-me a {
- text-transform: lowercase;
- text-decoration: underline;
- }
- /*
- ========================================
- LOGIN-CHECKBOX
- ========================================
- */
- form[name='loginform'] .login-remember input[type=checkbox] {
- position: relative;
- }
- form[name='loginform'] .login-remember input[type=checkbox]::before {
- content: "";
- display: inline-block;
- height: 16px;
- width: 16px;
- border: 1px solid #000;
- background: #FFF;
- }
- form[name='loginform'] .login-remember input[type=checkbox]:checked::after {
- content: "";
- display: inline-block;
- height: 6px;
- width: 8px;
- border-left: 2px solid #000;
- border-bottom: 2px solid #000;
- transform: rotate(-52deg);
- }
- form[name='loginform'] .login-remember input[type=checkbox]::after {
- position: absolute;
- left: -1px;
- top: 2px;
- }
- form[name='loginform'] .login-remember input[type=checkbox]::before {
- position: absolute;
- left: -5px;
- top: -2px;
- }
- /*
- ========================================
- REGISTER
- ========================================
- */
- .page-id-117 section div h3 {
- text-align: left;
- font-size: 1.5em;
- font-weight: bold;
- margin-bottom: 35px;
- }
- .page-id-117 section div p {
- font-size: 1em;
- line-height: 1.5;
- text-align: left;
- margin-bottom: 35px;
- }
- .page-id-117 section div p a {
- text-decoration: underline;
- text-transform: none;
- }
- .page-id-117 form h3 {
- width: 28%;
- margin: 0 auto;
- font-weight: bold;
- text-align: left;
- margin-bottom: 20px;
- }
- .page-id-117 form {
- display: flex;
- flex-direction: column;
- margin: 0 auto;
- background: #F7F7F7;
- }
- .page-id-117 form div {
- width: 28%;
- margin: 0 auto;
- }
- .page-id-117 form .register-username label,
- .page-id-117 form .register-password label {
- margin-right: 5px;
- }
- .page-id-117 form .register-username,
- .page-id-117 form .register-password {
- display: flex;
- flex-direction: row;
- justify-content: space-evenly;
- }
- .page-id-117 form input[type=text],
- .page-id-117 form input[type=password] {
- box-sizing: border-box;
- margin-bottom: 20px;
- padding: 5px;
- font-size: 14px;
- width: 100%;
- }
- form input[type=submit] {
- margin: 0 auto;
- margin-top: 10px;
- padding: 15px 20px;
- font-size: 1em;
- font-weight: bold;
- border: 2px solid #000;
- cursor: pointer;
- text-transform: uppercase;
- outline: none;
- background: transparent;
- color: #000;
- }
- .page-id-117 form input[type=submit] {
- display: block;
- }
- /*
- ========================================
- FOOTER
- ========================================
- */
- footer {
- margin-top: 51px;
- margin-bottom: 50px;
- }
- footer nav a {
- margin-right: 25px;
- font-size: 0.782em;
- }
- footer nav a:hover {
- color: #000;
- text-decoration: underline;
- }
- footer .logo {
- margin-top: 45px;
- font-weight: 900;
- font-size: 0.782em;
- line-height: 1.5;
- }
- footer .logo a {
- margin-right: 30px;
- }
- @media only screen and (max-width: 1250px) {
- .page {
- width: 920px;
- }
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement