/*
Theme Name: Op weg naar de kunst
Theme URI: https://opwegnaardekunst.nl
Author: Mathijs Bernson
Description: Thema voor Op weg naar de kunst
*/

/* Tweaks: Hugo Kerstens */

/*
 * Rood: #cc2a1d
 * Geel: #d3a500
 * Grijs: #b1b3b5
 */

/* Fonts */
@font-face {
    font-family: 'gandhi_sansregular';
    src: url('fonts/GandhiSans-Regular-webfont.eot');
    src: url('fonts/GandhiSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/GandhiSans-Regular-webfont.woff') format('woff'),
         url('fonts/GandhiSans-Regular-webfont.ttf') format('truetype'),
         url('fonts/GandhiSans-Regular-webfont.svg#gandhi_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'gandhi_sansbold';
    src: url('fonts/GandhiSans-Bold-webfont.eot');
    src: url('fonts/GandhiSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/GandhiSans-Bold-webfont.woff') format('woff'),
         url('fonts/GandhiSans-Bold-webfont.ttf') format('truetype'),
         url('fonts/GandhiSans-Bold-webfont.svg#gandhi_sansbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* General styles */
body {
    width: 960px;
    margin: 0 auto;
    padding: 0;
    font-family: 'gandhi_sansregular', sans-serif;
    position: relative;
    background-color: #fff;
    color: #000;
}

a { color: #cc2a1d; }
a.active { color: #d3a500; }

.container, body > article {
    width: 590px;
    margin-right: 34px;
}

.clearfix {
    width: 100%;
    clear: both;
}

mark, .highlight {
    color: #cc2a1d;
    background-color: transparent;
}

p {
	font-size: 13pt;
}

/* Page header */
header { }

header h1, .separator {
    margin-left: -37px;
}

header h1 a {
    color: transparent;
    background-image: url("images/logo.png");
    background-repeat: no-repeat;
    display: block;
    width: 340px;
    height: 154px;
    background-size: cover;
    text-decoration: none;
}

header .menu {
    /* float: right; */
    position: absolute;
    top: 0;
    right: 0;
    margin: 1ex 0;
    padding: 0;

    text-transform: uppercase;
    font-size: 121.5%;
    font-weight: bold;
    list-style: none;
}
header .menu a {
    text-decoration: none;
}
header .menu .current-menu-item a,
header .menu .current_page_item a {
    color: #d3a500;
    text-decoration: underline;
}
header .menu li {
    display: inline-block;
    margin: 0 0 0 2em;
}

header .menu-mobiel-menu-container {
	display: none;
}

header .menu .current_page_item { }

header .message {
  position: absolute;
  top: 80px;
  width: 60%;
  right: 0;
}
header .message a {
  font-size: 13pt;
  text-decoration: none;
}

header .leader {
    width: 60%;
    float: right;
    clear: none;
    /* margin-top: -3em; */
	margin-top: -3.3em;
    /* margin-bottom: 2em; */
	margin-bottom: 1em;
}

/* Sidebar */
aside {
    width: 252px;
    float: right;
    background-color: #b1b3b5;
    padding: 24px;
}
aside li,
.comments h2 {
    font-size: 14pt;
    font-weight: bold;
}

aside h3 {
	text-transform: lowercase;
}

    /* Search form */

aside .searchform {
    position: relative;
}
aside .widget h1, aside .widget h2,
aside .searchform label { display: none; }
aside .searchform input[type="text"] {
    font-size: 18pt;
    width: 100%;
    border: none;
}
aside .searchform input[type="submit"] {
    position: absolute;
    top: 6px;
    right: 4px;
}

    /* Locations widgets */

aside .widget.widget_nav_menu {
    margin-bottom: 6em;
}
aside .widget.widget_nav_menu li {
    margin: 1em 0;
}
aside ul {
    list-style: none;
    padding: 0;
}
aside ul li {
    background-color: #d3a500;
    padding: 1ex 1.5ex;
    text-transform: lowercase;
}
aside ul li a {
    color: #000;
    text-decoration: none;
}

aside .widget_owndk_locations ul {
    position: relative;
}
aside .widget_owndk_locations ul li {
    text-transform: uppercase;
    text-align: center;
    display: inline-block;
    font-size: 28px;
    overflow: hidden;
    width: 55px;
    margin: 0 8px 6px 0;
    padding: 11px 0;
}
aside .widget_owndk_locations ul li:last-child {
    margin-right: 0;
}
aside .widget_owndk_locations ul li {
    color: #000;
    background-color: #fff;
}
aside .widget_owndk_locations ul li.alternate {
    color: #fff;
    background-color: #000;
}
aside .widget_owndk_locations ul.countries-list li {
    color: #000;
    background-color: #d3a500;
}
aside .widget_owndk_locations ul.countries-list li.alternate {
    color: #000;
    background-color: #fff;
}
aside .widget_owndk_locations ul li a { color: inherit; }

    /* Social media widget */
ul.social-media {
}
ul.social-media li {
    display: inline-block;
    width: 55px;
    margin-right: 5px;
    font-size: 62px;
    padding: 0;
    background-color: transparent;
}
ul.social-media li:last-child {
    margin-right: 0;
}
ul.social-media li a {
    color: #cc2a1d;
}

/* Article */
article {
    line-height: 1.4;
}

article .afbeelding {
  display: block;
  width: 100%;
}

article .afbeelding img { 
  max-width: 100% !important; 
  max-height: 350px;
}

article iframe {
  max-width: 100%;
}

article h1,
article h2,
article h3 {
    margin: .5em 0;
}
article h1 {
    font-size: 200%;
}

article h1 a {
    text-decoration: none;
    color: #000;
}

article .wp-post-image {
    margin-top: 2em;
}

article .timestamp {
    color: #b1b3b5;
}

/* Museum article */
.museum {
}

.museum:first-of-type .wp-post-image {
    margin-top: 0 !important;
}

.museum h1 a,
.museum h2 a {
    text-decoration: none;
}
.museum h2 a {
    color: #b1b3b5;
}

.museum h1 a {
    color: #000;
}

.museum-voorzieningen {
    margin-bottom: 3em;
}
.museum-voorzieningen h1,
.museum-voorzieningen h1 a {
    color: #cc2a1d;
}

/* Voorzieningen blok */
.voorzieningen { }

.voorzieningen table {
    text-align: left;
}
.voorzieningen table,
.voorzieningen table th {
    width: 100%;
}
.voorzieningen table th,
.voorzieningen table td {
    margin: 0;
    padding: .5ex 1ex;
}
.voorzieningen table th {
    background-color: #d3a500;
}
.voorzieningen .rating {
    margin-right: 1em;
}
.voorzieningen table tr:first-child th {
    text-transform: uppercase;
}

.praktische_info {
    line-height: 1.5em;
}
.praktische_info p {
    margin: 0;
}

/* Comments */
.comment-form label {
    display: block;
}

.comment-respond textarea {
    min-width: 60ex;
}

.comments {
    background-color: #fff;
}

.comments .comment-list {
    margin: 1em;
}

.comments h2 {
    background-color: #d3a500;
    text-transform: lowercase;
    padding: 4px .5em;
}

.comments .comment-navigation {
    text-align: center;
    padding: 1em 0;
}

.comments .avatar {
    display: none;
}

.comment-metadata, 
.comment-metadata a {
    text-decoration: none;
    color: #b1b3b5;
}

.comment-body {
    padding-bottom: 1em;
}


/* Video/image grids */
.primary-showcase {
    margin-bottom: 2em;
}

.primary-showcase img {
    max-width: 100% !important;
}

.showcase-grid {
    position: relative;
    margin-bottom: 2em;
}
.showcase-grid ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.showcase-grid li {
    position: relative;
    display: inline-block;
    padding: 0;
    margin: 0;
    margin-right: 12px;
    margin-bottom: 12px;
    overflow: hidden;
    width: 186px;
    height: 140px;
}

.showcase-grid li:nth-child(3n) {
    margin-right: 0px;
}

.showcase-grid li img {
    height: 100%;
}

.showcase-grid li span {
    transition: .4s;
}

.showcase-grid li span a {
    color: #000;
    background-color: #fff;
    text-decoration: none;

    display: block;
    position: absolute;

    width: 90%;
    bottom: 16px;
    left: 0;
    padding: 3% 5%;
    opacity: .9;
}

/* Wordpress CSS classes */

.pagination {
    margin: 2em 0;
    padding-bottom: 1em;
    width: 590px;
}
.alignleft {
    float: left;
}
.alignright {
    float: right;
}
.aligncenter {
    margin: 0 auto;
}

.wp-caption-text {
    font-size: 80%;
}

p img {
    padding: 0;
    max-width: 100%;
}
img.alignright {
    float: right;
    margin: 0 0 1em 1em;
}
img.alignleft {
    float: left;
    margin: 0 1em 1em 0;
}
img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
a img.alignright {
    float: right;
    margin: 0 0 1em 1em;
}
a img.alignleft {
    float: left;
    margin: 0 1em 1em 0;
}
a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

img.size-medium {
    margin-right: 1em;
}

hr {
    width: 100%;
    clear: both;
    border: none;
    display: block;
}

#topbuttonholder {
	position: fixed;
	width: 960px;
	height: 0px;
	bottom: 100px;
	margin: 0 auto;
}

#topbutton {
    display: none;
    z-index: 99;
	font-size: 30px;
	width: 50px;
	height: 50px;
	float: right;
	margin-right: 250px;
    border: none;
    outline: none;
    background-color: #cc2a1d;
    color: white;
    cursor: pointer;
    border-radius: 10px;
}

#topbutton:hover {
    background-color: #ec4a3d
}

a.cn-revoke-inline {
	float: right;
	padding-bottom: 10px;
}

.cookie-notice-container {
	width: initial !important;
}