/*
 * jQuery Slot Machine v4.0.1
 * https://github.com/josex2r/jQuery-SlotMachineundefined
 *
 * Copyright 2014 Jose Luis Represa
 * Released under the MIT license
 */

@charset "utf-8";
/* CSS Document */
.btn-group-justified {
    margin: 0 auto;
}

.slotMachine .slot{
    height:100px;
    background-position-x: 55%;
    background-repeat: no-repeat;
}

.slot1 {
    background-image: url("../media/slot/slot1.png");
}

.slot2 {
    background-image: url("../media/slot/slot2.png");
}

.slot3 {
    background-image: url("../media/slot/slot3.png");
}

.slot4 {
    background-image: url("../media/slot/slot4.png");
}

.slot5 {
    background-image: url("../media/slot/img/slot5.png");
}

.slot6 {
    background-image: url("../media/slot/slot6.png");
}

/*
 * SlotMachine
 */
#randomize {
    border-bottom: 10px solid rgb(72, 158, 48);
    background-color: #EB6B56;
    border-top: 20px dashed #B8312F;
}

#randomize .row > div.col-sm-4 > div {
    padding: 40px;
    width: 180px;
    height: 180px;
    background: white;
    border-radius: 50%;
    margin-left: auto;
    margin-right: auto;
    display: block;
    text-align: center;
}

#randomize .row > div.col-xs-4 > div {
    padding-top: 40px;
    padding-left: 40px;
    width: 175px;
    height: 175px;
    background-color: #fff;
    border-radius: 50%;
    margin: auto;
}

.randomizeMachine {
    width: 100px;
    height: 100px;
}

#randomize .btn-group {
    margin-top: 30px;
    width: auto;
    margin-bottom: 15px;
}

.machineResult {
    color: #fff;
    text-align: center;
    font-weight: 900;
    height: 50px !important;
    background: transparent !important;
    font-size: 18px;
    padding: 10px !important;
}

/*
 * Casino
 */
#casino {

}

#casino .content:nth-child(1) {
    text-align: center;
    background: url('../media/slot/machine.png') no-repeat 50% 80px;
    background-position-x: calc(50% + 30px);
    min-height: 580px;
}

#casino .content > div {
    padding-top: 165px;
    width: 300px;
    margin: 0 auto;
    transform: translateX(30px);
}

.machineContainer{
    padding: 5px 1px 5px 1px;
    height: 135px;
}

.slotMachine{
    width: 36.333333%;
    border: 5px solid #CF5178;
    height: 100px;
    display: inline-block;
}

#casino .btn-group {
    margin-top: 150px;
    transform: translateX(-25px);
}

#casino .btn-group .btn {
    border: none;
    background-color: rgb(209, 79, 119);
}

#casino .btn-group .btn:hover, .btn-group .btn:focus {
    background-color: rgb(180, 75, 119);
}

.slotMachineNoTransition {
    -webkit-transition: none !important;
    -o-transition: none !important;
    transition: none !important;
}

.slotMachineBlurFast {
    -webkit-filter: blur(5px);
    filter: blur(5px);
}

.slotMachineBlurMedium {
    -webkit-filter: blur(3px);
    filter: blur(3px);
}

.slotMachineBlurSlow {
    -webkit-filter: blur(2px);
    filter: blur(2px);
}

.slotMachineBlurTurtle {
    -webkit-filter: blur(1px);
    filter: blur(1px);
}

.slotMachineGradient {
    -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0,0,0,0)), color-stop(25%, rgba(0,0,0,1)), color-stop(75%, rgba(0,0,0,1)), color-stop(100%, rgba(0,0,0,0)) );
    -webkit-mask: url("data:image/svg+xml;utf8,<svg version="1.1" xmlns="http:// www.w3.org/2000/svg" width="0" height="0"><mask id="slotMachineFadeMask" maskUnits="objectBoundingBox" maskContentUnits="objectBoundingBox"><linearGradient id="slotMachineFadeGradient" gradientUnits="objectBoundingBox" x="0" y="0"><stop stop-color="white" stop-opacity="0" offset="0"></stop><stop stop-color="white" stop-opacity="1" offset="0.25"></stop><stop stop-color="white" stop-opacity="1" offset="0.75"></stop><stop stop-color="white" stop-opacity="0" offset="1"></stop></linearGradient><rect x="0" y="-1" width="1" height="1" transform="rotate(90)" fill="url(#slotMachineFadeMask)"></rect></mask></svg>#slotMachineFadeMask");
    mask: url("data:image/svg+xml;utf8,<svg version="1.1" xmlns="http:// www.w3.org/2000/svg" width="0" height="0"><mask id="slotMachineFadeMask" maskUnits="objectBoundingBox" maskContentUnits="objectBoundingBox"><linearGradient id="slotMachineFadeGradient" gradientUnits="objectBoundingBox" x="0" y="0"><stop stop-color="white" stop-opacity="0" offset="0"></stop><stop stop-color="white" stop-opacity="1" offset="0.25"></stop><stop stop-color="white" stop-opacity="1" offset="0.75"></stop><stop stop-color="white" stop-opacity="0" offset="1"></stop></linearGradient><rect x="0" y="-1" width="1" height="1" transform="rotate(90)" fill="url(#slotMachineFadeMask)"></rect></mask></svg>#slotMachineFadeMask");
}
