/**
 * @package   ShackToolbox
 * @contact   www.joomlashack.com, help@joomlashack.com
 * @copyright 2018 Perfect Web. All rights reserved.
 * @copyright 2019-2024 Joomlashack.com. All rights reserved
 * @license   http://www.gnu.org/licenses/gpl.html GNU/GPL
 *
 * This file is part of ShackToolbox.
 *
 * ShackToolbox is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 2 of the License, or
 * (at your option) any later version.
 *
 * ShackToolbox is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with ShackToolbox.  If not, see <http://www.gnu.org/licenses/>.
 */

@import url(//fonts.googleapis.com/css?family=Kotta+One);

.pweb-theme-transparency.pwebbox-box .pwebbox-container {
	-webkit-animation: pweb-transparency 50s linear .50s infinite alternate;
	-moz-animation: pweb-transparency 50s linear .50s infinite alternate;
	animation: pweb-transparency 50s linear .50s infinite alternate;
	background-color: transparent;
}
.pweb-theme-transparency.pweb-closed .pwebbox-container {
	-webkit-animation: none;
	-moz-animation: none;
	animation: none;
}
.pweb-theme-transparency.pwebbox-box .pwebbox-container form input,
.pweb-theme-transparency.pwebbox-box .pwebbox-container form select,
.pweb-theme-transparency.pwebbox-box .pwebbox-container form textarea {
    background-color: #666;
	background-color: rgba(0, 0, 0, 0.4);
    border-color: #000;
	border-color: rgba(0, 0, 0, 0.6);
}
.pweb-theme-transparency.pwebbox-box .pwebbox-container form input:focus,
.pweb-theme-transparency.pwebbox-box .pwebbox-container form select:focus,
.pweb-theme-transparency.pwebbox-box .pwebbox-container form textarea:focus {
	background-color: #333;
    background-color: rgba(0, 0, 0, 0.6);
    border-color: #000;
	border-color: rgba(0, 0, 0, 0.9);
}
.pweb-theme-transparency.pwebbox-box .pwebbox-container form select option {
	background: #FFF;
}

/* Little fix for Bottom Bar */
.pweb-bottombar.pweb-theme-transparency .pwebbox-container {
    background-repeat: repeat-x;
}
.pweb-theme-transparency.pwebbox_bottombar_toggler {
    background-color: #000;
    background-image: -moz-linear-gradient(center top , #000, #1E1E1E);
    border-color: #000;
    text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
    color: #FFF;
    font-size: 16px;
    font-family: "Kotta One",serif;
}

/* TODO move in percents */
@keyframes pweb-transparency {
	0% { background-position: 0 0; }
	10% { background-position: -100px -20px; }
	22% { background-position: -200px -40px; }
	32% { background-position: -300px -60px; }
	42% { background-position: -350px -80px; }
	50% { background-position: -380px -100px; }
	60% { background-position: -350px -120px; }
	72% { background-position: -300px -140px; }
	82% { background-position: -200px -160px; }
	92% { background-position: -100px -180px; }
	100% { background-position: 0px -200px; }

}
@-moz-keyframes pweb-transparency {
	0% { background-position: 0 0; }
	10% { background-position: -100px -20px; }
	22% { background-position: -200px -40px; }
	32% { background-position: -300px -60px; }
	42% { background-position: -350px -80px; }
	50% { background-position: -380px -100px; }
	60% { background-position: -350px -120px; }
	72% { background-position: -300px -140px; }
	82% { background-position: -200px -160px; }
	92% { background-position: -100px -180px; }
	100% { background-position: 0px -200px; }
}
@-webkit-keyframes pweb-transparency {
	0% { background-position: 0 0; }
	10% { background-position: -100px -20px; }
	22% { background-position: -200px -40px; }
	32% { background-position: -300px -60px; }
	42% { background-position: -350px -80px; }
	50% { background-position: -380px -100px; }
	60% { background-position: -350px -120px; }
	72% { background-position: -300px -140px; }
	82% { background-position: -200px -160px; }
	92% { background-position: -100px -180px; }
	100% { background-position: 0px -200px; }
}