/*!
 *  Kwicks: Sexy Sliding Panels for jQuery - v2.2.1
 *  http://devsmash.com/projects/kwicks
 *
 *  Copyright 2013 Jeremy Martin (jmar777)
 *  Contributors: Duke Speer (Duke3D), Guillermo Guerrero (gguerrero)
 *  Released under the MIT license
 *  http://www.opensource.org/licenses/mit-license.php
 */

/*
 *  This file contains styles that are common to all kwicks instances.  Note that each kwicks instance requires
 *  additional styling - please see the examples for more info.
 */

.kwicks
{
    display: block;
    list-style-type: none;
    list-style: none;
    position: relative;
    margin: 0;
    padding: 0;
    height: 100%;
}

.kwicks.dark
{
    background-color: #000;
}

.kwicks > *
{
    display: block;
    overflow: hidden;
    padding: 0;
    margin: 0;
}

.kwicks.kwicks-processed > *
{
    margin: 0;
    position: absolute;
}

.kwicks-horizontal > *
{
    float: left;
}

.kwicks-horizontal > :first-child
{
    margin-left: 0;
}

.kwicks-vertical > :first-child
{
    margin-top: 0;
}

.kwicks li
{
    height: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    position: relative;
    background-attachment: fixed;
}

.kwicks li#panel-1
{
    background-image: url('components/pg.kwicks/assets/images/mo-baghdadi-109634.jpg');
}

.kwicks li#panel-2
{
    background-image: url('components/pg.kwicks/assets/images/temple-1097700_1920.jpg');
}

.kwicks li#panel-3
{
    background-image: url('components/pg.kwicks/assets/images/Thailand-food.jpg');
}

.kwicks li#panel-4
{
    background-image: url('components/pg.kwicks/assets/images/Thailand-6.jpg');
}

.kwicks-title
{
    color: #fff;
    position: absolute;
    right: 15px;
    opacity: 0;
    filter: alpha(opacity=0);
    z-index: 99;
}

.kwicks-expanded .kwicks-title
{
    transition: all 0.52s ease-in 0.5s;
    -webkit-transition: all 0.52s ease-in 0.5s;
    -ms-transition: all 0.52s ease-in 0.5s;
    opacity: 1;
    filter: alpha(opacity=100);
    transform: translateX(-25px);
    -webkit-transform: translateX(-25px);
    -moz-transform: translateX(-25px);
    -ms-transform: translateX(-25px);
    -o-transform: translateX(-25px);
}

.kwicks-collapsed .kwicks-title,
{
}

@media (min-width: 768px) and (max-width: 979px)
{
    .kwicks-title
    {
    }
}

@media (max-width:768px)
{
    .kwicks-title
    {
    }
}

@media (max-width:480px)
{
    .kwicks-title
    {
    }
}

@media (max-width:380px)
{
    .kwicks-title
    {
    }
}

.kwicks-accordian
{
    height: 100vh;
}

@media all and (device-width:768px) and (device-height:1024px) and (orientation:portrait)
{
    .kwicks-accordian
    {
        height: 1024px;
    }
}

@media all and (device-width:768px) and (device-height:1024px) and (orientation:landscape)
{
    .kwicks-accordian
    {
        height: 768px;
    }
}

@media screen and (device-aspect-ratio:40/71)
{
    .kwicks-accordian
    {
        height: 500px;
    }
}

.kwick-overlay-1
{
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(58, 0, 193, 0.51);
    z-index: 0;
    top: 0;
    left: 0;
}

.kwick-overlay-2
{
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 0, 0, 0.57);
    z-index: 0;
    top: 0;
    left: 0;
}

.kwick-overlay-3
{
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(11, 171, 0, 0.55);
    z-index: 0;
    top: 0;
    left: 0;
}

.kwick-overlay-4
{
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(151, 0, 121, 0.46);
    z-index: 0;
    top: 0;
    left: 0;
}