body { background: #141414; }

.container {
    text-align: center;
    margin: 20px auto;
}

.bulb-light {
    position: relative;
    border: 0;
    background: transparent;
    margin: 0 auto !important;
    padding: 0 !important;
    cursor: pointer;
    display: block;
    z-index: 1;
}

#light {
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
    position: absolute;
    top: 5px;
    left: 0;
    right: 0;
    box-shadow: 0px 0px 500px rgba(255,210,00,1), inset 0px 0px 500px 90px rgba(255,210,00,0.42);
    -moz-box-shadow: 0px 0px 500px rgba(255,210,00,1), inset 0px 0px 500px 90px rgba(255,210,00,0.42);
    -webkit-box-shadow: 0px 0px 500px rgba(255,210,00,1), inset 0px 0px 500px 90px rgba(255,210,00,0.42);
    -moz-border-radius: 999px;
    -webkit-border-radius: 999px;
    -khtml-border-radius: 999px;
    border-radius: 999px;
    width: 290px;
    height: 290px;
    background: none;
    margin: 0 auto;
    text-align: center;
    z-index: 2;
}

#bulb {
    opacity: 1;
    z-index: 3;
}

.bulb-top {
    position: relative;
    border: 0;
    width: 300px;
    height: 300px;
    margin: 0 auto;
    padding: 0;
    -moz-border-radius: 999px;
    -webkit-border-radius: 999px;
    -khtml-border-radius: 999px;
    border-radius: 999px;
    background: #E7E7E7;
    box-shadow: inset 0px 10px 15px -5px rgba(10,30,60,0.1);
    -moz-box-shadow: inset 0px 10px 15px -5px rgba(10,30,60,0.1);
    -webkit-box-shadow: inset 0px 20px 40px -10px rgba(10,30,60,0.1);
}

.reflection {
    position: absolute;
    top: 50px;
    left: 50px;
    background: rgba(255, 255, 255, 0.5);
    width: 50px;
    height: 50px;
    -moz-border-radius: 999px 400px;
    -webkit-border-radius: 999px 400px;
    -khtml-border-radius: 999px 400px;
    border-radius: 999px 400px;
}


#base { position:relative; z-index: 2; }

.base-top {
    margin: -18px auto -4px auto;
    padding: 0;
    width: 132px;
    height: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 21px solid rgb(180, 180, 180);
    -moz-border-radius: 999px;
    -webkit-border-radius: 999px;
    -khtml-border-radius: 999px;
    border-radius: 999px;
}

.base-spiral {
    background: rgb(200, 200, 200);
    width: 150px;
    height: 15px;
    -moz-border-radius: 999px;
    -webkit-border-radius: 999px;
    -khtml-border-radius: 999px;
    border-radius: 999px;
    margin: -1px auto 0px;
    padding: 0;
    transform: rotate(-3deg);
    -ms-transform: rotate(-3deg);
    -webkit-transform: rotate(-3deg);
    /*
    box-shadow: inset 0px -2px 10px 0px rgba(10,30,60,0.2),
    inset -20px 0px 60px -20px rgba(0,0,0,0.5);
    -moz-box-shadow: inset 0px -2px 10px 0px rgba(10,30,60,0.2),
    inset -20px 0px 60px -20px rgba(0,0,0,0.5);
    -webkit-box-shadow: inset 0px -2px 10px 0px rgba(10,30,60,0.2),
    inset -20px 0px 60px -20px rgba(0,0,0,0.5);
    */
}

.base-body {
    background: rgb(180, 180, 180);
    width: 135px;
    height: 15px;
    margin: -1px auto 0px;
    padding: 0;
    transform: rotate(-3deg);
    -ms-transform: rotate(-3deg);
    -webkit-transform: rotate(-3deg);
    /*
    box-shadow: inset -15px 0px 55px -20px rgba(0,0,0,0.5);
    -moz-box-shadow: inset -15px 0px 55px -20px rgba(0,0,0,0.5);
    -webkit-box-shadow: inset -15px 0px 55px -20px rgba(0,0,0,0.5);
    */
}

.base-bottom {
    margin: -1px auto 0px;
    padding: 0;
    width: 78px;
    height: 0;
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    border-top: 20px solid rgb(180, 180, 180);
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    -khtml-border-radius: 8px;
    border-radius: 8px;
    transform: rotate(-3deg);
    -ms-transform: rotate(-3deg);
    -webkit-transform: rotate(-3deg);
}

.base-connector {
    margin: 0 auto;
    padding: 0;
    width: 15px;
    height: 0;
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    border-top: 15px solid #444;
    transform: rotate(-3deg);
    -ms-transform: rotate(-3deg);
    -webkit-transform: rotate(-3deg);
}

body, .bulb-top, .bulb-bottom {
    -webkit-transition: background 0.5s ease-in-out;
    -moz-transition: background 0.5s ease-in-out;
    -o-transition: background 0.5s ease-in-out;
    transition: background 0.5s ease-in-out;
}

.bulb-middle-1, .bulb-middle-2, .bulb-middle-3 {
    -webkit-transition: border 0.5s ease-in-out;
    -moz-transition: border 0.5s ease-in-out;
    -o-transition: border 0.5s ease-in-out;
    transition: border 0.5s ease-in-out;
}
