/*
**
**
**
**
**
**
**
**
**  ==== SOLID COLORS
** ========================================
*/


div[data-psabd="white"]{
    background-color:#FFF !important;
}
div[data-psabd="black"]{
    background-color:#000 !important;
}
div[data-psabd="grey"]{
    background-color:#48484C !important;
}
div[data-psabd="red"]{
    background-color:#910E0E !important;
}
div[data-psabd="maroon"]{
    background-color:#6A2121 !important;
}
div[data-psabd="salmon"]{
    background-color:#DD5538 !important;
}
div[data-psabd="orange"]{
    background-color:#E76511 !important;
}
div[data-psabd="yellow"]{
    background-color:#ECAC2B !important;
}
div[data-psabd="light_green"]{
    background-color:#00B023 !important;
}
div[data-psabd="dark_green"]{
    background-color:#007918 !important;
}
div[data-psabd="teal"]{
    background-color:#00C1B3 !important;
}
div[data-psabd="blue"]{
    background-color:#009BC9 !important;
}
div[data-psabd="navy"]{
    background-color:#0067AB !important;
}
div[data-psabd="purple"]{
    background-color:#2135B2 !important;
}
div[data-psabd="magenta"]{
    background-color:#7D21B2 !important;
}
div[data-psabd="pink"]{
    background-color:#B51386 !important;
}

/*
**
**
**
**
**
**
**
**
**  ==== GRADIENTS
** ========================================
*/

div[data-psabd="white-grey"]{
    background:-webkit-linear-gradient(145deg, #FDFDFE, #B8B8BA);
    background:-moz-linear-gradient(145deg, #FDFDFE, #B8B8BA);
    background:linear-gradient(145deg, #FDFDFE, #B8B8BA);
}
div[data-psabd="red-maroon"]{
    background:-webkit-linear-gradient(145deg, #FDFDFE, #B8B8BA);
    background:-moz-linear-gradient(145deg, #FDFDFE, #B8B8BA);
    background:linear-gradient(145deg, #910E0E, #6A2121);
}
div[data-psabd="orange-yellow"]{
    background:-webkit-linear-gradient(145deg, #FDFDFE, #B8B8BA);
    background:-moz-linear-gradient(145deg, #FDFDFE, #B8B8BA);
    background:linear-gradient(145deg, #E76511, #ECAC2B);
}
div[data-psabd="green-dark_green"]{
    background:-webkit-linear-gradient(145deg, #FDFDFE, #B8B8BA);
    background:-moz-linear-gradient(145deg, #FDFDFE, #B8B8BA);
    background:linear-gradient(145deg, #00B023, #007918);
}
div[data-psabd="teal-blue"]{
    background:-webkit-linear-gradient(145deg, #FDFDFE, #B8B8BA);
    background:-moz-linear-gradient(145deg, #FDFDFE, #B8B8BA);
    background:linear-gradient(145deg, #00C1B3, #009BC9);
}
div[data-psabd="blue-navy"]{
    background:-webkit-linear-gradient(145deg, #FDFDFE, #B8B8BA);
    background:-moz-linear-gradient(145deg, #FDFDFE, #B8B8BA);
    background:linear-gradient(145deg, #009BC9, #0067AB);
}
div[data-psabd="purple-pink"]{
    background:-webkit-linear-gradient(145deg, #FDFDFE, #B8B8BA);
    background:-moz-linear-gradient(145deg, #FDFDFE, #B8B8BA);
    background:linear-gradient(145deg, #2135B2, #B51386);
}

/*
**
**
**
**
**
**
**
**
**  ==== GRAPHIC TEMPLATES
** ========================================
*/

div[data-psabd="birthday_0"]{
    background-image:url(../resources/backdrops/birthday_0.png);
}
div[data-psabd="birthday_1"]{
    background-image:url(../resources/backdrops/birthday_1.png);
}
div[data-psabd="eom_0"]{
    background-image:url(../resources/backdrops/eom_0.png);
}
div[data-psabd="fire_0"]{
    background-image:url(../resources/backdrops/fire_0.png);
}
div[data-psabd="horizon_0"]{
    background-image:url(../resources/backdrops/horizon_0.png);
}
div[data-psabd="wash_0"]{
    background-image:url(../resources/backdrops/wash_0.png);
}
div[data-psabd="coffee_0"]{
    background-image:url(../resources/backdrops/coffee_0.jpg);
}
div[data-psabd="tools_0"]{
    background-image:url(../resources/backdrops/tools_0.jpg);
}
div[data-psabd="drawing_0"]{
    background-image:url(../resources/backdrops/drawing_0.jpg);
}
div[data-psabd="beach_0"]{
    background-image:url(../resources/backdrops/beach_0_0.jpg);
}
div[data-psabd="clouds_0"]{
    background-image:url(../resources/backdrops/clouds_0_0.jpg);
}
div[data-psabd="galaxy_0"]{
    background-image:url(../resources/backdrops/galaxy_0_0.jpg);
}
div[data-psabd="galaxy_1"]{
    background-image:url(../resources/backdrops/galaxy_1_0.jpg);
}
div[data-psabd="storm_0"]{
    background-image:url(../resources/backdrops/storm_0_0.jpg);
}

/*
**
**
**
**
**
**
**
**
**  ==== TACO BELL TEMPLATES
** ========================================
*/

div[data-psabd="b_w_tacos"]{
    background-image:url(../resources/backdrops/b_w_tacos.jpg);    
}
div[data-psabd="campfire"]{
    background-image:url(../resources/backdrops/taco_bell_campfire.jpg);
}
div[data-psabd="daydream"]{
    background-image:url(../resources/backdrops/Daydream-full.jpg);
}
div[data-psabd="float_on"]{
    background-image:url(../resources/backdrops/FloatOn-full.jpg);
}
div[data-psabd="delicious"]{
    background-image:url(../resources/backdrops/DeliciousDoodles-full.jpg);
}
div[data-psabd="bridge"]{
    background-image:url(../resources/backdrops/BridgeOverBaja-full.jpg);
}
div[data-psabd="paint"]{
    background-image:url(../resources/backdrops/PaintTheBite-full.jpg);
}
div[data-psabd="hotsicles"]{
    background-image:url(../resources/backdrops/HOTsicles-full.jpg);
}
div[data-psabd="blackboard"]{
    background-image:url(../resources/backdrops/BlackboardBlast-full.jpg);
}
div[data-psabd="cheesy"]{
    background-image:url(../resources/backdrops/GetCheesy-full.jpg);
}
div[data-psabd="street"]{
    background-image:url(../resources/backdrops/StrEAT-Art-full.jpg);
}
div[data-psabd="drive_thru"]{
    background-image:url(../resources/backdrops/DriveThruDelight-full.jpg);
}
div[data-psabd="neon_bell"]{
    background-image:url(../resources/backdrops/neon_bell.jpg);
}
div[data-psabd="neon_taco"]{
    background-image:url(../resources/backdrops/neon_taco.png);
}
div[data-psabd="taco_shadow"]{
    background-image:url(../resources/backdrops/taco_shadow.jpg);
}
div[data-psabd="80s_taco"]{
    background-image:url(../resources/backdrops/80s_taco.jpg);
}
div[data-psabd="90s_taco"]{
    background-image:url(../resources/backdrops/90s_taco.jpg);
}
div[data-psabd="astro"]{
    background-image:url(../resources/backdrops/astro_taco.jpg);
}
div[data-psabd="beach_taco"]{
    background-image:url(../resources/backdrops/beach_taco.png);
}
div[data-psabd="big_and_small_tacos"]{
    background-image:url(../resources/backdrops/big_and_small_tacos.jpg);
}
div[data-psabd="taco_06"]{
    background-image:url(../resources/backdrops/taco_06.jpg);
}
div[data-psabd="neon_taco_shell"]{
    background-image:url(../resources/backdrops/neon_taco_shell.jpeg);
}
div[data-psabd="blue_taco_stripes"]{
    background-image:url(../resources/backdrops/blue_taco_stripes.jpg);
}
div[data-psabd="burrito"]{
    background-image:url(../resources/backdrops/burrito.jpg);
}
div[data-psabd="cheesy_taco"]{
    background-image:url(../resources/backdrops/cheesy_taco.jpg);
}
div[data-psabd="chip_dip"]{
    background-image:url(../resources/backdrops/chip_dip.jpg);
}
div[data-psabd="cinn_twist"]{
    background-image:url(../resources/backdrops/cinn_twists.jpg);
}
div[data-psabd="diablo_bg"]{
    background-image:url(../resources/backdrops/diablo_bg.png);
}
div[data-psabd="fire_bg"]{
    background-image:url(../resources/backdrops/fire_bg.png);
}
div[data-psabd="firesicles"]{
    background-image:url(../resources/backdrops/firesicles.jpg);
}
div[data-psabd="freeze"]{
    background-image:url(../resources/backdrops/freeze.jpg);
}
div[data-psabd="lav_taco"]{
    background-image:url(../resources/backdrops/lav_taco.jpg);
}
div[data-psabd="live_tacos"]{
    background-image:url(../resources/backdrops/live_tacos.jpg);
}
div[data-psabd="night_taco"]{
    background-image:url(../resources/backdrops/night_taco.png);
}
div[data-psabd="p_p_tacos"]{
    background-image:url(../resources/backdrops/p_p_tacos.jpg);
}
div[data-psabd="pink_taco"]{
    background-image:url(../resources/backdrops/pink_taco.jpg);
}
div[data-psabd="purple_taco"]{
    background-image:url(../resources/backdrops/purple_taco.jpg);
}
div[data-psabd="purple_taco_stripes"]{
    background-image:url(../resources/backdrops/purple_taco_stripes.jpg);
}
div[data-psabd="retro_taco"]{
    background-image:url(../resources/backdrops/retro_taco.jpg);
}
div[data-psabd="smiley_taco"]{
    background-image:url(../resources/backdrops/smiley_taco.jpg);
}
div[data-psabd="smiley_taco2"]{
    background-image:url(../resources/backdrops/smiley_taco2.jpg);
}
div[data-psabd="spicy"]{
    background-image:url(../resources/backdrops/spicy.jpg);
}
div[data-psabd="spray_paint_multi"]{
    background-image:url(../resources/backdrops/spray_paint_multi.jpg);
}
div[data-psabd="taco_bite"]{
    background-image:url(../resources/backdrops/taco_bite.jpg);
}
div[data-psabd="taco_color"]{
    background-image:url(../resources/backdrops/taco_color.jpg);
}
div[data-psabd="taco_deco"]{
    background-image:url(../resources/backdrops/taco_deco.jpg);
}
div[data-psabd="taco_hand"]{
    background-image:url(../resources/backdrops/taco_hand.jpg);
}
div[data-psabd="taco_leaf"]{
    background-image:url(../resources/backdrops/taco_leaf.jpg);
}
div[data-psabd="taco_love"]{
    background-image:url(../resources/backdrops/taco_love.jpg);
}
div[data-psabd="taco_love2"]{
    background-image:url(../resources/backdrops/taco_love2.jpg);
}
div[data-psabd="taco_paint"]{
    background-image:url(../resources/backdrops/taco_paint.png);
}
div[data-psabd="taco_paint2"]{
    background-image:url(../resources/backdrops/taco_paint2.jpg);
}
div[data-psabd="taco_pool"]{
    background-image:url(../resources/backdrops/taco_pool.jpg);
}
div[data-psabd="hot_packet"]{
    background-image:url(../resources/backdrops/hot_packet.jpg);
}
div[data-psabd="taco_stripes"]{
    background-image:url(../resources/backdrops/taco_stripes.jpg);
}
div[data-psabd="taco_taco"]{
    background-image:url(../resources/backdrops/taco_taco.jpg);
}
div[data-psabd="taco_upclose"]{
    background-image:url(../resources/backdrops/taco_upclose.jpg);
}
div[data-psabd="vintage_taco"]{
    background-image:url(../resources/backdrops/vintage_taco.png);
}
div[data-psabd="yellow_taco"]{
    background-image:url(../resources/backdrops/yellow_taco.jpg);
}
/*
**
**
**
**
**
**
**
**
**  ==== ANIMATIONS
** ========================================
*/

div[data-psabd="colors_0"]{
    background:-webkit-linear-gradient(334deg, #f2f2f4, #9a87cf, #4f56c3);
    background:-moz-linear-gradient(334deg, #f2f2f4, #9a87cf, #4f56c3);
    background:linear-gradient(334deg, #f2f2f4, #9a87cf, #4f56c3);
    background-size: 400% 400%;
}
div[data-psabd="colors_1"]{
    background:-webkit-linear-gradient(315deg, #94c997 0%, #daacec 74%);
    background:-moz-linear-gradient(315deg, #94c997 0%, #daacec 74%);
    background:linear-gradient(315deg, #94c997 0%, #daacec 74%);
    background-size: 400% 400%;
}
div[data-psabd="colors_2"]{
    background:-webkit-linear-gradient(334deg, #eea2a2 0%, #bbc1bf 19%, #57c6e1 42%, #b49fda 79%, #7ac5d8 100%);
    background:-moz-linear-gradient(334deg, #eea2a2 0%, #bbc1bf 19%, #57c6e1 42%, #b49fda 79%, #7ac5d8 100%);
    background:linear-gradient(334deg, #eea2a2 0%, #bbc1bf 19%, #57c6e1 42%, #b49fda 79%, #7ac5d8 100%);
    background-size: 400% 400%;
}
div[data-psabd="colors_3"]{
    background:-webkit-linear-gradient(-225deg, #231557 0%, #44107A 29%, #FF1361 67%, #FFF800 100%);
    background:-moz-linear-gradient(-225deg, #231557 0%, #44107A 29%, #FF1361 67%, #FFF800 100%);
    background:linear-gradient(-225deg, #231557 0%, #44107A 29%, #FF1361 67%, #FFF800 100%);
    background-size: 400% 400%;
}
div[data-psabd="colors_4"]{
/*    background:-webkit-linear-gradient(-225deg, #231557 0%, #44107A 29%, #FF1361 67%, #FFF800 100%);
    background:-moz-linear-gradient(-225deg, #231557 0%, #44107A 29%, #FF1361 67%, #FFF800 100%);*/
    background: radial-gradient(rgba(255,255,255,0) 0, rgba(255,255,255,.15) 30%, rgba(255,255,255,.3) 32%, rgba(255,255,255,0) 33%) 0 0, radial-gradient(rgba(255,255,255,0) 0, rgba(255,255,255,.1) 11%, rgba(255,255,255,.3) 13%, rgba(255,255,255,0) 14%) 0 0, radial-gradient(rgba(255,255,255,0) 0, rgba(255,255,255,.2) 17%, rgba(255,255,255,.43) 19%, rgba(255,255,255,0) 20%) 0 110px, radial-gradient(rgba(255,255,255,0) 0, rgba(255,255,255,.2) 11%, rgba(255,255,255,.4) 13%, rgba(255,255,255,0) 14%) -130px -170px,
        radial-gradient(rgba(255,255,255,0) 0, rgba(255,255,255,.2) 11%, rgba(255,255,255,.4) 13%, rgba(255,255,255,0) 14%) 130px 370px,
        radial-gradient(rgba(255,255,255,0) 0, rgba(255,255,255,.1) 11%, rgba(255,255,255,.2) 13%, rgba(255,255,255,0) 14%) 0 0,
        linear-gradient(45deg, #343702 0%, #184500 20%, #187546 30%, #006782 40%, #0b1284 50%, #760ea1 60%, #83096e 70%, #840b2a 80%, #b13e12 90%, #e27412 100%);
    background-size: 470px 470px, 970px 970px, 410px 410px, 610px 610px, 530px 530px, 730px 730px, 400% 400%;
    background-color: #840b2a;
}
div[data-psabd="colors_5"]{
    background: url(../resources/backdrops/raindrop.jpg);
    background-position: 0 0;
}
div[data-psabd="colors_6"]{
    background: url(../resources/backdrops/sky_cloud.jpg);
    background-position: 0 0;
}
@-webkit-keyframes MovingGradient{
    0%{background-position:4% 0%}
    50%{background-position:97% 100%}
    100%{background-position:4% 0%}
}
@-moz-keyframes MovingGradient{
    0%{background-position:4% 0%}
    50%{background-position:97% 100%}
    100%{background-position:4% 0%}
}
@keyframes MovingGradient{
    0%{background-position:4% 0%}
    50%{background-position:97% 100%}
    100%{background-position:4% 0%}
}
@keyframes background {
	from { background-position: 1000% 20000px, 0 0, 0 0; } 
	to { background-position: -50000% 20000px, -500000px 0, -250000px 0; }
}
@keyframes animated-pattern {
  from { background-position: 0 0; }
  to { background-position: 0 800px; }
}
@keyframes animated-pattern-horz {
  from { background-position: 0 0; }
  to { background-position: -800px 0; }
}

div[data-psabd="colors_0"].active{
    -webkit-animation:MovingGradient 5s ease infinite;
    -moz-animation:MovingGradient 5s ease infinite;
    animation:MovingGradient 5s ease infinite;
}
div[data-psabd="colors_1"].active{
    -webkit-animation:MovingGradient 5s ease infinite;
    -moz-animation:MovingGradient 5s ease infinite;
    animation:MovingGradient 5s ease infinite;
}
div[data-psabd="colors_2"].active{
    -webkit-animation:MovingGradient 5s ease infinite;
    -moz-animation:MovingGradient 5s ease infinite;
    animation:MovingGradient 5s ease infinite;
}
div[data-psabd="colors_3"].active{
    -webkit-animation:MovingGradient 5s ease infinite;
    -moz-animation:MovingGradient 5s ease infinite;
    animation:MovingGradient 5s ease infinite;
}
div[data-psabd="colors_4"].active{
    -webkit-animation:background linear 30000s infinite;
    -moz-animation:background linear 30000s infinite;
    animation:background linear 30000s infinite;
}
div[data-psabd="colors_5"].active{
    -webkit-animation:animated-pattern 15s linear infinite;
    -moz-animation:animated-pattern 15s linear infinite;
    animation:animated-pattern 15s linear infinite;
}
div[data-psabd="colors_6"].active{
    -webkit-animation:animated-pattern-horz 15s linear infinite;
    -moz-animation:animated-pattern-horz 15s linear infinite;
    animation:animated-pattern-horz 15s linear infinite;
}

/*
**
**
**
**
**
**
**
**
**  ==== EMERGENCY
** ========================================
*/

div[data-psabd="emergency_0"]{
    background-color:#000 !important;
}
div[data-psabd="emergency_0"]::after{
    content:'';
    display:block;
    position:absolute;z-index:0;
    top:0;left:0;
    width:calc(100% - 24px);height:calc(100% - 24px);
    background-color:transparent;
    border:12px solid transparent;
}
div[data-psabd="emergency_0"].active::after,
div[data-psabd="emergency_0"]:hover::after{
    -webkit-animation:EmergencyBorder 1s ease infinite;
    -moz-animation:EmergencyBorder 1s ease infinite;
    animation:EmergencyBorder 1s ease infinite;
}
@-webkit-keyframes EmergencyBorder{
    0%{     border-color:#000;       }
    50%{   border-color:#F62003; }
    100%{ border-color:#000;       }
}
@-moz-keyframes EmergencyBorder{
    0%{     border-color:#000;       }
    50%{   border-color:#F62003; }
    100%{ border-color:#000;       }
}
@keyframes EmergencyBorder{
    0%{     border-color:#000;       }
    50%{   border-color:#F62003; }
    100%{ border-color:#000;       }
}
