/*
Description:
    Contains all the styles for the winning wheel page.
    
Verison History:
    2012-01-28, Douglas McKechie
    - Created based off earlier version.
    
    2015-09-26, Douglas McKechie
    - Minor updates for the 2.0 winwheel example.
*/


/* Sets the background image for the wheel */


/* Do some css reset on selected elements */


.spin {
    position  : relative;
    margin-top: 55px;
}

.arrow {
    margin-top: 90px;
    position  : absolute;
    left      : 50%;
    top       : -2px;
    transform : translate(-50%, -50%);

}

.arrow img {
    /* width    : 50px; */
    width    : 100%;
}

h1.spin {
    color      : #ffffff;
    font-size  : 45px;
    font-weight: 800;
    padding    : 5px 0px;
    font-family: 'MyWebFont-medium';
}

.spinwhill {
    /* background-color: #bd2f2a;
    padding: 7px 30px;
    border-radius: 10px;
    display: inline-block;
    text-align: center;
    border: 5px solid #f1ce4d;
    font-family: 'MyWebFont-medium';
    font-weight: 800;
    text-transform: uppercase;
    cursor: pointer;
   color: #FFF; */
    margin-top      : 25px;
    background-color: #006a3d;
    padding         : 7px 30px;
    border-radius   : 10px;
    display         : inline-block;
    text-align      : center;
    border          : 7px solid #006a3d;
    font-family     : 'MyWebFont-medium';
    font-weight     : 400;
    text-transform  : uppercase;
    margin-top      : 25px;
    color           : #fff;
    cursor          : pointer;
}

.power_controls {
    display        : flex;
    flex-direction : column;
    height         : 100%;
    align-items    : center;
    justify-content: center;
}

span#myText {
    font-size     : 25px;
    text-transform: capitalize;
    font-weight   : 600;
    color         : #FFEE00;

    border-radius: 5px;

}

.play_agin {
    display         : block;
    padding         : 20px 28px;
    background-color: #fe9d2b;
    border-radius   : 10px;
    font-size       : 25px;
    font-weight     : 500;
    color           : #000;
    text-transform  : capitalize;
    margin-top      : 5px;
}

ul.logo_sec {
    border-radius: 5px; 
    display: flex;
    align-items: center;
    width: 100%;
    margin: 20px 0;
    justify-content: center;
    background: rgb(255 255 255 / 50%);
    list-style-type: none;
    padding: 0 5px;
}

ul.logo_sec li { 
    padding   : 5px;
}

ul.logo_sec li img {
    max-width: 100%;
}