/* ******************** ADDITIONAL MODIFICATIONS TO CORE CARO **************
Put rado buttons and checkboxes inline add to clara/css/components/form--checkbox-radio.css LINE 17

.form-type--boolean {
	display: inline-flex;
	padding-left: .5rem;
}
*/

/* LOGGED IN MODE */
.user-logged-in nav.tabs ul.tabs--primary li:nth-child(3) { display: none; } /* Remove DELETE button */

.wrapper { padding-top: 4rem; }
.navbar { height: 4rem; }

header.boxed
{
	padding-top: 1rem;
	border-bottom: 2px solid gray; 
	border-style: outset;
	background-color: rgba(235, 240, 247, 0.91);
}

ul.top-slide-1, tp-revslider-mainul
{
/*	background-color: beige;*/
	background-image: url(/sites/jf/files/images/Europe/Joyce%20in%20Italy.JPG);
	background-size: cover;}

/* Vertical spacing of home page blocks (and maybe more) */
.experience-box {
	position: relative;
	white-space: nowrap;
	margin: 2rem 0; 
	margin-top: 2rem;
}

/* h6 is same font size as p and has no margins */
h6 {
	font-size: 1.5rem;
	margin: 0;
}

/* color of titles for artwork */
h3.project-title { color: gray; }
h1.artwork-title
{
	color: gray;
	text-align: center;
}

.fine-note
{
	font-size: small;
	font-style: italic;
	background-color: #CBECFF;
}

/* LOGGED IN USER -- this scrolls the menu below the toolbar */
	body.role-joyce header,
	body.role-artist header,
	body.role-administrator header  { margin-top: 80px; }
	.user-logged-in nav.tabs { left: 15px !important; }
	.user-logged-in nav.tabs li a
	{
		padding-right: 6px !important;
		padding-left: 6px !important;
	}

/***********************************
	- LAYOUT -
***********************************/

.indented .comment { padding-left: 4rem; }

hr { border-top: 1px solid #aaa; }

/***********************************
	- NAVBAR -
***********************************/

.navbar-spacer {
    float: right;
    margin: -1rem 1.5rem 0;
}
.navbar-address, .navbar-title
{
	margin-top: -5px;
	float: none;
	text-align: center;
	font-style: italic;
	line-height: 1.2;
	font-size: 1.2rem;
}
.navbar .logo { padding-left: 10px; }

.navbar-title
{
	font-size: 1.7rem;
	font-weight: 600;
	text-transform: uppercase;
	font-weight: 600;
	text-transform: uppercase;
	padding-top: 0.5rem;
}
.block-page-title-block  { width: 80%; }
.navbar-title
{
	overflow: hidden;
	max-width: 60%;
	text-overflow: ellipsis;
	width: fit-content;
	white-space: nowrap;
	margin: 0 auto;
}

@media screen and (max-width: 480px) {
  .brand img { display: none; }
  }
  
.art-attributes
{
	padding-right: 4rem;
	padding-left: 4rem;
}
.art-details,
.pager-nav
	{ clear: both; }

/* @media (min-width: 992px), all
	margin-left: 25%;}
@media (min-width: 992px), all
	width: 50%;
}*/
@media (min-width: 992px){
	.page-header {
		margin: 1.8rem 0 1.8rem
	}
}
@media (min-width: 992px) {
	.col-md-5 {
		padding-top: 5rem;
	}
}
.row { margin-left: -10px; } /* Fix left shift on phones */


body
{
	background-color: #FCFBFB;
	line-height: 2rem;
	font-size: 1.3rem !important;
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    letter-spacing: 0.025em;
    color: #444;
}

header, footer, aside
{
	line-height: 2rem;
	font-size: 1.3rem !important;
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    letter-spacing: 0.025em;
    color: #666666;
}


/* ========== OVERRIDE style-light.css ========= */
h1, .h1 { font-family: 'Playfair Display'; }

h2, .h2
{
	font-family: 'Playfair Display';
	font-weight: 700;
	font-size: 3rem;
	color: #777;
}
h2.poppins
{
	font-family: 'Poppins';
	font-weight: 500;
	font-size: 2.5rem;
	color: #777;
}
h3, .h3
{
	font-family: 'Poppins' !important;
	line-height: 1.5 !important;
}

h4
{
	color: #B89D4F;
	font-weight: normal;
	text-transform: uppercase;
	font-size: 1.5rem;
	margin-bottom: .5rem;
}
h4 a {
	border: 1px #B89D4F solid;
	padding: 4px 25px 2px 25px;
}

section.region-leader .row { margin-bottom: 3rem; }
section.region-leader h1, section.region-leader h2
{
	font-family: 'Playfair Display';
	font-weight: 400;
	color: #555;
	text-align: center;
	margin-top: 0;
	margin-bottom: 1rem;
}
section.region-leader h1 { font-size: 4rem; }
section.region-leader h2 { font-size: 2rem; }
section.region-leader h6 { margin: 0.25rem; }

.more a, a.more {
	color: blue;
	font-style: italic;
}
.copyright
{
	font-family: sans-serif;
	font-size: 0.8rem;
	font-weight: normal;
}
.fineprint, .fineprint a
{
	font-family: sans-serif;
	font-size: 1rem !important;
	font-weight: normal !important;
}

.byline
{
	font-size: initial;
	font-style: italic;
	font-weight: 500;
}
.byline .field--name-field-location { display: inline-block; }

.text-center { text-align: center; }
.text-right { text-align: right; }
.image-style-image-centered
{
	margin-right: auto;
	margin-left: auto;
}

shadtext3 { text-shadow: 3px 3px #918e8e !important; }

.masked:before { background: none; } /* this is usually a gray background around an image */

@media (max-width: 549px) {
	.navbar
	{
		height: 0;
		padding-top: .0;
		padding-bottom: 1rem;
	}
}

/* Text adjustment */
.author-name
{
	text-transform: capitalize;
	font-size: inherit;
}
.brand-info .caption
{
	font-size: 1.25rem;
	font-style: italic;
	font-weight: 400;
}
/***********************************
	- SUPER :OGIN FORM -
***********************************/

#user-login-form,
#user-pass
{
	margin: 2rem auto 2rem auto;
	background-color: rgba(235, 240, 247, 0.91);
	padding: 0 12px 0 12px;
}

#user-login-form p.login-title,
#user-pass p.login-title
{
	background-color: #4F81EE;
	color: white;
	font-weight: 600;
	margin-right: -12px;
	margin-left: -12px;
}
#user-pass .back-to-login { float: left; }
#user-login-form p.forgot-password { top: 5px; }

/***********************************
	- SIDEBAR -
***********************************/

#sidebar-second
{
	background-color: #eee;
}
.view-sidebar-blocks { margin-top: 2rem; }


@media (min-width: 920px)
{
	.col-sm-8 { width: 70% !important; }
	.col-sm-4 { 
		width: 27% !important;
		margin-left: 1rem;
	}
}

#sidebar-second .well, #sidebar-second .views-element-container
{
	font-size: smaller;
	line-height: 120%;
	padding: 0 1rem 0.1rem 1rem;
}

#sidebar-second h2
{
	font-family: poppins, sans-serif !important;
	font-size: 1.5rem;
	font-weight: 600;
	text-transform: uppercase;
	text-align: center;
}
#sidebar-second .grid-items { margin: 0; }
#sidebar-second ul,
#sidebar-second ol
{
	padding-left: 1rem;
}
#sidebar-second ul,
#sidebar-second ol
{
	padding-left: 1rem;
	margin-top: -2rem;
}
#sidebar-second h5
{
	margin-top: 1.5rem;
	margin-bottom: .5rem;
}

@media (min-width: 992px)
{
	.col-md-8 { width: 85%; }
	.col-md-offset-2 { margin-left: 10%; }
}

#sidebar-second .views-element-container:after 
{
    content: ""; 
    display: block;
    margin: 0 auto;
    width: 50%;
    border-bottom: 2px solid black;
    margin-bottom: 1rem;
}
#sidebar-second { display: block !important; }
	
@media (max-width: 920px)
	{
		.col-sm-4, .col-sm-8 { width: 100% !important; 
	}
}
.view-display-id-sidebar_articles li,
 .view-display-id-related_quotes li,
 .view-display-id-sidebar_touche_list li { margin-bottom: 0.5rem; }


/***********************************
	- IMAGE STYLES -
***********************************/

.image-caption-right
{
	float: right;
	font-size: 1rem;
	margin-right: 40%;
	color: black;
	font-style: italic;
}

.caption-center
{
	font-size: 1rem;
	color: black;
	text-align: center;
	font-weight: 600;
	margin-top: -.6rem;
}

img
{
	display: block;
	max-width: 100%;
	height: auto;
}


/* ========= */

/* HOME PAGE REV SLIDER */
/* Hide bullets in home page slider */
#rev_slider.home-open .tp-bullets { display: none; }

/* Cover up the opening scene */
#rev_slider.home-open .tp-revslider-mainul { background-color: white; }

.slider-title
{
	text-shadow: 2px 2px #333;
}

/* logo border */
.brand-info {
	display: inline-block;
	float: left;
	padding-top: 2px;
}
.ct-single .featured-image {
	width: auto;
	max-width: 100%;
}
.featured-image {
	height: auto;
	margin: 0;
	vertical-align: middle;
	border-style: none;
	-webkit-transition: opacity 200ms ease;
	transition: opacity 200ms ease;
}
/* box-shadow: none|h-offset v-offset blur spread color */
.img-shadow-1 {
	box-shadow: 1.25rem 1.375rem 2.75rem 0rem rgba(0, 0, 0, 0.22) !important;
}
.img-shadow-2,
.field--name-field-art-original.field--type-image img, .item-shadow
{
	box-shadow: .75rem .85rem 1.75rem 0 rgba(0,0,0,.32);
}
.img-shadow-3 img {
	box-shadow: 1.25rem 1.375rem 4.75rem 0 rgba(0,0,0,.42)!important;
}
.img-shadow-4a img {
	box-shadow: .375rem .375rem .7rem 0 rgba(0,0,0,.22)!important;
}
.img-shadow-4 img {
	margin-bottom: 1rem;
	margin-top: 1rem;
	box-shadow: .5rem .5rem 1.5rem rgba(0,0,0,.42)!important;
	/*box-shadow: 1.25rem 1.375rem 4.75rem 0 rgba(0,0,0,.42)!important;*/
}
.item-shadow {
	margin-bottom: 1.75rem;
	margin-right: 1.75rem;
}

.view-display-id-block_2 .project-item { 
	overflow: unset; 
}

/* Page appearance for Artwork */
.page-node-type-artwork-page .page-header
{
	border-bottom: 0;
	padding: 0;
	margin: 0 0 1rem 0;
	width: 100%;
	text-align: center;
	color: grey;
}
.float-img-page-header
{
	border-bottom: 0;
	padding: 0;
	margin: 1rem;
}
.page-node-type-artwork-page .project-content { margin: 0 0 1rem 0; }

.field--name-field-art-original.field--type-image {
    font-size: 1.2857rem;
    line-height: 1.666;
    font-weight: 300;
    letter-spacing: 0;
	margin: 0 0 2rem 0;
	width: auto;
}

.field--name-field-art-original.field--type-image img
{
	width: 100%;
/*	max-height: 800px;*/
	margin-right: auto;
	margin-left: auto;
}

/* OVERWRITE style-light.css */
.project-item:hover .project-hover, .project-item:hover .project-hover-2 {
  background-color:#D7F5FF;
  color:#fff;
  opacity: 0.8;
}
.project-item:hover .project-hover-2 {
  opacity: 0.3;
}
h3.project-title {
  font-weight: 400;
	font-size: 1.285rem;
	color: #000;;
}
::selection{
    background-color:#D7F5FF;
    color:#fff;
}
-webkit-::selection{
    background-color:#D7F5FF;
    color:#fff;
}
::-moz-selection{
    background-color:#D7F5FF;
    color:#fff;
}
.align-center { text-align: center; }

/* RIGHT CHEVRON CODE: <i class="icon ion-ios-arrow-right"> </i> */

/* PAGE EDIT MENU - ELIMINATE DELETE & REVISION */
nav.tabs ul li, nav.tabs--primary ul li { background-color: lightgray; }
nav.tabs ul li a 
{  
	font-weight: 600;
	color: black;
}

/* show the complete pop-up menu which changes by @media */

.menu { z-index: 900 !important; }
.menu-list {
	top: 90px !important; /* to clear the navbar */
	bottom: 1rem !important;
}

/* Captions for in-body images */
figcaption
{
	text-align: center;
	font-style: italic;
	font-size: small;
	line-height: normal;
}

/* catalog isotope conttrol */
.grid ul.filter { float: left; }
.grid ul.filter li
{
	margin-right: 0.6rem;
	margin-left: 0.6rem;
}


/* #### SECTION OVERRIDES ##### */

/* .wrapper { padding-top: 5rem; } */

section h1 { margin-top: 0; }

.front-section { 
	border-top: 2px solid #444;
	margin-top: 1rem;
/*	padding: 1rem; */
	clear: both;
}
h2.section-title { text-align: center; }


a, .section-subtitle { color: #444; }
.btn { background-color: #75B106; }

/* FRONT PAGE STYLES */
section.section-news-front-page .card-block { background-color: #f2f2f2; }

.section-front-subtitle
{
	font-size: 2rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #444;
	margin-bottom: 1rem;
	font-weight: 500;
	font-style: italic;
}
.article-single .subtitle,
.blog-entry .subtitle,
.view-news-lists .subtitle
{
	font-style: italic;
	font-weight: 600;
}
.view-news-lists .subtitle,
.view-quotes .subtitle
 { font-size: 1.5rem; }

.link-arrow-2 { font-size: 2rem !important; }

.front-box-number {
	font-size: 7.5rem;
	line-height: 0.1rem;
	text-align: center;
}
.front-box-text { font-size: 1.5rem; }

/***********************************
	- NODE TYPE ARTICLE - Created with CK_Editor where we need more control on the image
***********************************/

article.node--type-article h1.display-1 { text-align: center; }
article.node--type-article .article-detail-image
{
	background-repeat: no-repeat !important;
	background-size: contain !important;
	background-position: center !important;
	background-color: #e4e4e2;
}
article.node--type-article .page-content figure.align-left img,
article.node--type-article .page-content img.align-left
{
	padding-top: 1rem; /* aligns top with paragraph */
	padding-right: 10px;
}
article.node--type-article .page-content figure.align-right img,
article.node--type-article .page-content img.align-right
{
	padding-top: 1rem; /* aligns top with paragraph */
	padding-left: 10px;
}
article.node--type-article .page-content figure.align-center img,
article.node--type-article .page-content img.align-center
{
	margin-top: -1rem; /* aligns top with paragraph */
}
.article-body, article.node--type-article .page-content { margin-top: 0; }

article.node--type-article .page-content p + p { text-indent: 3rem; }

article.node--type-article .page-content p.no-para-indent, 
article.node--type-article .page-content p:first-child  { text-indent: 0; }

article.node--type-article .page-content blockquote p { text-indent: 0rem !important; }

/******* ISOTOPE ****** */

.field--name-field-paragraph-content .grid { z-index: 800; }
.grid-items
{
	padding-top: 0;
	margin-top: 1px;
}
.grid-item
{
	padding-top: 0;
	margin-top: 0;
}
.grid-item img { padding: 0.5rem; }

.no-bg-img 
{ 
	background-image: url(/sites/common/framework/gray-bg-block.png);
	background-size: contain;
}

.views-more-link
{
	color: blue;
	font-style: italic;
	font-weight: 500;
}

article .article-body .field--item img
{
	margin-right: auto;
	margin-left: auto;
}
.is-unpublished .byline
{
	background-color: #ff0000 !important;
	color: white;
}

/***********************************
	- XXX -
***********************************/

.darktitle
{
	color: #4D600A !important;
	vertical-align: bottom;
}
.background-image {
  position: relative;
}
.views_slideshow_cycle_main
{
	margin-top: 1rem !important;
}
/* .views_slideshow_cycle_slide { 
	border: thick #826D6A ridge;
	box-shadow: 1.25rem 1.375rem 2.75rem 0rem rgba(0, 0, 0, 0.4)
	background: white!important;
}*/
.responsive, .field--name-body img {
/*  width: 100%; */
  height: auto;
}

.shaded
{
	box-shadow: 1.25rem 1.375rem 4.75rem 0 rgba(0,0,0,.42)!important;
	background-image: url(/sites/jf/files/images/framework/Joyce-Gallery-slides-2-1.jpg);
	background-size: cover;
	border: 4px #666 ridge;
}

/* GALLERY PROJECT DETAILS MODIFIED CUSTOM.CSS IN BAHAUS */
/* .gallery-header { background-color: rgb(245, 245, 245); } */
.gallery-body .grid-item { 
	padding: 2rem;
	margin-right: 4rem; 
}

.gallery-header { 
	padding-left: 2em;
	padding-right: 2em;
}
.gallery-header h1
{
	text-align: center;
	left: 7%;
	position: absolute;
	top: 14vw;
	color: white;
	font-size: 4vw;
	margin: 8vw 0 8vw;
}
.gallery-header .text-tag { font-size: 50%; }
/* .gallery-header #gallery-head-block { 
	background-image: url(/sites/jf/files/images/framework/background-exhibit-1s.jpg);
	background-size: cover;
	height: 30rem;
} */
.gallery-header .bgimg img { width: 100%; }

.gallery-header #gallery-head-block img { 
	transform: perspective(60em) rotateY(-25deg) rotateX(0deg);
	box-shadow: .5rem .75rem 2rem 0 rgba(0,0,0,.58);
	border-right: solid 4px #555;
	width: 22%;
	float: right;
	margin-right: 5%;
	margin-top: 4%;
	right: 7%;
	position: absolute;
	top: 0;
}
.gallery-header h2
{
	text-align: center;
	border: 2px white groove;
	background-color: #f2eddb; /*#e3ecd9;*/
	padding: 1rem;
	margin-bottom: 0;
}
.the-exhibit { border: 2px white groove; }

.gallery-text p, .gallery-header p
{
	font-family: 'Playfair';
	font-size: 1.5rem;
	line-height: 2.5rem;
}
.gallery-header p
{
	width: 80%;
	text-align: left;
	color: #a38a3e;
}

.view-display-id-gallery_showing .grid-item { 
	width: 100%; 
	margin-top: 1rem;
}
.gallery-title, .gallery-title a
{
	text-align: center;
	color: gray;
	font-family: poppins;
	font-size: 2rem;
	font-weight: 600;
}
.gallery-img, .gallery-text
{
	vertical-align: middle;
	height: 100%;
	padding: .5rem;
}
.view-art-gallery .view-footer { width: 100%; }
.view-art-gallery .view-footer h4 { text-align: center; }
		
/* Show image and text side-by-side except on phones in portrait mode */
@media (min-width: 550px) {
	.views-row.even .gallery-text.row-odd
		{ display: none; }
	.views-row.odd .gallery-text.row-even
		{ display: none; }
	.gallery-img, .gallery-text { 
		display: inline-block;
		width: 49%;
	}
	.gallery-header .gallery-img, .gallery-header .gallery-text { 
		display: block;
		width: 100%;
	}
	.views-row.even .gallery-body
		{ margin-right: 4rem; }
	.views-row.odd .gallery-body
		{ margin-left: 4rem; }
}
@media (max-width: 549px) {
	.gallery-text.row-even
		{ display: none; }	
	.img-shadow-4 img {
	margin-bottom: 0;
	margin-top: 0;
	}
	h4 a
	{
		display: inline-block;
		margin-bottom: 6px;
	}
}

.project-detail .project-detail-info .project-detail-content ul.project-detail-list { margin-top: 0; !important }


/* ************ SLICK SLIDES  *********** */

.slick-dots li button { background-color: white; }
.field--label, .field--type-boolean .field--item, .viewsreference--view-title { display: none; } /* hide paragraph extra items */


/* 3D effect */
.depth-wrapper {
  display:inline-block;
  perspective:1000px;
}
.depth-box {
box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset;
}

/* Override Custom Tags */
.field--name-field-tags {
  font-size: 1rem;
  margin-top: 0;
}
.field--name-field-tags .field--item, .field--name-field-project-category .field--item, .field--name-field_exhibited .field--item {
color: #999;
display: inline;
padding-left: 5px;
}
.slick-list { width: 100%; }

.slick__slide { 
	margin: 1.5rem;
	padding: 1.5rem;
	box-shadow: 1.25rem 1rem 2rem 0rem rgba(0, 0, 0, 0.32) !important;
}
.slick__slide a
{
	text-align: center;
	font-size: 1.3rem;
	color: black;
}
.slick__slide img /* Center the image within the slide with a frame */
{ 
	margin-left: auto;
	margin-right: auto;
	border: 6px;
	border-color: beige;
	border-style: inset;
}
.slick__slide .views-field { text-align: center; }
.slick__slide:hover { border: 6px #00F900 inset; }

.inline-block { 
	display: inline-block;
/*	vertical-align: bottom; */
/*	text-align: center;*/
	padding: 2rem;
}
.inline-block img { 
	margin-left: auto;
	margin-right: auto;
}
.float-left { float: left; }
.float-right { float: right; }
.clear-both { clear: both; }

/* ******** VIEWS SLIDESHOW (for quotes)  ******* */

.views_slideshow_cycle_slide .field-content { background: none !important; }
.views_slideshow_singleframe_slide {
  text-align: center;
  width: 100% !important; 
}

.calendar-block .inline-block { padding: 0.5rem; }
.calendar-block .inline-block.art { vertical-align: top; }
.calendar-block .inline-block.month { padding-bottom: 2.5rem; }
.calendar-block h6
{
	margin: .5rem 0 0 0;
	text-align: center;
}
.calendar-body { border: 2px #333 solid;}
.calendar-body h2 { margin: 0 0 1rem 1rem; }
.calendar-body h3 { margin: .5rem; }
.calendar-body h6 { 
	font-style: italic;
	font-weight: normal;
 }

/***********************************
	- SITE-WIDE FOOTER -
***********************************/

#footer 
{ 
	background-color: rgba(235, 240, 247, 0.91);
	border-top: 2px solid gray;
	padding: 1rem 4rem !important;
}

footer .section { padding: 1rem !important; }

.footer-flex
{
	width: 100%;
	margin-top: 0;
}

.footer-flex .flex-item 
{ 
	margin-top: 0;
	display: inline-block;
	vertical-align: top;
	padding-left: 2rem;
	font-size: 1rem;
	font-weight: 600;
}
.footer-menu 
{
	display: inline-block;
	width: 60%;
}

.footer-flex .brand-info a
{
	font-weight: 600;
	font-size: 2rem;
	text-indent: 1rem;
	display: inline-block;
}

.footer ul .active a, .footer ul li a:hover { color: #479CA5; }

#block-crellencompany, #block-dc-neueshaus-crellencompany
{
	margin-right: auto;
	margin-left: auto;
	margin-top: 1rem;
	border-top: 1px #959595 solid;
	padding-top: 1rem;
}
.tailend { text-align: center; }

@media screen {
   .print-footer { display: none; }
}
@media print {
   .display-footer, 
   .block-crellen-company, 
   .block-views-blocknews-lists-sidebar-articles,
   .field--type-comment {display: none;}
   .col-sm-8, .col-sm-4 { width: 100% !important }
}

/***********************************
	- FLOAT FRONT PAGE SLIDES -
***********************************/

.affix-top {
  opacity: 0;
  transition: transform 0.4s, opacity 0.2s;
}
body.path-frontpage #main-content { margin-top: -55px; } /* Use if Navbar is to not show like on front page */

/***********************************
- ADMIN CLARO FORM SECTION OVERIDES -
***********************************/

/* CHANGE: claro/css/components/messages line 27 ,messages { background-color: red; } */

body.user-logged-in .form-item .radio, body.user-logged-in .form-item .checkbox { display: inline !important; }

.form-item.form-type-radio, .form-item.form-type-checkbox { padding-left: 20px; }

.block-claro-content .form-item { display: inline-block !important; }

/*!---------- 2. MIXINS ----------*/

/*@media all and (max-width: 990px) {
  .v-align-children {
    display: block !important;
  }
}
.v-align-transform {
  position: relative;
  transform: translate3d(0, -50%, 0);
  -webkit-transform: translate3d(0, -50%, 0);
  top: 50%;
  z-index: 2;
}*/

/*!---------- n. PARALLAX ----------*/
/*.parallax {
  /* Full height */
  height: 100vh; 

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}*/

/*!---------- 5. SECTIONS ----------*/

/*.overlay:before {
  position: absolute;
  content: '';
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  opacity: 0.3;
  z-index: 2;
}
.overlay-heavy:before {
  opacity: .6;
}
.bg-light.overlay:before {
  position: absolute;
  content: '';
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: #ffffff;
  opacity: 0.1;
  z-index: 2;
}
.parallax > .background-image-holder,
.parallax .slides li > .background-image-holder {
  height: 100vh;
  top: -50vh;
  transition: all 0s ease !important;
  transition: opacity 0.3s ease !important;
  -webkit-transform-style: preserve-3d;
}
.parallax:first-child .slides li > .background-image-holder,
.parallax:first-child .background-image-holder {
  /*top: 0;*/
  height: 100vh;
  top: -50vh;
  background-size: cover !important;
  transition: all 0s ease !important;
  transition: opacity 0.3s ease !important;
  -webkit-transform-style: preserve-3d;
}
.main-container > a:first-child + .parallax .background-image-holder {
  top: 0;
}
@media all and (max-width: 767px) {
  .parallax > .background-image-holder,
  .parallax .slides li > .background-image-holder {
    top: 0 !important;
    transform: none !important;
    -webkit-transform: none !important;
  }
}*/

/*!---------- n. PARALLAX ----------*/
.parallax-container {
  position: relative;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: scroll;
  perspective: 8px;
  perspective-origin: 0%;
}

.parallax-background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100hv;
  transform: translateZ(0px);
}

.parallax-foreground {
  position: absolute;
  transform: translateZ(3px);
}

.parallax-foreground h5 a {
  color: white;
}


.user-logged-in.path-frontpage nav.tabs { display: none; }

/***********************************
	- IF THIS IS A STAGE SITE -
***********************************/

body.stagesite { background-color: #FFEAF5; }

noshow { opacity: 0; } 

/***********************************
	- LAY TEXT OVER IMAGE -
***********************************/
/* Centered text */
.over-center {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: white;
}
.over-center:hover { opacity: 0; }

.is-video
{
	position: absolute;
	left: 40%;
	top: 40%;
	color: #3c3;
	font-size: 8rem;
}
.article-list-title
{
	text-transform: uppercase;
	font-weight: 700;
	text-align: center;
}

/***********************************
	- EDIT MODE CHANGES -
***********************************/

form.node-article-edit-form, 
form.node-full-page-edit-form, 
form.node-artwork-page-edit-form, 
form.comment-comment-delete-form
{
	margin-top: 20px;
	margin-left: 50px;
}
form.node-artwork-page-form
{
	margin-top: 100px;
}
body.page-node-type-full-page nav.tabs { display: none; } /* hide edit tabs on Full Page types, i.e., project header, etc. */
nav.tabs li {
  display: none;
}
nav.tabs li:nth-child(-n+2){
  display: list-item;
}

/***********************************
	- ALIGN MODULE - For images only?
***********************************/

.align-left { padding-right: 10px; }


/***********************************
	- FRONT PAGE GRID -
***********************************/
.Hero-logo { height: 100% } /* specifically for PDCCA */

.item3
{
	grid-area: main;
	border: 5px green solid;
	color: #666;
	text-align: center;
}
.item4
{
	grid-area: right;
	text-align: left;
	vertical-align: middle;
	margin-top: auto;
	margin-bottom: auto;
}
.item5 { grid-area: footer; }
.number
{
	font-size: 9vw;
	font-weight: 600;
	color: #666;
}
.number-suffix
{
	font-size: 2vw;
	font-weight: 600;
	color: #666;
}

.grid-container {
  display: grid;
  grid-template-areas:
    'main right';
  gap: 10px;
}

.grid-container > div
{
	padding: 20px 0;
	font-size: 2.5vw;
}
.dots-image { margin-bottom: 5rem; }


/***********************************
	- FRONT PAGE QUOTES -
***********************************/

.client-box {
	padding: 1rem;
	margin: 1rem;
}

.client-box,
.client-box a
{
	color: #999;
	font-weight: 500;
	background: none !important;
}

.client-box  p { margin-bottom: 1rem; }

.client-box h3,
.client-box h3 a
{
	font-size: 2.5rem;
	font-weight: 600;
	color: #666;
	margin-top: 0;
	margin-bottom: 0;
}

.client-company
{
	font-style: italic;
	font-weight: 600;
}

.client-description a
{
	font-style: italic;
	font-weight: 600;
	color: blue;
}

.path-not-frontpage .view-quotes .views-row,
.front-quotes .views-element-container
{
	border: 1px solid  #ddd;
	background-color: #fffeff;
	margin: 1rem;
}

.view-display-id-quotes_block
{
	border: 3px solid  #eee;
	border-style: outset;
	background-color: #fffeff;
	margin: 2rem;
}

/***********************************
	- Alert banners -
***********************************/
.alert-success {
    color: white;
    font-weight: 600;
    background-color: #0ed30e;
    border-color: #275601;
}

.alert-danger
{
	color: white;
    font-weight: 600;
    background-color: #E20;
    border-color: #51010e;
}

/***********************************
	- Comments -
***********************************/
.field--type-comment 
{
	background: #F0F0F0;
	text-align: left;
	font-weight: 400;
	font-size: 1rem;
}
.field--type-comment .indented /* this is comment reply */
{
	background: #E9E9E9;
	margin-left: 10%;
	margin-right: 5%;
}
.field--type-comment .field--type-image { margin: 0; }
.field--type-comment img
{
	max-width: 60%;
}
.comments-section
{
	margin-top: 4rem;
	border-top: 1px #999 solid;
}

form.comment-form
{
border: 2px rgb(22, 166, 166) solid;
padding: 1rem;
}

article.comment img { margin-top: 1.5rem; }

.comment .avatar 
{
    float: left;
    margin-right: 0.14rem;
}
.field--name-comment-body p a
{
	color: blue;
	text-decoration: underline;
}
#commentable { display: none; }
#commentable:target { display: block; }

/***********************************
	- SPECIAL FOR STAGE SITE -
***********************************/

#toolbar-administration, #toolbar-administration { background-color: #F8DEFF !important; }

/***********************************
	- DIV TABLE (for recipe ingredients) -
***********************************/

.divTable
{
	display:  table;
	width:auto;
	margin-left: -2rem;
	/* background-color:#eee; */
	/* border:1px solid  #666666; */
	border-spacing:5px;/*cellspacing:poor IE support for  this*/
	/* border-collapse:separate;*/
}

.divRow
{
	display:table-row;
	width:auto;
}

.field--type-ingredient span
{
	display: table-cell;
	min-width: 4rem;
}

.quantity-unit
{
	text-align: right;
	padding-right: 0.5rem;
}

/***********************************
	- PULL QUOTES, BLOG ETC. -
***********************************/

.blog-body p { margin-bottom: 1rem; }

.blog-entry { margin-top: 2rem; }

.day-title { font-size: larger; }

article blockquote,
.article-body blockquote 
{
	font-family: 'Playfair Display', serif;
	font-size: 1.5rem;
	letter-spacing: 0.025em;
	line-height: 1.5;
	padding: 0;
	width: 85%;
	padding-left: 3rem;
	border-left: 0.2rem solid #cee002;
	margin-top: 2rem;
	color: #000;
}

.blog-entry.article-body { clear: both; }
.blog-entry.article-body p { margin-bottom: .6rem; }

.view-display-id-blog_front_page_block .blog-body img,
.blog-entry.article-body .blog-body img 
{ 
	display: none; 
}

@media (min-width: 920px)
{
	.view-display-id-blog_front_page_block .column-left,
	.blog-entry.article-body .column-left 
	{ 
		float: left;
		width: 74%; 
	}
	.view-display-id-blog_front_page_block .column-right,
	.blog-entry.article-body .column-right 
	{ 
		float: right;
		width: 24%;
		padding-top: 1rem; 
	}
}

/* base pull-quote style occurs only if window is wider than 992 */

/* the pull quote container to give it some structure */
/* medium+ screen responsive styles to position quotes outside of article body */
@media screen and (min-width:992px) {
	.pull-quote {
	  margin-bottom: 30px;
	}

	/* the blockquote style */
	blockquote .pull-quote  {
	  font-size: 1.4em !important;
	  margin: 0 !important;
	  width: 100% !important;
	  font-style: normal !important;
	  color: rgb(101, 101, 101);
	  line-height: 1.5em !important;
	  border-top: 2px solid rgba(101, 101, 101, 0.5);
	  border-bottom: 2px solid rgba(101, 101, 101, 0.5);
	  padding: 20px 0;
	}

	/* remove bottom margin from last element inside quote */
	blockquote .pull-quote > :last-child {
	  margin-bottom: 0;
	}

	/* override default.css styles */
	blockquote .pull-quote p {
	  font-size: inherit !important;
	  font-style: inherit !important;
	  line-height: inherit !important;
	  color: inherit !important;
	}
	blockquote.pull-quote::before {
		content: "“";
		position: absolute;
		top: -42px;
		left: -10px;
		display: block;
		font-size: 160px;
		color: #e7e7e7;
		z-index: -1;
		line-height: 1;
	}
	blockquote.pull-quote {
		font-family: Arial Rounded MT Bold;
		font-style: normal;
		width: 40%;
		position: relative;
		border: 0;
		overflow: visible;
		z-index: 1;
	}
	blockquote.pull-quote.pull-quote-left 
	{
		float: left;
		padding-right: 2rem;
	}
	blockquote.pull-quote.pull-quote-right { float: right; }
}
	blockquote.pull-quote.pull-quote-center 
	{
		width: 100%;
		font-size: larger;
		text-align: center;
	}