.yq-logo-black {
   background-image: url('http://api.youneeq.ca/Content/images/powered-by-yq-black.png');
}
.yq-logo-white {
   background-image: url('http://api.youneeq.ca/Content/images/powered-by-yq-white.png');
}

.yq-logo-top {
   margin-bottom: 1em;
}
.yq-logo-bottom {
   margin-top: 1em;
}

.yq-logo-left, .yq-logo-centre {
   margin-right: auto;
}
.yq-logo-right, .yq-logo-centre {
   margin-left: auto;
}

/* Youneeq Modal */

.recommended-modal {
   background-color: transparent;
   background-size: 121px 23px;
   border: none;
   clear: both;
   cursor: pointer;
   display: block;
   width: 121px;
   height: 23px;
}

.tbox {
   box-sizing: content-box;
   position: absolute;
   display: none;
   padding: 14px 17px;
   z-index: 900;
}

.tinner {
   padding: 15px;
   border-radius: 5px;
   background: #fff url(preload.gif) no-repeat 50% 50%;
   border-right: 1px solid #333;
   border-bottom: 1px solid #333;
}

.tmask {
   position: absolute;
   display: none;
   top: 0;
   left: 0;
   height: 100%;
   width: 100%;
   background: #000;
   z-index: 800;
}

.tclose {
   position: absolute;
   top: 0;
   right: 0;
   width: 30px;
   height: 30px;
   cursor: pointer;
   background: url(close.png) no-repeat;
}

.tclose:hover {
   background-position: 0 -30px;
}

/* Youneeq Explorer */

.yq-explorer {
   background-color: white;
   border: 1px solid #008c9d;
   border-radius: 1em;
   padding: 0.5em;
}

.yq-explorer-button {
   cursor: pointer;
}

.yq-explorer-section-head {
   border-top: 1px solid #008c9d;
}
.yq-explorer-section-head:first-child {
   border-top: none;
}

.yq-explorer-section {
   max-height: 8.5em;
   overflow: auto;
}

.yq-explorer input {
   position: fixed;
   left: -100px;
}

.yq-explorer-dom-current {
   cursor: not-allowed;
   background-color: #008c9d;
   border: 1px solid #888;
   border-radius: 0.5em;
   color: white;
   text-align: center;
   margin-bottom: 0.5em;
}

.yq-explorer label {
   cursor: pointer;
   display: block;
   background-color: #cacacb;
   border: 1px solid transparent;
   border-radius: 0.5em;
   color: white;
   text-align: center;
   margin-bottom: 0.5em;
   transition: all 0.2s ease-in 0s;
}
.yq-explorer input:checked + label {
   background-color: #008c9d;
}
.yq-explorer label:hover {
   border-color: #008c9d;
}
.yq-explorer input:checked + label:hover {
   border-color: #cacacb;
}

/* Toaster Card */

.yq-rec-box {
   box-sizing: border-box;
   bottom: -14rem;
   right: 0;
   font-size: 1.2rem;
   position: fixed;
   background-color: white;
   border: 2px solid gray;
   width: 40rem;
   max-width: 100%;
   height: 14rem;
   z-index: 2;
}
.yq-rec-box .yq-pop-img-link {
   box-sizing: border-box;
   display: block;
   overflow: hidden;
   float: left;
   width: 34%;
   height: 100%;
}
.yq-rec-box .yq-pop-text-box {
   box-sizing: border-box;
   height: 90%;
   float: right;
   padding-top: 1em;
   padding-left: 1em;
   position: relative;
   width: 100%;
}
.yq-rec-box .yq-pop-img-link + .yq-pop-text-box {
   width: 66%;
}
.yq-rec-box h4 {
   font-size: 1.2em;
   line-height: 1.3;
   margin-right: 2em;
}
.yq-rec-box .yq-domain {
   position: absolute;
   bottom: 0;
}
.yq-rec-box .yq-delete-pop-x {
   fill: black;
   stroke: white;
   stroke-width: 2;
   cursor: pointer;
   position: absolute;
   right: 0;
   top: 0;
   transition: fill 0.2s ease-in 0s;
}
.yq-rec-box .yq-delete-pop-x:hover {
   fill: red;
}

/* Recommendation Panel */

.yq-wrapper {
   position: relative;
}

.yq-article {
   position: relative;
}

.yq-article > * {
   display: block;
}

.yq-toggle-box {
   display: none !important;
}
.yq-toggle-box:not(:checked) + article .yq-toggle-item {
   display: none !important;
}

.yq-toggle-label, .yq-toggle-label-box {
   cursor: pointer;
   margin: 0;
   font-size: 1em;
   font-weight: inherit;
   line-height: inherit;
}
.yq-toggle-label {
   display: inline;
}
.yq-article > .yq-toggle-label {
   display: block;
}

.yq-delete-x {
   fill: black;
   stroke: white;
   stroke-width: 2;
   opacity: 0;
   cursor: pointer;
   position: absolute;
   right: 0;
   top: 0;
   transition: all 0.2s ease-in 0s;
}
.yq-article:hover .yq-delete-x, .yq-delete-x:hover, .yq-env-mobile .yq-delete-x {
   opacity: 1;
}
.yq-delete-x:hover {
   fill: red;
}

.yq-img-box {
   overflow: hidden;
}

.yq-img.yq-img-fit {
   object-fit: cover;
   object-position: 50% 0;
}

.yq-title {
   font-size: 1.0625em;
}

.yq-desc {
   font-size: 0.9375em;
   line-height: 1.5;
}