/*
 Looking at CSS eh?
 Found an error? Got a suggestion? Just curious?
 Visit buglogic.com
 or send an email to robert@buglogic.com
 --------------------------*/
 /*
GENERICS
---------------------------*/
body, html{height:100%;}
a {text-decoration:none;}
* { box-sizing: border-box;}
h1, h2, h3, h4 {margin:0; padding:0; line-height:100%;}
img {border:none; vertical-align:top;}
.table {display:table;}
.center-table {display:table;margin-left:auto;margin-right:auto;}
.cell {display:table-cell;vertical-align:top;}
.block-cell {display:table-cell;vertical-align:top;}
.center-cell {display:table-cell;vertical-align:middle;}
.bottom-cell {display:table-cell;vertical-align:bottom;}
.flex-bottom{margin-bottom:auto;}
.row {display:table-row}
.margin {margin-bottom:12px;}
.margin-top {margin-top:12px;}
.margin-right {margin-right:12px;}
.margin-left {margin-left:12px; }
.margin-auto {margin-left:auto;margin-right:auto;}
.clear {clear:both;}
.hidden {display:none;}
.visible{opacity:1}
.full {width:100%;}
.half {width:50%;}
.third {width:33%;}
.two-third {width:77%;}
.quarter {width:25%}
.fifth {width:20%;}
.max-full {max-width:100%;}
.max-height {max-height:90%;}
.small {font-size:90%;}
.smaller {font-size:80%;}
.smaller img {max-width:200px;}
.smallest {font-size:75%;}
.big{font-size:120%;}
.bigger {font-size:150%;}
.line-130 {line-height:130%;}
.line-140 {line-height:140%;}
.bold {font-weight:700;}
.center {text-align:center}
.text-left {text-align:left;}
.text-right {text-align:right;}
.right {float:right;}
.left {float:left;}
.inline {display:inline;}
.relative {position:relative}
.pad-left {padding-left:20px;}
.pad-left-10 {padding-left:10px;}
.pad-right {padding-right:20px;}
.pad-right-10 {padding-right:10px;}
.pad-top {padding-top:20px;}
.pad-top-10 {padding-top:10px;}
.pad-bottom {padding-bottom:20px;}
.pad-bottom-10 {padding-bottom:10px;}
.padded {padding:10px;}
.red {color:red}
.bio-reader {margin-left:auto;margin-right:auto;width:44em;}
.text-reader {margin-left:auto; margin-right:auto; width:33em;}
.header-title {display:flex; justify-content:space-around; align-items:center; margin-left:20px; margin-right:20px; margin-top:10px;}
.header-title h1{white-space:nowrap;}
.container {position:relative;}
/*
contact
------------------------------*/
.contact-info {display:table-cell;vertical-align:middle;width:33%;}
.contact-container {margin-left:auto;margin-right:auto;}

/*
top
-------------------------------*/
.sticky-top {position:sticky;position:-webkit-sticky;top:0}
.top-border {border-bottom:solid 1px #000;}
/*
gallery and home
------------------------------*/
.slide img {height:80vh;}
.content-container, .home-container {padding-bottom:20px;}
.gallery-wall {display:flex;}
.grid-wall {display:flex; justify-content:center; flex-wrap:wrap;}
a.gallery-item, div.gallery-item {border:solid 1px transparent;position:relative;display:block;}
div.gallery-wall img, a.gallery-item img {width:100%;height:auto;display:block;}
.gallery-caption {margin-top:10px;margin-bottom:20px;padding-left:30px;padding-right:30px;padding-top:20px;padding-bottom:20px;text-align:center;}
.image-wall {-moz-column-break-inside:avoid;-webkit-column-break-inside:avoid;break-inside:avoid;page-break-inside:avoid;width:100%;}
/*
gallery mouse-over options
--------------------------------*/
.gallery-title {position:absolute;z-index:10;display:none;padding:10px;text-align:center;bottom:0px;width:100%;}
.gallery-title-cover {background: rgba(73, 73, 73, 0.6);display:none;text-align:center;color:#FFF;position:absolute;width:100%;height:100%;top:0;z-index:10;padding-top:50%;}
.gallery-title-top {position:absolute;z-index:10;top:0;display:none;padding:10px;text-align:center;width:100%;}
.gallery-title-block {display:none;position:absolute;top:50%;left:50%;transform: translate(-50%, -50%);padding:10px;}
.gallery-title-fixed {background: rgba(73, 73, 73, 0.6);text-align:center;color:#FFF;display:block;height:auto;padding-top:5px;padding-bottom:5px;padding-left:5px;padding-right:5px;top:auto;bottom:0;}
a.fixed-gallery:hover{text-decoration:none;}
a.fixed-gallery:hover .gallery-title-fixed {background:#000;}
/*
-----------------------------------*/
a.gallery-grid {float:left;position:relative;background-repeat:no-repeat;background-position:center;background-size:cover;}
a.gallery-scroll {display:block;max-width:100%;margin-bottom:20px;margin-left:auto;margin-right:auto;}
a.top-link {display:inline-table;margin-left:10px;}
a.top-left-link {display:inline-table;margin-right:10px;}
a.top-center-link {display:inline-table;margin-left:10px;margin-right:10px;}
a.side-link {display:block;margin-bottom:10px;}
a.side-adv,a.side-art {display:table;margin-left:auto;margin-right:auto;margin-bottom:10px;margin-top:10px;max-width:90%;}
.title-top {display:none;position:absolute;top:50%;transform: translateY(-50%);text-align:center;color:#FFF;font-size:120%;width:100%;padding-left:10px;padding-right:10px;z-index:1;}
a.video-item {position:relative;}
a.video-item:hover{text-decoration:none}
.video-player {display:table;margin:auto;max-width:90%;cursor:pointer;}
.embed {margin:auto;display:table;margin-bottom:20px;}
.embed p {display:none;}
a.video-box {display:block; overflow:hidden;}
a.video-box video { min-width: 100%; min-height: 100%; position: absolute; top:50%; left:50%; transform:translateX(-50%) translateY(-50%);}
img.portfolio-image {max-width:100%; margin-left:auto; margin-right:auto;}
img.portfolio-auto {width:auto;margin:auto;}
.detail-list {display:flex; flex-wrap:wrap; margin-top:5px;}
.image-detail {width:90px;height:90px;cursor:pointer;border:solid 1px transparent;background-size: cover; background-repeat: no-repeat; background-position: center;margin-right:5px;margin-bottom:5px;}
.image-cover {display:table;width:100%;height:100vh;}
.fit-img {max-height:88vh;max-width:100%;margin-left:auto;margin-right:auto;cursor:pointer;}
.img-full {max-width:100%;margin-left:auto;margin-right:auto;cursor:pointer;} 
.image-cover-nav {display:table-cell;vertical-align:middle;width:15%;}
.image-cover-nav a {margin-left:5px;margin-right:5px;display:table;padding:5px;}
.image-cover-nav a:hover {text-decoration:none;}
.gallery-cats {display:flex;flex-wrap:wrap;width:90%;margin-left:auto;margin-right:auto;margin-bottom:20px;margin-top:10px;}
.gallery-cats a {display:inline-block;width:48%;padding-bottom:48%;margin:5px;background-position:center;background-size:cover;position:relative}
.gallery-cats a:hover h1{background-color:rgba(73, 73, 73, 0.4);}
.gallery-cats h1 {position:absolute;top:0;width:100%;height:100%;text-align:center;padding-top:50%;color:#FFF;text-shadow:2px 2px 2px #000;transition:background-color 1s;}
.gallery-likes {display:table;position:absolute;right:10px;}
a.tagger i:hover, a.tagger-active i {color:red;}
a.tagger-active i:hover{color:#000;}
a.like-link {display:table;border:solid 2px #FFF;background:#000;color:#FFF;padding:10px;}
a.like-link:hover {text-decoration:none;color:#b0ecf4;}

/*
news
-----------------------------------*/
.news-container {margin:auto;padding-bottom:20px;}
.blog-container {margin-left:20px;margin-right:20px;}
.news-wall, .image-wall {position:relative; margin-bottom:10px;}
a.news-item {display:inline-table;width:100%;position:relative;border:solid 1px #000;}
a.news-item:hover {text-decoration:none;}
.news-wall img {width:100%;height:auto;display:block;}
.front-headline, .cat-header {margin-left:10px;margin-right:10px;margin-top:10px;}
.news-date {font-size:90%; font-style:italic;margin-left:10px;margin-bottom:10px;margin-top:5px;display:block;}
.news-short {margin:10px;display:block;}
.news-sort {display:flex;flex-direction:row;align-items:flex-end;justify-content:flex-end;font-weight:600;margin-top:10px;}
.about {width:150px;}
.img-holder {display:table}
.dropdown {cursor:pointer;position:relative;margin-left:10px;}
.dropdown > .dropsub {display:none;z-index:100;position:absolute;right:5px;}
.dropdown:hover > .dropsub { display:table; }
.dropsub a {display:block;padding:10px;}
.dropsub a:hover { text-decoration:none; }
.comment-box {width:80%; margin:auto;}
.comment-box textarea {width:100%;height:130px;}
.page-box {display:table; margin-left:auto;margin-right:auto;margin-bottom:10px;padding:10px;background:#ececec;color:#000;border-radius:5px;}

/*
PRODUCTS STORE
----------------------------------*/
.product-image {width:67%;padding-top:10px;}
.product-image img {width:100%;border:solid 3px #000;}
.product-qty {display:table-cell;font-family:Georgia, serif;font-size:300%;vertical-align:middle;}
.product-qty-cell {display:table-cell;padding-left:5px;padding-right:5px;vertical-align:middle;padding-top:3px;}
.product-description {width:33%;padding-left:40px;}
.product-add, a.product-checkout, a.product-link {display:table;border:solid 3px #000;padding:5px 7px;cursor:pointer;font-size:130%;font-weight:700;margin-top:10px;}
.product-add:hover, a.product-checkout:hover, a.product-link:hover {text-decoration:none;}
.product-sold {display:table; margin:auto;position:relative;}
.product-sold-out {display:table;padding:5px 7px;font-size:130%;background:#000;font-weight:700;color:#f5f3e4;border:solid 3px #000;margin-top:10px;}
.product-header {font-family:Nunito;font-weight:700;padding-bottom:5px;border-bottom:solid 3px #000;font-size:130%;margin-top:10px;margin-bottom:10px;}
.product-detail {line-height:150%;}
.product-code {padding-top:px;padding-bottomz:5px;border-top:solid 3px #000;border-bottom:solid 3px #000;margin-bottom:10px;margin-top:10px;}
.checkout {border:solid 3px #000;border-radius:5px;padding:20px;margin-bottom:30px;background:#FFF;}
.checkout-confirm {background:#FFF;border-radius:10px;padding:12px;margin-top:10px;margin-bottom:10px;}
.product-thumb {float:left;width:22.5%;padding-bottom:22.5%;position:relative;overflow:hidden;cursor:pointer;border:solid 2px transparent;}
.product-thumb:hover {border:solid 2px #000;}
.product-thumb-image {position:absolute;background-size: cover; background-repeat: no-repeat; background-position: center;width:100%;height:100%;}
.product-cart-image {background-size: cover; background-repeat: no-repeat; background-position: center;width:150px;height:150px;border:solid 3px #000;}
.product-cart-item {display:table;width:100%;padding-bottom:10px;margin-bottom:10px;border-bottom:dotted 2px #000;}
.product-unique {display:table-cell;width:100px;height:100px;text-align:center;vertical-align:middle;border:solid 10px #000;border-radius:50px;font-weight:700;margin-top:12px;}
.top-cart {position:relative;float:right;margin-right:10px;}
a.cart {display:table;width:50px;height:50px;border-radius:25px;text-align:center;font-size:150%;position:relative;z-index:300;}
a.cart i{line-height:50px;}
a.cart:hover {text-decoration:none}
.highlight {background:#ececec;padding:20px;border-radius:10px;margin-bottom:20px;border:solid 3px #FFF;}
.highlight img {float:left;padding-right:14px;padding-bottom:14px;width:30%;}

/*
links
-----------------------------------*/
.links-container {display:flex; justify-content:center;align-items:center;flex-wrap:wrap; margin-left:auto; margin-right:auto; margin-bottom:40px;}
.links-container a {display:table; width:320px; height:179px; overflow:hidden; position:relative; margin:5px;}
.links-container a:hover{text-decoration:none;}
.links-container a img {width:100%;}
.links-container a .title {display:none; background:rgba(73, 73, 73, 0.6);text-align:center;color:#FFF;position:absolute;width:100%;height:100%;top:0;z-index:10;padding-top:80px;}
a.link-static {display:flex; justify-content:center; align-items:center;}
a.link-static div {text-align:center;}
.link-label {display:none; text-align:center; padding-top:5px; padding-bottom:5px;}
.link-label a {display:block; width:auto; height:auto; margin:0px;}
a.close {display:table; width:20px; height:20px;border-radius:10px;line-height:20px;text-align:center;}
a.inquire {display:table; padding:5px; margin-top:10px; margin-bottom:10px; font-size:120%;}
a.close:hover, a.inquire {text-decoration:none}
a.social-button {display:inline-table;width:28px;height:28px;text-align:center;border-radius:14px; font-size:16px;}
a.social-button i {line-height:28px;}
a.social-block {display:inline-table;font-size:28px;}
a.social-button i:hover {text-decoration:none}
a.fb { background:#315cb0;}
a.pn { background:#c60514;}
a.tw { background:#4db0f0;}
a.in { background:#bc2a8d;}
a.be { background:#2071ff;}
a.yt { background:#ed2925;}
a.li { background:#3a9ed8;}
a.vi { background:#2ccad6;}
a.db { background:#e84c89;}
a.im {background-color:#f6c700;}
a.il {background-color:#b4c3a6;}
a.dr {background-color:#ff380a;}
a.fb i,a.pn i,a.tw i, a.in i, a.be i, a.yt i, a.li i, a.vi i, a.db i {color:#FFF}
a.drawger {display:inline-block;background-image:url('https://includes.buglogic.com/images/logo-drawger.png');background-repeat:no-repeat;background-position:center;background-size:cover;line-height:28px;}
a.illoz {display:inline-block;background-image:url('https://includes.buglogic.com/images/logo-illoz.png');background-repeat:no-repeat;background-position:center;background-size:cover;line-height:28px;margin-left:5px;}
a.imdb {display:inline-block;background-image:url('https://includes.buglogic.com/images/logo-imdb.png');background-repeat:no-repeat;background-position:center;background-size:cover;width:28px;height:28px;border-radius:14px;}
a.pa {display:inline-block;background-color:#000000;background-image:url('https://includes.buglogic.com/_incl/css/images/icon-patreon-wt.svg');background-repeat:no-repeat;background-position:center;background-size:50%;width:28px;height:28px;border-radius:14px;}
a.pa-p {display:inline-block;background-image:url('https://includes.buglogic.com/_incl/css/images/icon-patreon.svg');background-repeat:no-repeat;background-position:center;background-size:60%;width:28px;height:28px;}
a.custom-social {display:inline-table;width:28px;height:28px;margin-left:5px;margin-right:5px;background-repeat:no-repeat;background-position:center;background-size:cover;}
/*
themes
-----------------------------------*/
div.hero {display:table; height:100vh; width:100%;}
.hero-content {display:table-cell; vertical-align:middle; text-align:center;}
.button, a.button {display:inline-table; margin-top:10px; margin-bottom:10px; padding:10px; cursor:pointer; font-size:120%; font-weight:bold;}
.button-round {border-radius:5px;}
.button:hover, a.button {opacity:0.8}
.button span {z-index:10;}
.banner-left {display:flex;align-items:center;}
.social-top {display:flex; align-items:center; justify-content:flex-end;}
.social-block {display:inline-block;vertical-align:middle;margin-bottom:5px;}
.social-right {position:absolute;right:10px;top:10px;z-index:200;}
.social-left {display:inline-table; margin-left:20px;}
.social-side {display:table; margin-left:auto; margin-right:auto; padding-top:10px padding-bottom:10px;}
.top-nav-sticky {position:sticky; top:0;z-index:99; transition: 0.4s;}
.top-nav-sticky img {max-height:40px;}
/*.top-nav {display:block}*/
.top-nav a.home, .top-nav-sticky a.home {transition: 0.4s;}
.side-nav a:hover, .top-nav a:hover, .top-nav-sticky a {text-decoration:none}
.side-nav {display:table-cell}
.side-nav nav {display:block}
.side-nav h1 {margin-bottom:10px;}
.center-logo {max-width:90%; margin-left:auto; margin-right:auto; margin-bottom:10px;}
.nav-logo {max-width:80%; margin-left:auto; margin-right:auto; margin-bottom:10px;}
.footer-custom {display:flex; justify-content:space-between; padding:10px; font-size:80%}
.welcome-banner {padding-top:10px; padding-bottom:10px; padding-left:10px; padding-right:20px; text-align:center; max-width:80%; margin-bottom:20px; margin-top:10px;}
.stack {display:flex;align-items:center;justify-content:center;}
.stack-reverse{flex-direction:row-reverse;}
div.stack-button, a.stack-button {display:table;padding:10px;border-radius:10px;margin-top:10px;margin-left:auto;margin-right:auto;border:solid 2px transparent;}
a.stack-button:hover {text-decoration:none;border:solid 2px #FFF;}
.stack-content {height:100vh;}
.stack-block {flex: 1 0 auto}
.stack-container {width:100%;height:100%;}
/*
custom home
-----------------------------------*/
.custom-flex {display:flex;align-items:center;}
.custom-home-banner {background-size:cover;background-repeat:no-repeat;background-position:center;}
.custom-fit {height:100vh;width:100%;}
.custom-row {flex-direction:row;}
.custom-row-reverse {flex-direction:row-reverse;}
.custom-col-container {display:flex;justify-content:center;flex-direction:row;}
.custom-col-box {display:flex;align-items:center;justify-content:center;width:100%;padding:20px;height:350px;}
.custom-col-image {width:50%;padding-top:50%;background-repeat:no-repeat;background-position:center;border-radius:50%;background-size:cover;transition:width 1s,padding-top 1s;}

/*
theme scroll
-----------------------------------*/
@keyframes fade-in {from {opacity: 0; transform: scale(.7,.7)}to {opacity: 1;}}
.gallery-scroll {animation: fade-in 1.4s;}
.fader {opacity:0;}
section {opacity: 0; transform: translate(0, 20px); transition: all 1s;}
section.visible {opacity: 1; animation: fade-in 1.4s;}
a.gallery-scroll {display:table; margin:auto; max-width:80%; margin-bottom:20px;text-align:center;}
a.gallery-scroll img { margin-bottom:10px; width:100%;}

/*
mobile
-----------------------------------*/
.mobile-top, .mobile-social, .title-tag {display:none; position:relative;}
a.mobile-open, a.mobile-close {display:table;background:#000;border:solid 1px #FFF;font-size:150%;padding:5px;position:absolute;z-index:100;top:5px;}
a.mobile-open i, a.mobile-close i {color:#FFF;}
.mobile-menu {text-align:center; padding-left:20px; padding-right:20px;}
.mobile-menu a {display:block; margin-bottom:10px; font-size:120%}


@media (max-width: 699px) {
	.image-cover-nav, .top-nav, .side-nav, .site-banner, .contact-info, .top-nav-sticky, .gallery-title {display:none;}
	.mobile-top, .cell, .mobile-social, .link-label, .links-container, a.news-item {display:block;}
	.mobile-social a {font-size:180%; margin-left:4px; margin-right:4px;}
	.mobile-top img {max-width:80%;margin-top:10px;}
	.mobile-top h1 {padding-bottom:20px; padding-top:10px;}
	.mobile-nav {display:table; position:absolute; top:10px; right:10px;}
	a.gallery-item, div.gallery-item, .top-cart, .left, .right {float:none;}
	a.gallery-item img, .img-full, .fit-img { max-width:95%; max-height:auto;}
	.grid-wall .gallery-title {display:none; padding:0;}
	a.gallery-grid {width:90%; padding-top:90%; display:block;}
	.product-image img {width:95%; margin:auto; border:none;}
	.gallery-wall {display:inline-block; position:relative; width:100%; margin-left:0px;}
	.gallery-cats a {display:block;width:100%;padding-bottom:100%;}
	.gallery-likes {display:table;position:absolute;top:10px;left:10px;right:auto;}
	/*.gallery-title-cover {display:block;height:auto;padding-top:5px;padding-bottom:5px;padding-left:5px;padding-right:5px;top:auto;bottom:0;}*/
	.title-tag {display:table; width:100%; position:relative; margin-top:10px; margin-bottom:10px; padding-bottom:10px; text-align:center;}
	.nav-logo {max-width:80%}
	.social-top, .social-side{float:none; top:0px; right:0px; text-align:center; padding-top:10px; padding-bottom:10px;}
	.social-right{position:relative; display:table; margin-left:auto; margin-right:auto; right:0px;}
	.third, .half, .two-third {width:100%}
	.text-reader,.bio-reader {margin-left:auto; margin-right:auto; width:auto; padding-left:20px; padding-right:20px;}
	.text-reader img {margin-top:10px;}
	.contact-container {margin-left:10px; margin-right:10px;}
	.img-holder, .links-container a {margin-left:auto; margin-right:auto;}
	.img-holder img {max-width:90%;}
	.product-image, .product-description {width:100%; text-align:center; padding-left:0px;}
	.product-description, #product, .table, a.cart, .product-add, .product-checkout, .captcha, .captcha-word, .product-cart-image, .highlight {margin-left:auto; margin-right:auto;}
	.highlight, #checkout-header {text-align:center;}
	.pad-left, .pad-right {padding-left:0px; padding-right:0px;}
	.pad-bottom {padding-bottom:10px;}
	.news-wall, .image-wall {-webkit-column-count: 1;-moz-column-count: 1;column-count: 1;-webkit-column-gap:0px;-moz-column-gap:0px;column-gap:0px;position:relative;}
	.blog-container, .news-container{margin-left:10px; margin-right:10px; max-width:90%;}
	.slide img, img.portfolio-auto {height:auto; width:100%;}
	.embed {display:block;position: relative;padding-bottom: 56.25%;padding-top: 25px;height: 0;}
	.embed iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
	.header-title h1 {white-space:normal; text-align:center;}
	.stack {flex-direction:column; font-size:60%;}
	.stack img {margin-left:auto;margin-right:auto;margin-top:10px;margin-bottom:10px;padding-left:10px;padding-right:10px;}
	.stack-reverse{flex-direction:column-reverse;}
	.stack-container, .stack-content {height:auto;}
	.custom-row, .custom-row-reverse {flex-direction:column}
	.custom-fit {height:50vh;}
	.custom-col-container {flex-direction:column;}
	a.custom-col {width:98%;}
	.custom-col-box {height:200px;}
}