/** PLATFORMERS - SITE ENGINE - UI | v1.0.0 **/

/*
UI: Slideshow

*/

.pf-ui-slideshow { overflow: hidden; position: relative; width: 100%; height: auto; /*height: 300px;*/ }
.pf-ui-slideshow--list { overflow: hidden; position: relative; top: 0; left: 0; margin: 0; padding: 0; height: 100%; }
.pf-ui-slideshow--list li { display: inline; float: left; margin: 0; padding: 0; list-style: none; height: 100%; background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; }

/*** CONTENT : DEFAULT ***/
.pf-ui-slideshow--slide.default > * { margin: 0; padding: 0; height: 100%; background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; min-height: 300px; }

/* Let's have our A tag fill the entire slide */
.pf-ui-slideshow--slide.default a { position: relative; display: block; width: 100%; height: 100%; color: #ffffff; transition: color 0.2s ease-in; }
.pf-ui-slideshow--slide.default a:hover { color: #fff; }

/* Position our caption at the bottom right corner of the slide */
.pf-ui-slideshow--slide.default a span.caption { display: inline-block; position: absolute; right: 0; bottom: 0; padding: 0.75em 1.5em; font-size: 1.3em; background: #000000; /* fallback for old browsers */ background: rgba(0, 0, 0, 0.8); }

/*** Preset None ***/
.pf-ui-slideshow--slide.default.layout-preset-none > .content { position:relative; }
.pf-ui-slideshow--slide.default.layout-preset-none a.link-full-cover { position: absolute; right: 0; bottom: 0; left: 0; right: 0; }

/*** Preset 1: Full background. ***/
.pf-ui-slideshow--slide.default.layout-preset-1 { }
.pf-ui-slideshow--slide.default.slide-preset1 { }

/*** Preset 2: Full background, Content Left. ***/
.pf-ui-slideshow--slide.default.layout-preset-2 { }
.pf-ui-slideshow--slide.default.slide-preset2 { }

/*** Preset 3: Full background, Content Right. ***/
.pf-ui-slideshow--slide.default.layout-preset-3 { }
.pf-ui-slideshow--slide.default.slide-preset3 { }

/*** Preset 4: 2-Columns, Image Left, Content Right. ***/
.pf-ui-slideshow--slide.default.layout-preset-4 { }
.pf-ui-slideshow--slide.default.layout-preset-4 { }
.pf-ui-slideshow--slide.default.layout-preset-4 > .ui.grid { margin: 0; padding: 0; }
.pf-ui-slideshow--slide.default.layout-preset-4 > .ui.grid > .column { margin: 0; padding: 0; }
.pf-ui-slideshow--slide.default.layout-preset-4 .column-content > .container { padding: 2rem; }
.pf-ui-slideshow--slide.default.layout-preset-4 .column-image > .background-image { height: 100%; }
.pf-ui-slideshow--slide.default.slide-preset4 { }
.pf-ui-slideshow--slide.default.slide-preset4 > .ui.grid { margin: 0; padding: 0; }
.pf-ui-slideshow--slide.default.slide-preset4 > .ui.grid > .column { margin: 0; padding: 0; }
.pf-ui-slideshow--slide.default.slide-preset4 .column-content > .container { padding: 2rem; }
.pf-ui-slideshow--slide.default.slide-preset4 .column-image > .background-image { height: 100%; }

/*** Preset 5: 2-Columns, Content Left, Image Right. ***/
.pf-ui-slideshow--slide.default.layout-preset-5 { }
.pf-ui-slideshow--slide.default.layout-preset-5 > .ui.grid { margin: 0; padding: 0; }
.pf-ui-slideshow--slide.default.layout-preset-5 > .ui.grid > .column { margin: 0; padding: 0; }
.pf-ui-slideshow--slide.default.layout-preset-5 .column-content > .container { padding: 2rem; }
.pf-ui-slideshow--slide.default.layout-preset-5 .column-image > .background-image { height: 100%; }
.pf-ui-slideshow--slide.default.slide-preset5 { }
.pf-ui-slideshow--slide.default.slide-preset5 > .ui.grid { margin: 0; padding: 0; }
.pf-ui-slideshow--slide.default.slide-preset5 > .ui.grid > .column { margin: 0; padding: 0; }
.pf-ui-slideshow--slide.default.slide-preset5 .column-content > .container { padding: 2rem; }
.pf-ui-slideshow--slide.default.slide-preset5 .column-image > .background-image { height:100%; }

/* resolution: Tablet - 768px - 991px*/
@media only screen and (min-width: 768px) and (max-width: 991px) {
    /*** Preset 4: 2-Columns, Image Left, Content Right. ***/
    .pf-ui-slideshow--slide.default.slide-preset4 .column-image > .background-image { height: 15rem; }
    .pf-ui-slideshow--slide.default.slide-preset4 > .ui.grid > .column { width:100%; }

    /*** Preset 5: 2-Columns, Content Left, Image Right. ***/
    .pf-ui-slideshow--slide.default.slide-preset5 .column-image > .background-image { height: 15rem; }
    .pf-ui-slideshow--slide.default.slide-preset5 > .ui.grid > .column { width: 100%; }
}

/* resolution: Mobile L - 425px */
@media only screen and (max-width: 425px) {
    /*** Preset 4: 2-Columns, Image Left, Content Right. ***/
    .pf-ui-slideshow--slide.default.slide-preset4 .column-image > .background-image { height: 15rem; }

    /*** Preset 5: 2-Columns, Content Left, Image Right. ***/
    .pf-ui-slideshow--slide.default.slide-preset5 .column-image > .background-image { height: 15rem; }
}


/*** BUTTONS ***/
/* Vertically center our buttons */
.pf-ui-slideshow--prev,
.pf-ui-slideshow--next { position: absolute; top: 50%; z-index: 100; color: #ffffff; font-size: 3em; /*font-size: 4em;*/ line-height: 1; text-shadow: 0px 1px 5px rgba(0, 0, 0, 0.3); cursor: pointer; visibility: hidden; transform: translateY( -50% ); }
.pf-ui-slideshow--prev { left: 15px; }
.pf-ui-slideshow--next { right: 15px; }
.pf-ui-slideshow--prev.disabled { display: none; }
.pf-ui-slideshow--next.disabled { display: none; }
a.pf-ui-slideshow--prev,
a.pf-ui-slideshow--next { color: #ffffff; }
.pf-ui-slideshow:hover .pf-ui-slideshow--prev,
.pf-ui-slideshow:hover .pf-ui-slideshow--next { visibility: visible; }

/* hide the text links */
.pf-ui-slideshow--prev span,
.pf-ui-slideshow--next span { display: none; }

.pf-ui-slideshow--index { position: absolute; bottom: 1rem; z-index: 100; width: 100%; text-align: center; }
.pf-ui-slideshow--index.disabled { display: none; }
.pf-ui-slideshow--index a { color: #fff; opacity: 0.5; /*cursor: pointer;*/ font-size: 1em; }
.pf-ui-slideshow--index a.active { color: #fff; opacity: 1; }



/*
UI: Cookie Policy Accept
*/
.pf-ui-cookie-policy-accept { z-index:10; }
.pf-ui-cookie-policy-accept.fixed { position: fixed; }
.pf-ui-cookie-policy-accept.fixed.bottom { bottom: 0; }
.pf-ui-cookie-policy-accept.fixed.left { left: 0; }

.pf-ui-cookie-policy-accept--content { }
.pf-ui-cookie-policy-accept.fixed > .pf-ui-cookie-policy-accept--content { padding: 1rem; }

.pf-ui-cookie-policy-accept--content.default .ui.segment { display:flex; align-items:center; }
.pf-ui-cookie-policy-accept--content.default .ui.segment > * { display: inline-block; margin: 0 1rem 0 1rem; }
/*.pf-ui-cookie-policy-accept--content.default .ui.segment > *:not(:last-child) { margin-right: 1em; }*/


@media only screen and (min-width: 768px) { 
    .pf-ui-cookie-policy-accept { /*min-width: 450px;*/ min-width: 32rem; }
}

@media only screen and (max-width: 767px) {
    .pf-ui-cookie-policy-accept { width: 100%; }
    .pf-ui-cookie-policy-accept.fixed > .pf-ui-cookie-policy-accept--content { padding:0; }
    .pf-ui-cookie-policy-accept.fixed > .pf-ui-cookie-policy-accept--content > .ui.segment { border-radius:0; }

    .pf-ui-cookie-policy-accept--content.default .ui.segment { flex-direction:column;}
    .pf-ui-cookie-policy-accept--content.default .ui.segment > * { display: block; width:100%; margin: 0 0 1rem 0; }
    .pf-ui-cookie-policy-accept--content.default .ui.segment > button:last-child { margin: 0; }
}