
@font-face {
	/*For arabic OBS!!! finns enbart här*/
	font-family: 'KacstOne';
	src: url('../../fonts/embedfonts/arabic/KacstOne.eot');
	src: url('../../fonts/embedfonts/arabic/KacstOne.eot?#iefix') format('embedded-opentype'),
	url('../../fonts/embedfonts/arabic/KacstOne.woff') format('woff'),
	url('../../fonts/embedfonts/arabic/KacstOne.ttf') format('truetype'),
	url('../../fonts/embedfonts/arabic/KacstOne.svg#KacstOne') format('svg');
	font-weight: normal;
	font-style: normal;
}

a:link { color:#4286f4; text-decoration: none; font-synthesis-weight:none; /* font-weight funkar inte */}
a:visited { color:#4286f4; text-decoration: none; font-synthesis-weight:none;}
a:hover { color: red; text-decoration: none; font-synthesis-weight:none;}

.ui-content{
	width: 97%;
	position: relative; left:-10px; margin-left:auto; margin-right:auto;
}

/* För formatering av sökfältet */
.ui-input-search{background-color: #ffffff; color: #333333; border: 0; text-shadow: none;}
li img {width: 50px; height: 50px; position: relative; left: 0px; top: 10%; display: inline-list-item;}

/* formatera menyknapprna i v'nster listpanelen som innehåller ikoner*/
.ui-listview > .ui-li-has-thumb > .ui-btn, .ui-listview > .ui-li-static.ui-li-has-thumb {
    min-height: 3.625em;
    padding-left: 52px;/*Vänster marginal på listview texten alltså texten på menyknappen*/
   
   border: none;
    /*border-top: 2px solid white;
    border-bottom: 0px solid white;
    border-left: 2px solid white;
    border-right: 2px solid white;*/
}
/* vita ramen runt select-menyn i v'nster panelen */
.ui-body-b, .ui-page-theme-b .ui-body-inherit, html .ui-bar-b .ui-body-inherit,
html .ui-body-b .ui-body-inherit, html body .ui-group-theme-b .ui-body-inherit,
html .ui-panel-page-container-b{
	border: none; letter-spacing: 0px;
	/*	border-top: 2px solid white; border-bottom: 1px solid white; border-left: 2px solid white; border-right: 2px solid white;*/
}
/* Ramen runt sista posten i v'nster panel-listan */    
.ui-listview>.ui-li-static.ui-last-child, .ui-listview>.ui-li-divider.ui-last-child,
.ui-listview>li.ui-last-child>a.ui-btn {
	border: none; letter-spacing: 0px;
	/*border-top: 1px solid white; border-bottom: 2px solid white; border-left: 2px solid white; border-right: 2px solid white;
}


#randomIcon {
	/*border-radius: 50%;*/
  -webkit-transition: -webkit-transform .8s ease-in-out;
          transition:         transform .8s ease-in-out;
}
#randomIcon:hover {
  -webkit-transform: rotate(360deg);
   -moz-transform: rotate(360deg);
          transform: rotate(360deg);
}

.virtualKeybrd .ui-slider-switch,
.vibration .ui-slider-switch {
	
		width: 13em; margin-left:auto; margin-right:auto;
	
	}
 
body{
	/*margin-top:0.8em;/*ge plats f wordsfound */
	background-color:#F2F2F2;
	font-family: arial,verdana, sans-serif;
	/*font-size: 1.0em;*/
	color: #000; text-shadow: 1px 1px 0px #fff;
}

/*taggen finns i filen getword.cgi*/
.wordsfound{
	position:absolute; top:0.01em; left:45%; width:25%;
	font-size:0.80em;
	z-index:1;
	overflow:hidden;
	margin-left:auto; margin-right:auto;
	}

/* för att visa meddelande vid click på
** copyknappen eller virt.t-bord on/off */
#cpyMsg {
	position: fixed;
	top: 50%;
	left: 25%;
	width: 50%;
	height: 5%;
	font-size:1.3em;
	text-align: center;
	vertical-align: middle;
	display:none;
	background-color: #000;
	color:#fff;
	filter: alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
	padding: 5px;
	border-radius: 12px;
	z-index:20000;

}


	
/*ovanför svarta rubriken, där progressbar är placerad*/
.progbar{
	border:0; border-collapse: collapse;
	z-index:2;
	margin-left:auto; margin-right:auto;
}

.titleContainer{height: 28px; margin-left:auto; margin-right:auto;}
#headerEng{width: 100%; position: relative; top:-10px; color: white; font-size: 1.1em; }
#headerSy{ width: 100%; position: relative;	 margin: 0 auto; /*right: 30%; top: -2.65em;*/ top:-10px; color: white;  display: inline;}

#welcome{width:45%; position: absolute;left: 4%; top:50%; float: left; font-size: 1.5em; text-align:right;
		color: #bdbdbd; text-shadow: 1px 1px 0px #fff;}/* grå Engelska rubriken högst upp till höger*/
		
#welcomemiddleHeader{width:1%;  float: inherit; }

#welcomeSy{width:48%; position: absolute;	left:53%; top:47%; float:right; display: inline; text-align:left;
	color: #bdbdbd; text-shadow: 1px 1px 0px #fff;}/* grå Syriska rubriken högst upp till höger*/

/* Svarta sökrutan under svarta rubriken 
.seektable{
	position:relative; top:-0.3em; left:0em;
	margin-left:auto; margin-right:auto;
	padding-left:5px;
	padding-right:5px;
	
}	*/
.feedback{
	color:#fd8521;vertical-align:middle;
}
.syfeedback{
	text-align:right;
	direction:rtl;
	color:#fd8521;
	font-size:1.0em;
	font-weight:bold;
}

/*Hela divven Rubriksraden English, Swedish mm.*/
#langRubrik{
	position:relative; left:0; top:1.0em;
}
/*själva Rubriksraden English, Swedish mm.*/
.header2{
 	width:100%;
	border-collapse: collapse;
	color:#5e5d5c;
}



/*tabelrubrikerna*/
.vanster{
	width:24%;
	color:#2f2e2d;
	vertical-align:middle;
	text-align:left;
	padding-left:10px;
	font-size:.9em;
	position:relative; top:-20px;/*chrome*/
	background-color:#FFFFFF;
}

.hoger{
	width:24%;
	color:#2f2e2d;
	vertical-align:middle;
	text-align:right;
	padding-right:10px;
	font-size:.9em;
	position:relative; top:-20px; /*chrome*/
	background-color:#FFFFFF;
}
#wordBlock{position: relative; top: 0px;}
#trigger{
	position: relative; top: 0px;left:-45%;
	font-size:1.0em;
	color:#ac3603; font-weight:bold;
	font-family: arial,verdana, sans-serif;
}

#nr{
	/*position:relative; left:1%;top: 8px;
	font-size:0.50em; font-weight: bold; 
	color:#ac3603;*/
	height: 1.0em;font-size:1.0em; font-weight: bold; 
}
/*fixar radius på alla grafiska hörn*/
.ui-btn-corner-all,.ui-input-text-corner-all {
    -moz-border-radius:    .5em;
    -webkit-border-radius: .5em;
    border-radius:         .5em;
 }​
/*textfield och button*/
.ui-block-b {
    width: 97% !important;
    padding-top: 3px !important;
	
}
.ui-block-c, .ui-block-d {
    width: 4% !important; 
	
} /*ta inte bort */ /*på slutet påverkar höjden på sökfältet*/

.keyboardInput,#sy{/*input field*/
	width: 99% !important;
	font-size:1.32em;
	/*font-weight:bold; styckar upp texten och gör den konstig*/
	text-align:center;
	direction:rtl;
	transform: scale(1.3);
}
/*inputfaltet #sy*/
input.ui-input-text{/*det funkar inte med bara .keyboardInput, #sy*/
	width: 99% !important;
	font-size:1.32em;
	font-weight:bold;
	text-align:center;
	direction:rtl;
	}
/*Chrome renderar fonterna mindre än firefox  därför flyttas dessa ut fr Keybord.css hit*/
.keyboardInputInitiator {
  /*position:relative; left:11%;	top:0px;/*om bildikon finns*/
}
#keyboardInputMaster tbody tr td table tbody tr td,
#keyboardInputMaster div,
#keyboardInputMaster thead tr th div ol li{
	color: #000; text-shadow: 1px 1px 0px #fff;
}
#keyboardInputMaster.keyboardInputSize1 * {
	font-size:1.04em;
	color: #000; text-shadow: 1px 1px 0px #fff;
}
/**************Zommar hela t-bordet så det passr skärmbredden**************/
#keyboardInputMaster tbody tr td div {
 /*zoom:1.15;/*Tolkas olika i olika browsrar se vaje browsers css*/
}
/* De olika blocken posterna*/
.bbttaabbllee{ 
	position:relative; left:0px; top:5px; width:100%;
	border: 1px solid  	#D8D8D8;
	
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	background-color:#FFFFFF;
	margin-left: 0px; margin-right: 0px;
}
#blockTable{
	width: 99%;
	margin-left:auto; margin-right:auto;
}

.en,.sv{
	font-size:1.0em;
	width:24%;/*ta inte bort detta*/
	text-align:left;
	padding-left:3px;
	}
.ent,.svt{
	font-size:0.9em;
	text-align:left;
	padding-left:3px;
	}
 .sy, .syt,.ar, .art{
	/*font-family: Simplified Arabic;*/
	text-align:right;
	direction:rtl;
	width:24%;

}
.sy{
	font-size:1.40em;
}

.syt{
	font-size:1.30em;
}
.ar{
	font-family: 'KacstOne';
	font-size:1.0em;
}
.art{
			font-family: 'KacstOne';
			font-size:0.95em;
}

/* För bildtexter i tex wikilänk */
figcaption.syt, figcaption.art, figcaption.ent, figcaption.svt {
	font-size: 0.9em;
	vertical-align: top;
}

/* highligt sökbegrepp i resultat*/
#highlight {
	/* border-bottom:solid;
	border-bottom-width:1.5px;
	border-bottom-color:#fd8521; */
}


/*slogan i sidfoten */
.slogan{
	width:100%;
	text-align:center;
	position:relative;
	font-size:1.0em;
	color:#5e5d5c;
}

/*biege page foot */
.footer{
	padding:3px 3px 3px 3px;
	width:100%;
	text-align:center;
	font-size:0.8em; color: #bdbdbd;
	vertical-align:middle;
	letter-spacing: 0px;
}

a.mail, a.facebook, a.twitter, a.linkedin, a.share:link{color: gray; text-decoration: none;}
a.mail, a.facebook, a.twitter, a.linkedin, a.share:visitied{color: gray; text-decoration: none;}
a.mail, a.facebook, a.twitter, a.linkedin, a.share:hover{color: gray; text-decoration: none;}

.material-icons {
        font-family: 'Material Icons';
        font-weight: normal;
        font-style:normal;
        color:#656463;
								font-size: 24px !important;  /* Preferred icon size */
        display: inline-block;
        line-height: 1;
        text-transform: none;
        letter-spacing: 0px;
        word-wrap: normal;
        white-space: nowrap;
        direction: ltr;
      
        /* Support for all WebKit browsers. */
        -webkit-font-smoothing: antialiased;
        /* Support for Safari and Chrome. */
        text-rendering: optimizeLegibility;
      
        /* Support for Firefox. */
        -moz-osx-font-smoothing: grayscale;
      
        /* Support for IE. */
        font-feature-settings: 'liga';
      }

/* skrivbordsikonen*/
.material-icons.keyBrdsIcon{
		position:absolute; top:-3px; left:3px;
		font-size: 40px !important;  /* Preferred icon size */
			
}

.material-icons.md-24 { font-size: 24px; }
.material-icons.md-36 { font-size: 36px; }
.material-icons.md-48 { font-size: 48px; }

/* ändra inte classen används i Jscript nedan*/
.grayKeyBrdIcon{color:#a1a1a1}

/* ändra inte classen används i Jscript nedan*/
.whiteKeyBrdIcon{color:#dedede}


/* ändra inte classen används i Jscript nedan*/			
#keyBrdOnOffBtn{
		width:42px; height:30px;
		/*position:absolute; top:-5px; right: 7px;*/
		margin-left:0; margin-right:0;
		padding:2px;

}

a#keyBrdOnOffBtn:link			{text-decoration:none; color:#dedede; position:absolute; right:3px; top:3px;}
a#keyBrdOnOffBtn:visited	{text-decoration:none; color:#dedede; position:absolute; right:3px; top:3px;}
a#keyBrdOnOffBtn:hover		{text-decoration:none; color:#dedede; position:absolute; right:3px; top:3px;}
/*a#keyBrdOnOffBtn:active		{text-decoration:none; color:#dedede; position:absolute; right:3px; top:3px;}*/



/*taggen finns i filen getword.cgi*/
.message{
	width:80%;
	border: solid;	border-width:1px;	
	border-color:#B8B8B8;
	color:#476B6B;
	background-color:#FFFFCC;
	text-align:center;
	font-size:1.0em;
	font-weight:bold;
	margin-left:auto; margin-right:auto;
	position: relative; top:10px;
	/*Ronded corner */
	-webkit-border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	border-radius: 0.5em;
	padding-top:5px; padding-bottom: 5px;
}

/*taggen finns i filen getword.html*/
.mobMessage{
	width:70%;
	border: solid;
	border-width:1px;
	border-color:#fd8521;
	/*color:#476B6B;*/
	background-color:#FFFFCC;
	text-align:center;
	font-size:1.0em;
	/*font-weight:bold;*/
	margin-left:auto; margin-right:auto;
	position: relative; top:1px;
	/*-moz-border-radius: 0.5em 0.7em 0.7em 0.7em;*/
	border-radius: 0.3em;
}	

/* formaterar medd. till gamla browsrar */
.browserTestMessage{
	width:70%;
	background:url(../../images/warning.png);
	background-repeat: no-repeat;
	/*background-position: 25% 0;*/
	margin-left:auto; margin-right:auto;
	color:red;
	font-size:1.0em;
	font-weight:bold;
}

.scrollup {
	width: 50px;
	height: 34px;
	position: fixed;
	bottom: 20px;
	left: 5px;
	padding: 5px 0px;

	/* background-color:#edeef0;
	color: black;
	border: 2px solid gray;
	border-radius: 1.5em;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 24px; */

	z-index:2000;
}

	

/**************************************** HANGMAN ******************************************/
#HangInner{ width: 100%; position:relative; margin-left:auto; margin-right:auto; text-align:center;}
#HangTitleContainer{
		width: 100%; position: relative; margin:0 auto; text-align:center;
}
/*#HangTitle{float:left;}********/
#backLink{width:20%;position: relative;left: 0px; top: 8px; float:left; color: #bdbdbd; text-shadow: 1px 1px 0px #fff;}
a#backLink:link{color: #bdbdbd;text-decoration:none;}
a#backLink:visited{color: #bdbdbd; text-decoration:none;}
a#backLink:hover{color:#bdbdbd;text-decoration:none;}		

#HangTitleText{position: relative; margin-right:auto; text-align:center; color: #ffffff; }
		
#_1,#_2,#_3,#_4,#_5,#_6,#_7,#_8,#_9,#_10,#_11,#_12,#_13,#_14,#_15,#_16,#_16,#_17,#_18,#_19,#_20,#_21,#_22{
	width: 40px; height: 42px; font-size: 1.6em; position:relative; text-align:center; 
}


#HangConsole{ font-size:1.0em; width: 94%; position:relative; margin-left:auto; margin-right:auto; padding-bottom:10px;}

/*#HangInput{ width: 15%; height: 1.65em, font-size:1.60em; text-align:center; position:relative; margin-left:auto; margin-right:auto;}*/

#HangGuessWord{ color: #000; direction:rtl; font-size:22px; position:relative; margin-left:auto; margin-right:auto;}
a#HangGuessWord:link{color: #0033FF;text-decoration:none;}
a#HangGuessWord:visited{color: inherit; text-decoration:none;}
a#HangGuessWord:hover{color:red;text-decoration:none;}

#HangInput{font-size:1.5em; height:2.256em; width: 2.4em; position:relative; right:0px; top:0px; text-align:center; border: 1px solid #cccccc;
-moz-border-radius:  1.25em 0em 0em 1.25em; -webkit-border-radius:  1.25em 0em 0em 1.25em;  -webkit-appearance : none ; outline:none; margin: 0px; padding: 0px;}

#okButton{	font-family: Arial; height:3.50em; width: 3.90em; position:relative; left:-6px; top:0px; border: 1px solid #cccccc; background-color: #ffffff;
-moz-border-radius: 1.75em; -moz-border-radius: 0em 1.75em 1.75em 0em; -moz-appearance:  none ;
-webkit-border-radius: 1.75em; -webkit-border-radius: 0em 1.75em 1.75em 0em; -webkit-appearance : none ;  margin: 0px; padding: 0px;}

.resultbtn{height: 24px; font-size:0.8em; position:relative; top:0px; direction: ltr;}

#keyPad{ width:93%; border:0px solid gray; position:relative; top:0px; margin-left:auto; margin-right:auto;}

#HangImage{position:relative; top:5px; position:relative; margin-left:auto; margin-right:auto;}

#HangMessage{ text-align:center; position:relative; top:-5px; margin-left:auto; margin-right:auto;}

#HangIMG{ border:1px ridge #BBBBBB; position:relative; margin-left:auto; margin-right:auto;}

#URL{ text-align:center; position:relative; margin-left:auto; margin-right:auto;}
/**************************************** HANGMAN ******************************************/				
