@media screen
    /*and (-webkit-min-device-pixel-ratio: 1), screen and (max--moz-device-pixel-ratio: 1)*/
{
    * {
        margin: 0px;
        padding: 0px;
        border: 0;
        font-family: Arial, sans-serif;
        color: #333333;
        border-spacing: 0px;
        outline: none;
        /*outline: 1px solid green;*/
    }
    	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
          /*outline: 1px solid green;*/
      }
      /* Let's get this party started */
      ::-webkit-scrollbar {
          width: 12px;
      }

      /* Track */
      ::-webkit-scrollbar-track {
          -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
          -webkit-border-radius: 10px;
          border-radius: 10px;
      }

      /* Handle */
      ::-webkit-scrollbar-thumb {
          -webkit-border-radius: 10px;
          border-radius: 10px;
          background: rgba(31,167,255,0.8); 
          -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
      }
      ::-webkit-scrollbar-thumb:window-inactive {
  	    background: rgba(31,167,255,0.4); 
      }
    /*html background*/
    html {
        background: rgba(0,0,0,0.0);
    }
    /* This is needed for some mobile devices to use the 620-wide version 
    html.width-620 {
        width: 620px; height: 540px;
    }
*/
    /*style for body*/

    body {
	    width: 100%; height: auto; margin: 0 auto;
        background: #ffffff url('../images/bg_pattern.png');
        display: block;
		-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
		overflow:hidden;
    }
    input {
        -webkit-appearance: none;
        -webkit-border-radius: 0px;
		-webkit-overflow-scrolling: touch;
        border-radius: 0px;
    }
    hr {
        height: 1px;
        width: 250px;
        margin:5px 20px;
        border-bottom: 1px dotted #aaa;
    }
    .toggle_button_off {
        background: url('../images/button_on.png');
        background-size: 100%;
        width: 20px;
        height: 18px;
        display: inline-block;
    }
    .toggle_button_on {
        background: url('../images/button_off.png');
        background-size: 100%;
        width: 20px;
        height: 18px;
        display: inline-block;
    }
    /*game board header*/
    .top_wrap {
        width: 100%;
        height: 35px;
        background: #cfcfcf url('../images/header_bg.png') repeat-x;
    }
        .top_wrap div {
            height: 15px;
            padding: 10px 20px;
            font-size: 12px;
            /*text-shadow: 1px 1px 3px #ffffff;*/
            font-weight: bold;
            text-transform: uppercase;
            display: inline-block;
            overflow: hidden;
        }
        /*class for displaying game name in header*/
        .top_wrap .game_name {
            width: 300px;
            float: left;
            text-align: left;
            font-size: 20px;
        }
        .top_wrap .game_name .game_title{
            font-size: 20px;
            padding: 4px;
            height:100%;
            position: relative;
            top: -6px;
            color: #000;
        }
        .top_wrap .ajaxloader {
            height: 15px;
            width: 128px;
            display: none;
            /*background: url('../images/299.gif') no-repeat;*/
            background-position: center center;
            float: left;
        }
        .top_wrap .date {
            width: 200px;
            float: right;
            text-align: right;
        }
    .main_container {
        width:100%;
        margin:0px;
        display: block;
        height: 633px;
        overflow: hidden;
    }
    /*class for displaying game menu*/
    .main_container .game_menu_container {
        width: 100%;
        height: 60px;
        margin-bottom: 10px;
        font-weight: bold;
    }
        .main_container .game_menu_container>div {
            width: auto;
            display: inline-block;

        }
        .main_container .game_menu_container .game_menu {
            height: 29px;
            text-align: right;
            font-weight: bold;
            padding: 10px 0 4px 0;
            float:right;
           

            /*-webkit-touch-callout: none;
            -webkit-user-select: none;
            -khtml-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;*/
        }
            .main_container .game_menu_container .game_title {
                width: auto;
                height: 29px;
                margin: 7px 0;
                float: left;
                text-align: left;
                font-size: 20px;
                overflow: hidden;
                text-transform: capitalize;
            }
            div#puzzle_name.game_title{
                height:29px;
            }
            /*common style for each of he menu icons*/
            .main_container .game_menu_container .game_menu ul.icons li {
                height: 29px;
                width: 34px;
                display: inline-block;
                text-decoration:none;
                padding: 0 5px;
                list-style: none;
                float: right;
                cursor: pointer;
                background: url('../images/sprite@1x.png');

            }
            /*background for each individual menu items through image sprites*/
            li#play{
                background-position: 0 -1413px;
                margin-right: 0px;
            }
            li#play.tactive{
                background-position: 0 -1571px;
                margin-right: 0px;
            }
            li#print{
                background-position: 0 -1798px;
            }
            li#print.iactive{
                background-position : 0 -1877px;
            }
ul.popup_menu{
    cursor:default !important;
}
ul.popup_menu *{
    cursor:default !important;
}
ul.popup_menu a,
ul.popup_menu .sub_menu,
ul.popup_menu .sub_menu *,
ul.popup_menu .other_games *,
ul.popup_menu .btn,
ul.popup_menu .btn *,
ul.popup_menu .button{
    cursor:pointer !important;
}
li#print ul.popup_menu {
                    width: 125px;
                    display: none;
                    top: 29px;
                    left: -70px;
                    position: relative;
                    z-index: 100;

                }
                    li#print ul.popup_menu li.popup_arrow {
	                    width: 200%;
                        height: 10px;
                        position: absolute;
                        left: 68px;
	                    background: url('../images/menu_popup_header@1x.png') no-repeat;
                        z-index:102;
                    }
                    li#print ul.popup_menu li.popup_container {
                        width: 114px;
                        height: 95px;
                        padding:8px 5px 0px 6px;
                        margin-top:9px;
	                    float: left;
	                    background: #ffffff url('../images/bg_pattern.png');
                        border:1px solid #cccccc;
                        z-index:100;
                        box-shadow: 2px 2px 19px #aaa;
                        -o-box-shadow: 2px 2px 19px #aaa;
                        -webkit-box-shadow: 2px 2px 19px #aaa;
                        -moz-box-shadow: 2px 2px 19px #aaa;
                        -webkit-border-radius: 10px;
                        -moz-border-radius: 10px;
                        border-radius: 10px;
                    }
                        /*li#print ul.popup_menu li.popup_container .button_print {
                            background: url('../images/sprite@1x.png');
                            background-position: 0 -1729px; width: 127px; height: 19px;
                        }*/
                        li#print ul.popup_menu li.popup_container .sub_menu {
                            width: 110px;
                            font-size: 12px;
                            text-align:left;
                            display: block;
                        }
                            /*li#print ul.popup_menu li.popup_container .sub_menu span.check {
                                background: url('../images/sprite@1x.png');
                                background-position: 0 -635px;
                                width: 12px;
                                height: 12px;
                                display:inline-block;
                            }
                            li#print ul.popup_menu li.popup_container .sub_menu span.cactive {
                                background: url('../images/sprite@1x.png');
                                background-position: 0 -697px;
                                width: 12px;
                                height: 12px;
                                display:inline-block;
                            }*/
                            li#print ul.popup_menu li.popup_container .sub_menu span.text {
                                width: 90px;
                                padding-left: 10px;
                                line-height: 30px;
                                display: inline-block;
                                font-size: 11px;
                                font-weight: bold;
                                margin: 0;
                                color: #666666;
                                /*border-bottom: 1px solid #dddddd;*/
                                /*text-shadow: 1px 0px #cccccc;*/
                            }
            li#hint{
                background-position: 0 -969px;
            }
            li#hint.iactive{
                background-position: 0 -1048px;
            }
                li#hint ul.popup_menu {
                    width: 176px;
                    display: none;
                    top: 29px;
                    left: -80px;
                    position: relative;
                    z-index: 100;
                }
                    li#hint ul.popup_menu li.popup_arrow {
	                    width: 200%;
                        height: 10px;
                        left:78px;
                        position: absolute;
	                    background: url('../images/menu_popup_header@1x.png') no-repeat;
                        z-index:102;
                    }
                    li#hint ul.popup_menu li.popup_container {
                        width: 160px;
                        height: auto;
                        padding:8px;
                        margin-top:9px;
	                    float: right;
	                    background: #ffffff url('../images/bg_pattern.png');
                        border:1px solid #cccccc;
                        z-index:100;
                        box-shadow: 2px 2px 19px #aaa;
                        -o-box-shadow: 2px 2px 19px #aaa;
                        -webkit-box-shadow: 2px 2px 19px #aaa;
                        -moz-box-shadow: 2px 2px 19px #aaa;
                        -webkit-border-radius: 10px;
                        -moz-border-radius: 10px;
                        border-radius: 10px;
                    }
                        li#hint ul.popup_menu li.popup_container .mode {
                            background: url('../images/mode_bg.png');
                            width: 154px;
                            height: 32px;
                            margin: 0 auto;
                        }
                        li#hint ul.popup_menu li.popup_container .mode.mactive {
                            background: url('../images/mode_expert_bg.png');
                        }
                            li#hint ul.popup_menu li.popup_container .mode > span {
                                width: 70px;
                                line-height: 32px;
                                display: inline-block;
                                float: left;
                                font-size: 12px;
                                font-weight: bold;
                            }
                        li#hint ul.popup_menu li.popup_container .sub_menu {
                            width: 154px;
                            line-height: 32px;
                            margin: 0 auto;
                            font-size: 11px;
                            text-align: left;
                            color: #666;
                            /*text-shadow: 1px 0px #CCC;*/
                            /*border-bottom: 1px ridge #DDD;*/
                            font-weight: bold;
                        }
                            li#hint ul.popup_menu li.popup_container .sub_menu span {
                                vertical-align: middle;
                            }
                            li#hint ul.popup_menu li.popup_container .sub_menu:last-child {
                                border: none;
                            }
            li#setting{
                background-position: -550px -69px;
            }
            li#setting.iactive{
                background-position: -550px -148px;
            }
                li#setting ul.popup_menu {
                    width: 213px;
                    /*height: 148px;*/
                    overflow: hidden;
                    display: none;
                    top: 29px;
                    left: -100px;
                    position: relative;
                    z-index: 100;
                }
                    li#setting ul.popup_menu li.popup_arrow {
                        width: 200%;
                        height: 10px;
                        left: 98px;
                        position:absolute;
                        background: url('../images/menu_popup_header@1x.png') no-repeat;
                        z-index: 102;
                    }
                    li#setting ul.popup_menu li.popup_container {
                        width: 168px;
                        height: auto;
                        padding: 8px;
                        margin: 9px 17px 13px 20px;
	                    float: right;
	                    background: #ffffff url('../images/bg_pattern.png');
                        border:1px solid #cccccc;
                        z-index:100;
                        box-shadow: 2px 2px 19px #aaa;
                        -o-box-shadow: 2px 2px 19px #aaa;
                        -webkit-box-shadow: 2px 2px 19px #aaa;
                        -moz-box-shadow: 2px 2px 19px #aaa;
                        -webkit-border-radius: 10px;
                        -moz-border-radius: 10px;
                        border-radius: 10px;
                    }
                        li#setting ul.popup_menu li.popup_container .button_reset {
                            background: url('../images/blue_stripe.png');
                            background-position: -550px 0;
                            line-height: 26px;
                            margin:10px auto 0 auto;
                            -webkit-border-radius: 10px;
                            -moz-border-radius: 10px;
                            border-radius: 10px;
                            color: #ffffff;
                            text-align: center;
                            font-size: 12px;
                            font-weight: bold;
                        }
                        li#setting ul.popup_menu li.popup_container .sub_menu {
                            width: 174px;
                            padding: 5px 0;
                            font-size: 12px;
                            text-align:left;
                            display: block;
                            /*border-bottom: 1px ridge #dddddd;*/
                        }
                            #show_mistakes_toggle {
                                border-bottom: 0px ridge #dddddd !important;
                            }
                            li#setting ul.popup_menu li.popup_container .sub_menu span.text {
                                display: inline-block;
                                font-size: 11px;
                                font-weight: bold;
                                line-height: 20px;
                                margin: 0;
                                color: #666666;
                                vertical-align: top;
                            }
         #calendar{
            background:url('../images/playanother.png')no-repeat;
            width: 132px;
            border-radius: 10px;
            right: 34px;
            /* top: -1px; */
            height: 24px;
            position: relative;
            border: 2px solid #0000;
            content:'';
            /* float: right; */
        }
        #calendar.iactive, #calendar:hover{
            border:2px solid #eef049;
        }
                li#calendar ul.popup_menu {
                    width: 410px;
                    height: auto;
                    display: none;
                    top: 29px;
                    left: -340px;
                    position: relative;
                    z-index: 100;
                }
                    li#calendar ul.popup_menu li.popup_arrow {
                        width: 200%;
                        height: 10px;
                        left: 338px;
                        background: url('../images/menu_popup_header@1x.png') no-repeat;
                        z-index: 102;
                        position: absolute;
                    }
                    li#calendar ul.popup_menu li.popup_container {
                        width: 384px;
                        height: auto;
                        padding:8px 12px 8px 12px;
                        margin-top:9px;
	                    float: right;
	                    background: #ffffff url('../images/bg_pattern.png');
                        border:1px solid #cccccc;
                        z-index:100;
                        box-shadow: 2px 2px 19px #aaa;
                        -o-box-shadow: 2px 2px 19px #aaa;
                        -webkit-box-shadow: 2px 2px 19px #aaa;
                        -moz-box-shadow: 2px 2px 19px #aaa;
                        -webkit-border-radius: 10px;
                        -moz-border-radius: 10px;
                        border-radius: 10px;
                    }
                        li#calendar ul.popup_menu li.popup_container .title {
                            width: 100%;
                            font-size:14px;
                            font-weight:bold;
                            text-decoration: uppercase;
                            text-align: center;
                        }
                        li#calendar ul.popup_menu li.popup_container .button {
                            width: 100%;
                            height:27px;
                            margin: 5px 0 10px 0;
                        }
                        li#calendar ul.popup_menu li.popup_container .button>span:first-child {
                            -webkit-border-top-left-radius: 5px;
                            -webkit-border-bottom-left-radius: 5px;
                            -moz-border-radius-topleft: 5px;
                            -moz-border-radius-bottomleft: 5px;
                            border-top-left-radius: 5px;
                            border-bottom-left-radius: 5px;

                        }
                        li#calendar ul.popup_menu li.popup_container .button>span:last-child {
                            -webkit-border-top-right-radius: 5px;
                            -webkit-border-bottom-right-radius: 5px;
                            -moz-border-radius-topright: 5px;
                            -moz-border-radius-bottomright: 5px;
                            border-top-right-radius: 5px;
                            border-bottom-right-radius: 5px;
                        }
                        li#calendar ul.popup_menu li.popup_container .button>span{
                            width: 127px;
                            display: inline-block;
                            float: left;
                            font-size: 11px;
                            line-height: 27px;
                            text-align: center;
                            background: url('../images/button_inactive_bg.png') repeat-x;
                            border-right:1px solid #dddddd;
                        }
                        li#calendar ul.popup_menu li.popup_container .button>span.bactive{
                            background: url('../images/button_active_bg.png') repeat-x;
                        }
                        li#calendar ul.popup_menu li.popup_container .puzzles_header {
                            width: 396px;
                            height:15px;
                            margin: 0 10px 0 0;
                        }
                        li#calendar ul.popup_menu li.popup_container .puzzles_header>span{
                            display:inline-block;
                            line-height:18px;
                            float: left;
                            font-size:12px;
                            font-weight: normal;
                            padding:0 5px;
                            text-align:left;
                            border-right: 1px inset #DDDDDD;
                            border-bottom: 1px inset #DDDDDD;
                        }
                            li#calendar ul.popup_menu li.popup_container .puzzles_header > span:first-child {
                                padding: 0px;
                            }
                            li#calendar ul.popup_menu li.popup_container .puzzles_header > span:last-child {
                                border-right: none;
                            }
                            li#calendar ul.popup_menu li.popup_container .puzzles_header span.name {
                                width: 180px;
                            }
                            li#calendar ul.popup_menu li.popup_container .puzzles_header span.perc {
                                width: 70px;
                            }
                            li#calendar ul.popup_menu li.popup_container .puzzles_header span.spent {
                                width: 88px;
                                padding-left: 16px;
                            }
                        li#calendar ul.popup_menu li.popup_container .other_games {
                            width: 388px;
                            height: 288px;
                            margin: auto;
                            overflow-y: scroll;
                        }
                            li#calendar ul.popup_menu li.popup_container .other_games div {
                                height: 40px;
                            }
                                li#calendar ul.popup_menu li.popup_container .other_games div.cur_puz>span.name>span:first-child{
                                    color: #1da1ff;
                                }
                            li#calendar ul.popup_menu li.popup_container .other_games div>span{
                                display: inline-block;
                                line-height: 40px;
                                float: left;
                                text-align: left;
                                border-bottom: 1px inset #DDDDDD;
                                font-size: 10px;
                                overflow:hidden;
                            }
                                li#calendar ul.popup_menu li.popup_container .other_games div span.name {
                                    width: 178px;
                                    height: 35px;
                                    line-height: 15px;
                                    font-size: 14px;
                                    padding: 5px 2px 0 0;
                                    text-overflow: ellipsis;
                                    text-transform: capitalize;
                                }
                                li#calendar ul.popup_menu li.popup_container .other_games div span.name > span {
                                    line-height: 16px;
                                    text-overflow: ellipsis;
                                    width: 100%;
                                    display: block;
                                    white-space: nowrap;
                                    overflow: hidden;
                                    text-transform: capitalize;
                                }
                                    li#calendar ul.popup_menu li.popup_container .other_games div span.name .game_date {
                                        display: block;
                                        color: #666666;
                                        font-size: 10px;
                                    }
                                li#calendar ul.popup_menu li.popup_container .other_games div span.perc {
                                    width: 82px;
                                    font-size: 11px;
                                    background: #eeeeee;
                                    text-align: center;
                                }
                                li#calendar ul.popup_menu li.popup_container .other_games div span.time_spent {
                                    width: 107px;
                                    font-size: 11px;
                                    text-align: center;
                                }
            li#info{
                background-position: 0 -1127px;
            }
            li#info.iactive{
                background-position: 0 -1206px;
            }
                li#info ul.popup_menu {
                    width: 415px;
                    height: 322px;
                    display: none;
                    top: 29px;
                    left: -379px;
                    position: relative;
                    z-index: 100;
                }
                    li#info ul.popup_menu li.popup_arrow {
                        width: 200%;
                        height: 10px;
                        left: 378px;
                        background: url('../images/menu_popup_header@1x.png') no-repeat;
                        z-index: 102;
                        position: absolute;
                    }
                    li#info ul.popup_menu>li.popup_container {
                        width: 403px;
                        height: auto;
                        padding:8px 5px 8px 5px;
                        margin-top:9px;
	                    float: right;
	                    background: url('../images/bg_pattern.png');
                        border:1px solid #cccccc;
                        z-index:100;
                        box-shadow: 2px 2px 19px #aaa;
                        -o-box-shadow: 2px 2px 19px #aaa;
                        -webkit-box-shadow: 2px 2px 19px #aaa;
                        -moz-box-shadow: 2px 2px 19px #aaa;
                        -webkit-border-radius: 10px;
                        -moz-border-radius: 10px;
                        border-radius: 10px;
                    }
                        li#info ul.popup_menu li.popup_container .title {
                            width: 100%;
                            font-size:14px;
                            font-weight:bold;
                            text-decoration: uppercase;
                            text-align: center;
                        }
                        li#info ul.popup_menu li.popup_container .button {
                            width: 100%;
                            height:25px;
                            margin: 5px 0 10px 0;
                        }
                        li#info ul.popup_menu li.popup_container .button>span{
                            width: 133px;
                            display: inline-block;
                            float: left;
                            font-size: 11px;
                            line-height: 27px;
                            text-align: center;
                            background: url('../images/button_inactive_bg.png') repeat-x;
                            border-right:1px solid #dddddd;
                        }
                        li#info ul.popup_menu li.popup_container .button>span.bactive{
                            background: url('../images/button_active_bg.png') repeat-x;
                        }
                        li#info ul.popup_menu li.popup_container .button>span:first-child {
                            -webkit-border-top-left-radius: 5px;
                            -webkit-border-bottom-left-radius: 5px;
                            -moz-border-radius-topleft: 5px;
                            -moz-border-radius-bottomleft: 5px;
                            border-top-left-radius: 5px;
                            border-bottom-left-radius: 5px;
                        }
                        li#info ul.popup_menu li.popup_container .button>span:last-child {
                            -webkit-border-top-right-radius: 5px;
                            -webkit-border-bottom-right-radius: 5px;
                            -moz-border-radius-topright: 5px;
                            -moz-border-radius-bottomright: 5px;
                            border-top-right-radius: 5px;
                            border-bottom-right-radius: 5px;
                        }

                        li#info ul.popup_menu li.popup_container > ul {
                            color: #333;
                            height: auto;
                            font-size: 12px;
                            overflow: hidden;
                            text-align: left;
                        }
                        li#info ul.popup_menu li.popup_container > ul li {
                            background: none;
                            display: none;
                            float: left;
                            width: auto;
                            height: 100%;
                            margin-bottom:10px;
                            text-align: justify;
                        }
                            li#info ul.popup_menu li.popup_container > ul > li.pactive {
                                display: block;
                                font-size: 9.5px;
                                font-weight: normal;
                            }
                            li#info ul.popup_menu li.popup_container > ul > li > div {
                                clear: both;
                            }
                            li#info ul.popup_menu li.popup_container > ul > li>div>b {
                                font-size: 10px;
                                font-weight: bold;
                            }
                            li#info ul.popup_menu li.popup_container > ul > li>div a, .lighted {
                                color:#1B9BFF;
                                text-decoration: none;
                            }
                            li#info ul.popup_menu li.popup_container > ul > li>div , .blacked {
                                color:#000;
                                text-decoration: none;
                            }
                            li#info ul.popup_menu li.popup_container > ul > li > div > img{
                                display: inline-block; margin-right:10px;
                                float: left;
                            }
                            li#info ul.popup_menu li.popup_container > ul > li > div > span {
                                display: inline-block; width: 60%;
                            }
            .main_container .game_menu_container ul.icons li.time {
                background: none;
                width: 120px;
                margin-left: -12px;
            }
            .main_container .game_menu_container  ul.icons li span#time{
                width:100%;
                line-height: 30px;
                color: #929292;
                display:inline-block;
                text-align: left;
                font-size: 16px;
                font-weight: bold;
                vertical-align: text-top;
            }
        .main_container .game_menu_container .credits {
            width:100%;
            height: 16px;
            margin: 0;
            text-align: left;
            font-size: 11px;
            padding-top: 4px;
            font-weight: bold;
            color: #444444;
             position: relative;
             left: 35px;
        }
    /*game board container*/
       .main_container .container {
          height: 545px;
          display: block;
          margin: 5px auto 5px auto;
          position:relative;
          WIDTH: 732px;
    }
    /*black overlay when puzzle loads*/
    #black_overlay {
        position: fixed;
        top: 0px;
        left: 0px;
        height: 100%;
        width: 100%;
        background-color: #000;
        z-index: 100;
    }
    .overlay {
        display: none;
        opacity: 0;
    }
    /*popup to choose puzzle mode in overlay*/
    .popup {
        background: #ffffff url('../images/bg_pattern.png');
            width: 350px;
             height:250px;
             position: absolute;
             margin: auto;  
              position: absolute;
              left:0;
              right: 0;
              top: 0;
              bottom: 0;
             z-index: 200;
             -webkit-border-radius: 10px;
             -moz-border-radius: 10px;
             border-radius: 10px;
             display: none;
             opacity: 0;
    }
    .congrats {
         background: #ffffff url('../images/bg_pattern.png');
         width: 350px;
         -webkit-transform: translate3d(-50%, -50%,0);
         -moz-transform: translate3d(-50%, -50%,0);
         -ms-transform: translate3d(-50%, -50%,0);
         -o-transform: translate3d(-50%, -50%,0);

              transform: translate3d(-50%, -50%,0);
              position: absolute;
              margin: auto;  
               position: absolute;
               left:50%;
               top: 50%;
              z-index: 200;
              -webkit-border-radius: 10px;
              -moz-border-radius: 10px;
              border-radius: 10px;
              display: none;
              opacity: 0;
        padding-bottom: 10px;
    }
        .congrats div{
                                   width: 100%;
                                   line-height: 28px;
                                   margin: 0 15px;
                                   display: inline-block;
                                   font-size: 16px;
                               }
            .congrats div span:first-child {
                display: inline-block;
                width: 60%;
                float: left;
                text-align: right;
            }
            .congrats div span:last-child {
                width: 30%;
                display: inline-block;
                margin-left: 10px;
                text-align: left;
            }
            .congrats div.play_again {
                width: 300px;
                margin: 10px 0 0 25px;
                -webkit-border-radius: 10px;
                -moz-border-radius: 10px;
                border-radius: 10px;
                background: url('../images/play_again.png');
                text-align: center;
                color: #ffffff;
                font-weight: bold;
                line-height: 42px;
                font-size: 20px;
                cursor: pointer;
            }
        .congrats div:first-child{
            line-height: 50px;
            width: 100%;
            margin: 20px auto 5px auto;
            font-size: 20px;
            text-transform: capitalize;
            border:0px solid green;
        }
    /*title for choosin mode in popup displayed inside black overlay*/
        .congrats .popup_title, .popup .popup_title {
            text-align: center;
            font-weight: bold;
            margin: 13px 0 10px 0;
            font-size: 17px;
            color: #009cff;
            text-transform: uppercase;
        }
        .popup .popup_buttons {
            background: url('../images/popup_mode_bg.png');
            display: block;
            width: 189px;
            margin: 10px 0;
            height: 37px;
            line-height: 37px;
            font-size: 12px;
            font-weight: bold;
            text-align: center;
            margin: 20px auto 15px auto;
            cursor: pointer;
        }
            .popup .popup_buttons .active {
                background: url('../images/popup_regular_bg.png') no-repeat;
                background-position: -93px 0px;
                width: 78px;
                height: 37px;
                float: left;
                padding-left: 16px;
            }
           .popup .popup_buttons .inactive {
                background: url('../images/popup_regular_bg.png') no-repeat;
                background-position: -93px 0px;
                width: 78px;
                height: 37px;
                float: left;
                padding-left: 16px;
            }
        .popup p {
            width: 130px;
            float: left;
            margin: 10px 20px;
            text-align: left;
            font-size: 13px;
        }
    /*class with 5pixel top radius*/
    .roundedtop {
        -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px;
        -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px;
        border-top-left-radius: 5px; border-top-right-radius: 5px;
    }
    /*class with 5pixel bottom radius*/
    .roundedbottom {
        -webkit-border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px;
        -moz-border-radius-bottomleft: 5px; -moz-border-radius-bottomright: 5px;
        border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;
    }
    .right {
        float: right;
    }
    .left#left {
        float: left;
    }
    #acr {
    }
    #clock_toggle {
        display: none !important;
    }
    #alert {
      background: #ffffff url('../images/bg_pattern.png');
         width: 350px;
          height:250px;
          position: absolute;
          margin: auto;  
           position: absolute;
           left:0;
           right: 0;
           top: 0;
           bottom: 0;
          z-index: 200;
          -webkit-border-radius: 10px;
          -moz-border-radius: 10px;
          border-radius: 10px;
          display: none;
          opacity: 0;
    }
    #alert>div {
        padding: 20px 20px;
        margin: 0 auto;
        display: block;
        font-weight: bold;
        text-align: center;
        color: #333333;
        font-size: 20px;
        margin: 0 auto;
    }
    
    #alert > div > div > input {
       width: 37%;
       display: inline-block;
       zoom: 1;
       vertical-align: baseline;
       margin: 0 2px;
       outline: none;
       cursor: pointer;
       text-align: center;
       text-decoration: none;
       padding: .5em 2em .55em;
       /* text-shadow: 0 1px 1px rgba(0, 0, 0, .3); */
       -webkit-border-radius: .5em;
       -moz-border-radius: .5em;
       border-radius: .5em;
       -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
       -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
       box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
       background: -moz-linear-gradient(19% 75% 90deg, #E0E0E0, #FAFAFA);
       background: -webkit-gradient(linear, left top, left bottom, from(#FAFAFA), to(#E0E0E0));
       border: 1px solid rgba(0, 0, 0, 0.2);
       cursor: pointer;
       font-weight: 700;
       font-size: 18px;
    }
	#alert > div > div > span {
		display:none;
	}
	 .mobile-only {display:none;}
}
@media only screen and (min-width : 768px) and (max-width : 1024px) {
							 li#info ul.popup_menu li.popup_container > ul > li>div>b {
                                font-size: 12px;
                                font-weight: bold;

                            }

 							li#info ul.popup_menu li.popup_container > ul > li.pactive {
                                display: block;
                                font-size: 13px;
                                font-weight: normal;
								width:380px;
								height:450px;
								overflow:scroll;
								padding-right:15px
                            }

}


@media only screen and (max-width : 730px) {
  /*global handlers for responsive behavior at this viewport*/
  .tablet-only, .desktop-only {display:none;}
  .mobile-only {display:block;}
    .main_container .container {
        height: 545px;
        display: block;
        margin: 5px auto 5px auto;
        position:relative;
        WIDTH: 100%;
  }
  img.mobile-only {width:101%;margin-bottom: 8px;display:inline-block;}
  /* Let's get this party started */
    ::-webkit-scrollbar {
        width: 5px;
        height: 5px;
    }

    /* Track */
    ::-webkit-scrollbar-track {
        -webkit-box-shadow: none; 
        -webkit-border-radius: 10px;
        border-radius: 10px;
    }

    /* Handle */
    ::-webkit-scrollbar-thumb {
        -webkit-border-radius: 10px;
        border-radius: 10px;
        background-color: rgba(0,0,0,0.5); 
        -webkit-box-shadow: inset 0 0 0px rgba(0,0,0,0.3); 
    }
    ::-webkit-scrollbar-thumb:window-inactive {
	    background: none; 
    }
						 /*style for body*/
              body {
          	    width: 100%; height: auto; margin: 0 auto;
                  background: #ffffff url('../images/bg_pattern.png');
                  display: block;
          		-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
          		overflow:visible!important;
              }
              input {
                  -webkit-appearance: none;
                  -webkit-border-radius: 0px;
          		    -webkit-overflow-scrolling: touch;
                  border-radius: 0px;
              }
              hr {
                  height: 1px;
                  width: 250px;
                  margin:5px 20px;
                  border-bottom: 1px dotted #aaa;
              }
              .toggle_button_off {
                  background: url('../images/button_on.png');
                  background-size: 100%;
                  width: 20px;
                  height: 18px;
                  display: inline-block;
              }
              .toggle_button_on {
                  background: url('../images/button_off.png');
                  background-size: 100%;
                  width: 20px;
                  height: 18px;
                  display: inline-block;
              }
              /*game board header*/
              .top_wrap, .header {
                  height: 35px;
                  background: #cfcfcf url('../images/header_bg.png') repeat-x;
                  width:100%;
              }
                  .top_wrap div ,  .header div {
                      height: 15px;
                      padding: 10px;
                      font-size: 12px;
                      /*text-shadow: 1px 1px 3px #ffffff;*/
                      font-weight: bold;
                      text-transform: uppercase;
                      display: inline-block;
                      overflow: hidden;
                  }
                  /*class for displaying game name in header*/
                  .top_wrap .game_name, .header .game_name {
                      width: auto;
                      float: left;
                      text-align: left;
                      min-width: 35%;
                      font-size: 20px;
                  }
                  .top_wrap .ajaxloader {
                      height: 15px;
                      width: 128px;
                      display: none;
                      /*background: url('../images/299.gif') no-repeat;*/
                      background-position: center center;
                      float: left;
                  }
                    .top_wrap .date, .header .date  {
                      width: 41%;
                      float: right;
                      text-align: right;
											padding-left:0px;
                  }
              .main_container {
                  width:100%;
                  margin:0px;
                  display: block;
                  height: 668px;
            
              }
              /*class for displaying game menu*/
              .main_container .game_menu_container {
                  width: 100%;
                  height: 77px;
                  margin-bottom: 10px;
                  font-weight: bold;
              }
                  .main_container .game_menu_container>div {
                      width: 100%;
                      display: inline-block;

                  }
                  .main_container .game_menu_container .game_menu {
                      height: 29px;
                      text-align: right;
                      font-weight: bold;
                      padding: 10px 0 4px 0;
                      border-bottom: 1px solid #CCC;
                      display: inline;
                      float: none;

                      /*-webkit-touch-callout: none;
                      -webkit-user-select: none;
                      -khtml-user-select: none;
                      -moz-user-select: none;
                      -ms-user-select: none;
                      user-select: none;*/
                  }
                      .main_container .game_menu_container .game_title {
                          width: 100%;
                          height: 25px;
                          margin: 0px;
                          float: none;
                          text-align: left;
                          font-size: 20px;
                          overflow: hidden;
                          text-transform: capitalize;
                          padding: 6px 11px 0px 11px;
                      }
                      /*hide in favor of slider menu*/
                      .main_container .game_menu_container .game_menu ul.icons li {
                       
                          width: 32px;

                      }
                      /*background for each individual menu items through image sprites*/
                      li#play{
                          background-position: 0 -1413px;
                          margin-right: 0px;
                      }
                      li#play.tactive{
                          background-position: 0 -1571px;
                          margin-right: 0px;
                      }
                      li#print{
                          /*display:none;*/
                      }
                      li#print.iactive{
                          background-position : 0 -1877px;
                      }
                      li#print ul.popup_menu {
                              width: 125px;
                              display: none;
                              top: 29px;
                              left: -70px;
                              position: relative;
                              z-index: 100;
                          }
                              li#print ul.popup_menu li.popup_arrow {
          	                    width: 200%;
                                  height: 10px;
                                  position: absolute;
                                  left: 68px;
          	                    background: url('../images/menu_popup_header@1x.png') no-repeat;
                                  z-index:102;
                              }
                              li#print ul.popup_menu li.popup_container {
                                  width: 114px;
                                  height: 95px;
                                  padding:8px 5px 0px 6px;
                                  margin-top:9px;
          	                    float: left;
          	                    background: #ffffff url('../images/bg_pattern.png');
                                  border:1px solid #cccccc;
                                  z-index:100;
                                  box-shadow: 2px 2px 19px #aaa;
                                  -o-box-shadow: 2px 2px 19px #aaa;
                                  -webkit-box-shadow: 2px 2px 19px #aaa;
                                  -moz-box-shadow: 2px 2px 19px #aaa;
                                  -webkit-border-radius: 10px;
                                  -moz-border-radius: 10px;
                                  border-radius: 10px;
                              }
                                  /*li#print ul.popup_menu li.popup_container .button_print {
                                      background: url('../images/sprite@1x.png');
                                      background-position: 0 -1729px; width: 127px; height: 19px;
                                  }*/
                                  li#print ul.popup_menu li.popup_container .sub_menu {
                                      width: 110px;
                                      font-size: 12px;
                                      text-align:left;
                                      display: block;
                                  }
                                      /*li#print ul.popup_menu li.popup_container .sub_menu span.check {
                                          background: url('../images/sprite@1x.png');
                                          background-position: 0 -635px;
                                          width: 12px;
                                          height: 12px;
                                          display:inline-block;
                                      }
                                      li#print ul.popup_menu li.popup_container .sub_menu span.cactive {
                                          background: url('../images/sprite@1x.png');
                                          background-position: 0 -697px;
                                          width: 12px;
                                          height: 12px;
                                          display:inline-block;
                                      }*/
                                      li#print ul.popup_menu li.popup_container .sub_menu span.text {
                                          width: 90px;
                                          padding-left: 10px;
                                          line-height: 30px;
                                          display: inline-block;
                                          font-size: 11px;
                                          font-weight: bold;
                                          margin: 0;
                                          color: #666666;
                                          /*border-bottom: 1px solid #dddddd;*/
                                          /*text-shadow: 1px 0px #cccccc;*/
                                      }
                      li#hint{
                          background-position: 0 -969px;
                      }
                      li#hint.iactive{
                          background-position: 0 -1048px;
                      }
                          li#hint ul.popup_menu {
                              width: 176px;
                              display: none;
                              top: 29px;
                              left: -80px;
                              position: relative;
                              z-index: 100;
                          }
                              li#hint ul.popup_menu li.popup_arrow {
          	                    width: 200%;
                                  height: 10px;
                                  left:78px;
                                  position: absolute;
          	                    background: url('../images/menu_popup_header@1x.png') no-repeat;
                                  z-index:102;
                              }
                              li#hint ul.popup_menu li.popup_container {
                                  width: 160px;
                                  height: auto;
                                  padding:8px;
                                  margin-top:9px;
          	                    float: right;
          	                    background: #ffffff url('../images/bg_pattern.png');
                                  border:1px solid #cccccc;
                                  z-index:100;
                                  box-shadow: 2px 2px 19px #aaa;
                                  -o-box-shadow: 2px 2px 19px #aaa;
                                  -webkit-box-shadow: 2px 2px 19px #aaa;
                                  -moz-box-shadow: 2px 2px 19px #aaa;
                                  -webkit-border-radius: 10px;
                                  -moz-border-radius: 10px;
                                  border-radius: 10px;
                              }
                                  li#hint ul.popup_menu li.popup_container .mode {
                                      background: url('../images/mode_bg.png');
                                      width: 154px;
                                      height: 32px;
                                      margin: 0 auto;
                                  }
                                  li#hint ul.popup_menu li.popup_container .mode.mactive {
                                      background: url('../images/mode_expert_bg.png');
                                  }
                                      li#hint ul.popup_menu li.popup_container .mode > span {
                                          width: 70px;
                                          line-height: 32px;
                                          display: inline-block;
                                          float: left;
                                          font-size: 12px;
                                          font-weight: bold;
                                      }
                                  li#hint ul.popup_menu li.popup_container .sub_menu {
                                      width: 154px;
                                      line-height: 32px;
                                      margin: 0 auto;
                                      font-size: 11px;
                                      text-align: left;
                                      color: #666;
                                      /*text-shadow: 1px 0px #CCC;*/
                                      /*border-bottom: 1px ridge #DDD;*/
                                      font-weight: bold;
                                  }
                                      li#hint ul.popup_menu li.popup_container .sub_menu span {
                                          vertical-align: middle;
                                      }
                                      li#hint ul.popup_menu li.popup_container .sub_menu:last-child {
                                          border: none;
                                      }
                      li#setting{
                          background-position: -550px -69px;
                      }
                      li#setting.iactive{
                          background-position: -550px -148px;
                      }
                          li#setting ul.popup_menu {
                              width: 213px;
                              /*height: 148px;*/
                              overflow: hidden;
                              display: none;
                              top: 29px;
                              left: -100px;
                              position: relative;
                              z-index: 100;
                          }
                              li#setting ul.popup_menu li.popup_arrow {
                                  width: 200%;
                                  height: 10px;
                                  left: 98px;
                                  position:absolute;
                                  background: url('../images/menu_popup_header@1x.png') no-repeat;
                                  z-index: 102;
                              }
                              li#setting ul.popup_menu li.popup_container {
                                  width: 168px;
                                  height: auto;
                                  padding: 8px;
                                  margin: 9px 17px 13px 20px;
          	                    float: right;
          	                    background: #ffffff url('../images/bg_pattern.png');
                                  border:1px solid #cccccc;
                                  z-index:100;
                                  box-shadow: 2px 2px 19px #aaa;
                                  -o-box-shadow: 2px 2px 19px #aaa;
                                  -webkit-box-shadow: 2px 2px 19px #aaa;
                                  -moz-box-shadow: 2px 2px 19px #aaa;
                                  -webkit-border-radius: 10px;
                                  -moz-border-radius: 10px;
                                  border-radius: 10px;
                              }
                                  li#setting ul.popup_menu li.popup_container .button_reset {
                                      background: url('../images/blue_stripe.png');
                                      background-position: -550px 0;
                                      line-height: 26px;
                                      margin:10px auto 0 auto;
                                      -webkit-border-radius: 10px;
                                      -moz-border-radius: 10px;
                                      border-radius: 10px;
                                      color: #ffffff;
                                      text-align: center;
                                      font-size: 12px;
                                      font-weight: bold;
                                  }
                                  li#setting ul.popup_menu li.popup_container .sub_menu {
                                      width: 174px;
                                      padding: 5px 0;
                                      font-size: 12px;
                                      text-align:left;
                                      display: block;
                                      /*border-bottom: 1px ridge #dddddd;*/
                                  }
                                      #show_mistakes_toggle {
                                          border-bottom: 0px ridge #dddddd !important;
                                      }
                                      li#setting ul.popup_menu li.popup_container .sub_menu span.text {
                                          display: inline-block;
                                          font-size: 11px;
                                          font-weight: bold;
                                          line-height: 20px;
                                          margin: 0;
                                          color: #666666;
                                          vertical-align: top;
                                      }
                      li#calendar{
                          background-position: 0 -261px;
                      }
                      li#calendar.iactive{
                          background-position: 0 -340px;
                      }
                          li#calendar ul.popup_menu {
                              width: 410px;
                              height: auto;
                              display: none;
                              top: 29px;
                              left: -340px;
                              position: relative;
                              z-index: 100;
                          }
                              li#calendar ul.popup_menu li.popup_arrow {
                                  width: 200%;
                                  height: 10px;
                                  left: 338px;
                                  background: url('../images/menu_popup_header@1x.png') no-repeat;
                                  z-index: 102;
                                  position: absolute;
                              }
                              li#calendar ul.popup_menu li.popup_container {
                                  width: 63%;
                                  height: auto;
                                  padding:8px 12px 8px 12px;
                                  margin-top:9px;
          	                    float: right;
          	                    background: #ffffff url('../images/bg_pattern.png');
                                  border:1px solid #cccccc;
                                  z-index:100;
                                  box-shadow: 2px 2px 19px #aaa;
                                  -o-box-shadow: 2px 2px 19px #aaa;
                                  -webkit-box-shadow: 2px 2px 19px #aaa;
                                  -moz-box-shadow: 2px 2px 19px #aaa;
                                  -webkit-border-radius: 10px;
                                  -moz-border-radius: 10px;
                                  border-radius: 10px;
                              }
                                  li#calendar ul.popup_menu li.popup_container .title {
                                      width: 100%;
                                      font-size:14px;
                                      font-weight:bold;
                                      text-decoration: uppercase;
                                      text-align: center;
                                  }
                                  li#calendar ul.popup_menu li.popup_container .button {
                                      width: 100%;
                                      height:27px;
                                      margin: 5px 0 10px 0;
                                  }
                                  li#calendar ul.popup_menu li.popup_container .button>span:first-child {
                                      -webkit-border-top-left-radius: 5px;
                                      -webkit-border-bottom-left-radius: 5px;
                                      -moz-border-radius-topleft: 5px;
                                      -moz-border-radius-bottomleft: 5px;
                                      border-top-left-radius: 5px;
                                      border-bottom-left-radius: 5px;

                                  }
                                  li#calendar ul.popup_menu li.popup_container .button>span:last-child {
                                      -webkit-border-top-right-radius: 5px;
                                      -webkit-border-bottom-right-radius: 5px;
                                      -moz-border-radius-topright: 5px;
                                      -moz-border-radius-bottomright: 5px;
                                      border-top-right-radius: 5px;
                                      border-bottom-right-radius: 5px;
                                  }
                                  li#calendar ul.popup_menu li.popup_container .button>span{
                                      width: 84px;
                                      display: inline-block;
                                      float: left;
                                      font-size: 11px;
                                      line-height: 27px;
                                      text-align: center;
                                      background: url('../images/button_inactive_bg.png') repeat-x;
                                      border-right:1px solid #dddddd;
                                  }
                                  li#calendar ul.popup_menu li.popup_container .button>span.bactive{
                                      background: url('../images/button_active_bg.png') repeat-x;
                                  }
                                  li#calendar ul.popup_menu li.popup_container .puzzles_header {
                                      width: 396px;
                                      height:15px;
                                      margin: 0 10px 0 0;
                                  }
                                  li#calendar ul.popup_menu li.popup_container .puzzles_header>span{
                                      display:inline-block;
                                      line-height:18px;
                                      float: left;
                                      font-size:12px;
                                      font-weight: normal;
                                      padding:0 5px;
                                      text-align:left;
                                      border-right: 1px inset #DDDDDD;
                                      border-bottom: 1px inset #DDDDDD;
                                  }
                                      li#calendar ul.popup_menu li.popup_container .puzzles_header > span:first-child {
                                          padding: 0px;
                                      }
                                      li#calendar ul.popup_menu li.popup_container .puzzles_header > span:last-child {
                                          border-right: none;
                                      }
                                      li#calendar ul.popup_menu li.popup_container .puzzles_header span.name {
                                          width: 180px;
                                      }
                                      li#calendar ul.popup_menu li.popup_container .puzzles_header span.perc {
                                          width: 70px;
                                      }
                                      li#calendar ul.popup_menu li.popup_container .puzzles_header span.spent {
                                          width: 88px;
                                          padding-left: 16px;
                                      }
                                  li#calendar ul.popup_menu li.popup_container .other_games {
                                      width: 388px;
                                      height: 288px;
                                      margin: auto;
                                      overflow-y: scroll;
                                  }
                                      li#calendar ul.popup_menu li.popup_container .other_games div {
                                          height: 40px;
                                      }
                                          li#calendar ul.popup_menu li.popup_container .other_games div.cur_puz>span.name>span:first-child{
                                              color: #1da1ff;
                                          }
                                      li#calendar ul.popup_menu li.popup_container .other_games div>span{
                                          display: inline-block;
                                          line-height: 40px;
                                          float: left;
                                          text-align: left;
                                          border-bottom: 1px inset #DDDDDD;
                                          font-size: 10px;
                                          overflow:hidden;
                                      }
                                          li#calendar ul.popup_menu li.popup_container .other_games div span.name {
                                              width: 178px;
                                              height: 35px;
                                              line-height: 15px;
                                              font-size: 14px;
                                              padding: 5px 2px 0 0;
                                              text-overflow: ellipsis;
                                              text-transform: capitalize;
                                          }
                                          li#calendar ul.popup_menu li.popup_container .other_games div span.name > span {
                                              line-height: 16px;
                                              text-overflow: ellipsis;
                                              width: 100%;
                                              display: block;
                                              white-space: nowrap;
                                              overflow: hidden;
                                              text-transform: capitalize;
                                          }
                                              li#calendar ul.popup_menu li.popup_container .other_games div span.name .game_date {
                                                  display: block;
                                                  color: #666666;
                                                  font-size: 10px;
                                              }
                                          li#calendar ul.popup_menu li.popup_container .other_games div span.perc {
                                              width: 82px;
                                              font-size: 11px;
                                              background: #eeeeee;
                                              text-align: center;
                                          }
                                          li#calendar ul.popup_menu li.popup_container .other_games div span.time_spent {
                                              width: 107px;
                                              font-size: 11px;
                                              text-align: center;
                                          }
                      li#info{
                          background-position: 0 -1127px;
                      }
                      li#info.iactive{
                          background-position: 0 -1206px;
                      }
                          li#info ul.popup_menu {
                              width: 415px;
                              height: 322px;
                              display: none;
                              top: 29px;
                              left: -379px;
                              position: relative;
                              z-index: 100;
                          }
                              li#info ul.popup_menu li.popup_arrow {
                                  width: 200%;
                                  height: 10px;
                                  left: 378px;
                                  background: url('../images/menu_popup_header@1x.png') no-repeat;
                                  z-index: 102;
                                  position: absolute;
                              }
                              li#info ul.popup_menu>li.popup_container {
                                  width: 69%;
                                  height: auto;
                                  padding:8px 5px 8px 5px;
                                  margin-top:9px;
          	                    float: right;
          	                    background: url('../images/bg_pattern.png');
                                  border:1px solid #cccccc;
                                  z-index:100;
                                  box-shadow: 2px 2px 19px #aaa;
                                  -o-box-shadow: 2px 2px 19px #aaa;
                                  -webkit-box-shadow: 2px 2px 19px #aaa;
                                  -moz-box-shadow: 2px 2px 19px #aaa;
                                  -webkit-border-radius: 10px;
                                  -moz-border-radius: 10px;
                                  border-radius: 10px;
                              }
                                  li#info ul.popup_menu li.popup_container .title {
                                      width: 100%;
                                      font-size:14px;
                                      font-weight:bold;
                                      text-decoration: uppercase;
                                      text-align: center;
                                  }
                                  li#info ul.popup_menu li.popup_container .button {
                                      width: 100%;
                                      height:25px;
                                      margin: 5px 0 10px 0;
                                  }
                                  li#info ul.popup_menu li.popup_container .button>span{
                                    width: 93px;
                                      display: inline-block;
                                      float: left;
                                      font-size: 11px;
                                      line-height: 27px;
                                      text-align: center;
                                      background: url('../images/button_inactive_bg.png') repeat-x;
                                      border-right:1px solid #dddddd;
                                  }
                                  li#info ul.popup_menu li.popup_container .button>span.bactive{
                                      background: url('../images/button_active_bg.png') repeat-x;
                                  }
                                  li#info ul.popup_menu li.popup_container .button>span:first-child {
                                      -webkit-border-top-left-radius: 5px;
                                      -webkit-border-bottom-left-radius: 5px;
                                      -moz-border-radius-topleft: 5px;
                                      -moz-border-radius-bottomleft: 5px;
                                      border-top-left-radius: 5px;
                                      border-bottom-left-radius: 5px;
                                  }
                                  li#info ul.popup_menu li.popup_container .button>span:last-child {
                                      -webkit-border-top-right-radius: 5px;
                                      -webkit-border-bottom-right-radius: 5px;
                                      -moz-border-radius-topright: 5px;
                                      -moz-border-radius-bottomright: 5px;
                                      border-top-right-radius: 5px;
                                      border-bottom-right-radius: 5px;
                                  }

                                  li#info ul.popup_menu li.popup_container > ul {
                                      color: #333;
                                      height: auto;
                                      font-size: 12px;
                                      overflow: hidden;
                                      text-align: left;
                                  }
                                  li#info ul.popup_menu li.popup_container > ul li {
                                      background: none;
                                      display: none;
                                      float: left;
                                      width: auto;
                                      height: 100%;
                                      margin-bottom:10px;
                                      text-align: justify;
                                  }
                                      li#info ul.popup_menu li.popup_container > ul > li.pactive {
                                          display: block;
                                          font-size: 9.5px;
                                          font-weight: normal;
                                      }
                                      li#info ul.popup_menu li.popup_container > ul > li > div {
                                          clear: both;
                                      }
                                      li#info ul.popup_menu li.popup_container > ul > li>div>b {
                                          font-size: 10px;
                                          font-weight: bold;
                                      }
                                      li#info ul.popup_menu li.popup_container > ul > li>div a, .lighted {
                                          color:#1FA7FF;
                                          text-decoration: none;
                                      }
                                      li#info ul.popup_menu li.popup_container > ul > li > div > img{
                                          display: inline-block; margin-right:10px;
                                          float: left;
                                      }
                                      li#info ul.popup_menu li.popup_container > ul > li > div > span {
                                          display: inline-block; width: 60%;
                                      }
                      .main_container .game_menu_container .game_menu ul.icons li.time {
                          background: none;
                          width: 65px;
                          margin-right: 30px;
                          display: inline;
                      }
                      .main_container .game_menu_container .game_menu ul.icons li span#time {
                      width: 100%;
                      line-height: 30px;
                      color: #1fa7ff ;
                      display: inline-block;
                      text-align: right; 
                      font-size: 16px;
                      font-weight: bold;
                      vertical-align: text-top;
                      }
                  .main_container .game_menu_container .credits {
                      width:100%;
                      height: 16px;
                      margin: 6px 0 0 0;
                      text-align: left;
                      font-size: 11px;
                      padding: 3px 6px 6px 11px;
                      font-weight: bold;
                      color: #444444;
                      /*text-shadow: 1px 1px 3px #ffffff;*/
                  }
              /*game board container*/
              .main_container .container {
                  height: 545px;
                  width: 100%;
                  display: block;
                  margin-top: 5px;
                  position:relative;
              }
              /*black overlay when puzzle loads*/
              #black_overlay {
                  position: fixed;
                  top: 0px;
                  left: 0px;
                  height: 100%;
                  width: 100%;
                  background-color: #000;
                  z-index: 100;
              }
              .overlay {
                  display: none;
                  opacity: 0;
              }
              /*popup to choose puzzle mode in overlay*/
              .popup {
               
                  width: 80%;
                 
              }
              .congrats {
                              
                               width: 80%;
                               
                          
                           }
                               .congrats div{
                                   width: 100%;
                                   line-height: 28px;
                                   margin: 0 5px;
                                   display: inline-block;
                                   font-size: 16px;
                               }
                                   .congrats div span:first-child {
                                       display: inline-block;
                                       width: 60%;
                                       float: left;
                                       text-align: right;
                                   }
                                   .congrats div span:last-child {
                                       width: 30%;
                                       display: inline-block;
                                       margin-left: 10px;
                                       text-align: left;
                                   }
                                   .congrats div.play_again {
                                       width: 85%;
                                       margin: 10px 0 0 25px;
                                       -webkit-border-radius: 10px;
                                       -moz-border-radius: 10px;
                                       border-radius: 10px;
                                       background: url('../images/play_again.png');
                                       text-align: center;
                                       color: #ffffff;
                                       font-weight: bold;
                                       line-height: 42px;
                                       font-size: 20px;
                                       cursor: pointer;
                                   }
                               .congrats div:first-child{
                                   line-height: 50px;
                                   width: 100%;
                                   margin: 20px auto 5px auto;
                                   font-size: 20px;
                                   text-transform: capitalize;
                                   border:0px solid green;
                               }
              /*title for choosin mode in popup displayed inside black overlay*/
                  .congrats .popup_title, .popup .popup_title {
                      text-align: center;
                      font-weight: bold;
                      margin: 13px 0 10px 0;
                      font-size: 17px;
                      color: #009cff;
                      text-transform: uppercase;
                  }
                  .popup .popup_buttons {
                      background: url('../images/popup_mode_bg.png');
                      display: block;
                      width: 189px;
                      margin: 10px 0;
                      height: 37px;
                      line-height: 37px;
                      font-size: 12px;
                      font-weight: bold;
                      text-align: center;
                      margin: 20px auto 15px auto;
                      cursor: pointer;
                  }
                      .popup .popup_buttons .active {
                          background: url('../images/popup_regular_bg.png') no-repeat;
                          background-position: -93px 0px;
                          width: 78px;
                          height: 37px;
                          float: left;
                          padding-left: 16px;
                      }
                     .popup .popup_buttons .inactive {
                          background: url('../images/popup_regular_bg.png') no-repeat;
                          background-position: -93px 0px;
                          width: 78px;
                          height: 37px;
                          float: left;
                          padding-left: 16px;
                      }
                  .popup p {
                     width: 90%;
                     float: left;
                     margin: 10px;
                     text-align: left;
                     font-size: 13px;
                     display: block;
                  }
              /*class with 5pixel top radius*/
              .roundedtop {
                  -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px;
                  -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px;
                  border-top-left-radius: 5px; border-top-right-radius: 5px;
              }
              /*class with 5pixel bottom radius*/
              .roundedbottom {
                  -webkit-border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px;
                  -moz-border-radius-bottomleft: 5px; -moz-border-radius-bottomright: 5px;
                  border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;
              }
              .main_container .container .right {
              height: 100%;
              width: 500px;
              margin: auto 0 auto 18px;
              display: inline;
              float: none;
              }
            .left#left{display:none;}

              #acr {
              }
              #clock_toggle {
                  display: none !important;
              }
              #alert {
                  width: 80%;
                 
              }
              #alert>div {
                  padding: 20px 20px;
                  margin: 0 auto;
                  display: block;
                  font-weight: bold;
                  text-align: center;
                  color: #333333;
                  font-size: 20px;
                  margin: 0 auto;
              }
              #alert > div > div > input {
                  width: 60%;
                  display: inline-block;
                  zoom: 1;
                  vertical-align: baseline;
                  margin: 5px 2px;
                  outline: none;
                  cursor: pointer;
                  text-align: center;
                  text-decoration: none;
                  padding: .5em 2em .55em;
                  /*text-shadow: 0 1px 1px rgba(0, 0, 0, .3);*/
                  -webkit-border-radius: .5em;
                  -moz-border-radius: .5em;
                  border-radius: .5em;
                  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
                  -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
                  box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
                  background: -moz-linear-gradient(19% 75% 90deg, #E0E0E0, #FAFAFA);
                  background: -webkit-gradient(linear, left top, left bottom, from(#FAFAFA), to(#E0E0E0));
                  border: 1px solid rgba(0, 0, 0, 0.2);
                  cursor: pointer;
                  font-weight: bold;
                  letter-spacing: 2px;
              }
          	#alert > div > div > span {
          		display:none;
          	}	 

}
@media only screen and (max-width : 480px) {
    .main_container .game_menu_container .game_menu ul.icons li {
        width: 30px;
    }
}


div#puzzle_date {
  position: relative;
  top: 2px;
  font-size: 11px;
  float: right;