/*
MagicPot Games
manukv
*/
/* For Background */
body,.ui-page { background: #272727;}

.ui-content{
    color:#FFF;
    text-shadow: none;
}

/* For avoiding page transition flicker */
.ui-page {
/*    -webkit-perspective: 1;*/
/*-webkit-backface-visibility: hidden;*/
    background: #feffd3 !important;
}

.lfloat{
    float:left;
}

.rfloat{
    float:right;
}

.ui-shadow,
.ui-btn-up-a,
.ui-btn-hover-a,
.ui-btn-down-a,
.ui-body-b,
.ui-btn-up-b,
.ui-btn-hover-b,
.ui-btn-down-b,
.ui-bar-c,
.ui-body-c,
.ui-btn-up-c,
.ui-btn-hover-c,
.ui-btn-down-c,
.ui-bar-c,
.ui-body-d,
.ui-btn-up-d,
.ui-btn-hover-d,
.ui-btn-down-d,
.ui-bar-d,
.ui-body-e,
.ui-btn-up-e,
.ui-btn-hover-e,
.ui-btn-down-e,
.ui-bar-e,
.ui-overlay-shadow,
.ui-shadow,
.ui-btn-active,
.ui-body-a,
.ui-bar-a {
    text-shadow: none;
    box-shadow: none;
    -webkit-box-shadow: none;
}

.clear{
    clear: both;
}


#logo{
    display: block;
    margin: 1em auto 0;
}

.myheader{
    padding-left: 6px;
}

.header-right{
    padding-top: 5px;
    margin-right: 10px;
}

.puzzlecontainer{
    margin: 0 auto;
    position: relative;
    border: 1px solid #000;
}

.puzzleoverlay{
    opacity: 0.3;
    position:absolute;
    background: #000;
    top:0;
    left:0;
}

.block.blank {
    visibility: hidden;
}


.block {
    position:absolute;
    border:1px solid #000;
    cursor: pointer;
    color: #FFF;
    font-weight: 600;
    text-shadow: 1px 1px 1px #000;
    
    /* Disables selections */
    -moz-user-select: -moz-none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
    user-select: none;
}

    /*.block:hover {
        cursor:pointer;
        border:1px solid #ff6a00;
    }
    
    .block.blank:hover {
        cursor:default;
        margin: 0px;
        border:1px solid #000;
    }*/












.scorespanel{
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 4px;
    padding-bottom: 0;
    float:left;
}

.scorespanel h6{
    margin-top: 2px;
    margin-bottom: 2px;
    margin-left: 10px;
}

.ui-btn-right a{
    float:left;
    margin-top: 5px;
}

.ui-btn-right a:first-child{
    margin-right: 5px;
}

#counter{
    /*float:right;*/
    margin-right: 20px;
}

#counter-number{
    /*color:#F00;*/
}

#timer{
    float:left;
}

#timer-minutes,#timer-seconds{
    /*color:#F00;*/
}

.bottom-left{
    float:left;
    padding-top: 5px;
}

.bottom-right{
    float:right;
}

.start-button{
    /*padding: 8px 12px;*/
    position: absolute;
}

.refreshbutton{
    display:none;
}


#movesshow, #timeshow{
    margin:5px;
    font-size: 2em;
}






.ui-simpledialog-container .ui-header,.red{
    /*border: 1px solid       #990000 {a-bar-border}*/;
    background-image: -webkit-gradient(linear, left top, left bottom, from( #73ab39 /*{a-bar-background-start}*/), to( #77a461 /*{a-bar-background-end}*/)); /* Saf4+, Chrome */
    background-image: -webkit-linear-gradient( #73ab39 /*{a-bar-background-start}*/, #77a461 /*{a-bar-background-end}*/); /* Chrome 10+, Saf5.1+ */
    background-image: -moz-linear-gradient( #73ab39 /*{a-bar-background-start}*/, #77a461 /*{a-bar-background-end}*/); /* FF3.6 */
    background-image: -ms-linear-gradient( #73ab39 /*{a-bar-background-start}*/, #77a461 /*{a-bar-background-end}*/); /* IE10 */
    background-image: -o-linear-gradient( #73ab39 /*{a-bar-background-start}*/, #77a461 /*{a-bar-background-end}*/); /* Opera 11.10+ */
    background-image: linear-gradient( #73ab39 /*{a-bar-background-start}*/, #77a461 /*{a-bar-background-end}*/);
}


.red.ui-btn-active{
    /*border: 1px solid       #990000 {a-bar-border}*/;
    background-image: -webkit-gradient(linear, left top, left bottom, from( #87025E /*{a-bar-background-start}*/), to( #CC0482 /*{a-bar-background-end}*/)); /* Saf4+, Chrome */
    background-image: -webkit-linear-gradient( #87025E /*{a-bar-background-start}*/, #CC0482 /*{a-bar-background-end}*/); /* Chrome 10+, Saf5.1+ */
    background-image: -moz-linear-gradient( #87025E /*{a-bar-background-start}*/, #CC0482 /*{a-bar-background-end}*/); /* FF3.6 */
    background-image: -ms-linear-gradient( #87025E /*{a-bar-background-start}*/, #CC0482 /*{a-bar-background-end}*/); /* IE10 */
    background-image: -o-linear-gradient( #87025E /*{a-bar-background-start}*/, #CC0482 /*{a-bar-background-end}*/); /* Opera 11.10+ */
    background-image: linear-gradient( #87025E /*{a-bar-background-start}*/, #CC0482 /*{a-bar-background-end}*/);
}


.ui-icon-menu {
    background-image: url('images/menuIcon.png') !important;
}

.pushdiv{
    width:100%;
}

p.dialg-content{
    text-align: center;
    color:#222 !important;
    padding: 8px;
}

.dialog-close-button{
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px !important;
}

.ui-simpledialog-screen{
    opacity: 0.5;
    background: #FFF;
}

.scorename{
    font-size: 16px;
}

.scoremoves{
    font-size: 12px;
    color:#999;
}

#hiddenlinktosubmit{
    float:right;
    width: 10px;
    height: 10px;
}






/* For hide numbers on tiles */
.hidenumbers{
    font-size: 0 !important;
    text-indent:-9999px;
}


/* For footer icons */

.footernavbar .ui-btn .ui-btn-inner { padding-top: 40px !important; }
.footernavbar .ui-btn .ui-icon { width: 30px!important; height: 30px!important; margin-left: -15px !important; box-shadow: none!important; -moz-box-shadow: none!important; -webkit-box-shadow: none!important; -webkit-border-radius: 0 !important; border-radius: 0 !important; }
#footerhomebtn .ui-icon { background:  url('../images/glyphish/53-house.png') 50% 50% no-repeat; background-size: 22px 22px; }
#footersettingsbtn .ui-icon { background:  url('../images/glyphish/19-gear.png') 50% 50% no-repeat; background-size: 26px 26px;  }
#footerscoresbtn .ui-icon { background:  url('../images/glyphish/85-trophy.png') 50% 50% no-repeat;  background-size: 24px 24px; }
#footerhelpbtn .ui-icon { background:  url('../images/glyphish/184-warning.png') 50% 50% no-repeat;  background-size: 24px 19px; }


/* For loading text */

.ui-loader-default h1{
    width: auto;
    height: auto;
    font-size: 12px;
    color:#FFF;
}

/* For footer banner */
.footerbanner{
    display: block;
    width: 100%;
    height:50px;
    background: url('../images/magicpot_ad.png') center center;
}
a.back-to-home-link {
    background: transparent;
    border: 0;
}
.back-to-home-link .ui-btn-inner {
padding: 0;
}

/*thank you message*/
.d-flex {
    display: -ms-flexbox;
    display: flex;
    align-items: center;
}
.thank-you-msg-block-outer {
    padding: 20px;
    min-height: 320px;
    position: relative;
    z-index: 3;
    background: #feffd3;
    display: none;
    width: 300px;
    margin: 18% auto 0 auto;
    font-family: arial, Helvetica, sans-serif;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    line-height: 20px;
}
.txt-large {
    font-size: 20px; color: #77a461; font-weight: bold; line-height: 22px;margin-bottom: 10px;display: block;
}
.thank-you-msg-block {
    text-align: center;
    margin: auto;
    font-weight: bolder;
    font-size: 16px; font-weight: normal; color: #333
}
.back-to-home-btn {
    display: table;
    margin: 20px auto;
    color: #FFFFFF;
    font-size: 14px;
    background-color: #f38131;
    padding: 10px 12px;
    text-decoration: none;
    font-weight: normal;
}
.social-media-icon {
    width: 40px;
    height: 40px;
    display: inline-block;
    cursor: pointer;
    background-image: url("../images/social.svg");
    background-size: 50px auto;
    background-repeat: no-repeat;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    margin: 5px;
}
.fb-clr {
    background-color: #2b44a0;
    background-position: -6px -5px;
}
.tw-clr {
    background-position: -4px -107px;
    background-color: #2caafe;
}
.wt-clr {
    background-position: -4px -159px;
    background-color: #13b345;
}
.share-score-block {
    text-align: center;
    max-width: 270px;
    margin: auto;
    background: #fff;
    padding: 15px;
    -moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
}
.share-icons-outer {
    text-align: center;
    margin: 15px 0 0 0;
}
.box-shadow {
    -webkit-box-shadow: 0px -1px 9px -1px rgb(110 110 110 / 17%);
    -moz-box-shadow: 0px -1px 9px -1px rgba(110, 110, 110, 0.17);
    box-shadow: 0px -1px 9px -1px rgb(110 110 110 / 17%);
}
.fb-clr:hover, .tw-clr:hover, .wt-clr:hover {
  filter: brightness(110%);
}


@media only screen and (min-width: 800px){
    .thank-you-msg-block-outer {
    margin: 12% auto 0 auto;
}
}
@media only screen and (min-width: 600px){
    .ui-input-text{
        width: 600px !important;
        margin: 0 auto !important;
        position: relative !important;
    }
}