/*


Barbican Theme CSS


/theme/css/style.css


Since: 20190527
Author: Shawn Raymond
Purple: #5f4d9a
Gold: #fec467
Grey: #f8f8f8

*/

/* font */
body { font-family:'Lato', sans-serif; }

/* viewport --- ensure full window size with zero horizontal scroll, force vertical scroll */
html { height:100%; }
body { width:100%; height:100%; overflow-x:hidden; overflow-y:scroll; }

/* fit images */
img { max-width:100%; height:auto; }

.max-50w { max-width:50px; height:auto; }
.max-100w { max-width:100px; height:auto; }
.max-150w { max-width:150px; height:auto; }
.max-200w { max-width:200px; height:auto; }
.max-250w { max-width:250px; height:auto; }
.max-300w { max-width:300px; height:auto; }
.max-350w { max-width:350px; height:auto; }
.max-400w { max-width:400px; height:auto; }
.max-450w { max-width:450px; height:auto; }
.max-500w { max-width:500px; height:auto; }
@media only screen and (max-width:576px)
{
	.max-50w,
	.max-100w,
	.max-150w,
	.max-200w,
	.max-250w,
	.max-300w,
	.max-350w,
	.max-400w,
	.max-450w,
	.max-500w { max-width:100%; height:auto; }
}

/* bootstrap v5 override defaults */
a, .btn-link { text-decoration:none; }
.input-group-text { height:100%; padding:0.5rem; background-color:#e9ecef; border-top-right-radius:0; border-bottom-right-radius:0; }
.input-group { margin-top:0.25rem; }
.input-group label.form-control { /* margin-top:0.25rem; */ padding:0.2rem 0.2rem 0.2rem 0.75rem; }

/* youtube links */
a.youtube { position:relative; display:inline-block; margin:0 auto; }
a.youtube img { border-radius:3px; }
a.youtube:after { position:absolute; top:0; left:0; right:0; bottom:0; content:" "; }
a.youtube:after { background-position:center center; background-repeat:no-repeat; background-size:50px 50px; background-image:url('/theme/addons/youtube/youtube.png'); }

/* youtube embed shrink */
@media only screen and (max-width:576px)
{
	iframe.youtube { width:240px; height:135px; }
}


/* buff --- subtle display changes */
#theme-body { padding-top:0px; }
#theme-sidebar { padding-top:0px !important; }
#theme-sidebar { background-color:#eee; }
a.link { color:#f90; }
a:hover { text-decoration:none; }

/* override bootstrap low opacity tooltip hover */
.tooltip.show { opacity:1; filter:alpha(opacity=100); }

/* divisions */
.lighting .option-tooltip-present::before { border: 2px solid #fec467; /* background-color:#fec467; */ }
.ceilings .option-tooltip-present::before { border: 2px solid #89c0cc; /* background-color:#89c0cc; */ }
.acoustic .option-tooltip-present::before { border: 2px solid #4bdb98; /* background-color:#4bdb98; */ }
.walls .option-tooltip-present::before    { border: 2px solid #b6c34a; /* background-color:#b6c34a; */ }
.health .option-tooltip-present::before    { border: 2px solid pink; /* background-color:#b6c34a; */ }

.lighting input[type=text].option-tooltip-present { border: 2px solid #fec467; }
.ceilings input[type=text].option-tooltip-present { border: 2px solid #89c0cc; }
.acoustic input[type=text].option-tooltip-present { border: 2px solid #4bdb98; }
.walls input[type=text].option-tooltip-present    { border: 2px solid #b6c34a; }

.bg-walls { background-color:#b6c34a; }
.bg-health { background-color:#a38abf; }

/* template: bootstrap card */
/*
.barby-card {}
.barby-card-img { min-height:200px; background-size:cover; background-repeat:no-repeat; }
.barby-card-img img { display:none; }
*/

.text-small { font-size:0.75rem; }
.pointer { cursor:pointer; }
.cursor { cursor:default; }
.bg-gray { background-color:#eee; }
.nobr { white-space:nowrap; }

/* corporate colors */
.fg-purple { color:#5f4d9a; }
.fg-gold { color:#fec467; }
.fg-grey { color:#f8f8f8; }
.bg-purple { background-color:#5f4d9a; }
.bg-gold { background-color:#fec467; }
.bg-grey { background-color:#f8f8f8; }
.border-purple { border-color:#5f4d9a; }
.border-gold { border-color:#fec467; }
.border-grey { border-color:#f8f8f8; }


/* field builder */
.field_section { margin-top:2rem; }
.field-option { margin-bottom:10px; }

/* builder: suppress contact form code */
/* div#_field_client_code { display:none; } */
div#_field_product_code { display:none; }


/* field info floater */
@media only screen and (min-width:992px)
{
.info-dodge { padding-right:270px; }
.info-float { position:absolute; top:0; right:0; width:250px; }
}




/*
--------------------------
primary silos
----------------
*/

.product-card { margin-top:1rem; margin-bottom:1rem; }
.page-img-bg { background-size:cover; background-position:center center; transition:min-height 0.2s ease-in-out; }

/* barbican cascade bootstrap cards */
.page-card { border:0; }
.page-card .card-body { padding:0; }
.page-card .card-title { font-size:1rem; margin:0.75rem 0 1rem; text-align:center; }
.page-card .card-text { display:none; }
.page-card .card-footer { display:none; }
.page-card .card-footer.active { display:block; }

.listview .page-img-bg { min-height:0px; background-image:none !important; }
#product-browser.listview img { opacity:1; width:auto; height:55px; border-top-left-radius:0; border-top-right-radius:0; }
.listview .page-card-img { position:absolute; bottom:0; left:0; }

.listview .product-card { flex:0 0 100%; max-width:100%; }
.listview .page-card { margin-bottom:0.5rem !important; }
.listview .page-card:hover { background-color:#f3f3f3; }
.listview .card-body { padding:0.75rem; }
.listview .card-title { display:inline; font-size:1.25rem; margin-right:0.25rem; }
.listview .card-text { display:inline; opacity:0.5; }
.listview .card-footer { display:block; }


/* modify common field: height */
body.lighting ._field._wrap_5 > div > div { display:inline-block; width:50%; }
body.lighting ._field._wrap_10 > div > div { display:inline-block; width:33%; }
/*
body.lighting ._field._wrap_5 > div > div:first-child,
body.lighting ._field._wrap_10 > div > div:first-child { display:block; }
*/

/* increase margin top - todo: remove !important after addon autoinclude prefixes style bank */
._field_sec { margin-top:2rem /* !important */; }
._field_sec:nth-child(1) { margin-top:0 !important; }

/* shrink grid table a tad for looks */
._field_grd table { width:90%; margin-bottom:0; }

.fur { display:inline-block; vertical-align:-5px; width:20px; height:20px; border-radius:5px; background-image:url(/furball/addons/admin/furball-admin-icons.png); background-size:auto 40px; background-position:-180px 0; }
.furh { display:inline-block; vertical-align:-10px; width:40px; height:40px; border-radius:5px; background-image:url(/furball/addons/admin/furball-admin-icons.png); background-size:auto 80px; background-position:-354px 0; }


/* site wide captions */
.barbican-caption-right-full { position:absolute; left:0%; width:100%; bottom:0%; padding:10px 25px 15px 25px; color:#fff; background-color:#000; background-color:rgba(0, 0, 0, 0.85); }
.barbican-caption-left-full { position:absolute; right:0%; width:100%; bottom:0%; padding:10px 25px 15px 25px; color:#fff; background-color:#000; background-color:rgba(0, 0, 0, 0.85); text-align:right; }
.barbican-caption-right-half { position:absolute; left:5%; width:95%; bottom:7%; padding:10px 25px 15px 25px; color:#fff; background-color:#000; background-color:rgba(0, 0, 0, 0.85); }
.barbican-caption-left-half { position:absolute; right:5%; width:95%; bottom:7%; padding:10px 25px 15px 25px; color:#fff; background-color:#000; background-color:rgba(0, 0, 0, 0.85); text-align:right; }
.barbican-caption-title { font-size:1.2rem; }
.barbican-caption-description { font-size:0.5rem; }

.barbican-caption-attribution { margin-top:0.25rem; font-size:0.5rem; }
.barbican-caption-left-full .barbican-caption-attribution,
.barbican-caption-left-half .barbican-caption-attribution { position:absolute; right:25px; bottom:-15px; }
.barbican-caption-right-full .barbican-caption-attribution,
.barbican-caption-right-half .barbican-caption-attribution { position:absolute; left:25px; bottom:-15px; }
.barbican-caption-left-full .barbican-caption-attribution a,
.barbican-caption-left-half .barbican-caption-attribution a,
.barbican-caption-right-full .barbican-caption-attribution a,
.barbican-caption-right-half .barbican-caption-attribution a { color:#fff !important; }
.barbican-caption-attribution:hover { text-shadow:-1px -1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, 1px 1px 0 #000; }

.barbican-caption-button { position:relative; z-index:100; padding-top:.1rem; padding-bottom:.1rem; }
/* xs-320px sm-576px md-768px lg-992px xl-1200px */
@media only screen and (min-width:576px)
{
	.barbican-caption-right-full { left:15%; width:85%; bottom:10%; }
	.barbican-caption-left-full { right:15%; width:85%; bottom:10%; }
	.barbican-caption-right-half { left:10%; width:90%; bottom:10%; }
	.barbican-caption-left-half { right:10%; width:90%; bottom:10%; }
	.barbican-caption-title { font-size:2rem; }
	.barbican-caption-description { font-size:1rem; }
	.barbican-caption-attribution { margin-top:0.5rem; font-size:0.5rem; }
}
@media only screen and (min-width:992px)
{
	.barbican-caption-right-full { left:40%; bottom:10%; width:60%; }
	.barbican-caption-left-full { right:40%; bottom:10%; width:60%; }
}


/* site wide page icons */
.page-icon { position:relative; margin-bottom:2rem; }
.page-icon img { width:100%; height:auto; }
.page-icon-title { position:absolute; left:0; right:0; bottom:0; padding:10px; color:#fff; background-color:#000; background-color:rgba(0, 0, 0, 0.85); text-align:center; }


/* buttons */
.btn-reset { opacity:0.5; transition:all 250ms ease-in-out; }
.btn-reset:hover { opacity:1; background-color:#eee; }
.btn-lighting { color:#fff; background-color:#ffc844; border-color:#ffc844; }
.btn-lighting:hover { color:#fff; background-color:#cc9f36; border-color:#cc9f36; }
.btn-acoustic { color:#fff; background-color:#00b18e; border-color:#00b18e; }
.btn-acoustic:hover { color:#fff; background-color:#00846a; border-color:#00846a; }
.btn-walls { color:#fff; background-color:#cadb2b; border-color:#cadb2b; }
.btn-walls:hover { color:#fff; background-color:#9eab21; border-color:#9eab21; }

/* feature buttons */
.button-link { margin:0 0 0 2rem; border:none; background:none; color:#6c757d; text-transform:uppercase; }
.button-link:after { content:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAQElEQVR42qXKwQkAIAxDUUdxtO6/RBQkQZvSi8I/pL4BoGw/XPkh4XigPmsUgh0626AjRsgxHTkUThsG2T/sIlzdTsp52kSS1wAAAABJRU5ErkJggg==); margin: 0 3px 0 5px; }


/* opacity */
.opacity-25 { opacity:0.25; }
.opacity-10 { opacity:0.10; }

.lit { opacity:0.75; transition:all 250ms ease-in-out; }
.lit:hover { opacity:1; }
.dim { opacity:0.5; transition:all 250ms ease-in-out; }
.dim:hover { opacity:1; }
.shy { opacity:0.25; transition:all 250ms ease-in-out; }
.shy:hover { opacity:1; }




/*
shake animation via css-tricks
https://css-tricks.com/snippets/css/shake-css-keyframe-animation/
*/
.shake {
	animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
	transform: translate3d(0, 0, 0);
	backface-visibility: hidden;
	perspective: 1000px;
	animation-iteration-count: 1;
}
@keyframes shake {
  10%, 90% {
    transform: translate3d(-1px, 0, 0);
  }

  20%, 80% {
    transform: translate3d(2px, 0, 0);
  }

  30%, 50%, 70% {
    transform: translate3d(-4px, 0, 0);
  }

  40%, 60% {
    transform: translate3d(4px, 0, 0);
  }
}