@font-face {
    font-family: "BlackOpsOne";
    /*src: url("font/BlackOpsOne-Regular.ttf");*/
	src: url("font/opensans-condbold.ttf");
}


img {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
}

html, body{
    /*font-family: Impact, fantasy;*/
    font-family: "BlackOpsOne";
    /*font-size: larger;*/
}

body {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

canvas {

    background: #11e8bb; /* Old browsers */
    background: -moz-linear-gradient(top,  #11e8bb 0%, #8200c9 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #11e8bb 0%,#8200c9 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #11e8bb 0%,#8200c9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#11e8bb', endColorstr='#8200c9',GradientType=0 ); /* IE6-9 */

}

.special-word {
    color: red;
}

.button {
    display: block;
    width: 300px;
    margin: 0 auto;
    height: 50px;
    line-height: 45px;
    color: white;
    /*font-weight: bold;*/
    text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
    /*background-image: -webkit-linear-gradient(bottom, #95a2e4 0%, #0037d0 100%);*/
	
	background-image:url("textures/gui/btn.png");
    /*background-repeat:no-repeat;*/
	background-size: 100% 100%;
    
    text-align: center;
    text-decoration: solid;
    margin-left:-150px;
    font-size: larger;
}

.button:hover {
	/*background-image:url("textures/btn1d.png");
    background-color: #B30D5D;
    background-image: -webkit-linear-gradient(bottom, #B30D5D 0%, #FB1886 100%);
    background-image: linear-gradient(to bottom, #B30D5D 0%, #FB1886 100%);*/
}

.button:active {
	background-image:url("textures/gui/btn.png");
	box-shadow: 0 5px #666;
	transform: translateY(4px);
	/*background-color: #B30D5D;
	background-image: -webkit-linear-gradient(bottom, #B30D5D 0%, #FB1886 100%);
	background-image: linear-gradient(to bottom, #B30D5D 0%, #FB1886 100%);*/
}

.right {
    margin-left:0px;
}


.textline {
    text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

.boxshadow {
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 5px;
}

.textpadding {
    padding: 10px;
}

/* MENU MAIN */
#btn_play {
	position:absolute;
	bottom: 10%;
	left: 50%;
}

/* MENU EARN */
#btn_earn_video {
	position:absolute;
	bottom: 40%;
	left: 50%;
}

#btn_earn_friends {
	position:absolute;
	bottom: 25%;
	left: 50%;
}

#btn_earn_send {
	position:absolute;
	bottom: 10%;
	left: 50%;
}

#btn_earn_play {
	position:absolute;
	bottom: 10%;
	right: 3%;
}

/* END MENU */
#btn_end_continue {
	position:absolute;
	bottom: 10%;
	right: 3%;
}


/* END MENU */
#btn_send_ammo {
	position:absolute;
	bottom: 30%;
	left: 50%;
}

#btn_send_back {
	position:absolute;
	bottom: 10%;
	left: 50%;
}





/* ADS */



#btn_ad_yes {
	position:absolute;
	bottom: 10%;
	right: 10%;
}

#btn_ad_no {
	position:absolute;
	bottom: 10%;
	left: 10%;
}




#btn_playfriend {
	position:absolute;
	bottom: 40%;
	left: 50%;
}

#btn_skins {
	position:absolute;
	bottom: 30%;
	left: 50%;
}

#btn_settings {
	position:absolute;
	bottom: 20%;
	left: 50%;
}

#btn_highscore{
	position:absolute;
	bottom: 10%;
	left: 50%;
}

/* MENU END */
#btn_endplay {
	position:absolute;
	bottom: 50%;
	left: 50%;
}

#btn_endplayfriend {
	position:absolute;
	bottom: 40%;
	left: 50%;
}

#btn_mainmenu {
	position:absolute;
	bottom: 30%;
	left: 50%;
}

#btn_endshare {
	position:absolute;
	bottom: 10%;
	left: 50%;
}

#btn_continue {
	position:absolute;
	bottom: 60%;
	left: 50%;
}

#btn_nocontinue {
	position:absolute;
	bottom: 40%;
	left: 50%;
}

/* MENU SETTINGS */
#btn_settingsback {
	position:absolute;
	bottom: 20%;
	left: 50%;
}

/* MENU START MINI GAME */
#btn_mini_start {
	position:absolute;
	bottom: 30%;
	left: 50%;
}

/* MENU HIGHSCORE */
#btn_highscoreglobal {
	position:absolute;
	top: 10%;
	left: 70%;
	width: 120px;
	margin-left: auto;
	-ms-transform: translate(-50%, 0%);
	transform: translate(-50%, 0%);
}

#btn_highscorefriends {
	position:absolute;
	top: 10%;
	left: 30%;
	width: 120px;
	margin-left: auto;
	-ms-transform: translate(-50%, 0%);
	transform: translate(-50%, 0%);
}
/* MENU SKINS */
#btn_skinsleft {
	position:absolute;
	width: 50px;
	bottom: 50%;
	left: 5%;
	margin-left: auto;
	/*-ms-transform: translate(-50%, 0%);
	transform: translate(-50%, 0%);*/
}
#btn_skinsright {
	position:absolute;
	width: 50px;
	bottom: 50%;
	right: 5%;
	margin-left: auto;
	/*-ms-transform: translate(-50%, 0%);
	transform: translate(-50%, 0%);*/
}
#btn_skinsbuy {
	position:absolute;
	width: 100px;
	bottom: 20%;
	left: 50%;
	margin-left: auto;
	-ms-transform: translate(-50%, 0%);
	transform: translate(-50%, 0%);
}
#btn_skinsmainmenu {
	position:absolute;
	bottom: 10%;
	left: 50%;
	margin-left: auto;
	-ms-transform: translate(-50%, 0%);
	transform: translate(-50%, 0%);
}



/* MENU PAUSE */
#btn_pause_continue {
	position:absolute;
	bottom: 50%;
	left: 50%;
}

#btn_pause_menu {
	position:absolute;
	bottom: 20%;
	left: 50%;
}

/* MENU CONTINUE */
#btn_menu_continue {
	position:absolute;
	bottom: 50%;
	left: 50%;
}

/* MENU GIFT */
#btn_gift_share {
	position:absolute;
	bottom: 50%;
	left: 50%;
}

#btn_gift_video {
	position:absolute;
	bottom: 30%;
	left: 50%;
}

.background_menu{
    display: block;
    margin: 0 auto;
    position: absolute;
    top: 0%;
    left: 0%;
    height: 100%;
    width: 100%;
	background-color: rgba(1, 1, 1, 0.3);
}

.command_icon {
    display: block;
    margin: 0 auto;	
    position: absolute;
    bottom: 5%;
    height: 20%;
    /*width: 15%;*/
	pointer-events: none;
}

.avatar {
    display: block;
    margin: 0 auto;	
    position: absolute;
    top: 0px;
    left: 0px;
    height: 100px;
    width: 100px;	
}

.hand {
    display: block;
    margin: 0 auto;	
    position: absolute;
    top: 80%;
    left: 20%;
    height: 100px;
    width: 100px;	
}

.sound{
    display: block;
    margin: 0 auto;
    position: absolute;
    top: 30%;
    left: 50%;
    height: 100px;
    width: 100px;	
	-ms-transform: translate(-50%, 0%);  
	transform: translate(-50%, 0%);
}

.close{
    display: block;
    margin: 0 auto;
    position: absolute;
    height: 40px;
    width: 40px;	
	-ms-transform: translate(-50%, 0%);  
	transform: translate(-50%, 0%);
}

.diamond{
    display: block;
    margin: 0 auto;
    position: absolute;
    top: 1%;
    left: 40%;
    height: 30px;
    width: 30px;	
	-ms-transform: translate(-50%, 0%);  
	transform: translate(-50%, 0%);
}

.diamond_with_text{
    display: inline;
    height: 30px;
    width: 30px;	
}



.adimg{
    display: block;
    margin: 0 auto;
    position: absolute;
    top: 10%;
    left: 50%;
    height: 50%;
    /*width: 100px;	*/
	-ms-transform: translate(-50%, 0%);  
	transform: translate(-50%, 0%);
}



/* LOADING */
.loading_icon{
    display: block;
    margin: 0 auto;
    position: absolute;
    top: 10%;
    left: 50%;
    height: 30%;
	-ms-transform: translate(-50%, 0%);  
	transform: translate(-50%, 0%);
}

.background_loading{
    display: block;
    margin: 0 auto;
    position: absolute;
    top: 0%;
    left: 0%;
    height: 100%;
    width: 100%;
	background-color: rgba(1, 1, 1, 1.0);
}









.leaderboard__list {
    position: absolute;
    top: 17%;
    bottom: 5%;
    right: 10px;
    left: 10px;
    display: none;
    overflow: scroll;
    margin: 0;
    padding: 20px 12px;
    list-style: none;
    -webkit-overflow-scrolling: touch;
	/*background-image: url("textures/gui/btn.png");*/
	/*background: #fff;*/
}

.leaderboard__list__entry {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 10px
}

.leaderboard__list__entry+.leaderboard__list__entry {
    border-top: 1px solid #5a481a
}

.leaderboard__list__entry .entry-rank {
    position: absolute;
    top: 5px;
    left: 2px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    min-width: 20px;
    height: 20px;
    padding: 2px;
    background: #fff;
    font-size: 10px;
    /*font-weight: 700;
	letter-spacing: -1px;*/
    line-height: 1;
    border-radius: 10px;
	color: #000;
}

.leaderboard__list__entry .entry-avatar {
    display: inline-block;
    overflow: hidden;
    width: 45px;
    min-width: 45px;
    height: 45px;
    /*border-radius: 50%*/
}

.leaderboard__list__entry .entry-avatar img {
    width: 100%
}

.leaderboard__list__entry .entry-name {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow: hidden;
    padding-left: 10px;
    font-size: 16px;
    font-weight: 500;
    text-overflow: ellipsis;
    text-transform: uppercase
}

.leaderboard__list__entry .entry-score {
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase
}


/* HEALTH BAR PLAYER */
#HBP_player {
    display: inline-block;
    margin: 5px;
    border: solid 1px black;
 /*   width: 130px;
    height: 145px;*/
 
    width: 40%;
    height: 15px;
 
    image-rendering: pixelated;
    image-rendering: -webkit-optimize-contrast;
    /* Backup Image: http://i.imgur.com/2kyQPQD.png */
    /*background: url(https://scontent.fbeg2-1.fna.fbcdn.net/v/t1.0-9/283967_10150247913358650_5816731_n.jpg?_nc_cat=110&_nc_sid=85a577&_nc_ohc=--8txW_qHUwAX_o6x6L&_nc_ht=scontent.fbeg2-1.fna&oh=3390acc8dff5b8e968b836fc6bdb9896&oe=5EA05889),
       linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.8));
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center bottom;*/
    position: absolute;
    top: 0%;
    left: 30%;
}
  
.HBP_health {
    border-bottom: solid 1px black;
    position: relative;
    height: 15px;
    width: 100%;
    margin-bottom: 5px;
    /*background: linear-gradient(#ff9933, #b76d24);*/
    background: #FFFFFF;
}
 
.HBP_health .HBP_bar {
    position: absolute;
    left: 0;
    top: 0;
    height: inherit;
    width: 70%;
    background: rgb(0, 128, 0);
    transition: width 250ms, background 100ms;
}
 
.HBP_health .HBP_barafter{
    content: ' ';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    /*Isto kolko i player width*/
    width: 100%;
    height: 5px;
    background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.3));
    z-index: 1;
}



/* Joystick */
#joystick_wrapper {
	width: 100%;
	height: 100%;
}

.joystick_back {
	background-image: url("textures/joystick/joystick_out2.png");
	background-size: contain;
	height: 100px;
	user-select: none;
	width: 100px;
	left: 100px;
	bottom: 100px;
	position:absolute;
	-ms-transform: translate(-25%, 25%);
	transform: translate(-25%, 25%);
	animation: fadeOut ease 10s;
}

.joystick {
	background-image: url("textures/joystick/joystick_in2.png");
	background-size: contain;
	/*background-color: blue;
	border-radius: 100%;*/
	height: 50px;
	user-select: none;
	width: 50px;
	left: 100px;
	bottom: 100px;
	position:absolute;
}