/* CSS Document */
/* CSS Document */


/** {
padding:0;
margin:0;
}*/
table, p, ul, ol, li h1, h2, h3, h4, hr blockquote{
margin: 0px;
padding: 0px;
}
/********************************************** HTML & BODY ***************************************** */
html{

font-size:16px;
 /*scroll-behavior: smooth; */
}
body {
font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif;
padding: 0;
margin: 0;
}
/**********************************************************************************************************************/
/************************************* HEADINGS 1 2 3 and 4 *********************************************************/
/**********************************************************************************************************************/

/******************************** HEADING ONE ********************************************/

h1, h2, h3, h4, h5, h6 {
/*font-family: 'Libre Caslon Display', serif;*/
c
color: #333333;
font-weight:normal
}
#header-top { /*this cancels margin top and bottom from H1 headings inhereted from .main-content */
margin-bottom: 0px;
margin-top:0px;
}
@media (min-width: 0px) {
h1 {
font-size: 1.90rem;
margin-top: 1rem;
margin-bottom: 1.2rem;
line-height: 1.9rem;
}
}
@media (min-width: 576px) {
h1 {
font-size: 1.9rem;
letter-spacing: 0rem;
margin-top:2rem;
line-height: 1.9rem;
}
}
@media (min-width: 768px) {
h1 {
font-size: 2.2rem;
letter-spacing: .1rem;
margin-bottom: 2.2rem;
margin-bottom: 2.2rem;
line-height: 2.4rem;
}
}
@media (min-width: 992px) {
h1 {
font-size: 2.2rem;
letter-spacing: .1rem;
margin-bottom: 2.2rem;
margin-bottom: 2.2rem;
line-height: 2.4rem;
}
}
@media (min-width: 1200px) {
h1 {
font-size: 2.2rem;
letter-spacing: .1rem;
margin-bottom: 2.2rem;
margin-bottom: 2.2rem;
line-height: 2.4rem;
}
}
/*************** SMALL for smaller text and TEXT MEDIUM (for "part one" & "part two") TEXT SIZES **********************/
 
@media (min-width: 0px){
#header-top .text-medium {
padding-top: .25rem;
padding-bottom: 0px;
font-size: .9rem;
color: black;
font-style:italic;
}}
@media (min-width: 576px) {
#header-top .text-medium {
padding-top: .45rem;
padding-bottom: 0px;
font-size: .9rem;
color: black;
font-style:italic;	
}}
@media (min-width: 768px) {
#header-top .text-medium {
padding-top: .45rem;
padding-bottom:0px;
font-size: 1rem;
color: black;
font-style:italic;	
}}
@media (min-width: 992px)  {
#header-top .text-medium {
padding-top: .45rem;
padding-bottom:0px;
font-size: 1rem;
color: black;
font-style:italic;		
}
}
@media (min-width: 1200px) {
#header-top .text-medium {
padding-top: .45rem;
padding-bottom:0px;
font-size: 1rem;
color: black;
font-style:italic;	
}
}
/******************************** HEADING TWO ********************************************/
@media (min-width: 0px) {
h2 {
font-size: 1.5rem;
letter-spacing: 0rem;
line-height: 1.7rem;
margin-top: .5rem;
margin-bottom: 1.3rem;
font-weight:normal;
color: black;
}
}
@media (min-width: 576px) {
h2 {
font-size: 1.5rem;
letter-spacing: 0rem;
line-height: 1.7rem;
margin-top: .5rem;
margin-bottom: 1.3rem;
padding-bottom:0px;
font-weight:normal;
color: black;
}
}
@media (min-width: 768px) {
h2 {
font-size: 1.5rem;
margin-top: .5rem;
margin-bottom: 1.3rem;
font-weight:normal;
color: black;
}
}
@media (min-width: 992px) {
h2 {
font-size: 1.5rem;
letter-spacing: .05rem;
margin-top: 0rem;
margin-bottom: 1.3rem;
font-weight:normal;
color: black;
}
}
@media (min-width: 1200px) {
h2 {
font-size: 1.5rem;
letter-spacing: .05rem;
margin-top: 0rem;
margin-bottom: 1.3rem;
font-weight:normal;
color: black;
}
}
/***************************************** SPECIFIC HEADING 2  and HEADINK LINK RULES *****************************************/
h2.no-margin-top, h2.bookshop {
margin: .6rem 0rem .6rem 0rem;
font-weight:normal;
}
h2.no-margin-top {	
margin-top: 0rem;
font-weight:normal;	
}
.events-left h2.bookshop{	
margin-top: 0rem;
padding-top: 0rem;
padding-bottom:.3rem;
margin-bottom:0px;
font-size: 1.1rem;
line-height: 1.2rem;
font-weight:normal;
font-style:italic;	
}
h2 a:link,  h2.no-margin-top a:link, h2.bookshop a:link{
color: #333333;
text-decoration: none;
border-bottom: none;
font-weight:normal;  
}
h2 a:visited,  h2.no-margin-top a:visited, h2.bookshop a:visited{
color: #333333;
font-weight:normal;    
}
h2 a:hover,  h2.no-margin-top a:hover, h2.bookshop a:hover{
color: #cccccc;  
font-weight:normal; 
}
/******************************** HEADING 3 ********************************************/ 
h3 {
color: black;
font-size: 1.3rem;
margin: 0rem 0rem 1.4rem 0rem;
line-height: 1.2em;
letter-spacing: 0.025rem;
clear: both;
text-align: left;
font-weight:normal;
}
@media (min-width: 576px) {
h3 {
color: black;
font-size: 1.3rem;
margin: 0rem 0rem 1.4rem 0rem;
line-height: 1.2em;
clear: both;
font-weight:normal;
}
}
 /******************************** HEADING 4 ********************************************/
h4 {
margin-bottom:1rem;
font-size: 1em;
margin: 0rem 0rem 0rem 0rem;
padding: .3rem 0rem .5rem 0rem;
font-weight:100;
line-height: 1.2rem;
letter-spacing: 0.025rem;
text-transform:uppercase;
}
h4.dutch-timeline-painters {
margin-bottom:1rem;
color: black;
font-size: 1rem;
margin: 0rem 0rem 1rem 1.1rem;
font-weight:100;
line-height: 1.2rem;
letter-spacing: 0.025rem;
clear: both;
}
.main-content .smallish-text {
 font-size:95%;
 line-height:1rem;
 display:inline-block;
 padding: 0rem .5rem .3rem .6rem;
 border-left: 1px solid #cccccc;
 margin-bottom: 1rem;
 text-decoration:none;
 word-wrap: break-word;
 }
 
 .main-content a.smallish-text {
 word-wrap: break-word;
 }
 
 small {
    font-size: 80%;
	line-height: 6rem;
}
/*********************************************************************************************************/
/********************************************** TOP ******************************************************/
/*********************************************************************************************************/

/******************** ANNOUNCEMENT or ADVERTISEMENT at TOP OF PAGE **********************************/
.ad {
background-color:pink;
background-image:url(../directoryimages/favorite-ad-SML.jpg);
background-repeat:no-repeat;
background-position:left;
color:#999999;
margin-bottom: 0rem;
text-align: center;
height: 121px;
width:100%;
font-size:2rem;
text-align:center;
color: #cccccc;
padding-top:70px;
display:none;
}

.ad a:link{
color: #cccccc;
}

.ad a:visited{
color: #cccccc;
}

.ad a:hover {
color: #F7F7F7;
text-decoration:none;
border-bottom: 1px solid #cccccc;
}
/******************************* JUMBOTRON *************************************************/
@media (min-width: 0px)  {
.jumbotron {
background-image: url(background-images/jumbotron-study.jpg);
background-repeat:no-repeat;
background-size: cover;
background-position: center center;
margin-bottom: 0;
-webkit-border-radius: 0 !important;
-moz-border-radius: 0 !important;
border-radius: 0 !important;
height:250px;
}
}
@media (min-width: 576px)  {
.jumbotron {
background-image: url(background-images/jumbotron-writing.jpg);
background-repeat:no-repeat;
background-size: cover;
background-position: center center;
margin-bottom: 0;
-webkit-border-radius: 0 !important;
-moz-border-radius: 0 !important;
border-radius: 0 !important;
height:250px;
}
}
@media (min-width: 768px) {
.jumbotron {
background-image: url(background-images/jumbotron-art.jpg);
background-repeat:no-repeat;
background-size: cover;
background-position: center center;
margin-bottom: 0;
-webkit-border-radius: 0 !important;
-moz-border-radius: 0 !important;
border-radius: 0 !important;
height:400px;
}
}
@media (min-width: 992px) {
.jumbotron {
background-image: url(background-images/jumbotron-berlin.jpg);
background-repeat:no-repeat;
background-size: cover;
background-position: center center;
margin-bottom: 0;
-webkit-border-radius: 0 !important;
-moz-border-radius: 0 !important;
border-radius: 0 !important;
height:400px;
}
}
@media (min-width: 1200px) {
.jumbotron {
background-image: url(background-images/jumbotron-clouds.jpg);
background-repeat:no-repeat;
/*background-size: cover;*/
background-position: bottom -40px left;
height:400px;
margin-bottom: 0;
-webkit-border-radius: 0 !important;
-moz-border-radius: 0 !important;
border-radius: 0 !important;
}
}
/*************************** MISC ELEMENTS AT TOP OF PAGE  **********************************/
/************* anchor at top of page for eventual scroll up and scroll down offset *******/
#top-offset {
position:absolute;
top:410px;
}
@media (max-width: 768px) {
#top-offset {
position:absolute;
top:250px;
}
}
.ev-three-dot-o {
font-family: 'Lato', sans-serif;
display:block;
position: relative;
font-size: 3.5rem;
color: white;
opacity: .3;
text-align: center;
top:58%;
}
@media (min-width: 1200px) {
 .ev-three-dot-o {
display:block;
position: relative;
font-size: 3.5rem;
color: black;
opacity: .08;
text-align: center;
top:40%;
}
}
/************ removes "3.0" from ESSENTIAL VERMEER 3.0 in small device navbars ***********************************/
@media (max-width: 350px) {
.three-point-o {
display: none; 
}
}
/******************************************************************************/
/*************************** NAVIGATION BAR **********************************/
/******************************************************************************/
 nav   {
font-family: 'Lato', sans-serif;
margin-bottom: 0rem;
padding-bottom: -1rem;
}


.navbar {
backgound-image: none;
background-color: white;
border-bottom: 1px solid #cccccc;
border-top: 1px solid #cccccc;
z-index: 1020;
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 1020;
background-image: url(svg-images/ev-brands.svg);
background-position: 0px 0px;
background-repeat:no-repeat;
}
.navbar .navbar-nav .my-link {
color: #666666;
font-size: .75rem;
margin: 0rem .5rem 0rem .5rem;
border-bottom: 1px solid transparent;
-webkit-transition: all 400ms ease;
-moz-transition: all 400ms ease;
-ms-transition: all 400ms ease;
-o-transition: all 400ms ease;
transition: all 400ms ease; 
}
.navbar .navbar-nav .my-link:hover {
font-size: .75rem;
margin:0rem .5rem 0rem .5rem;
border-bottom: 1px solid #aaaaaa;
color: #999999;
text-decoration: none;
}
.navbar-brand {
line-height:1rem;
width:28px;
height: 20px;
}
.navbar-text {
font-size: 1.1rem;
line-height: 1rem;
letter-spacing: 0rem;
font-weight: normal;
display: inline-block;
padding-top: 1px;
padding-bottom: 0; 
margin-top: 0;
margin-bottom: 0; 
}
.navbar-toggler-icon {
display: inline-block;
width: 1rem;
height: 1rem;
vertical-align: middle;
content: "";
background: no-repeat center center;
background-size: 100% 100%;
}
.navbar-light .navbar-toggler-icon {
 border: 0px;
}
.navbar-light .navbar-toggler {
 border: 0px;
}
.nav-search {
font-size: .65em;
width: 4.7rem;
text-transform:uppercase;
color: #6666666;
border: 1px solid #999999;
padding: .1rem 1.8rem 0.09rem 1rem;
margin-right: 2rem;
margin-top: 2px;
line-height: 1;
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
-webkit-transition: all 400ms ease;
-moz-transition: all 400ms ease;
-ms-transition: all 400ms ease;
-o-transition: all 400ms ease;
transition: all 400ms ease; 
}
.nav-search:hover {
color:#999999;
border: 1px solid #bbbbbb;
cursor:pointer;
}
.navbar-nav > li {
font-size: 20px;
  }
.dropdown-menu {
font-size: 20px;
z-index:1210;
}
.navbar-nav .dropdown-menu { /*puts light bottom shadow on navbar dropdown menu*/
position: static;
float: none;
border-radius: 0rem;
box-shadow: 0 8px 6px -6px #dddddd;
}

.my-dopdown-navbar-link  { /*determines rules for font aize and spacing in navbar menu dropdown POPULAR PAGES menu*/
font-size: .9rem;
line-height:1.4rem;
}
	  
#hide-most-popular {
display:block;
}
@media (max-width: 900px) {
#hide-most-popular {
display:none;
}
} 
#hide-events {
display:block;
}
@media (max-width: 950px) {
#hide-events {
display:none;
}
} 

/******************************** TOAST ******************************* */
.toast  {
color: #666666;
max-width: 2000px;
padding: 0px;
margin: 0px;
border:0;*5
}
.toast-body {
 background-color: #daecfb;
 color: #666666;
 font-family: 'Lato', sans-serif;
 font-size: 1rem;
 text-align:center;
 line-spacing: .1rem;
 line-height: 1rem;
 padding: 15px 0px  15px  0px; 
}
@media (max-width: 440px) { 
.toast-body {
 color: #666666;
 font-size: .8rem;
 text-align:center;
 line-spacing: .1rem;
 line-height: 1rem;
 padding: 10px  03px  10px  0px; 
}
}
.toast-body a:link {
 color:  #666666;
 clear:none;
 text-decoration:none;
  -webkit-transition: all 400ms ease;
-moz-transition: all 400ms ease;
-ms-transition: all 400ms ease;
-o-transition: all 400ms ease;
transition: all 400ms ease; 
}
.toast-body a:visited{
 color: #666666;
clear:none;
 text-decoration:none;
}
.toast-body a:hover{
color: #666666;
clear:none;
text-decoration:none;
border-bottom: 3px solid #999999;
}
button.close {
margin-right:1rem;
line-height:1;
font-size: 1.4rem;
padding: 0px 0px;
float:right;
display: block;
clear:none;
 /*display:none;*/
}
.toast-header {
 display:none;
}
/******************************** TOAST DRESDEN SURVEY ******************************* */

.toast-dresden  {
color: #666666;
Background-color:pink;
width: 350px;
padding: 0px;
margin: 0px;
border:0;*5
}
.toast-dresden-body {
 background-color: #daecfb;
 color: #666666;
 font-family: 'Lato', sans-serif;
 font-size: 1rem;
 text-align:center;
 line-spacing: .1rem;
 line-height: 1rem;
 padding: 15px 0px  15px  0px; 
}
@media (max-width: 440px) { 
.toast-dresden-body {
 color: #666666;
 font-size: .8rem;
 text-align:center;
 line-spacing: .1rem;
 line-height: 1rem;
 padding: 10px  03px  10px  0px; 
}
}
.toast-dresden-body a:link {
 color:  #666666;
 clear:none;
 text-decoration:none;
  -webkit-transition: all 400ms ease;
-moz-transition: all 400ms ease;
-ms-transition: all 400ms ease;
-o-transition: all 400ms ease;
transition: all 400ms ease; 
}
.toast-dresden-body a:visited{
 color: #666666;
clear:none;
 text-decoration:none;
}
.ttoast-dresden-body a:hover{
color: #666666;
clear:none;
text-decoration:none;
border-bottom: 3px solid #999999;
}
button.close {
margin-right:1rem;
line-height:1;
font-size: 1.4rem;
padding: 0px 0px;
float:right;
display: block;
clear:none;
 /*display:none;*/
}
.toast-dresden-header {
 display:none;
}
/******************************** MINOR ELEMENTS ******************************* */
bold, strong {
font-weight:bold;
opacity: .8;
}
blockquote {
margin-left: 10%;
margin-right: 10%;
}
blockquote p{
font-style: normal;
}
/*************************************** LINE ************************************** */
hr {
border-top: 1px solid #dbc8ca;
border-bottom: 0px solid white;
clear: both;
margin: 0 0 1.5rem 0;
}
hr.double {
border-top:  4px double #888888;
}
/************ LINE WITH EXTRA MARGIN USED ONLY IN CATALOGUE SECTION ************** */
hr.menu {
border-top: 1px solid #dbc8ca;
border-bottom: 0px solid white;
clear: both;
margin: .3rem 0rem .5rem 0rem;
}
/************ LINE WITH EXTRA MARGIN USED ONLY IN CATALOGUE SECTION ************** */
hr.catalogue-line {
border-top: 1px solid #dbc8ca;
border-bottom: 0px solid white;
clear: both;
margin: 0 0 .8rem 0;
}
/************ LINE INSIDE EXTRA CONTENET MENUS ************** */
 .menu-line {
border-top: 1px solid #dbc8ca;
border-bottom: 0px solid white;
clear: both;
margin-top: 1rem;
margin-bottom: 1rem;
}

div.scroll-div { 
overflow-x: auto; 
overflow-y: hidden; 
white-space: nowrap; 
} 
 
/**********************************************************************************************************************/
/******************************* MAIN CONTENT and MAIN OBJECTS IN IT *************************************************/
/**********************************************************************************************************************/
@media (min-width: 0px)  {
.main-content   {
margin-bottom: 3rem;
}
}
@media (min-width: 576px)  {
.main-content {
font-size: 1.1rem;
padding: 0rem 1rem 0rem 1rem;
margin-bottom: 3rem;
}
}
@media (min-width: 768px)  {
.main-content {
padding: 0rem 1rem 0rem 1rem;
margin-bottom: 3rem;
}
}
@media (min-width: 992px)  {
.main-content   {
margin-bottom: 1rem;
padding: 0rem 3rem 0rem 0rem;
}
}
@media (min-width: 1200px)  {
.main-content  {
margin-bottom: 1rem;
}
}
@media (min-width: 0px)  {
.main-content p {
font-size: 1.15rem;
line-height:1.6rem;
letter-spacing: 0.025rem;
color: #333333;
margin-top: 0rem;
padding-bottom: 1.5rem;
}
}
@media (min-width: 576px)  {
.main-content p {
font-size: 1.15rem;
line-height:1.6rem;
letter-spacing: 0.025rem;
color: #333333;
margin-top: 0rem;
padding-bottom: 1.5rem;
}
}
@media (min-width: 768px) {
.main-content p {
font-size: 1.15rem;
line-height:1.6rem;
letter-spacing: 0.025rem;
color: #333333;
margin-top: 0rem;
padding-bottom: 1.5rem;
}
}
@media (min-width: 992px) {
.main-content p {
font-size: 1.15rem;
line-height:1.6rem;
letter-spacing: 0.025rem;
color: #333333;
margin-top: 0rem;
padding-bottom: 1.5rem;
}
}
@media (min-width: 1200px) {
.main-content p {
font-size: 1.15rem;
line-height:1.6rem;
letter-spacing: 0.025rem;
color: #333333;
margin-top: 0rem;
padding-bottom: 1.5rem;
}
}
/***************** MAIN-CONTENT LINKS *******************************/
.main-content a:link, .btn-link:link {
color:#333333;
text-decoration: none;
border-bottom: 1px solid #d0d0d0;
-webkit-transition: color 300ms ease;
-moz-transition: color 300ms ease;
-ms-transition: color 300ms ease;
-o-transition: color 300ms ease;
transition: color 300ms ease; 
}
.main-content a:visited, .btn-link:visited {
color:#333333;
text-decoration: none;
border-bottom: 1px solid #d0d0d0;
}
.main-content a:hover, .btn-link:hover {
color: #d0d0d0;
text-decoration:none;
border-bottom: 1px solid #f4f4f4;
}
/********************************************************************************************/
/********************************** IMAGE HOLDERS for MAIN TEXT *****************************/
/********************************************************************************************/
.imagehold-center-align, .imagehold-center-align250, .imagehold-center-align300, .imagehold-center-align350, .imagehold-center-align400, .imagehold-center-align450, .imagehold-center-align500, .imagehold-center-align600, .imagehold-center-align700, .imagehold-center-align800 {
margin: 0 1rem 0 1rem;
color: #666666;
font-family: 'Lato', sans-serif;
font-size: .85rem;
line-height: 1.2rem;
text-align: left;
}
.imagehold-center-align250 {
width: 250px;
}
.imagehold-center-align300 {
width: 300px;
}
.imagehold-center-align350 {
width: 350px;
}
.imagehold-center-align400 {
width: 400px;
}
.imagehold-center-align450 {
width: 450px;
}
.imagehold-center-align500 {
width: 500px;
}
.imagehold-center-align600 {
width: 600px;
}
.imagehold-center-align700 {
width: 700px;
}
.imagehold-center-align800 {
width: 800px;
}
.imagehold-center-align a:link, .imagehold-center-align250 a:link,  .imagehold-center-align300 a:link,  .imagehold-center-align350 a:link,  .imagehold-center-align400 a:link,  .imagehold-center-align450 a:link,  .imagehold-center-align500 a:link, .imagehold-center-align600 a:link, .imagehold-center-align700 a:link, .imagehold-center-align800 a:link {
color: #666666;
text-decoration:none;
border-bottom: 1px solid #e1dede;
-webkit-transition: color 500ms ease;
-moz-transition: color 300ms ease;
-ms-transition: color 300ms ease;
-o-transition: color 300ms ease;
transition: color 300ms ease;
}
.imagehold-center-align a:visited,  .imagehold-center-align250 a:visited,  .imagehold-center-align300 a:visited,  .imagehold-center-align350 a:visited,  .imagehold-center-align400 a:visited,  .imagehold-center-align450 a:visited,  .imagehold-center-align500 a:visited, .imagehold-center-align600 a:visited, .imagehold-center-align700 a:visited, .imagehold-center-align800 a:visited  {
color: #666666;
text-decoration:none;
border-bottom: 1px solid #edebeb;
}
.imagehold-center-align a:hover, .imagehold-center-align250 a:hover,  .imagehold-center-align300 a:hover,  .imagehold-center-align350 a:hover,  .imagehold-center-align400 a:hover,  .imagehold-center-align450 a:hover,  .imagehold-center-align500 a:hover, .imagehold-center-align600 a:hover, .imagehold-center-align700 a:hover, .imagehold-center-align800 a:hover {
color: #e1dede;
border-bottom: 1px solid #edebeb;
}
.imagehold-center-align img, .imagehold-center-align250 img,.imagehold-center-align300 img, .imagehold-center-align350 img, .imagehold-center-align400 img, .imagehold-center-align450 img, .imagehold-center-align500 img, .imagehold-center-align600 img, .imagehold-center-align700 img, .imagehold-center-align800 img{
margin-bottom: 1em;
}

.imagehold-center-align {
 min-width: 100%}
/*****************************************************************************************************/
/************************** BASIC IMAGE HOLDERS for MAIN TEXT (FLOAT LEFT)****************************/
/*****************************************************************************************************/
.image-row {
padding: .5em  0rem 1.5rem 0rem;
 
}
@media (max-width: 768px)  {
.image-row {
}
}
.image-row-multiple {
margin: 0rem  0rem 0rem 0rem;

}
@media (max-width: 768px)  {
.image-row-multiple {
margin: 0rem  0rem 0rem 0rem;
}
}
.imagehold120, .imagehold150, .imagehold200, .imagehold210, .imagehold220, .imagehold250, .imagehold300, .imagehold350, .imagehold400, .imagehold450, .imagehold500{
margin: .7rem 2.83rem 1.5rem 0rem;
padding: 0rem 0em 0em 0rem;
color: #666666;
font-family: 'Lato', sans-serif;
font-size: .85rem;
line-height: 1.2rem;
float:left;
text-align: left;
}
.imagehold120 {
width: 120px;
}
.imagehold150 {
width: 150px;
}
.imagehold200 {
width: 200px;
}
.imagehold210 {
width: 210px;
}
.imagehold220 {
width: 220px;
}
.imagehold250 {
width: 250px;
}
.imagehold300 {
width: 300px;
}
.imagehold350 {
width: 350px;
}
.imagehold400 {
width: 400px;
}
.imagehold450 {
width: 450px;
}
.imagehold500 {
width: 500px;
}
.imagehold120 img, .imagehold150 img, .imagehold200 img, .imagehold210 img, .imagehold220 img, .imagehold250 img, .imagehold300 img, .imagehold350 img, .imagehold400 img, .imagehold450 img, .imagehold500 img {
margin-bottom: 1rem;
}
.imagehold120 p, .imagehold150 p, .imagehold200 p, .imagehold220 p, .imagehold250 p, .imagehold300 p, .imagehold350 p, .imagehold450 p, .imagehold500 p {
}
.imagehold120 a:link,  .imagehold150 a:link,  .imagehold200 a:link,  .imagehold210 a:link, .imagehold220 a:link,  .imagehold250 a:link,  .imagehold300 a:link,  .imagehold350 a:link,  .imagehold400 a:link,  .imagehold450 a:link, .imagehold500 a:link {
color: #666666;
text-decoration:none;
border-bottom: 1px solid #e1dede;
-webkit-transition: color 300ms ease;
-moz-transition: color 300ms ease;
-ms-transition: color 300ms ease;
-o-transition: color 300ms ease;
transition: color 300ms ease;
}
.imagehold120 a:visited,  .imagehold150 a:visited,  .imagehold200 a:visited,  .imagehold210 a:visited, .imagehold220 a:visited,  .imagehold250 a:visited,  .imagehold300 a:visited,  .imagehold350 a:visited,  .imagehold400 a:visited,  .imagehold450 a:visited, .imagehold500 a:visited{
color: #666666;
text-decoration:none;
border-bottom: 1px solid #edebeb; 
}
.imagehold120 a:hover,  .imagehold150 a:hover,  .imagehold200 a:hover, .imagehold210 a:hover, .imagehold220 a:hover,  .imagehold250 a:hover,  .imagehold300 a:hover,  .imagehold350 a:hover,  .imagehold400 a:hover,  .imagehold450 a:hover,  .imagehold500 a:hover{
color: #e1dede;
border-bottom: 1px solid #edebeb;
}
/***************************  removes margins from sides of IMAGHEOLD divs that are INSIDE IMAGE-ROW-MULTIPLE divs **************************/
@media (max-width: 768px) {
div.image-row-multiple div.imagehold120, div.image-row-multiple div.imagehold150, div.image-row-multiple div.imagehold200, div.image-row-multiple div.imagehold220, div.image-row-multiple div.imagehold250, div.image-row-multiple div.imagehold300, div.image-row-multiple div.imagehold350, div.image-row-multiple div.imagehold400, div.image-row-multiple div.imagehold450, div.image-row-multiple div.imagehold500, div.image-row-multiple div.imagehold550   {
margin-bottom: 1.5rem;
margin-top: 0;
}
}
/***************** this casues the larger image in IMAGEHOLDXXX divs to center align, resize to 300px an at tablet breakpoint ****************/
@media (max-width: 768px) {
.imagehold250, .imagehold300, .imagehold350, .imagehold400, .imagehold450, .imagehold500{
margin: 0rem auto 1.5rem auto;
float:none;
width:300px;
padding-left: 0px;
padding-right: 0px;
}
}

@media (max-width: 768px) {
.imagehold220 img, .imagehold250 img  {
width:300px;
}
}
@media (max-width: 768px) {
.imagehold120, .imagehold150, .imagehold200, .imagehold210, .imagehold220 {
margin: 0em auto 1.5rem auto;
float:none;
padding-left: 0px;
padding-right: 0px;
}
}
/***********************************************************************************************/
/******************************* NORMAL PRE-SIZED LIGHT BOXES **********************************/
/*************************************************************************************v*********/
.imagehold-lightbox, .imagehold-lightbox-120, .imagehold-lightbox-150, .imagehold-lightbox-200, .imagehold-lightbox-220, .imagehold-lightbox-250, .imagehold-lightbox-300, .imagehold-lightbox-350, .imagehold-lightbox-400, .imagehold-lightbox-450, .imagehold-lightbox-500, .imagehold-lightbox-800{
margin: .7rem 2.83rem 1.5rem 0rem;
padding: 0rem 0em 0em 0rem;
color: #666666;
font-family: 'Lato', sans-serif;
font-size: .85rem;
line-height: 1.2rem;
float:left;
text-align: left;

}
.imagehold-lightbox {
float: left;
}
.imagehold-lightbox-150 {
width: 150px;
}
.imagehold-lightbox-200 {
width: 200px;
}
.imagehold-lightbox-220 {
width: 220px;
}
.imagehold-lightbox-250 {
width: 250px;
}
.imagehold-lightbox-300 {
width: 300px;
}
.imagehold-lightbox-350 {
width: 350px;
}
.imagehold-lightbox-400 {
width: 400px;
}
.imagehold-lightbox-450 {
width: 450px;
}
.imagehold-lightbox-500 {
width: 500px;
}

.imagehold-lightbox-800 {
width: 800px;
}

@media (max-width: 768px) {
.imagehold-lightbox-250, .imagehold-lightbox-300, .imagehold-lightbox-350  {
margin: 1rem auto 1rem auto;
float:none;
padding-left: 0px;
width:250px;
}
}
/****************************************redoes margins of LIGHTBOX divs inside multiple row******************************************/

div.image-row-multiple div.imagehold-lightbox, div.image-row-multiple div.imagehold-lightbox-120, div.image-row-multiple div.imagehold-lightbox-150, div.image-row-multiple div.imagehold-lightbox-200, div.image-row-multiple div.imagehold-lightbox-220, div.image-row-multiple div.imagehold-lightbox-250, div.image-row-multiple div.imagehold-lightbox-300, div.image-row-multiple div.imagehold-lightbox-350, div.image-row-multiple div.imagehold-lightbox-400, div.image-row-multiple div.imagehold-lightbox-450, div.image-row-multiple div.imagehold-lightbox-500   {
margin: 0rem 0rem 1.5rem 0rem;
 
}
 

/****************************************redoes margins of LIGHTBOX divs inside single row******************************************/
 
div.image-row div.imagehold-lightbox, div.image-row div.imagehold-lightbox-120, div.image-row div.imagehold-lightbox-150, div.image-row div.imagehold-lightbox-200, div.image-row div.imagehold-lightbox-220, div.image-row div.imagehold-lightbox-250, div.image-row div.imagehold-lightbox-300, div.image-row div.imagehold-lightbox-350, div.image-row div.imagehold-lightbox-400, div.image-row div.imagehold-lightbox-450, div.image-row div.imagehold-lightbox-500   {
margin: 0rem 0rem .3rem 0rem;
width:250px
}


@media (max-width: 768px) {
.imagehold-lightbox img, .imagehold-lightbox-200 img, .imagehold-lightbox-220 img {
float:none;
width:250;
padding-left: 0px;
}
}
@media (max-width: 768px) {
.imagehold-lightbox-250 img, .imagehold-lightbox-300 img {
float:none;
width:300px;
padding-left: 0px;
}
}

/****************************************************LIGHTBOX  LINKS**************************************************/
.imagehold-lightbox a:link,  .imagehold-lightbox-120 a:link,  .imagehold-lightbox-150 a:link,  .imagehold-lightbox-200 a:link,  .imagehold-lightbox-220 a:link,  .imagehold-lightbox-250 a:link,  .imagehold-lightbox-300 a:link,  .imagehold-lightbox-350 a:link, .imagehold-lightbox-400 a:link, .imagehold-lightbox-450 a:link, .imagehold-lightbox-500 a:link, .imagehold-lightbox-800 a:link {
outline-style: none ;
}


.imagehold-lightbox a:visited,  .imagehold-lightbox-120 a:visited,  .imagehold-lightbox-150 a:visited,  .imagehold-lightbox-200 a:visited,  .imagehold-lightbox-220 a:visited, .imagehold-lightbox-250 a:visited,  .imagehold-lightbox-300 a:visited,  .imagehold-lightbox-350 a:visited,  .imagehold-lightbox-400 a:visited,  .imagehold-lightbox-450 a:visited,  .imagehold-lightbox-500 a:visited, .imagehold-lightbox-800 a:visited  { 
outline-style: none ;
}

.imagehold-lightbox a:hover,  .imagehold-lightbox-120 a:hover,  .imagehold-lightbox-150 a:hover,   .imagehold-lightbox-200 a:hover,  .imagehold-lightbox-220 a:hover,  .imagehold-lightbox-250 a:hover,  .imagehold-lightbox-300 a:hover,  .imagehold-lightbox-350 a:hover,  .imagehold-lightbox-400 a:hover,  .imagehold-lightbox-450 a:hover,  .imagehold-lightbox-500 a:hover, .imagehold-lightbox-800 a:hover {
outline-style: none ;
}
/***************************************************** LIGHTBOX IMAGE ***********************************************************/
 .imagehold-lightbox img, .imagehold-lightbox-120 img,  .imagehold-lightbox-150 img,  .imagehold-lightbox-200 img,  .imagehold-lightbox-220 img,  .imagehold-lightbox-250 img,  .imagehold-lightbox-300 img,  .imagehold-lightbox-350 img,  .imagehold-lightbox-400 img,  .imagehold-lightbox-450 img,  .imagehold-lightbox-500 img, .imagehold-lightbox-800 img  {
background-image: url(svg-images/enlarge-01.svg);
background-size: 14px 12px;
background-repeat: no-repeat;
background-position: right 0rem bottom .2rem;
padding-bottom: 1.4rem;
border: none;
text-decoration: none;
}
/***************************************************** LIGHTBOX SMALL THIUMBNAIL IMAGE HODLER ***********************************************************/
.imagehold-lightbox-thumbnail {
float: none;
margin-left:0rem;
margin-right:0rem;
margin-bottom:3rem;
text-align:left;
font-size: .85rem;
line-height: 1.2rem;
}
.imagehold-lightbox-thumbnail img{
background-image: url(svg-images/enlarge-01.svg);
background-size: 14px 12px;
background-repeat: no-repeat;
background-position: right 0rem bottom .1rem;
padding-bottom: 1rem;
border: none;
text-decoration: none;
}

.lightbox-text:after {
content: url("../css/svg-images/enlarge-01.svg");
 
}

/************************************************* IMAGE CAPTION NUMBER  **************************************************************/
.figure-number-text {
 }
 /************************************* TEXT CAPTION NUMBER inside IMAGEHOLDS with image**********************************************/
.fig-num {
}

/************************************* IMAGE HOLDERS FOR LIGHTBOXES IN VERMEER STAMP SECTION *****************************************/
.imagehold-lightbox-stamps{
line-height: 1.2em;
margin: 3rem auto 1rem auto;
display:block;
float:none;
width:200px;
background-image: none
} 
@media (min-width: 400px) {
.imagehold-lightbox-stamps{
line-height: 1.2em;
float:left;
margin: 0rem .5rem 2rem .5rem;
width:200px;
background-image: none
}
}
a.image_nobrd {
border: none !important;
text-decoration: none !important;
}
.imagehold-add-bottom {
margin-bottom: 2rem
}
/************************************ DIV PRONUNCIATION AUDIO FILES *******************************************/
.pronunciation {
font-size: .9rem;
color:#666666;
font-family: 'Lato', sans-serif;
background-position: 0px 0px;
background-color: #f8f8f8;
background-image: url(background-images/pronounced-background.jpg);
background-repeat: no-repeat;
background-position: 0px 0px;
width: 170px;
float: left;
margin: .5rem 2.83rem 1.5rem 0rem;
padding: 7.8rem .5rem .5rem .6rem;
letter-spacing: .01em;
}
@media (max-width: 500px) {
.pronunciation {
float: none;
margin: 1rem auto 1.5rem auto;
}
}
.pronunciation ul{
padding-bottom: 0rem;
}
.pronunciation li {
background-image: url(svg-images/disk.svg);
background-size: 10px 10px;
background-repeat: no-repeat;
background-position: 0px 6px;
list-style: none;	 
line-height: 1.1rem;
padding-top: .1rem;
padding-bottom: .23rem;
padding-left: 1.3rem;
letter-spacing: .01rem;
}
.pronunciation a:link {
color:#666666;
text-decoration:none;
border-bottom: none;
text-decoration:none;
border-bottom: none;
-webkit-transition: color 400ms ease;
-moz-transition: color 400ms ease;
-ms-transition: color 400ms ease;
-o-transition: color 400ms ease;
transition: color 400ms ease;  	
}
.pronunciation a:visited{
color:#666666;
text-decoration:none;
border-bottom: none;
}
.pronunciation a:hover {
color: #cccccc;
text-decoration:none;
border-bottom: none;
}
.courtesy-marco {
font-size: .75em;
clear:both;
padding: .5em 0rem 0em 0em;
margin-top: .6em;
line-height: 1.4em;
letter-spacing: .01em;
border-top: 1px solid #cccccc;
text-align:center;
}
/********************************************** AFTERLIFE SECTION TABLE **************************************/
h2.afterlife {
padding-top: 0rem;
margin-top: -.5rem;
margin-bottom: 0rem;
padding-bottom: .9rem;
font-size: 1.2rem;
text-transform: uppercase;
line-height: 1.5rem;
text-align: center;
font-weight:normal;
}
.afterlife-table {
float: left;
margin-top: .5rem;
line-height: 1.3rem;
font-size: .85rem;
}
table.afterlife-table  {
border-collapse: collapse;
border: 1px solid #cccccc;
clear: both;
float: left;
padding-bottom: .5em;
margin-bottom: 1.3em;
font-size: .85rem;
line-height: 1.3em;
} 
table tbody .afterlife-table  {
border-collapse: collapse;
border: 1px solid #cccccc;
clear: both;
float: left;
padding-bottom: .5rem;
margin-bottom: 1.3rem; 
}
table.afterlife-table td {
border:1px solid #cccccc;
margin:0;
padding: 6px;
}
table.afterlife-table tr {
border:1px solid #cccccc;
margin:0;
padding: 6px;
}
table.afterlife-table p {
font-size: .85rem;
line-height: 1.2rem;
padding-bottom: 1rem;
}
table.afterlife-table p:last-child {
 padding-bottom:0rem;
}
.afterlife-timelineimages {  
font-size: 95%;
color: #999999;
line-heigth: 1em;
line-height: 1em;
text-align: center;
vertical-align: top;
float: left;
width: 100px;
margin-right: 1em;
padding: 3px 3px 0px 3px;
border-right: 1px solid #cccccc;
}
.afterlife-timelineimages img{
margin-bottom:1rem;
}
table.afterlife-table  a:link {
text-decoration:none;
border-bottom: none;
-webkit-transition: color 500ms ease;
-moz-transition: color 300ms ease;
-ms-transition: color 300ms ease;
-o-transition: color 300ms ease;
transition: color 300ms ease;
}
table.afterlife-table  a:visited  {
text-decoration:none;
border-bottom: none;
}
table.afterlife-table a:hover{
text-decoration: none;
border-bottom: none;
color: #e1dede;
}
.table table .text-small a:link{
border: none;
}
table .text-small a:visited{
border: none;
}
/******************************************************************************************/
/************************************** LISTS *********************************************/
/*****************************************************************************************/
/********************************* ORDERED LIST ********************************************/
/*****************************************************************************************/
ol {
list-style-position: inside;
padding-left:.3rem;
}
ol li {
font-size: 1.1rem;
line-height:1.7rem;
padding-left: .8rem;
list-style-position: inside;
margin-left: 0rem;
padding-bottom: .6rem;
text-indent:-1em;
}
@media (min-width: 576px) {
ol li {
padding-bottom: 1rem;
font-size:  1.15rem;
padding-bottom: .6rem;
line-height:1.7rem;
}
} 
ol li:last-child {
 padding-bottom:1.5rem;
}
ul > li {
    margin-left: 0px;
}
.list-indent  li{
padding-left: 3rem;
margin-bottom: 2rem;
}
/************************ LIST LIST with SVG DISK BULLET  **************************/
.list-bullet ul{
}
.list-bullet li {
background-image: url(svg-images/disk.svg);
background-repeat: no-repeat;
background-position: -1px 7px;
background-size: 11px 11px;
list-style: none;
list-style: none;
line-height: 1.7rem;
padding-bottom: .8rem;
padding-left: 1.3rem; 
font-size: 1.15rem;
}
@media (min-width: 576px) {
.list-bullet li {
padding-bottom: 1.1rem;
font-size: 1.15rem;
}
}
.list-bullet  li:last-child {
padding-bottom: 1.5rem;
}
/************************ LIST LIST with SVG DISK BULLET and SMALL TEXT   **************************/
.list-bullet-small ul{
}
.list-bullet-small li {
background-image: url(svg-images/disk.svg);
background-repeat: no-repeat;
background-position: -1px 8px;
background-size: 9px 9px;
list-style: none;
line-height: 1.7rem;
padding-bottom: .8rem;
padding-left: 1rem; 
font-size: 1.05rem;
}
@media (min-width: 576px) {
.list-bullet-small li {
padding-bottom: 1.1rem;
line-height: 1.5rem;
padding-bottom: .8rem;
font-size: 1.05rem;
}
}
.list-bullet-small li:last-child {
padding-bottom: 1.5rem;
}
/************************ LIST with no BULLETS **************************/
.list-no-bullet ul {
}
.list-no-bullet  li {
font-size: 1.15rem;
line-height: 1.5rem;
padding-bottom: .7rem;
list-style-type: none;
}
@media (min-width: 1200px) {
.list-no-bullet  li {
font-size: 1.15rem;
list-style-type: none;
text-indent: 0rem;
margin-left: 0rem;
padding-bottom: .7rem;
line-height: 1.5rem;
}
}
.list-no-bullet-small ul {
}
.list-no-bullet-small li {
list-style-type: none;
text-indent: 0rem;
margin-left: 0rem;
padding-bottom: .5rem;
font-size: .9rem;
line-height: 1.3rem;
}
.list-no-bullet-small li:last-child {
 padding-bottom:1.5rem;
}
.list-asterix li {
background-image: url(svg-images/disk.svg);
background-repeat: no-repeat;
background-position: -1px 9px;
background-size: 11px 11px;
list-style: none;
list-style: none;line-height: 1.7rem;
padding-bottom: .8rem;
padding-left: 1.3rem; 
}
/**********************************************************************************/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> HORIZONTAL LIST >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
/**********************************************************************************/
.horizontal-list { 
}
.glossary-list {
 margin: 0rem auto 0rem auto;
}
.horizontal-list:after {  
}
.horizontal-list li {
display: inline-block;
list-style-type: none;
padding: 1px 8px 1px 8px;
 margin: 0rem .4rem 0rem .4rem; 
font-size: 1.2rem;
font-weight:normal;
margin-bottom:.5rem;
color: #cccccc;
border: 1px solid #666666;
text-decoration:none;
letter-spacing: -1px;
}
.horizontal-list li:first-child {
margin-left: 0rem;
text-decoration:none;
}
.horizontal-list li:last-child {
margin-right:0rem;
text-decoration:none;
}
.horizontal-list a:link {
color:#666666;
text-decoration:none;
border-bottom: none;
-webkit-transition: color 500ms ease;
-moz-transition: color 300ms ease;
-ms-transition: color 300ms ease;
-o-transition: color 300ms ease;
transition: color 300ms ease;
}
.horizontal-list a:visited {
color:#666666;
text-decoration:none;
border-bottom: none;
}
.horizontal-list a:hover {
color: #cccccc;
text-decoration:none;
border-bottom: none;	 
}

/**************************** DIRECTIONS **********************************/
#directions, #directions-previous, #directions-next {
clear: both;
font-size:.85rem;
margin: .8rem auto 1em auto;
word-spacing: 50px;
width:180px;

padding-bottom: 0px;
background-image:url(background-images/previous-next-arrows.jpg);
background-repeat: no-repeat;
background-position: 0px  3px;
font-family: 'Lato', sans-serif;
text-transform: uppercase;
text-align: center;
}
#directions-previous {
background-position: 3px 2px;
height: 24px;
width: 90px;
padding-left: 14px;
 
}
#directions-next{
background-position: -115px 3px;
height: 24px;
width: 70px;
padding-left: 0px;
padding-bottom: .3em;

}
#directions a:link, #directions-previous a:link, #directions-next a:link {
text-decoration: none;
border-bottom: none;
white-space: nowrap;
}
.directions-left {
float: none;
}
@media (min-width: 576px) {
.directions-left {
float: left;
justify-content: center;
}
}

#survey-sml {
background-image: url(svg-images/survey-sml.svg);
background-repeat: no-repeat;
background-position: 0px  3px;
height: 22px;
width: 20px;

}

/***************** 50% LEFT & RIGHT CONTAINERS *************************/
.fifty-percent-left {
width: 50%;
float:left;
}
.fifty-percent-right  {
width: 50%;
float:left;
margin-left:35px;
}
/***************** 25% LEFT & RIGHT CONTAINERS (used only in GLOSSARY SSECTION *******************************/
.box25percent {
width: 25%;
float:left;
}
/****************************CENTER ALIGN *************************************/
.center-align {
margin-bottom: 2rem;
text-align:center;
}
.center-align img{
margin-left:auto;
margin-right:auto;
padding-bottom: .3rem;
}
.center-align p{
padding-top: .1rem;
padding-bottom: 1.5rem;
}
/***********************************  SPAN for "from:" ******************************/
p.from, p.from-two {
text-transform: uppercase;
border-left: 1px solid #666666;
padding: 0rem 0rem 0rem .5rem;
font-size: .95rem;
margin-top: 1.5rem;
margin-bottom: .9rem;
line-height: .8em;
color:#666666;
/*font-style:italic;*/
}
p.from-two {
text-transform: none;
border-left: 1px solid #666666;
padding: 0rem 0rem 0rem .5rem;
font-size: .95rem;
margin-top: 1.5rem;
margin-bottom: .9rem;
line-height: 1.4em;
color:#333333;
/*font-style:italic;*/
}
.small p{
font-size: .98rem;
 padding-bottom:1rem;
line-height: 1.2em;
color:#333333;
}
.light-gray-background {
background-color: #daecfb;
opacity: .7;
border: 1px solid #666666;
border-radius:1px;
transition: all 0.23s ease-in-out 0s;
padding: 0px 4px 0px 4px;
color: #333333;
font-weight:bold;
margin-right: .1rem;
text-transform: none;
letter-spacing:.08rem;
}
/*************************************************************************************/
/************************ TWO TEXT BOXES with COLORED BACKGROUND **********************/
/**********************************************************************************/
.text-box-blue {
clear: both;
padding: 1.5rem .5rem  0rem .5rem;
margin: 0em 0rem  1.5em 0em;
letter-spacing:.02em;
background-color: #f8f8f8;
border-top: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
}
 @media (min-width: 576px) {
 .text-box-blue {
clear: both;
padding:  1.5rem .5rem  0rem 1.5rem;
margin: 0em 0rem  1.5em 0em;
letter-spacing:.02em;
background-color: #f8f8f8;
border-top: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
}
}
.text-box-blue h3{
margin-bottomn: 1.5rem;
margin-bottom: .7rem;
text-align: left;
margin-top: 0rem;
text-transform: uppercase;
font-size: 1.1rem;
}

@media (max-width: 768px) {
.text-box-blue h3{
margin-bottom: .7rem;
margin-top: 0rem;
text-align: center; 
 
}
}
.text-box-blue p, .text-box-blue li{
padding-bottom: 1.1em;
font-size: 1.075rem;
line-height: 1.6rem;
}
 
@media (min-width: 768px) {
.text-box-blue p, .text-box-blue li{
padding-bottom: 1.1em;
line-height: 1.5rem;;
font-size: 1.1rem;
}
}
/******************************* RELATED TOPICS MENU  on top, right-hand side of  2-BAR PAGES **********************************/
#two-bar-extra-content-menu {
/* background-color: #F6F6F6;*/ 
 width: 100%;
font-size: 1.02rem;
padding:.3em .3em .3em .7em;
margin: .5em auto 1.5em auto;
float:none;
border: 1px solid #cccccc;
line-height: 1.3rem;
 
}
@media (min-width: 576px) {
#two-bar-extra-content-menu {
/* background-color: #F6F6F6;*/
 width: 250px;
font-size: .9rem;
padding: .7em .5em .3em .7em;
margin: .5em .5rem 1.5rem 2rem;
float: right;
border: 1px solid #cccccc;
line-height: 1.3em;
}
}
.two-bar-menu-title-extra-content{
font-family: 'Lato', sans-serif;
color: black;
margin-bottom: 0rem;
text-transform: uppercase;
display:block;
font-size: .95em;
margin: 0em 0em 0em -.1em;
padding-bottom:0em;
padding-top:.4em;
letter-spacing: .1em;
line-height: 1rem;
padding-left: 1em;
}
#two-bar-extra-content-menu ul {
padding-top:.6em;
padding-bottom:.3em;
}
#two-bar-extra-content-menu  li{
background-image: url(svg-images/disk.svg);
background-size: 9px 9px;
background-repeat: no-repeat;
background-position: 0px 7px;
list-style: none;	 
line-height: 1.1rem;
padding-top: .1rem;
padding-bottom: .23rem;
padding-left: 1.3rem;
letter-spacing: .01rem;
}
#two-bar-extra-content-menu a:link {
color: #333333;
text-decoration:none;
border-bottom: none;
-webkit-transition: color 500ms ease;
-moz-transition: color 300ms ease;
-ms-transition: color 300ms ease;
-o-transition: color 300ms ease;
transition: color 300ms ease;
}
#two-bar-extra-content-menu a:visited {
color: #333333;
text-decoration:none; 
}
#two-bar-extra-content-menu a:hover {
color: #e1dede;
border-bottom: none;
}
/*******************************************************************************/
/******************************** FOOTNOTES **********************************/
/*******************************************************************************/
#footnotes {
clear: both;
border-top: 1px solid #cccccc;
padding: 1rem 1.5rem 0rem 0rem;
 
/*background-color: #f6f7f8;*/
/*font-size: .85em;*/
}
/*******************************************************************************/
/*******************************************************************************/
/******************************* LEFT *****************************************/
/*******************************************************************************/
/*******************************************************************************/
/*.sticky {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  background-color: yellow;
}*/

.left {
font-family: 'Lato', sans-serif;
color: #666666;
font-size: .80rem;
line-height:1rem;
position: -webkit-sticky;
position: sticky;
top: 120px;
height:630px;

}
.left a:link{
color: #666666;
text-decoration: none;
border-bottom: 1px solid transparent;
-webkit-transition: border 600ms ease;
-moz-transition: border 600ms ease;
-ms-transition: border 600ms ease;
-o-transition: border 600ms ease;
transition: border 600ms ease;  	
}
.left a:visited {
color: #666666;
}
.left a:hover {
border-bottom: 1px solid color: #cccccc;;
}

.left ul {
padding-left: 3em;
}
.left li {
list-style-type: none;
margin-bottom:1em;
text-indent: 0rem;
margin-left: 0rem;
padding-top: .5rem;
float:left;
}
/*********************** LEFT LIST ICONS ********************************/

 #newsletter-icon, #newsletter, #news, #lightbulb, #email, #facebook, #twitter, #earring, #share-icon, #slideshow, #faq, #info, #share-icon, #instagram, #patreon, #youtube{
/*border: 1px solid #cccccc;
border-radius: 25px;
width: 50px;
height: 50px;
line-height: 0px;*/
display: block;
background-image: url(svg-images/svg-sheet.svg);
background-repeat: no-repeat;
clear: both;
padding-left:3em;
height:30px;
padding-top: 4px;
width:100%;
background-position: 0px  0px;
margin-bottom: .5rem; 
}
#newsletter-icon {
background-position: 0px -50px;
background-repeat: no-repeat;
background-position: 0px -50px;
}
#news   {
background-position: 0px -50px;
}
#lightbulb {
background-position: 0px -100px;
}
#email {
background-position: 0px -150px;
}
#slideshow {
background-position: 0px -200px;
}
#facebook {
background-position: 0px -250px;
}
#twitter {
background-position: 0px -300px;
}
 #youtube {
background-position: 3px -1448px;
}
 
@media (min-width: 992px) {
 
#twitter {
background-position: 0px -300px;
}
#instagram  {
background-position: 0px -350px;
} 
#earring {
background-position: 0px -400px;
}
#share-icon {
background-position: 0px -450px;
}
#info {
background-position: 0px -500px;
}
#patreon {
background-position: 6px -1806px;
}
#youtube {
background-position: 3px -1448px;
}

}

/*#patreon {
background-image: url(svg-images/svg-sheet-02.svg);
background-position: -6px -88px;
}*/

.instagram-lovs  {
width:300px;
height:23px;
padding: 0 0 10px 2rem;
background: url(svg-images/instagram-color-handle-PLAIN.svg);
background-size: 270px;
background-repeat:no-repeat;
background-position: 0px -24px;
margin: 1rem 0 2rem 0; 
}
.instagram-lovs:hover  {
background-position: 0px 0px;
}

/*********************  LOVS Advertisement   ***********************************/

#panel-box-LOVS  {
background-image:url(background-images/panel-box-milkmiad-detail.jpg);
background-size: 100%;
color:white;
}

/*@media (max-width: 992px) {
#panel-box-LOVS  {
background-image:url(background-images/panel-box-milkmiad-detail-second-SALPS.jpg);
background-size: 100%;
color:white;
}
}*/

.LOVS-title {
text-align:center;
padding-left: 1rem;
padding-right: 1rem;
padding-bottom: 110px;
margin-bottom: 0px;
color:white;
font-size: 1.8rem;
}
p.LOVS-text {
text-align:center;
background-color: rgba(0, 0, 0, 0.2);
padding-left: 1rem; padding-right: 1rem;
padding-bottom: 1rem;
color:white; 
font-size: 1.1rem;
}
p.LOVS-info {
padding-bottom:.1rem;
font-weight: bold;
margin-left:1rem;
text-align:center;
color:white;
font-size: .9rem;
}
#look-inside-LOVS {
background-image: url(svg-images/svg-sheet-02.svg);
background-repeat:no-repeat;
background-position: -16px -300px;
 width:140px;
 height: 50px;
/*border: lime dotted 2px;*/
 margin: 8px 0px 0px 1rem;
clear:both;
}
.main-content p.LOVS-format-type  {
padding-bottom:20px;
margin-bottom::30px;
font-size:.85rem;
font-family:"Times New Roman", Times, serif;
color:green;
}

.main-content ol.LOVS-list{
list-style-position: inside;
padding-left:.3rem;
padding-bottom:0rem;
}
.main-content ol li.LOVS-list{
font-size:.94rem;
padding-left: .8rem;
list-style-position: inside;
margin-left: 0rem;
padding-bottom:0rem;
text-indent:-1em;
color:#666666;
}


/*********************** RATING STARS  ********************************/
.new-stars-00, .new-stars-01, .new-stars-02, .new-stars-03, .new-stars-04, .new-stars-05 {
background-image: url(svg-images/new-stars-00.svg);
background-repeat: no-repeat;
background-position: 0px 0px;
width:155px;
height:25px;
padding-left: 3rem;
}
.new-stars-01 {
background-image: url(svg-images/new-stars-01.svg);
}
.new-stars-02 {
background-image: url(svg-images/new-stars-02.svg);
}
.new-stars-03 {
background-image: url(svg-images/new-stars-03.svg);
}
.new-stars-04 {
background-image: url(svg-images/new-stars-04.svg);
}
.new-stars-05 {
background-image: url(svg-images/new-stars-05.svg);;
}
/***************** TOP MENU FADE-IN "UP" LINK ***************** */	
.scroll_To_Top{
padding: .2rem .4rem .3rem .5rem;
background: white;
position: absolute;
cursor: pointer;
border-radius: 50%;
border: 1px solid #cccccc;
z-index: 11;
display: block;
color: #cccccc;
font-size: 1rem;
text-decoration: none;
letter-spacing: .1rem;
top: 1rem;
right: 4rem;	
text-align: center;
}	
 .scroll_To_Top:link{
text-decoration:none;
border-bottom: none;
color: white;
text-decoration:none;
color: white;
-webkit-transition:   700ms ease;
-moz-transition:   700ms ease;
-ms-transition:   700ms ease;
-o-transition:   700ms ease;
transition:   700ms ease; 
}	
 .scroll_To_Top:hover{
text-decoration:none;
border-bottom: none;
background: #aaaaaa;
 color: white;
} 

/********************** SCROLL UP BUTTON and SCROLL OFFSET ****************************/

.fixed-scroll-up  {
background-color:white;
color: #999999;
width: 30px;
height:30px;
border-radius: 50%;
border: #cccccc 1px solid;
position:fixed;
z-index:1200; 
right: 1rem; 
bottom: .6rem;
padding: .4rem .3rem .4rem .35rem;
line-height:1rem;
font-size: .85rem;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
 opacity: 0; 
 -webkit-transition: opacity .3s ease-in;
    -moz-transition:  opacity .3s ease-in;
    -o-transition:  opacity .3s ease-in;
    -ms-transition:  opacity .3s ease-in;
    transition: opacity .3s ease-in;
}

@media (min-width: 992px) {
.fixed-scroll-up  {
background-color:white;
color: #999999;
width:40px;
height:40px;
border-radius: 50%;
border: #cccccc 1px solid;
position:fixed;
z-index:1200; 
right: 2rem; 
bottom: 10rem;
padding: .7rem  1rem 1rem .63rem;
line-height:1rem;
font-size: .85rem;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  opacity: 0;
  -webkit-transition:  opacity .3s ease-in;
    -moz-transition:  opacity .3s ease-in;
    -o-transition:  opacity .3s ease-in;
    -ms-transition:  opacity .3s ease-in;
    transition:  opacity .3s ease-in;
}
}
.scroll-up-visible {
  opacity: 1;
}
.fixed-scroll-up a:link  {
text-decoration:none;
border: 0;
color:#999999;
}
.fixed-scroll-up a:visited  {
text-decoration:none;
border: 0;
color:#999999;
}


/********************** SCROLL SOCIAL BUTTON ****************************/
.fixed-scroll-social  {
position:fixed;
z-index:1200; 
right: 1em; 
bottom: 3rem;
padding: 1rem 1rem 2rem 1rem;
line-height:1rem;
font-size: .85rem;
 opacity: 1; 
 -webkit-transition: opacity .3s ease-in;
    -moz-transition:  opacity .3s ease-in;
    -o-transition:  opacity .3s ease-in;
    -ms-transition:  opacity .3s ease-in;
    transition: opacity .3s ease-in;
}
@media (min-width: 992px) {
.fixed-scroll-social  {
position:fixed;
z-index:1200; 
right: 1rem; 
bottom: 3rem;
padding: 1rem 1rem 2rem 1rem;
line-height:1rem;
font-size: .85rem;
  opacity: 1;
  -webkit-transition:  opacity .3s ease-in;
    -moz-transition:  opacity .3s ease-in;
    -o-transition:  opacity .3s ease-in;
    -ms-transition:  opacity .3s ease-in;
    transition:  opacity .3s ease-in;
}
}
.scroll-up-visible {
  opacity: 1;
}
.fixed-scroll-up a:link  {
text-decoration:none;
border: 0;
color:#999999;
}
.fixed-scroll-up a:visited  {
text-decoration:none;
border: 0;
color:#999999;
}
a.anchor-offset {
padding-top:  60px;
margin-top: -60px;
border:none;
text-decoration:none;
 }
 
/****************************** FOOTER that turns off on smaller devices ***********************************************/
.footer {
color:#333333;
background-color: white;
border-top: 1px solid #cccccc;
margin-top: 0em;
text-align: center;
font-size: .9rem;
padding: 1.2rem 0rem 1.2em  0rem;
} 
.footer  a:link{
color:#333333;
text-decoration: none;
-webkit-transition: color 300ms ease;
-moz-transition: color 300ms ease;
-ms-transition: color 300ms ease;
-o-transition: color 300ms ease;
transition: color 300ms ease; 
}
.footer a:visited {
color:#333333;
text-decoration: none;
border-bottom: 1px solid #d0d0d0;
}
.footer a:hover {
color: #d0d0d0;
text-decoration:none;
border-bottom: 1px solid #f4f4f4;
}
/*************** LEFT that goes to bottom of page for smaller devices *********************/
.left-two {
font-size: .85em;
color: #999999;
background-color: white;
border-top:1px solid #cccccc;
padding-top:.5em;
padding-bottom:.5em;
}
/*********************** LEFT LIST ICONS ********************************/
.footer-icon-newsletter, .footer-icon-news, .footer-icon-lightbulb, .footer-icon-email, .icon-email, .footer-icon-facebook, .footer-icon-earring,  .footer-icon-instagram, .footer-icon-twitter, .footer-icon-info, .footer-icon-patreon, .footer-icon-youtube  {
background-image: url(svg-images/svg-sheet.svg);
background-repeat: no-repeat;
background-position: 0px 0px;
margin: 0rem .3rem;
height: 30px;
width: 2rem;
display:block;
}
.footer-icon-news {
background-position: 4px -50px;
}

.footer-icon-youtube {
background-position: 0px -1448px;
}
.footer-icon-lightbulb {
background-position: 0px -100px;
}
.footer-icon-email {
 background-position: 0px -100px
}
.icon-email {
background-position: 0px -100px
}

.footer-icon-facebook {
background-position: 0px -250px;
}

.footer-icon-twitter {
 background-position: 0px -298px;
}

.footer-icon-instagram {
background-position: 0px -348px;
}

.footer-icon-earring {
background-position: 0px -400px;
}

.footer-icon-info {
background-position: 0px -498px;
}

.footer-icon-patreon {
background-position: 5px -1806px;
}
.footer-icon-share {
background-image: url(../css/svg-images/share-02.svg);
background-size: 1.3rem;
background-repeat: no-repeat;
background-position: 0rem .2rem;
margin: 0rem .3rem;
height: 2rem;
width: 2rem;
}
.footer-icon-glass {
background-image: url(../css/svg-images/magnify-glass.svg);
background-repeat:no-repeat;
background-size: 1.2rem;
background-position: 0rem .3rem;
margin: 0rem .3rem;
padding:0;
height: 1rem;
width: 2rem;

}
/*******************************************************************************************/
/*******************************************************************************************/
/****************************** OBJECTS IN 2-BAR FORMAT ********************************** */
/*******************************************************************************************/
/*******************************************************************************************/
 
/******************************************************************************************/
/******************** EVENTS DOUBLE BOXES WITH NORMAL & SMALL TEXT ************************/
/******************************************************************************************/
.events  {
border-top:  4px double #cccccc;
margin-bottom: 0rem;
padding-top: 1.5rem;
clear: both;
}
.events-small {
clear: both;
border-top: 4px double #cccccc;
margin-bottom: 0rem;
margin-top: .5rem;
padding-top: 1em;
font-size: 1rem;
line-height: 1.3rem;
padding-top: 1.5rem;
}
.events-small p{
padding-bottom: 1.1rem;
}
.events-left {
line-height: 1.3rem;
/*padding: 0rem 0rem 1.5rem 0rem;*/
/*border: 1px solid #eeeeee;*/
}
.events-left h2 {
line-height: 1rem;
padding-bottom: .5rem;
text-align:left;
font-size: 1.2rem;
letter-spacing: 0px;
}
.events-left img{
padding: .8rem 0rem 1rem 0rem;
clear: both;
max-width: 100%;
}
.events-right {
/*padding: 0rem 0rem 0rem 0rem;*/
}
/************************************** GLOSSARY *****************************************/
.glossaryalphabet {
background-color: #F8F8F8;
padding: 1rem 1rem 1rem 1rem;
 
margin: 0rem .5rem 1rem .5rem;
font-size: .95rem;
}
.glossaryalphabet ul li{
padding-bottom: 0rem;
line-height: 1.4rem;
list-style: none;
list-style-position: inside;
padding-left: 0rem;
}
.glossaryalphabet a:link {
color: #666666;
text-decoration: none;
border: none;
-webkit-transition: color 500ms ease;
-moz-transition: color 300ms ease;
-ms-transition: color 300ms ease;
-o-transition: color 300ms ease;
transition: color 300ms ease;
}
.glossaryalphabet a:visited {
color: #666666;
text-decoration: none;
border: none;
}
.glossaryalphabet a:hover {
color: #dddddd;
text-decoration: none;
}
.glossarysignature {
background-image: url(svg-images/signature-vermeer.svg);
background-repeat: no-repeat;
background-position: 0px 4px;
background size: 3rem;
float: left;
height: 44px;
width: 72px;
margin-right: 1rem;
}
/************************************* VERMEER'S SIGNATURE IMAGES ****************************************/
 .signature-box-right {
float: none;
margin: 1rem auto 1rem auto;
clear: both;
border: none;
padding:1rem
}

@media (min-width: 576px) {
 .signature-box-right {
float: left;
width:250px;
margin-left:15px;
border: 1px #cccccc solid;
} 
}
.signature-box-right img{
display: block;
margin: 5px auto 5px auto;
}
/*************************************************************************************************/
/*************************************************************************************************/
/********** CATALOGUE ELEMENTS used in INDEX for INDIVIDUAL CATALOGUE ENTRIES *******************/
/*************************************************************************************************/
/*************************************************************************************************/
.cat-line  {
clear: both;
border-top: solid 1px #cccccc;
margin-top: 1.5rem;
padding-top: 1.5rem;
} 
@media (min-width: 576px) {
.cat-line  {
clear: both;
border-top: solid 1px #cccccc;
margin-top: 1.5rem;
padding-top: 2rem;
} 
}
.cat-line h2 {
line-height: 1rem;
font-weight:normal;
} 
/*********************************************** CATALOGUE NUMBER *********************************/
.cat-number {
font-size: 2rem;
line-height: 2rem;
margin: 0rem 0rem 0rem  0rem;;
color: #cccccc;
float: left;
width:50px;
/*border: 1px red solid;*/
}
@media (min-width: 576px) {
.cat-number {
font-size: 2rem;
line-height: 2rem;
margin: 0rem 0rem 0rem  0rem;;
color: #cccccc;
float: left;
width:50px;
/*border: 1px red solid;*/
}
}
/********************************* CATALOGUE THUMBNAIL IMAGE HOLDER *********************************/
.cat-image {
margin: 0rem auto 1.5rem auto;
width:240px;
border: none;
/*border: 1px orange solid;*/
}
@media (min-width: 576px) {
.cat-image {
float: left;
margin: 0rem 1.3rem 0rem 1.5rem;
margin-bottom: 1rem;
border: none;
width:150px;
/*border: 1px orange solid;*/
}
}
.cat-image img{
margin-bottom: 1rem;
border: 0rem;
opacity: 1;
transition: all .2s ease-in-out; 
}
.cat-image  img:hover {
opacity: 1;
 transform: scale(1.05);
}
/****************************** VERMEER CATALOGUE ENTRY INFORMATION ******************************************/
.cat-info, .cat-info-index{
width: 250px;
margin: -.4rem 0rem 0rem 0rem;
font-size: 1rem;
padding: .1rem .5rem .5rem .5rem;
font-weight: normal;
line-height: 1.2rem;
}
@media (min-width: 576px) {
.cat-info, .cat-info-index{
float: left;
width: 250px;
margin: -.4rem 0rem 0rem 0rem;
font-size: .9rem;
padding: .1rem .5rem .5rem .5rem;
font-weight: normal;
line-height: 1.1rem;
}
}
.cat-info-index{
float: left;
width: 250px;
border: 1px solid #cccccc;
margin: 0rem auto 0rem auto;
display: block;
clear: both;
float: none;
}
@media (min-width: 576px) {
.cat-info-index{
float: left;
width: 250px;
border: 1px solid #cccccc;
clear: none;
margin-bottom: 1.5rem;
}
}
.cat-info-index a:link{
color:#666666;
text-decoration:none;
-webkit-transition: color 500ms ease;
-moz-transition: color 300ms ease;
-ms-transition: color 300ms ease;
-o-transition: color 300ms ease;
transition: color 300ms ease;
}
.cat-info-index a:visited {
color:#666666;
}
.cat-info-index  a:hover{
color: #e1dede;
border-bottom: 1px solid #edebeb;
}
/*********************************** various HEADINGS ***********************************************/
.cat-info h2,   .cat-info-index h2 {
margin-bottom: .2rem;
padding-bottom: .2rem;
margin-top: .5rem;
font-size: 1.2rem;
font-weight: normal;
font-style:italic;
text-align: left;
}
.cat-line a:link,  .cat-info a:link  {
border: none;
text-decoration:none;
color:#333333;
text-decoration:none;
-webkit-transition: color 500ms ease;
-moz-transition: color 300ms ease;
-ms-transition: color 300ms ease;
-o-transition: color 300ms ease;
transition: color 300ms ease;
}
.cat-line a:visited,  .cat-info-index a:visited {
color:#333333;
}
.cat-line a:hover,  .cat-info a:hover,  .cat-info-index a:hover  {
color: #e1dede;		 
}
/***************************** TEMPORARY LOCATION of CATALOGUE ENTRY **************************************/
.temporarylocationcentry {
float: none;
width: 250px;
color: #999999;
background-color: #f9f9f8;
margin: 1.5rem auto 0rem auto;
dispaly: block;
padding: 0.6rem 0.6rem 0.3rem 0.7rem;
border-top: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
}
.temporarylocationcentry .cat-line a:link {
color: #999999;
text-decoration: none;
border: none;
-webkit-transition: color 500ms ease;
-moz-transition: color 300ms ease;
-ms-transition: color 300ms ease;
-o-transition: color 300ms ease;
transition: color 300ms ease;
}
.temporarylocationcentry .cat-line a:visited {
color: #999999;
text-decoration: none;
}
.temporarylocationcentry .cat-line a:hover {
color: #e1dede;
}


@media (min-width: 576px) {
.temporarylocationcentry {
float: left;
clear:both;
width: 420px;
color: #999999;
background-color: #f9f9f8;
margin: 0rem 0rem 0rem 75px;
padding: 0.6rem 0.6rem 0.3rem 0.7rem;
border-top: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
}
}
.temporarylocationcentry p {
padding-bottom: .4rem;
font-size: .8rem;
line-height: 1rem;
}
.temporarylocationcentry .cat-line a:link {
color: #999999;
text-decoration: none;
border: none;
-webkit-transition: color 500ms ease;
-moz-transition: color 300ms ease;
-ms-transition: color 300ms ease;
-o-transition: color 300ms ease;
transition: color 300ms ease;
}
.temporarylocationcentry .cat-line a:visited {
color: #999999;
text-decoration: none;
}
.temporarylocationcentry .cat-line  a:hover {
color: #e1dede;
}
/**************************** CONTAINERS for DUTCH PAINTINGS & VERMEER in FRAMES SECTIONS ****************************/
.dutch-master-thumbnail {
height: 100px;
margin-left: .5rem;
float: left;
}
.frames-dutch-picture-container {
clear: both;
margin-left: 1rem;
padding-left: 1rem;
border-left: solid 1px #cccccc;
float: left;
}
.picture-container-frames {
float: left;
margin-top: .6rem;
}
.picture-container-frames img{
}
.picture-container {
clear: both;
margin-top: 1.5rem;
 }
#dutch-painters-container {
clear: both;
}
/***********************************************************************************************************************************************/
/***** PAINTING inside RELATED ARTWORKS - CATALOGUE - XXL IMAGES - DUTCH PAINTINGS - ABOUT - FRAMED PAINTINGS **********************/
/***********************************************************************************************************************************************/
#painting-info {
line-height: 1.3em;
font-size: 1.05rem;
padding:  .8rem .5rem .8rem 1rem;
width: 100%;
border: solid 1px #cccccc;
margin: .6em auto 1.5em auto; 
}
@media (min-width: 576px) {
#painting-info {
line-height: 1.3em;
font-size: .85rem;
padding: .8rem .5rem .8rem 1rem;
float: left;
clear: both;
width: 250px;
border: solid 1px #cccccc;
margin: .6em 2rem 1em 0rem; 
}
}
#painting-info h2 {		
margin-top: 0rem;
margin-bottom: 0rem;
padding-bottom: .4rem;
border:none;
text-decoration: none;
font-weight: normal;
font-size: 1.5rem;
font-style: italic;
text-align: left;
padding-top: .1rem; 
line-height:1.2rem;
letter-spacing:.05rem;
}
@media (min-width: 576px) {
#painting-info h2 {		
margin-top: 0rem;
margin-bottom: 0rem;
padding-bottom: .4rem;
border:none;
text-decoration: none;
font-weight: normal;
font-size: 1.3rem;
font-style: italic;
text-align: left;
padding-top: .1rem; 
line-height:1.2rem;
letter-spacing:.05rem;
}
}
#painting-info ul {
margin-top:1rem;
border-top: 1px solid #cccccc;
padding-top: 1rem;
}
 
#painting-info li {
background-image: url(svg-images/disk.svg);
background-repeat: no-repeat;
background-position: 0px 5px;
list-style: none;
padding-left: 1.5rem;
line-height: 1.3rem;
}  
#painting-info a:link {
color: #333333;
border:none;
text-decoration: none;
-webkit-transition: color 500ms ease;
-moz-transition: color 300ms ease;
-ms-transition: color 300ms ease;
-o-transition: color 300ms ease;
transition: color 300ms ease;
}
#painting-info a:visited {
color: #333333;
border:none;
text-decoration: none;
}
#painting-info a:hover {
color: #e1dede;	  
}
/***************** LIST HOLDING BOX INSIDE PAINTING INFO IN FRAME SECTION (only)*******************************/
.painting-menu-inside {
margin-top: 1rem;
width:100%;
border-top: 1px solid #cccccc;
padding-top: 1rem;
}
@media (max-width: 576px) {
.painting-menu-inside {
margin-top: .5rem;
width:100%;
border-top: 1px solid #cccccc;
padding-top: .5rem;
}
}
/*************************************************************************************/
/****************************** RELATED IMAGES SECTION ********************************/
/*************************************************************************************/
.related-images-box {
margin-top:1rem;
padding-top: 1.5rem;
line-height: 1.3rem;
border-top: 1px solid #cccccc;
padding-top: 1.5em;
clear: both;
}
.related-images-lightbox {
padding: 0rem 0rem 1em 0rem;
margin: 0rem auto 0rem auto;
display: block;
width:200px;
}
 @media (min-width: 678px) {
.related-images-lightbox {
padding: 0rem 0rem 0rem 0rem;
margin: 0rem 1rem 1.5rem 0rem;
float:left;
}
} 
.related-images-lightbox img{
background-image: url(svg-images/enlarge-01.svg);
background-size: 14px 12px;
background-repeat: no-repeat;;
background-position: right 0rem bottom .2rem;
padding-bottom: 1.4rem;
border: none;
text-decoration: none;
opacity: 1;
-webkit-transition:   400ms ease;
-moz-transition:   400ms ease;
-ms-transition:   400ms ease;
-o-transition:   400ms ease;
transition:   400ms ease;	
}
.related-images-lightbox img:hover {    
opacity: .8;  
}
.related-images-caption, .related-images-caption-vermeer {
width: 250px;
padding: .6rem .5rem .5rem .7rem;
border: solid 1px #cccccc;
line-height: 1.2rem;
font-size: 1rem;
display: block;
margin: 0rem auto 1.5rem auto;
}
@media (min-width: 678px) {
.related-images-caption, .related-images-caption-vermeer {
width: 250px;
padding: .6rem .5rem .5rem .7rem;
border: solid 1px #cccccc;
line-height: 1.2rem;
font-size: .9rem;
display: block;
margin: 0rem auto 1.5rem auto;
margin-left: 1rem; 
float: right;
}
}
.related-double-box {
clear:none;
}
@media (min-width: 678px) {
.related-double-box {
}
}
.related-images-caption-vermeer {
border:solid 1px #9e444c;
}
.related-images-textbox {
width: 250px;
padding: .5rem .5rem .5rem .5rem;
margin: 0rem auto 0rem auto;
border: solid 1px #cccccc;
line-height: 1.2rem;
font-size:1rem;
}
 @media (min-width: 678px) {
.related-images-textbox {
float: right;;
margin-bottom: 1.5rem;
font-size:.9rem;
}
} 
.related-images-textbox p {   
}
/*******************************************/
/*******************************************/
/*******************************************/
/****** MISC & BULLETS for TEXTS ********* */
/*******************************************/
/*******************************************/
/*******************************************/
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5rem;
}


.svg-new:after {
display: inline-flex;
content: '';
background-image: url('svg-images/new.svg');
background-repeat: no-repeat;
background-position: 0px 0px;
background-size: 30px 36px;
height: 30px;
width: 30px;
margin-left: .5rem;
        }
		
.svg-ongoing:after {
display: inline-flex;
content: '';
background-image: url('svg-images/ongoing.svg');
background-repeat: no-repeat;
background-position: 0px 0px;
background-size: 26px 26px;
margin-left: .5rem;
        }
		

.svg-upcoming:after {
display: inline-flex;
content: '';
background-image: url('svg-images/upcoming.svg');
background-repeat: no-repeat;
background-position: 0px 0px;
bckground-size: 30px 30px;
height: 30px;
width: 30px;
margin-left: .5rem;
}
		
/***************** BULLET for AMAZON BRAND NAME for BOOKSHOPS ***************** */
.svg-amazon {
background-image: url(svg-images/amazon.svg);
background-repeat: no-repeat;
padding-left:2rem;
background-size: 1.5rem;
background-position: 0px  0px;
}
/************************************ BULLET for CHECKMARK ***************************************** */
.checkmark {
display: block;
background-image: url(svg-images/checkmark.svg);
background-position: 0px 0px;
background-repeat: no-repeat;
padding-left:2rem;
background-position: 0px 3px;
}
/********************************* BULLET for "CLICK HERE" ************************************ */
.svg-click-here {
background-image: url(svg-images/click-here.svg);
background-repeat: no-repeat;
bckground-size: 2rem;
padding-left:2rem;
background-position: 0px 0px;
}
/************************************ DOWNLOAD PDF ***************************************** */
.svg-download-pdf {
background-image: url(svg-images/pdf-01.svg);
background-repeat:no-repeat;
background-position: 0rem 0px;
padding-left: 2em;
}	 
/************************************ MAGNIFYING GLASS ***************************************** */
.svg-glass {
background-image: url(svg-images/magnify-glass.svg);
background-position: 0px  4px;
background-repeat: no-repeat;
padding-left:2.5rem;
}
/************************************ LINK  ***************************************** */
.svg-link{
background-image: url(svg-images/link.svg);
background-position: -3px  0px;
background-repeat: no-repeat;
padding-left:1.6em;}  
/************************************ MAP  ***************************************** */
.svg-map{
background-image: url(svg-images/map.svg);
background-position: 0px  0px;
background-repeat: no-repeat;
padding-left:2em;}	 	 
/***************** BULLET for MOUSE ***************** */
.svg-mouse {
background-image:url(svg-images/mouse.svg);
background-repeat: no-repeat;
background-position: 0px  4px;
padding-left:2em;
}	  
/***************** BULLET for PUSH PIN ***************** */
.svg-museum {
background-image: url(svg-images/museum.svg);
background-repeat: no-repeat;
background-position: 0px  -1px;
padding-left:2em;
}
/***************** BULLET for PENCIL NOTE ***************** */
.svg-pencil {
background-image: url(svg-images/pencil.svg);
background-repeat: no-repeat;
background-position: 0px  0px;
padding-left:2em;}
/***************** BULLET for PUSH PIN ***************** */
.svg-pushpin {
background-image: url(svg-images/push-pin.svg);
background-repeat: no-repeat;
background-position: 0px  0px;
padding-left:2em;
}
/***************** BULLET for SPEAKER ***************** */
.svg-speaker {
background-image: url(svg-images/speaker.svg);
background-repeat: no-repeat;
background-position: 0px  0px;
padding-left:2em;
} 
/***************** WORLD CATALOGUE ICON FOR VERMEER EXHIBITION PAGE ***************** */
.worldcat-exhibits {
background-image: url(svg-images/world-cat.svg);
background-repeat: no-repeat;
background-size:1rem;
background-position: 0px  0px;
padding-left:2em;
}
/****************************** OPENBOOK for EXHIBITION PAGE ****************************/
.pdf-exhibits {
background-image: url(svg-images/pdf.svg);
background-repeat: no-repeat;
background-size:1rem;
background-position: 0px  0px;
padding-left:2em;
}
/***************** BULLET for MUSIC CLASSIFICATION  ***************** */
.svg-music {
background-image: url(svg-images/music.svg);
background-size: 1.4rem;
background-repeat:no-repeat;
background-position: 0rem .1rem;
padding-left: 2rem;
}
/***************** BULLET for TWO MUSICAL NOTES  ***************** */
.svg-musical-notes {
background-image: url(svg-images/musical-notes.svg);
background-repeat:no-repeat;
background-position: 0px  4px;
padding-left: 2em;
}
/***************** BULLET for LISTEN to MUSIC***************** */
.svg-listen-to-music {
background-image: url(svg-images/music-02.svg);
background-repeat: no-repeat;
background-position: 0px  0px;
padding-left:2em;
}
/***************** BULLET for UNDER CNSTRUCTION ***************** */
.construction {
background-image: url(svg-images/uncercontruction-01.svg);
background-repeat: no-repeat;
background-size: 1.5rem;
background-position: 0px 0px;
padding-left: 3rem;
}

 #two-bar-extra-content-menu li.constrution {
background-image: url(svg-images/uncercontruction-01.svg);
background-repeat: no-repeat;
background-size: 1.2rem;
background-position: 0px 1px;
padding-left: 2rem;
list-style: none;
font-style:italicS 
}
/***************** BULLET for LISTEN to MUSIC***************** */
.youtube {
background-image: url(svg-images/youtube.svg);
background-repeat: no-repeat;
background-size: 2.7rem;
background-position: 0px 2px;
padding-left: 3.5rem;
}
/***************** TUBE OF PAINT for PALETTE SECTION ***************** */
 .svg-tube-paint  {
background-image: url(svg-images/tube-paint.svg);
background-repeat: no-repeat;
background-position: 0px 0px;
list-style-type:none;
list-style-position:inside;
padding-left:2rem;
margin-left: -1rem;
padding-bottom: 1.2rem;

}
.svg-tube-paint-vermilion  {
background-image: url(svg-images/tube-paint-vermilion.svg);
background-repeat: no-repeat;
background-position: 0px 0px;
background-size: 30px 30px;
list-style-type:none;
list-style-position:inside;
padding-left:2rem;
margin-left: -1rem;
padding-bottom: 1.2rem;

}
/***************************************** CLEAR DIVS *********************************/
.clearboth {
clear: both;
}
.clearboth-and-space {
clear: both;
margin-bottom: 2rem;
}
.clearboth-and-space-sml {
clear: both;
margin-bottom: 1rem;
}
/************************************** DIV FLOAT LEFT *********************************/
.float-left {
float: left;
margin-right: 1rem;
margin-top: .1rem;
}
.float-left img{
margin-bottom: 1.3rem;
} 
/*************************** AMAZON LINKS on BOOKSHOP PAGES *******************************/
.amazonlinks {
background-image: url(svg-images/amazon.svg);
background-repeat: no-repeat;
background-position: 0px 0px;
padding-left: 2rem;
padding-bottom:1rem
}
.amazon-exhibits {
background-image: url(svg-images/amazon.svg);
background-repeat: no-repeat;
background-size: 1rem;
background-position: 0px 0px;
padding-left: 1.5rem;
}
.events-right .amazonlinks a:link {
border-bottom: none;
text-decoration: none;   
}
.events-right .amazonlinks a:visited {
border-bottom: none;
text-decoration: none;    
}
.events-right .amazonlinks a:hover {
}
.amazonlinksbrit {
background-image: url(svg-images/british-flag.svg);
background-repeat: no-repeat;
background-position: 0px 3px;
background-size: 1.2rem;
padding-left: 2rem;
margin-bottom: 1rem;
margin-top: 0px;
}
.events-right .amazonlinksbrit a:link {
border-bottom: none;
text-decoration: none; 
}
.events-right .amazonlinksbrit a:visited {
border-bottom: none;
text-decoration: none; 
}
.events-right .amazonlinksbrit a:hover {
} 
/******* USED ONLY in FOLK MUSICICAL INSTRUMENT SECTION ***********/
.musiclangfolk {
font-size: .9rem;
float: right;
margin: 0rem .5rem  1rem .6rem;
border: 1px dotted #cccccc;
padding: .9rem;
background-color: #FDFDFD;
font-size: .9rem;
}
.musiclangfolk p{
padding-bottom: .4rem;
line-height: 1.2rem;
font-size: 1.05rem;
}
/************* IMAGE HOLDERS FOR VERMEER'S WOMEN ************/
.woman {
float: left;
margin-right: 1rem;
margin-bottom: 1rem;
}
.womanlarge {
width: 120px;
height: 200px;
float: left;
margin-left: 35px;
margin-bottom: 15px;
font-size: .75em;
line-height: 1.3em;
font-style:italic;
text-align: left--;
margin-bottom: 2em;
}
.womanlarge img{
margin-bottom: .8rem;
}
/************************************* TIMELINE RULES ******************************* */
.all-painters-dutch, .all-painters-dutch-01, .all-painters-dutch-02, .all-painters-dutch-03, .all-painters-dutch-04, .all-painters-dutch-05 {
background-image: url(../timelines/timeline-svgs/background-centuries-of-vermeers-time.svg);
background-repeat: repeat-y;
padding-top:2rem; 
}
@media (max-width: 992px) { 
.all-painters-dutch  {
margin-left:40px;
padding-top:2rem;
}
}
 
@media (max-width: 615px) {
.all-painters-dutch-01  {
padding-top:2rem;
}
}
@media (max-width: 576px) {
.all-painters-dutch-02  {
padding-top:2rem;
}
}
@media (max-width: 640) {
.all-painters-dutch-03  {
padding-top:2rem;
}
}
@media (max-width: 730px) {
.all-painters-dutch-04  {
padding-top:2rem;
}
}
@media (max-width: 820px) {
.all-painters-dutch-05  {;
padding-top:2rem;
}
}

.all-painters {
background-image:url(../timelines/timeline-svgs/background-centuries-1200-1800.svg);
background-repeat: repeat-y;
width:2100px;
/*border-top: 1px solid #cccccc;*/
}

.self-portraits {
background-image: url(../timelines/timeline-svgs/background-self-portraits.svg);
background-repeat: repeat-y;
width:2100px;
/*border-top: 1px solid #cccccc;*/
}
/*.all-painters-vermeers-time {
background-image: url(../timelines/timeline-svgs/background-centuries-of-vermeers-time.svg);
background-repeat: repeat-y;
padding-top:2rem;}
 */
.timelinepainter {
color: #666666; 
border: 1px solid #999999;
padding: 0px 0px;
margin-bottom: .8rem;
font-size: .85rem;
text-align: center;
background-color:white;
line-height:1.1rem;
}
.timelinepainter:hover {
background-color: #FCFCFC;
border: 1px solid #999999;
cursor:pointer;
line-height:1.1rem;
margin-bottom: .8rem;
font-size: .85rem;
padding: 0px 0px;
box-shadow: 0 0 5px 2px rgba(0,0,0,.06);
}
.timelinepainter li{
font-size: .95rem;
line-height:1.1rem;
}
.timelinepainter   a:link {
text-decoration: none;
border:none;
line-height:1.1rem;
}
.timelinepainter a:visited {
text-decoration: none;
border:none;
line-height:1.1rem;
}
.list-timeline li a:hover {
text-decoration: none;
border:none;
line-height:1.1rem;
}
/************************************* 5-PART VERMEER TIMELINE IMAGE CONTAINERS ******************************* */
.timelineimages {  
font-size: 75%;
line-height: 1.2rem;
color: #999999;
text-align: left;
vertical-align: top;
text-align: left;
float: left;
width: 150px;
margin: .5rem 1.5rem 1rem 0rem;
padding: 0rem 1rem 0rem .5rem;
border-right: 1px solid #cccccc;
}
.timelineimages img{  
padding-bottom: .5rem;
clear: both;		
}
.timeline-caption{  
clear: both;		
}
/**************  MUSEUM PICTURES  *****************/
.imagehold-thumbnail {
 margin-bottom:1.5em;
}
/**************  DUTCH MUSEUMS  *****************/
.vermeerpicsandsigs { 
background-image: url(background-images/depricated/signature_vermeer.jpg);
background-repeat: no-repeat;
background-position: left top;
height: 90px;
width: 650px;
padding-left: 60px;
margin-bottom: 1.5em;
}	
.vermeerpicsandsigs img{ 
float:left;
padding-left: 2em;
}
 
/************************************* FORMATS SERIES OF IMAGES on DELFT IMPRESSIONS PAGE ******************************* */	
.thumbsdelft {
float: left;
height: 100px;
width: 100px;
margin-top: 10px;
margin-right: 28px;
margin-bottom: 28px;
margin-left: 10px;
border: 2px solid #FFFFFF;
}
/***************** MUSIC BOX FFOR ALL MUSIC SECTIONS ***************** */
.music-box {
margin: .3em 2em .5em 0em;
width:250px;
border: 1px solid #cccccc;
padding: .7em .5em 0em 1em;
float: left;
}
.music-box p   {
font-size: .85em;
padding-bottom: .8rem;
line-height: 1.3em;}




/***************** FIGURE-CAPTION SPAN ***************** */
/*#brandname {
height: 25px;
width: 20px;
background-image: url(background-images/brandname-sml.png);
background-repeat: no-repeat;
background-position: 0px 0px;
margin-top: 0em;
margin-right: auto;
margin-bottom: 6em;
margin-left: auto;
clear: both;
}*/
/***************** VERMEER TRAVEL PAGES *****************/
#amsterdam_travel {
background-image: url(../vermeer_trips/trips-images/amsterdam.jpg);
background-repeat: no-repeat;
height: 300px;
width: 500px;
padding-left: 12px;
margin-bottom: 1.3em;
}
#berlin_travel {
background-image: url(../vermeer_trips/trips-images/berlin2.jpg);
background-repeat: no-repeat;
height: 300px;
width: 500px;
padding-left: 12px;
margin-bottom: 1.3em;
}
#braunschweig_travel {
background-image: url(../vermeer_trips/trips-images/braunschweig.jpg);
background-repeat: no-repeat;
height: 300px;
width: 500px;
padding-left: 12px;
margin-bottom: 1.3em;
}
#dresden_travel { 
 background-image: url(../vermeer_trips/trips-images/dresden.jpg);
background-repeat: no-repeat;
height: 300px;
width: 500px;
padding-left: 8px;
margin-bottom: 1em;
}
#dublin_travel {
background-image: url(../vermeer_trips/trips-images/dublin.jpg);
background-repeat: no-repeat;
height: 300px;
width: 500px;
padding-left: 8px;
margin-bottom: 1.3em;
}
#edinburgh_travel {
background-image: url(../vermeer_trips/trips-images/edinburgh.jpg);
background-repeat: no-repeat;
height: 300px;
width: 500px;
padding-left: 16px;
margin-bottom: 1.3em;
}
#frankfurt_travel {
background-image: url(../vermeer_trips/trips-images/frankfurt.jpg);
background-repeat: no-repeat;
height: 300px;
width: 500px;
padding-left: 16px;
margin-bottom: 1em;
}
#europe-travel {
background-image: url(svg-images/map-of-europe-with-travel-routes.svg);
background-repeat: no-repeat;
background-size: 700px 467px;
background-position: 0px 0px;
height: 467px;
width: 700px;
margin-bottom: 1.3em;
border: 1px solid #cccccc;
}
#hague_travel {
background-image: url(../vermeer_trips/trips-images/hague.jpg);
background-repeat: no-repeat;
height: 300px;
width: 500px;
padding-left: 8px;
margin-bottom: 1.3em;
}
#london_travel {
background-image: url(../vermeer_trips/trips-images/london.jpg);
background-repeat: no-repeat;
height: 300px;
width: 500px;
padding-left: 8px;
margin-bottom: 1.3em;
}
#paris_travel {
background-image: url(../vermeer_trips/trips-images/paris.jpg);
background-repeat: no-repeat;
height: 300px;
width: 500px;
padding-left: 8px;
margin-bottom: 1em;
}
#vienna_travel {
background-image: url(../vermeer_trips/trips-images/vienna.jpg);
background-repeat: no-repeat;
height: 300px;
width: 500px;
padding-left: 12px;
margin-bottom: 1.3em;
}
/***************** TIMELINE OF EUROPEAN PAINTERS *****************/
.timelineimages {  
font-size: 95%;
line-heigth: 1em;
line-height: 1em;
text-align: center;
vertical-align: top;
float: left;
width: 100px;
margin-right: 1em;
padding: 3px 3px 3px 3px;
}
.timelineimages img{  
padding-bottom: 1em;
}
.dates {            
float: left;
width: 187px;
padding-left: 8px;
margin-top: 16px;
margin-bottom: 16px;
}
.timelinepainterfl {            
font-size: 80%;
line-height: 1em;
background-color: #F7E8EA;
padding: 2px;
clear: both;
float: left;
border: 1px solid #cccccc;
margin-bottom: 10px;
text-align: center;
}
.timelinepainterfr {           
font-size: 80%;
line-height: 1em;
background-color: #F7E8EA;
padding: 2px;
clear: both;
float: left;
border: 1px solid #cccccc;
margin-bottom: 10px;
text-align: center;
}
.timelinepainterfr {            
background-color: #E8ECF7;
}
.timelinepainterit { 
font-size: 80%;
line-height: 1em;
background-color: #F7E8EA;
padding: 2px;
clear: both;
float: left;
border: 1px solid #cccccc;
margin-bottom: 10px;
text-align: center;
}
.timelinepainterit {           
background-color: #E8F7EE;
}
.timelinepaintern {          
font-size: 80%;
line-height: 1em;
background-color: #F7E8EA;
padding: 2px;
clear: both;
float: left;
border: 1px solid #cccccc;
margin-bottom: 10px;
text-align: center;
}
.timelinepaintern {            
background-color: #EFEFEF;
}
.timelinepainterssp {            
font-size: 80%;
line-height: 1em;
background-color: #F7E8EA;
padding: 2px;
clear: both;
float: left;
border: 1px solid #cccccc;
margin-bottom: 10px;
text-align: center;
}
.timelinepainterssp {           
background-color: #F7F5D5;
}
/***********************+** ABOUT SECTION ****************************/
.about-book {
width: 320px;
font-size: .85em;
border: 1px solid #cccccc;
padding: .7rem .5rem .7rem  .7rem;
line-height: 1.4em;
margin-bottom: 1.5em;
}
.about-book  img {
float:left;
margin: 0em 1.5em .3rem 0em;
clear: none;
display: block;
}
h2.about{	
margin-top: 0rem;
margin-bottom: .5rem;
padding-bottom: .0em;
font-size: 1.2rem;
line-height: 1.2rem;
text-align:left;
font-style: normal;	
}
/************************** BOOTSTRAP ELEMENTS **************************************/
/************************** BOOTSTRAP ELEMENTS **************************************/
/************************** BOOTSTRAP ELEMENTS **************************************/

/* ******** BOOTSTRAP COLLAPSABLE TEXT BOX ***********/ 
.panel-box {
border-top: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
padding: .3em 0em .3em 0em;
margin-bottom:1.5em;
background-color: #F9F9F9;

} 


.collapse-panel, .collapse-panel-maps {
background-image:url(svg-images/information-04.svg);
background-repeat:no-repeat;
background-position: .2em 0em;
padding-left: 2em;
cursor:pointer;
margin-bottom:0em;
letter-spacing:.05em;
font-size: 1.1rem;
font-family: 'Lato', sans-serif;
}
.collapse-panel-maps {
background-image: url(svg-images/map.svg);
background-repeat:no-repeat;
background-position: .5rem 0rem;
background-size: 1.7rem;
padding-left: 2.5rem;
cursor:pointer;
margin-bottom:0em;
letter-spacing:.05em;
font-size: 1.1rem;
}
@media (min-width: 576px) {
 .collapse-panel {
font-size: 1.1rem;
}
} 
.collapse-panel-content {
margin-top:0rem;
margin-bottom:1rem;
line-height: 1.5em;
padding: 1rem .5rem 0rem  .5rem;
background-color: #F9F9F9;
/*border-left: 1px solid #cccccc;*/
} 
@media (min-width: 576px) {
.collapse-panel-content {
margin-top:0rem;
margin-bottom:1rem;
line-height: 1.5em;
padding: 1rem 1rem 0rem 1.5rem;
background-color: #F9F9F9;
/*border-left: 1px solid #cccccc;*/
} 
}
.collapse-panel-content p  {
font-size: .98rem;  
padding-bottom: 1.1em;
font-size: 1.075rem;
line-height: 1.6rem;
} 
 .collapse-panel-content li {
padding-bottom: 1.1rem;
font-size: .98rem;
line-height: 1.5em;
font-size: 1.08rem;
} 
/*********************************************** BOOTSTRAP MODAL for SHARE BUTTONS  ******************************************************/
/*this makes AddtoAny icons smaller */
.a2a_svg, .a2a_count { /*this makes AddtoAny icons smaller */
width: 3rem!important;
height: 3rem!important;
margin: 0rem .3rem; 
border-radius: .5rem!important;
}
/*this makes AddtoAny icons larger */
@media (min-width:  992px) { 
.a2a_svg, .a2a_count {
width: 5rem!important;
height: 5rem!important;
margin: 0rem 1rem; 
border-radius: .5rem!important;
}
}
/****************** this removes background color and border from close button in SHARE MODAL ****************************/
.share-close   {
background-color: transparent!important;
border: 0px}
 .share-close:hover   {
background-color: transparent!important;
border: 0px;
color: #cccccc;
}
#my_centered_buttons {
display: flex;
justify-content: center;
}

.modal-text:after {
content: url("../css/svg-images/enlarge-01.svg");
 
}

/********************************** BASIC MODAL LAYOUT *************************************** */

h6.modal-title {
font-size:1.2rem;
text-align:left;
}
@media (max-width: 450px) { 
h6.modal-title {
font-size:1rem;
text-align:left;
}
}
@media (max-width: 320px) { 
h6.modal-title {
font-size:.8rem;
text-align:left;
padding-left:3px;
}
}
.modal-header {
background-image: url(svg-images/ev-brands.svg);
background-repeat:no-repeat;
background-position: -12px 10px;
height:60px;
border-bottom: none;
padding-left: 60px;
}
@media (max-width: 400px) {
.modal-header {
background-image: none;
height:50px;
border-bottom: none;
padding-left: 15px;
}
}
.modal-body {
list-style-position:inside;
padding:2rem;
}
.modal-footer {
display:none;
}
.btn-modal {
color: #666666;
border: 1px solid #666666;
padding:0rem 2rem 0rem 2rem;
background-color: #F7F7F7;
text-transform:uppercase;
font-size: 1rem;
letter-spacing:.05rem;
 border-radius: 0;
}
 input {
 width:100%;
 padding: .25rem
 }
 textarea  {
 width:100%;
 padding: .25rem
 }
 /*************************** MODAL AND BUTTON COMPLETE PAINTING MODAL    ******************************/
 .oeuver-button{
 background-color: #FAFAFA;
 line-height:1rem;
 font-size:.95rem;
 padding:.3rem;
 border: 1px solid #cccccc;
 cursor:pointer;
 }
 .oeuver-button:hover{
 background-color: #F3F3F3;
 line-height:1rem;
 font-size:.95rem;
 padding:.3rem;
 border: 1px solid #cccccc;
 cursor:pointer;
 }
 
 /*************************************  MODAL COMPLETE PAINTING QUICK SEARCH ****************************************/
#quick-search-container {
border: 1px solid #cccccc;
position: fixed;
top: 25px;
right: 25px;
background: white;
padding:0px 8px 0px 8px;
font-size:.87rem;
color:#666666;
}
#quick-search-container:hover {
background: #ffffff;
}
@media (max-width: 760px) {
#quick-search-container  {
color:#666666;
background-color: white;
border: none;
font-size: 1rem;
letter-spacing: 0rem;
line-height: 1.2rem;
position: absolute;
margin-top:190px;
padding:12px 8px 12px 8px;
-webkit-border-radius:0px;
-moz-border-radius:0px;
border-radius:0px;
border-radius:0px;
width:100%;
height:40px;
bottom: 0px;
right: 0px;
text-align:center;
-webkit-transition: all 400ms ease;
-moz-transition: all 400ms ease;
-ms-transition: all 400ms ease;
-o-transition: all 400ms ease;
transition: all 400ms ease;
}
}
#quick-search-container a:link{
color:#666666;
-webkit-transition: all 400ms ease;
-moz-transition: all 400ms ease;
-ms-transition: all 400ms ease;
-o-transition: all 400ms ease;
transition: all 400ms ease;
}
#quick-search-container a:visited{
color:#666666;
}
#quick-search-container a:hover{
color:#aaaaaa;
border:0;
text-decoration:underline;
}
@media (max-width: 768px) {
#quick-search-container a:link{
color:#999999;
-webkit-transition: all 400ms ease;
-moz-transition: all 400ms ease;
-ms-transition: all 400ms ease;
-o-transition: all 400ms ease;
transition: all 400ms ease;
}
}
@media (max-width: 768px) {
#quick-search-container a:visited{
color:#999999;
}
}
@media (max-width: 768px) {
#quick-search-container a:hover{
color:#666666;
border:0;
text-decoration:underline;
}
}


.find-it {
display: inline;
}
@media (max-width: 576px) {
.find-it {
display: none;
}
}
#all-paintings 
{ 
padding-top: 0px;
padding-bottom: 0px;
}
#all-paintings .tool
{ 
border: 0;
text-decoration:none;
}
#all-paintings img{
opacity: 1;
transition: all .2s ease-in-out; 
}
#all-paintings  img:hover {
opacity:1;
transform: scale(1.08);
}
/* makes thumbmnaild get smaller on small devices */
.quicksearch-image  {
width:50px;
}
@media (min-width: 563px) {
.quicksearch-image  {
 width:70px;
}
}
/*************************** QUICK SEARCH DIVS   ******************************/
.quick-find-diana, .quick-find-christ, .quick-find-procuress, .quick-find-asleep, .quick-find-open, .quick-find-milk,  .quick-find-officer, .quick-find-interrupted,.quick-find-berlin, .quick-find-street, .quick-find-glass, .quick-find-view, .quick-find-music, .quick-find-pitcher, .quick-find-lute, .quick-find-picher, .quick-find-blue, .quick-find-necklace,.quick-find-balance, .quick-find-concert, .quick-find-writing, .quick-find-art, .quick-find-earring, .quick-find-hat, .quick-find-mistress, .quick-find-flute, .quick-find-study, .quick-find-astronomer, .quick-find-geographer, .quick-find-love, .quick-find-lace, .quick-find-guitar, .quick-find-beit, .quick-find-standing, .quick-find-seated, .quick-find-faith,.quick-find-praxedis, .quick-find-rolin  {
width:70px;
height: 66px;
background-image: url(background-images/quick-search-catalog-sheet.jpg);
background-repeat:no-repeat;
background-position: 0px 0px;
float: left;
transition: all .2s ease-in-out;
}

.quick-find-diana:hover, .quick-find-christ:hover, .quick-find-procuress:hover, .quick-find-asleep:hover, .quick-find-open:hover, .quick-find-milk:hover,  .quick-find-officer:hover, .quick-find-interrupted:hover,.quick-find-berlin:hover, .quick-find-street:hover, .quick-find-glass:hover, .quick-find-view:hover, .quick-find-music:hover, .quick-find-pitcher:hover, .quick-find-lute:hover, .quick-find-picher:hover, .quick-find-blue:hover, .quick-find-necklace:hover,.quick-find-balance:hover, .quick-find-concert:hover, .quick-find-writing:hover, .quick-find-art:hover, .quick-find-earring:hover, .quick-find-hat:hover, .quick-find-mistress:hover, .quick-find-flute:hover, .quick-find-study:hover, .quick-find-astronomer:hover, .quick-find-geographer:hover, .quick-find-love:hover, .quick-find-lace:hover, .quick-find-guitar:hover, .quick-find-beit:hover, .quick-find-standing:hover, .quick-find-seated:hover, .quick-find-faith:hover,.quick-find-praxedis:hover, .quick-find-rolin:hover {
transform: scale(1.12);
}

.quick-find-christ {
height: 78px;
background-position: -70px 0px;
}
.quick-find-procuress   {
height: 78px;
background-position: -140px 0px;
}
.quick-find-asleep   {
height: 81px;
background-position: -210px 0px;
}
.quick-find-open   {
height: 95px;
background-position: 0px -100px;
}
.quick-find-officer   {
height: 76px;
background-position: -70px -100px;
}
.quick-find-milk   {
height: 79px;
background-position: -140px -100px;
}
.quick-find-interrupted   {
height: 61px;
background-position: -210px -100px;
float: left;
}
.quick-find-berlin   {
height: 62px;
background-position: 0px -200px;
}
.quick-find-street   {
height: 86px;
background-position: -70px -200px;
}
.quick-find-glass   {
height: 82px;
background-position: -140px -200px;
}
.quick-find-view   {
height: 64px;
background-position: -210px -200px;
}
.quick-find-music   {
height: 80px;
background-position: 0px -300px;
}
.quick-find-pitcher   {
height: 80px;
background-position: -70px -300px;
}
.quick-find-lute   {
height: 80px;
background-position: -140px -300px;
}
.quick-find-blue   {
height: 84px;
background-position: -210px -300px;
}
.quick-find-necklace   {
height: 81px;
background-position: 0px -400px;
float: left;
}
.quick-find-balance   {
height: 78px;
background-position: -70px -400px;
float: left;
}
.quick-find-concert   {
height: 79px;
background-position: -140px -400px;
float: left;
}
.quick-find-writing   {
height: 79px;
background-position: -210px -400px;
float: left;
}
.quick-find-art   {
height: 83px;
background-position: 0px -500px;
float: left;
}
.quick-find-earring   {
height: 82px;
background-position: -70px -500px;
float: left;
}
.quick-find-hat   {
height: 89px;
background-position: -140px -500px;
float: left;
}
.quick-find-mistress   {
height: 81px;
background-position: -210px -500px;
float: left;
}
.quick-find-flute   {
height: 79px;
background-position:  0px -600px;
float: left;
}
.quick-find-study   {
height: 78px;
background-position: -70px -600px;
float: left;
}
.quick-find-astronomer   {
height: 80px;
background-position: -140px -600px;
float: left;
}
.quick-find-geographer   {
height: 79px;
background-position: -210px -600px;
float: left;
}
.quick-find-love   {
height: 81px;
background-position: 0px -700px;
float: left;
}
.quick-find-lace   {
height: 82px;
background-position: -70px -700px;
float: left;
}
.quick-find-guitar   {
height: 80px;
background-position: -140px -700px;
float: left;
}
.quick-find-beit   {
height: 85px;
background-position: -210px -700px;
float: left;
}
.quick-find-standing   {
height: 81px;
background-position:  0px -800px;
float: left;
}
.quick-find-seated   {
height: 77px;
background-position: -70px -800px;
float: left;
}
.quick-find-faith   {
height: 91px;
background-position: -140px -800px;
float: left;
}
.quick-find-praxedis   {
height: 86px;
background-position: -210px -800px;
float: left;
}
.quick-find-rolin   {
height: 88px;
background-position:  0px -900px;
float: left;
}
/*************************** BECOME A PATRON in jumbotron ******************************/
#become-a-patron {
background-image: url(svg-images/svg-sheet-02.svg);
background-repeat: no-repeat;
clear: both;
height:30px;
padding-top: 4px;
/*background-position: -16px -61px;*/
background-position: -16px  -241px; 
margin-bottom: .5rem;
width: 150px;
height:22px;
position: fixed;
top: 21px;
left: 25px;
}

#become-a-patron:hover {
background-image: url(svg-images/svg-sheet-02.svg);
background-repeat: no-repeat;

/*background-position: -16px  -31px;*/
background-position: -16px  -272px;
background-repeat:no-repeat;
width: 150px;
height:22px;
position: fixed;
top: 21px;
left: 25px;
}


/*******************************************************************************/
/*************************** BOOTSTRAP ELEMENTS   ******************************/
/*******************************************************************************/

/*************************** BOOTSTRAP POPOVER with images AND text   ******************************/

/* popover frame*/
.popover {
font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif;
border-radius: 0;
-moz-box-shadow: 0 0 10px #cccccc;
-webkit-box-shadow: 0 0 10px #cccccc;
box-shadow: 0 0 10px #cccccc;
border: none;
max-width: 300px;
}
h3.popover {
font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif;
}
/*lower part which holds text*/
.popover-header  {
font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif;
color: gray;
background-color: white;
line-height: 1.1rem;
font-size: .9rem;
background-color: white;
color:#666666; 
font-style: normal;
font-weight:normal;
}
/*upper part wich holds image*/
.popover-body {
font-size: .9rem;
padding: .5rem .75rem;
 background-color: white; 
color:#666666; 
display: block;/*this removes popover body where image goes, in use for now ONLY in FAMILY TREE article*/
}
.popover img{
max-width:100%;   
}
.popover-header p  {
margin-bottom: .5rem;
font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif;
}
/*body color of popover arrow*/
.bs-popover-auto[x-placement^="bottom"] > .arrow::after, .bs-popover-bottom > .arrow::after {
top: 1px;
border-width: 0 .5rem .5rem .5rem;
}
/*************************** BOOTSTRAP TOOLTIP box and text   ******************************/
.tooltip >.tooltip-inner {
background-color: white;
opacity: 1 !important;
border: 1px solid #cccccc;
max-width: 250px;
padding: .5rem .5rem;
color: #333333;
text-align: left;
font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif;
font-size: .85rem;
letter-spacing: 0rem;
line-height: 1rem;
font-weight: normal;
-webkit-font-smoothing: antialiased;
-webkit-filter: blur(0.000001px);
font-smoothing: antialiased;
filter: blur(0.000001px);
}
.tooltip.in {
  opacity: 1 !important;
  filter:alpha(opacity=100) !important;
}
.tool  {
border-bottom: 1px solid #cccccc;
background-color: white}
.tool:hover {
cursor:pointer;
} 
.tooltip-inner {
    background-color: white;
    max-width: 200px;
    color: #fff;
    text-align: center;
    background-color: #000;
    border-radius: 0rem;
	box-shadow: 0 8px 6px -6px #dddddd;/*puts slight shadow on bottom of tooltip inner*/
}
.tooltip.bs-tooltip-right .arrow:before {/*removes arrow from tooltip*/
    border-right-color: #ffffff !important;
}
.tooltip.bs-tooltip-left .arrow:before {
    border-left-color: #ffffff !important;
}
.tooltip.bs-tooltip-bottom .arrow:before {
    border-bottom-color: #ffffff !important;
}
.tooltip.bs-tooltip-top .arrow:before {
    border-top-color: #ffffff !important;
}  
.tooltip.show {/*makes tooltip completely opaque*/
  opacity: 1!important;
}              
/*******************************  BOOTSTRAP GENERAL TABLE ********************************/
table {
font-size: .8em;
background-color: white;
}
/************************** COLOR HOVER IN TABLE ROWS  ************************************/
.table-hover tbody tr:hover td {
background: #F6F6F6;
}
/*************************** various BUTTONS and ACCORDIANS *******************************/

 
btn .btn-link.focus, btn .btn-link:focus, .btn-link-drop:focus {
text-decoration: none!important;
box-shadow: none!important;
}
.page-link:focus {
z-index: 2;
outline: 0;
text-decoration: none;
box-shadow: none;
}	
.btn-link.focus,.btn-link:focus {
text-decoration: none;
box-shadow: none;
}
.btn-link {
color:#666666;
font-size: .85em;
}
.btn-link-drop {
color:#666666;
font-size: .85em;
border:1px solid #cccccc;
border-radius: 0;
}
.btn-link-drop:hover {
color: #666666;
background-color: #F6F6F6;
border:1px solid #cccccc;
border-radius: 0;
}
 
#accordion-perspective {
	margin-bottom: 1.5em;
	 
}
#accordion-perspective .card-body  {
	font-size: .9em;
	line-height: 1.5em;
}
#accordion-glossary {
	margin-bottom: 1.5em;
}
#accordion-glossary li {
color: #aaaaaa;
text-indent: -1.3em;
padding-left:1em;
}
#accordion-glossary .card-body  {
font-size: .9em;
line-height: 1.5em;
}
#basic-accordian {
margin-bottom: 1.5em;
}
.card-body {
font-size: .95rem;
line-height: 1.5em;
padding: 1rem 1rem 1rem 2rem;
}

 

/*******************************  BOOTSTRAP CAROUSEL ********************************/
.carousel {
border-radius: 100%;
}
.carousel-caption { 
line-height: 1.1rem;
color: #666666;
text-align: left; 
position: absolute;
bottom: -28px;
}
@media (min-width: 576px) {
.carousel-caption { 
line-height: 1.1rem;
color: #666666;
text-align: left; 
position: absolute;
bottom: -28px;
}
}
.carousel-caption h6{ 
 font-size: .7rem;
}
@media (min-width: 576px) {
.carousel-caption h6{
font-size: .8rem;
}
}
.carousel-caption a:link{ 
font-size: .7rem;
line-height: 1.1rem;
color: #666666;
font-style:italic;
font-weight: bold;
}
.carousel-caption a:visited{ 
font-size: .7rem;
line-height: 1.1rem;
color: #666666;
font-weight:bold;
}
.carousel-caption a:hover { 
font-size: .7rem;
line-height: 1.1rem;
color: #9E9E9E;
text-underline: none;
font-weight:bold;
}
.carousel-control-next-icon, .carousel-control-prev-icon { 
display: inline-block;
background: no-repeat 50%/100% 100%;
background-repeat: no-repeat;
background-image: none;
margin-top: -100px; /*regulate horizontal positon of icons*/
}
.carousel-control-prev-icon {
background-image: url(../css/svg-images/carousel-backwards.svg);
background-repeat:no-repeat;
margin-left: -60px;
height:30px;
width:20px;
}
.carousel-control-next-icon {
background-image: url(../css/svg-images/carousel-forwards.svg);
background-repeat:no-repeat;
margin-right:  -60px;
height:30px;
width:20px;
}
.carousel-inner  {
display: block;
clear: both;
content: "";
padding-bottom:95px; 
border-bottom:1px #cccccc solid;
}
 a.carousel-control-next,  a.carousel-control-prev  {
text-decoration: none;
border-bottom: 0!important;
}
a:hover.carousel-control-next,  a.carousel-control-prev   {
text-decoration: none;
border-bottom: 0!important;
} 
.carousel-caption {
bottom:-95px; 
}
/************************** BOOTSTRAP DROPDOWN MENU BASICS  ***********************************/
.dropdown-item {

display: block;
width: 100%;
padding: 0em 1.5em;
font-size: .8em;
clear: both;
font-weight: 400;
color: #212529;
text-align: inherit;
white-space: nowrap;
background-color: transparent;
border: 0;
border-bottom-color: currentcolor;
border-bottom-style: none;
border-bottom-width: 0px;
}

/****************** BOOTSTRAP DROPDOWN MENU FOR DUTCH PAINTING BUTTON  ************************/
.btn-dutch-painting {
float: none;
clear:both;
font-family: 'Lato', sans-serif;
}
.btn-dutch-painting:focus {
outline: 0;
  text-decoration: none;
  box-shadow: none;
}
@media (max-width: 576px) {
.btn-dutch-painting {
display: flex;
justify-content: center;
}
}
/*********************** BOOTSTRAP DROPDOWN MENU FOR DELFT TODAY BUTTON ***********************/
.btn-delft {
float:right;
clear:both;
margin: .4rem .5rem .5rem 1.5rem;
background-color: #F8F8F8
}
.btn-delft:focus {
outline: 0;
text-decoration: none;
box-shadow: none;
}
@media (max-width: 576px) {
.btn-delft {
float:none;
margin-bottom: 1rem;
margin-left:none;
display: flex;
justify-content: center;

}
}
/********************* BOOTSTRAP DROPDOWN MENU FOR PALETTE BUTTON *****************************/
.btn-palette {
float:right;
clear:both;
margin: .4rem .5rem .5rem 1.5rem;
width:250px;
}
.btn-palette:focus {
outline: 0;
  text-decoration: none;
  box-shadow: none;
}
@media (max-width: 576px) {
.btn-palette {
float:none;
width:100%;
margin:0 0 1rem 0;
display: flex;
justify-content: center;
font-size: 1rem;
}
}
.btn-palette .btn-link-drop  {
width:100%;
white-space:normal;

}
@media (max-width: 576px) {
.btn-palette .btn-link-drop  {
width:100%;
font-size: 1rem;
}
}


/************************** BOOTSTRAP DROPDOWN MENU FOR PALETTE  BUTTON***********************************/
/*.btn-travels {
float:right;
margin-left:2rem;
}
.btn-travels:focus {
outline: 0;
text-decoration: none;
box-shadow: none;
}
@media (max-width: 576px) {
.btn-travels {
float:none;
margin-bottom: 1rem;
margin-left:none;
display: flex;
justify-content: center;
}
}*/

/************************** BOOTSTRAP DROPDOWN MENU FOR PALETTE  BUTTON***********************************/
/*.btn-interviews {
float:right;
margin-left:2rem;
}
.btn-interviews:focus {
outline: 0;
text-decoration: none;
box-shadow: none;
}
@media (max-width: 576px) {
.btn-interviews {
float:none;
margin-bottom: 1rem;
margin-left:none;
display: flex;
justify-content: center;
}
}*/
/************************** BOOTSTRAP DROPDOWN MENU FOR MASTERS BUTTON ***********************************/
.btn-masters {
display: block;
border-radius: 0;
float:left;
margin: 0rem .5rem 1.5rem 0rem;
}
.btn-masters:focus {
outline: 0;
  text-decoration: none;
  box-shadow: none;
}
@media (max-width: 576px) {
.btn-masters {
float:none;
margin-bottom: 1rem;
margin-left:none;
display: flex;
justify-content: center
}
}


/************************** BOOTSTRAP DROPDOWN MENU FOR CLIENTS BUTTON ***********************************/
/*.btn-clients {
display: block;
border-radius: 0;
float:right;
clear:both;
margin: .2rem .5rem .5rem 1.5rem;
}
.btn-clients:focus {
outline: 0;
  text-decoration: none;
  box-shadow: none;
}
@media (max-width: 576px) {
.btn-clients {
float:none;
margin-bottom: 1rem;
margin-left:none;
display: flex;
justify-content: center
}
}*/
/************************** BOOTSTRAPDROPDOWN BUTON FOR DISSIUS PAINTINGS ***********************************/
/*.btn-dissius-piantings {
display: block;
border-radius: 0;
float:right;
clear:both;
margin: 0rem .5rem .5rem 1.5rem;
}
.btn-dissius-piantings:focus {
outline: 0;
  text-decoration: none;
  box-shadow: none;
}
@media (max-width: 576px) {
.btn-dissius-piantings {
float:none;
margin-bottom: 1rem;
margin-left:none;
display: flex;
justify-content: center
}
}*/
/******************************* BOOTSTRAP DROPDOWN FONT SIZE AND PADDING  ******************************************************/
#my-dropdowns .dropdown-item {
font-size: 1rem;
padding-top:.15rem;
padding-bottom: .15rem;
  }
  
 /************************  NEW BRAND NAME WITH BOX AND OUTLINE ***********************************/
/*#brand-2019-navbar {
background-image:url(svg-images/brand-name-with-box.svg);
background-repeat:no-repeat;
background-position: 0px 0px;
}*/
#brand-2019 {
}
#brand-square {
fill:#777777;
}
#brand-box {
fill:#777777;
}
#brand-outline {
stroke:#777777;
fill:none;
}
#brand-e {
stroke:white;
fill:white;
}
#brand-m {
stroke:white;
fill:white;
}

/**************** TIMELINE RULES *******************/
.list-timeline li a:hover {
text-decoration: none;
border:none;
}

.tool-right {
float:right;
padding-right: 5px;
font-style:italic;
}
 



/******************************************************************************/
/******************************************************************************/
/**************** BOX for EXTRA CONTENT with IMAGE *******************/
/**************** and smaller margins for BOOKS *******************/
/******************************************************************************/
.extra-content-book {
background-image: none;
}
.main-content .extra-content-book-2 {
float:left;
color:#999999;
font-size: .85rem;
line-height: 1rem;
max-width: 150px;
}
.extra-content-book-2 a:link {
color:#777777;
text-decoration: none;
border-bottom: 1px solid #E0E0E0;
-webkit-transition: color 300ms ease;
-moz-transition: color 300ms ease;
-ms-transition: color 300ms ease;
-o-transition: color 300ms ease;
transition: color 300ms ease; 
}
.extra-content-book-2 a:visited  {
color:#777777;
text-decoration: none;
border-bottom: 1px solid #d0d0d0;
}
.extra-content-book-2 a:hover {
color: #d0d0d0;
text-decoration:none;
border-bottom: 1px solid #f4f4f4;
}
.extra-content-book-2 img{
margin-bottom: .5rem;
min-width:100px;
}
/************************temporary place holder for (see figure xxx) insertations ***************************************/
.see-somehwere {
display:none;
color:red;
font-weight:bold;
}
/************************ containers that hold list of Dutch painters at bootom of each DUTCH PAINTING entry ***************************************/
.twentey-five-percent {
width:50%;
float:left;
padding-right:1rem;
}

@media (min-width: 576px) {
.twentey-five-percent {
width:25%;
float:left;
padding-right:1rem;
}
}

/***************************************************************************************/
/************************ MAILCHIMP SIGNUP FORM  ***************************************/
/****************************************************************************************/
#mc_embed_signup form {
display:block;
position:relative;
text-align:left;
clear:none;
padding: 0px 0px 0px 10px;
background-color: white;
margin: 0;
width:100%;
margin-bottom: 20px;
border-left: 1px solid #cccccc;
}
#mc_embed_signup h2 {
font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif;
font-weight:normal;
font-style:italic;
padding:0;
line-height:1rem;
margin:0px 0px 10px 0px; 
font-size: .85rem;
width:100%;
text-transform:uppercase;
word-spacing: 6px;
color: #999999;
}
.newsletter-things {
font-style:normal;
padding-left:3px;
margin-bottom:12px;
line-height: 1.2rem;
}
/* labels for email and name */ 
#mc_embed_signup .mc-field-group label  {
display:block;
margin-bottom:0px;
background-color: transparent;
width:100%;
clear:both;
font-size: .85rem;
line-height: .85rem;
display:none;
}
/* INPUT boxes */
#mc_embed_signup .mc-field-group input {
display:block;
width:100%;
padding:8px 5px;
text-indent:2%;
font-size: .85rem;
}
::-webkit-input-placeholder { /* Edge */
  color: #aaaaaa;
}
:-ms-input-placeholder { /* Internet Explorer */
  color:#aaaaaa;
}
::placeholder {
  color: #aaaaaa;
}
/* input FOCUS */
#mc_embed_signup input:focus {
outline: 1px solid #cccccc;
background-color: #F9FCFF;
}
#mc_embed_signup input:focus::-webkit-input-placeholder {
 opacity: .3;
}
/* box that holds EMAIL label and input field */
.email {
float:left;
clear: both;
width:180px;
background-color: transparent;
margin-right: 5px;
}
/* box that holds NAME label and input field */
.name {
float:left;
clear: both;
width:100%;
background-color: transparent;
margin-right: 10px;
}
/* removes NAME field  in small devices  */
@media (max-width: 520px) {
.name {
display:none;
}
}
/* border around INPUT BOXES */
#mc_embed_signup input  {
border: 1px solid #dddddd;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
color: #999999;
}
/*#mce-EMAIL.required.email   {
border: 1px solid #dddddd;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
color: #999999; 
}*/
/* group that holds two filed groups???*/
#mc_embed_signup .mc-field-group {
float:left;
position:relative;
width:100%;
padding-bottom:0;
min-height:44px;
}
/* BUTTON */
#mc_embed_signup .button  {
clear: both;
background-color: #daecfb;
opacity: .7;
border: 1px solid #666666;
border-radius:1px;
transition: all 0.23s ease-in-out 0s;
color: #666666;
cursor: pointer;
display: inline-block; 
font-size:13px;
font-weight: italic;
line-height: 1rem;
margin: 0px 0px 0px 0px;
padding: 4px 4px;
text-align: center;
text-decoration: none;
vertical-align: top;
white-space: nowrap;
width: 110px;
text-transform:uppercase;
letter-spacing: .01rem;
}
#mc_embed_signup .button:hover {
background-color: #666666;
color: white;
}
/* ????????? */
#mc_embed_signup .nowrap {
white-space:nowrap;
}
/* ????????? */
#mc_embed_signup .size1of2  {
clear:none;
float:left;
display:inline-block;
width:46%;
margin-right:4%;
}
/* ????????? */
* html #mc_embed_signup .size1of2 {
margin-right:2%; /* Fix for IE6 double margins. */
}
/* ????????? */
#mc_embed_signup .mc-field-group select {
display:inline-block;
width:99%;
padding:5px 0;
margin-bottom:2px;
background-color: white;
}
/**************************** Previous and Next painting  arrows ************************************/

/*
<li id="next-painting" style="list-style:none">
*/
#two-bar-extra-content-menu #next-painting, #painting-info #next-painting  {
background-image:url(svg-images/next-02.svg);
background-repeat:no-repeat;
background-size:.45rem;
background-position: 2px 6px;
background-repeat: none;
padding-left: 1.3rem;
}
/*
<li id="previous-painting" style="list-style:none">
*/
#two-bar-extra-content-menu #previous-painting, #painting-info #previous-painting  {
background-image: url(svg-images/previous-02.svg);
background-repeat:no-repeat;
background-position: 2px 6px;
background-size:.45rem;
background-repeat: none;
padding-left: 1.3rem;
}
 #cooldaddy { 
 background-color:red; }

 
a {
/* These are technically the same, but use both */
overflow-wrap: break-word;
word-wrap: break-word;

-ms-word-break: break-all;
/* This is the dangerous one in WebKit, as it breaks things wherever */
word-break: break-all;
/* Instead use this non-standard one: */
word-break: break-word;

/* Adds a hyphen where the word breaks, if supported (No Blink) */
-ms-hyphens: auto;
-moz-hyphens: auto;
-webkit-hyphens: auto;
hyphens: auto;
}


/* adds some space above first nav item and mnakes font larger when toggled*/
@media (max-width: 576px) {
li.nav-item:first-child {
margin-top:1.5rem;
}
}
@media (max-width: 576px) {
.navbar .navbar-nav .my-link {
font-size: 1rem;
}
}
@media (max-width: 576px) {
.navbar .navbar-nav .my-link:hover {
font-size: 1rem;
}
}

/* removes  lines around toggle hamburger*/
.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler-icon:focus {
    outline: none;
    box-shadow: none;
}

/*************************** DELFT SVG GROWTH styles *****************************************/


#expansion-of-delft {
background-image: url(../delft/view-of-delft-archive/maps/marian-growth.jpg);
background-repeat: no-repeat;
background-size: contain;
}
 

text#delft-years {
font-size:40px;
line-height:1.25;
font-family:
'Times New Roman';
writing-mode:lr-tb;text-anchor:start;
fill:#000000;
fill-opacity:1;
stroke:none;
}


/*** * answers for PRAXEDIS POLL ****/
label#l_0_5f1ecc3ce4b072b12a12acf9.OPP-poll-choice.OPP-poll-choice-text, label#l_1_5f1ecc3ce4b072b12a12acf9.OPP-poll-choice.OPP-poll-choice-text, label#l_2_5f1ecc3ce4b072b12a12acf9.OPP-poll-choice.OPP-poll-choice-text  {
color:#666666!important 
font-size:1.05rem!important;
padding: 8px 0px 0px 0px!important;
line-height:1rem!important;
}
@media (min-width: 520px) {
label#l_0_5f1ecc3ce4b072b12a12acf9.OPP-poll-choice.OPP-poll-choice-text, label#l_1_5f1ecc3ce4b072b12a12acf9.OPP-poll-choice.OPP-poll-choice-text, label#l_2_5f1ecc3ce4b072b12a12acf9.OPP-poll-choice.OPP-poll-choice-text  {
color:#666666!important
font-size:1rem!important;
padding: 8px 0px 0px 0px!important;
line-height:1rem!important;
}
}

/*** * answers for BARON ROLIN ****/
label#l_0_5f1eaad7e4b072b12a12ac8f.OPP-poll-choice.OPP-poll-choice-text, label#l_1_5f1eaad7e4b072b12a12ac8f.OPP-poll-choice.OPP-poll-choice-text, label#l_2_5f1eaad7e4b072b12a12ac8f.OPP-poll-choice.OPP-poll-choice-text  {
color:#666666!important 
font-size:1.05rem!important;
padding: 8px 0px 0px 0px!important;
line-height:1rem!important;
}
@media (min-width: 520px) {
label#l_0_5f1eaad7e4b072b12a12ac8f.OPP-poll-choice.OPP-poll-choice-text, label#l_1_5f1eaad7e4b072b12a12ac8f.OPP-poll-choice.OPP-poll-choice-text, label#l_2_5f1eaad7e4b072b12a12ac8f.OPP-poll-choice.OPP-poll-choice-text  {
color:#666666!important 
font-size:1rem!important;
padding: 8px 0px 0px 0px!important;
line-height:1rem!important;
}
}




/*** * answers for DRESDEN POLL ****/
label#l_0_61470282e4b04db784bde6ba.OPP-poll-choice.OPP-poll-choice-text, label#l_1_61470282e4b04db784bde6ba.OPP-poll-choice.OPP-poll-choice-text, label#l_2_61470282e4b04db784bde6ba.OPP-poll-choice.OPP-poll-choice-text, label#l_3_61470282e4b04db784bde6ba.OPP-poll-choice.OPP-poll-choice-text, label#l_4_61470282e4b04db784bde6ba.OPP-poll-choice.OPP-poll-choice-text  {
color:#666666!important
font-size:1.05rem!important;
padding: 8px 0px 0px 0px!important;
line-height:1rem!important;
}
@media (min-width: 520px) {
label#l_0_61470282e4b04db784bde6ba.OPP-poll-choice.OPP-poll-choice-text, label#l_1_61470282e4b04db784bde6ba.OPP-poll-choice.OPP-poll-choice-text, label#l_2_61470282e4b04db784bde6ba.OPP-poll-choice.OPP-poll-choice-text, label#l_3_61470282e4b04db784bde6ba.OPP-poll-choice.OPP-poll-choice-text, label#l_4_61470282e4b04db784bde6ba.OPP-poll-choice.OPP-poll-choice-text  {
color:#666666!important 
font-size:1rem!important;
padding: 8px 0px 0px 0px!important;
line-height:1rem!important;
}
}


/*** * answers for RUBBER DUCK ****/
label#l_0_5f47516be4b048bb3274734d.OPP-poll-choice.OPP-poll-choice-text, label#l_1_5f47516be4b048bb3274734d.OPP-poll-choice.OPP-poll-choice-text, label#l_2_5f47516be4b048bb3274734d.OPP-poll-choice.OPP-poll-choice-text  {
color:#666666!important
font-size:1.05rem!important;
padding: 8px 0px 0px 0px!important;
line-height:1rem!important;
}
@media (min-width: 520px) {
label#l_0_5f47516be4b048bb3274734d.OPP-poll-choice.OPP-poll-choice-text, label#l_1_5f47516be4b048bb3274734d.OPP-poll-choice.OPP-poll-choice-text, label#l_2_5f47516be4b048bb3274734d.OPP-poll-choice.OPP-poll-choice-text  {
color:#666666!important 
font-size:1rem!important;
padding: 8px 0px 0px 0px!important;
line-height:1rem!important;
}
}

/**** answers for CAMERA OBSCURA ****/
label#l_0_5f477ac9e4b048bb3274741c.OPP-poll-choice.OPP-poll-choice-text, label#l_1_5f477ac9e4b048bb3274741c.OPP-poll-choice.OPP-poll-choice-text, label#l_2_5f477ac9e4b048bb3274741c.OPP-poll-choice.OPP-poll-choice-text  {
color:#666666!important
font-size:1.05rem!important;
padding: 8px 0px 0px 0px!important;
line-height:1rem!important;
}

@media (min-width: 520px) {
label#l_0_5f47516be4b048bb3274734d.OPP-poll-choice.OPP-poll-choice-text, label#l_1_5f47516be4b048bb3274734d.OPP-poll-choice.OPP-poll-choice-text, label#l_2_5f47516be4b048bb3274734d.OPP-poll-choice.OPP-poll-choice-text  {
color:#666666!important; 
font-size:1rem!important;
padding: 8px 0px 0px 0px!important;
line-height:1rem!important;
}
}




/*** DRESDEN BOX wider ****/
 
#OPP-poll-id-61470282e4b04db784bde6ba {
width:  100%!important;!important;
margin: .7rem auto .5rem auto!important;
}

@media (min-width: 520px) {
#OPP-poll-id-61470282e4b04db784bde6ba {
width:  100%!important;
margin: .7rem auto .5rem auto!important;
}
}


/*overall box*/
#OPP-div-around-poll {
border: 1px solid #cccccc!important;
}
/***question text on SMALL viewport***/
#OPP-poll-question-text {
color:#666666!important;
line-height: 1.1rem!important;
font-size: 1.2rem!important;
margin-bottom: 1rem!important;
}
@media (min-width: 520px) {
#OPP-poll-question-text {color:666666!important;
line-height:1.3rem!important;
font-size:1.2rem!important;
margin-bottom: 1rem!important;
}
}


tr.OPP-poll-choice-div.OPP-poll-choice-td-content {
padding: 20px 20px 20px 20px!important;
background-color:white!important;
vertical-align: bottom!important;
}
td.OPP-poll-choice-div.OPP-poll-choice-td-buttone {
padding: 20px 20px 20px 20px!important;
color:pink!important; 
}
/** RESULT text ****/ 
#OPP-result-link-text {
font-size:1rem!important;
padding-left:2rem!important;
color:#666666!important;
font-style:italic!important;
font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif!important;
}
/************************* VOTE button *************************/
#OPP-poll-vote-button {
font-size:.85rem!important;
padding:.2rem .6rem. .2rem .6rem!important;
color:#666666!important;
background-color:white!important;
border:1px solid #666666!important;
text-transform:uppercase!important;
}
#OPP-poll-vote-button:hover {
font-size:.85rem!important;
padding:.2rem .6rem. .2rem .6rem!important;
color: white!important;
background-color:#666666!important;
border:1px solid #666666!important;
}
.OPP-choiceBarFilled {
height:14px!important;
padding-top:2px!important;
background-color: #bee0f9!important;
}
.OPP-choiceBar{
margin-top:2px!important;
}
td.OPP-poll-choice-div.OPP-poll-choice-td-content {
padding: 0px 0px 0px 10px!important;
color: #666666!important; 
font-size:4rem!important;
}
/*height of resutls bar*/
.OPP-choiceBar {
height:9px!important;
margin-bottom: 3px!important;
margin-top:1px!important;
display: inline-block;
float: left;
width:100%;
}
.OPP-result-summary {
margin-top:3rem!important;
font-size: 1rem!important;
font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif!important;
}
/* text of see results */
.OPP-poll-choice-text {
font-size: .95rem!important;
line-height:1rem!important;
}

/*************************** 25 Things Youd didn't know *********************************************/

.twentyfive {
display: none;
background-color: #f8f8f8;
width: 100%;
font-size: 1.1rem;
text-align:center;
padding:1rem .5rem .8rem .5rem;
border: 1px solid #cccccc;
font-family: 'Lato', sans-serif;
 
}
.twentyfive  a:link {
text-align:center;
padding: .3rem;
margin: .2rem;
background-color: #f8f8f8;
color: #333333;
-webkit-transition: color 300ms ease;
-moz-transition: color 300ms ease;
-ms-transition: color 300ms ease;
-o-transition: color 300ms ease;
transition: color 300ms ease; 
}
.twentyfive  a:visited{
text-align:center;
padding: .3rem;
margin: .2rem;
background-color: #f8f8f8;
color: #6a7a89;
}
.twentyfive a:hover{
text-align:center;
padding: .3rem;
margin: .2rem;
background-color: #F9F9F9;
color: #d95a4b; 
text-decoration:none
} 
.twentyfiv-text  a:link {
color: #d95a4b;
-webkit-transition: color 300ms ease;
-moz-transition: color 300ms ease;
-ms-transition: color 300ms ease;
-o-transition: color 300ms ease;
transition: color 300ms ease; 
}
.twentyfive-text  a:visited{
color: #d95a4b;
}
.twentyfive-text a:hover{
color: #cccccc; 
text-decoration:none
} 
#collapssecondbook {
 background-color: #f8f8f8;
 padding-top: 1rem;
}
 
.twentyfive-image {
background-color: #f8f8f8;
 
}
.twentyfive-text {
 background-color: #f8f8f8;
}
.twentyfive-text p {
text-align: left;
font-size: 1.07rem;
line-height:1.4rem;
padding-bottom: .6rem;
background-color: #f8f8f8;
}
.twentyfive-paypal {
font-family: 'Lato', sans-serif;
 background-color: white;
 font-size: .95rem;
 padding-top: 1rem;
  padding-bottom: 1rem;
 border-radius: 8px;
 border:1px solid #d95a4b;
 color: black
}
.pp-button  {
background-color: white;
}
.lato-text {
}
.small-book-cover {
width: 150px;
margin-top: .5rem
}

#img-link-no-underline,   #img-link-no-underline img{
    text-decoration: none;
	border-width: 0px;
}