* {
    box-sizing: border-box;
    font-family: 'Roboto', sans-serif;
}

html, body {
    margin: 0;
    color: #303030;
    overflow-x: hidden;
}

a {
    color: #f6c142;
    text-decoration: none;
}
.center {
    margin: 0 auto;
}
#top {
    height: 6rem;
    background-color: #f6c142;  
    xbackground-color: #fbbe0a; 
}

#top #logo {
    background: url(../images/logo@2x.png) no-repeat;
    display: block;
    /* 600 bij 89 */
    width: 300px;
    height: 45px;
    background-size: cover;
    padding: 1rem 0 2rem 0;
    margin-top: 1.4rem;
    
    
}



.holder {
    width: 62.5rem;
    margin: 0 auto;
    overflow: hidden;
}
.holder menu {
    text-align: center;
    padding: 0;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.1rem;
}
.holder menu ul {
    list-style: none;
    padding: 0;
    display: flex;
    
    justify-content: center;
    margin: 0;
}

.holder menu a {
    padding: 1rem 0rem;
    margin: 0 2rem;
    width: 18%;
    color: inherit;
    border-bottom: 1px solid transparent;
}
.holder menu a:hover {
    border-bottom: 1px solid #aaa;
}

.holder h1 {
    text-transform: uppercase;
    color: #f6c142;
    letter-spacing: 0.3rem;
}

.holder h1.of {
    text-transform: none;
    letter-spacing: 0.1rem;

}

.holder #content {
    margin-top: 4.6rem;
}

.holder #content h1 {
    text-align: center;
}

.holder #content .content__holder {
    width: 100%;
    display: flex;
    margin-top: 1rem;
}

.holder #content .content__holder--menu {
    flex: 0 0 14.6rem;
    text-transform: uppercase;
    vertical-align: top;
    
    
}

.holder #content .content__holder--menu ul {
    list-style: none;
    margin: 0; 
    padding: 0;
}

.holder #content .content__holder--menu ul li {
    border-bottom: 1px solid #f6c142;
    width: 8rem;
    padding-bottom: 0.8rem;
    margin-top: 1rem;
    letter-spacing: 0.04rem;
}

.holder #content .content__holder .content__holder--main {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}
.holder #content .content__holder .content__holder--main .collectie {
    flex: 0 0 calc(50% - 2rem);
    margin-right: 4rem;
    margin-bottom: 2.6rem;
}
.holder #content .content__holder .content__holder--main .collectie:nth-child(2n){
    margin-right: 0;
}
.holder #content .content__holder .content__holder--main .collectie img {
    height: 15.875rem;
    max-width: 100%;
    
}


.holder #content .content__holder  p {
    line-height: 2rem;
    
    letter-spacing: 0.05rem;
}
.holder #content .content__holder .content__holder--main .collectie p {
    height: 2rem;
    margin-top: 0;
    line-height: 1.6rem;
    
    letter-spacing: 0.05rem;
}
.holder #content .content__holder .content__holder--main .collectie h2 {
    font-size: 1.16rem;
    font-weight: 600;
    margin-bottom: 0;
    letter-spacing: 0.05em;
    margin-top: 1.2rem;
}
.holder #content .content__holder .content__holder--main .collectie a.explore {
    text-align: right;
    width: 100%;
    display: inline-block;
    letter-spacing: 0.05rem;
    font-weight: bold;
}

.holder #content .content__holder .content__werk {
    width: 52rem;
    margin: 0 auto;
}

.holder #content .content__holder .content__werk p {
    width: 34rem;
    margin: 2rem auto;
}
.holder #content .content__holder .content__werk img {
    display: block;
    margin: 0 auto;
}
.holder #content .content__holder .content__werk h2 {
    color: #f6c142;
    text-align: center;
    letter-spacing: 0.08rem;
    margin: 2rem 0;
}
.first-letter {
    font-size: 5rem;
    line-height: 5rem;
    float: left;
    padding: 0 1rem 0rem 0rem;
    
}

 .images {
    list-style: none;
    padding: 0;
    display: flex;
    margin: 0;
    margin-top: 3rem;
    width: 100%;
    align-items: center;
    justify-content: center;
    
}

 .images li {
     /* was 200px */
    flex: 0 0 140px;
    margin-right: 1rem;
    
}
 .images li img {
    max-width: 100%;
    
}

.nm {
    margin-top: 0 !important;
}
.holder #content .content__holder .content__werk h3 {
    font-weight: normal;
    text-align: center;
    text-transform: uppercase;
    font-size: 1rem;
    color: #aaa;
    margin-bottom: 2rem;
    letter-spacing: 0.2rem;
}   

.holder #content .content__holder .content__werk figcaption {
    text-align: center;
    font-size: 0.8rem;
    color: #aaa;
    margin-top: 1rem;
    margin-bottom: 3rem;
    line-height: 1.4rem;
    
}

.holder #content .content__holder .content__werk h1 {
    text-transform: none;
    margin-bottom: 2rem;
    margin-top: 0;
    letter-spacing: 0.08rem;
}



.holder #content .content__holder .content__werk .intro {
    text-align: center;
    margin-bottom: 2.4rem;
    margin-top: 0;
}

.holder #holder__footer {
    border-top: 1px solid #f6c142;
    display: flex;
    width: 100%;
    padding-top: 5rem;
    margin-top: 5rem;
    font-size: 0.8rem;
}

.holder #holder__footer .footer__item {
    flex: 0 0 20%;
}

.holder #holder__footer .footer__item #logo {
    background: url(../images/logo-postzegel@2x.png) no-repeat;
    width: 100px;
    height: 119px;
    background-size: cover;
    

}

.holder #holder__footer .footer__item h3 {
    font-size: 0.8rem;
    margin-top: 0;
    letter-spacing: 0.05rem;
    text-transform: uppercase;
}

.holder #holder__footer .footer__item ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.holder #content .content__holder--menu ul li:nth-child(1) {
    margin-top: 0;

}
.holder #holder__footer .footer__item ul li {
    margin-bottom: 0.6rem;
    letter-spacing: 0.05rem;
}

footer {
    width: 100%;
    background-color: #f6c142;
    overflow: hidden;
    color: #fff;
    padding: 1.2rem 0;
    margin-top: 4rem;
}

footer #footer__holder {
    width: 62.5rem;
    margin: 0 auto;
    font-size: 0.8rem;
}

footer #footer__holder ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
}

footer #footer__holder ul li {
    margin: 0 1rem;
}

.content__werk .main-image {
    display: flex;
    align-items: center; 
    width: 100%;
    margin: 0 auto;
    
    
    
    
}

.arrow-right,
.arrow-left {
    background: url(../images/next.png) no-repeat;
    width: 30px;
    height: 30px;
    background-size: cover;
    flex: 0 0 30px;
    cursor: pointer;
}
.arrow-left {
    margin-right: 2rem;
    transform: rotateY(180deg);
}
.arrow-right {
    margin-left: 2rem;
    
}
.argh {
    overflow: auto;
    padding: 1px;
}
.hidden {
    overflow: hidden; 
    height: 0px; 
    width: 0px;
}
.bump {
    display: inline-block;
    margin-top: 5rem !important;
    margin-bottom: 2rem !important;
}


hr {
    border: 0;
    border-top: 1px solid #f6c142;
    display: block;
    margin: 4rem 0;
    width: 100%;
}
.content__werk .main-image__holder {
    flex: 1 1 auto;
    overflow: hidden;
}
.main-image__holder ul {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;
    overflow: hidden;
}
.main-image__holder ul li {
    flex: 0 0 100%;
}
.content__werk .main-image__holder img {
    max-width: 100%;
}
.gedicht {
    width: 708px;
    height: 658px;
    background: url(../images/6---GEDICHT---achtergrond.jpg) no-repeat;
    margin: 0 auto;
    padding: 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.gedicht .gedicht__tekst {
    color: #fff;
    font-size: 0.9rem;
    width: 20rem !important;
    line-height: 1.4rem !important;
}
.gedicht .gedicht__detail {
    width: 222px;
    position: absolute;
    height: 207px;
    right: -100px;
    margin-top: 18rem;
    background: url(../images/gedicht_detail.jpg) no-repeat;
    bottom: 6rem;
}

.content__holder--double {
    display: flex;
    width: 100%;
    flex-wrap: wrap;

    justify-content: center;
}
.double__work {
    margin-right: 2rem;
}

.gedicht--bushido {
    background-image: url(../images/5---Bushido---Achtergrond-voor-gedicht.jpg);
}

.gedicht__detail--bushdio {
    background-image: url(../images/5a---Bushido---Detail-voor-bij-gedicht.jpg) !important;
}
.gedicht--anam {
    background-image: url(../images/Spiralen-dansend-op-de-piano---Achtergrond-voor-gedicht.jpg) !important;
}
.gedicht__detail--anam {
    background-image: url(../images/Anam-Cara---detail-voor-bij-gedicht.jpg) !important;
}

.yellow-intro {
    font-weight: bold;
    color: #f6c142;
}

.gedicht--dragon {
    background-image: url(../images/3----Dragon1.jpg) !important;
    background-image: url(../images/3---Achtergrond-gedicht-1---ALTERNATIEF!.jpg) !important;
    background-size: cover;
    
}
.gedicht__detail--dragon {
    background-image: url(../images/3a----Dragon-detail-bij-gedicht-1.jpg) !important;
}
.gedicht--dragon2 {
    background-image: url(../images/4---Achtergrond-gedicht-2---ALTERNATIEF!.jpg) !important;
}
.gedicht__detail--dragon2 {
    background-image: url(../images/4a----Dragons-Flight-TIF---detail-bij-gedicht-2--x.jpg) !important;
}
.dws-gedicht {
  background-image: url('/images/Dance-with-Saturnus---vergroting-voor-achtergrond-gedicht.jpg') !important;
}

.collectie__image {
    position: relative;
    height: 15.875rem;
    max-width: 100%;
}
.collectie__image img {
    position: absolute;
    -webkit-transition: opacity 1s ease-in-out;
  -moz-transition: opacity 1s ease-in-out;
  -o-transition: opacity 1s ease-in-out;
  transition: opacity 1s ease-in-out;
}
.collectie__image img.first:hover {
    opacity: 0;
}

.alt_gedicht {
    width: 708px;
    height: 658px;
    background-color: #f2f2f2;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
}
.alt_gedicht img {
    margin: 0 !important;
}
.holder #content .content__holder .alt_gedicht .alt_gedicht__text {
    margin: 4rem auto;
    width: 20rem;
}

.simages,
.himages {
    list-style: none;
    padding: 0;
    display: flex;
    margin: 0;
    margin-top: 3rem;
    width: 100%;
    align-items: center;
    justify-content: center;
    
    
}

.simages li,
 .himages li {
    flex: 0 1 auto;
    margin-right: 1rem;
    height: 200px;
    
}
.as {
    padding: 0 2rem;
}
.as img {
    max-width: 100%;
    margin-bottom: 1rem;
}
.ornament {
    max-width: 400px;
    padding-top: 2rem;
}
.simages li {
    height: 160px;
}

.himages li img {
    max-width: 400px;
    height: 100%;
    
}
.simages li img {
    max-width: 300px;
    height: 100%;
}
.double__work h2 {
    margin-top: 0 !important;
}

.source {
    font-size: 0.8em;
    text-align: right;
}

.notop {
    margin-top: 0 !important;
}
.content__holder--menu a {
    color: inherit;
}

.bold {
    font-weight: bold;
}
.cv {
    width: 34rem;
    margin: 4rem auto 2rem auto;
    background-color: #e7e6e6;
    padding: 2rem 1rem;
    line-height: 2rem;
    letter-spacing: 0.05rem;

}
.cv ul li {
    margin-bottom: 2rem;
}
.small {
    font-size: 0.8rem;
    line-height: 1.4rem !important;
}

.quote {
    font-style: italic;
    color: #f6c142;
	font-size: 1rem;
}
.right_link {
    color: #f6c142;
    font-weight: bold;
    display: block;
    text-align: right;
}
ol {
    width: 34rem;
    margin: 2rem auto 0 auto;
    font-size: 0.95rem;
    line-height: 2rem;
    font-style: italic;
    padding-left: 5rem;
    
}
ol li {
    padding-left: 1rem;
    margin-bottom: 0.35rem;
}
.mbottom {
    margin-bottom: 1rem;
}
.noflex {
    display: block !important;
}
.noflex h3 {
    margin-top: 0;
    margin-bottom: 0;
}
.contact {
    background-color: #e6e6e6;
    padding: 4rem;
    
}
.holder #content .content__holder .contact-left {
    flex: 0 0 400px;
    margin-right: 2rem;
}
.contact label {
    display: block;
    margin-bottom: 0.6rem;
    margin-top: 1rem;
}
button,
.contact input {
    margin-bottom: 1rem;
    font-size: 1rem;
    padding: 6px;
    border: 1px solid #aaa;
}
button,
.contact textarea,
.contact input {
    width: 24rem;
}


button,
.contact input[type="submit"] {
    display: block;
    margin-top: 2rem;
    background-color: #f6c142;
    border: 0;
    color: #fff;
    font-size: 1rem;
    letter-spacing: 0.3rem;
    font-weight: bold;
    padding: 1rem 0;
}
.contact textarea {
    
    height: 10rem;
    border: 1px solid #aaa;
    resize: none;
}

#home__carousel {
    width: 100%;
    display: flex;
    margin-top: 1rem;
    align-items: center;
    justify-content: center;
    
}

#home__carousel .item {
    margin-right: 1rem;
    letter-spacing: 0.05rem;
    color: #000;
}

#home__carousel .item img {
    height: 400px;
}
.item strong {
    color: #f6c142;;
}


.row .item a {
    color: inherit;
}
#home__other {
    width: 52rem;
    margin: 0 auto;
    display: flex;

}
#home__other .row {
    flex: 1 1 50%;
    margin-right: 4rem;
}
#home__other .row .item p {
    margin-bottom: 4rem;
}
#home__other .row:nth-child(2){
    margin-right: 0;
}
.meer-op-deze-site {
    width: 52rem;
    margin: 4rem auto 3rem auto;
    text-transform: none !important;
    text-align: center;

}
.testimonial {
    width: 52rem;
    margin: 2rem auto 6rem auto;
    text-align: center;
    color: #aaa;
    font-size: 1.4em;
    font-style: italic;
    line-height: 2em;
    
}
.anders {
    font-size: 1.1rem;
}

.smaller-holder {
    flex: 0 1 34rem !important;
    
}
.smaller-image {
    width: calc(38rem + 60px) !important;
    justify-content: center;
}

.footer__item a {
    color:inherit;
}

.nodown {
    margin-bottom: 0 !important;
}
.noup {
    margin-top: 0 !important;
}
.oranje,
.anam-cara_link {
    color: #f6c142;
}

.goodbye {
    font-size: 1.4rem;
    font-weight: normal;
}

.images li.image-height {
    flex: 1 0 auto;
}

.content__werk .more-space {
    margin-bottom: 4rem;

}
.less-top {
    margin-top: 0.4rem;
}
.carousel {
    scroll-behavior: smooth;
}
.nodesktop {
    display: none !important;
}
.gedicht, .alt_gedicht {
    margin-bottom: 2rem;
}
.folder {
    padding: 1rem 0rem;
    
}
.nm {
	margin-bottom: 0 !important;

}

.bump {
	margin-bottom: 3rem !important;
}

.mb {

}
.images li.ttt {
    flex: 0 0 300px;
    }
.figadjust {
  margin-bottom: 2rem !important;
}

.smaller_head {
    font-size: 0.8rem;
    font-weight: normal;
}
#quote {
    color: #aaa;
    font-style: italic;
    text-align: center;
    font-weight: normal;
}
.neg_margin {
    margin-top: -1rem !important;
}
#home__other {
}
#home__other img {
    max-width: 100%;
}
.fw {
    flex: 0 0 100%;
    display: block;
}
.wrap {
    flex-wrap: wrap;
}

#home__other h2 {
    text-align: center;
    width: 100%;
    color: #f6c142;
}
.quote.blue {
    padding: 0 1rem;
}
.blue {
    color: #0070c0 !important;
}
.nmb {
    margin-bottom: 0 !important;
}