div#wpvrk_keyboard_main_wrapper { 
display: block;
margin: 0 auto;
position: relative;
width: 684px;
margin-bottom:50px;
}
div#keyboard ul.cf li a, div#keyboard ul.cf li a:hover { text-decoration:none !important;cursor:pointer !important; color:#990033 !important; }
div#areawrapper {
margin: 15px auto 0;
width: 680px;
height: 215px;
position:relative;
text-align:center;
}
div#wpvrk_keyboard_main_wrapper div#areawrapper textarea#area.resizable {
border: 1px solid #CCCCCC;
height: 190px;
width: 670px;
font-size:20px;	
text-align:right;
}
#keyboard {
margin: 1px auto 0;
width: 680px;
height: 290px;
background:	#d5d9dc;
-moz-border-radius-topleft: 7px 21px;
-moz-border-radius-topright: 7px 21px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-top-left-radius: 7px 21px;
border-top-right-radius: 7px 21px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
padding: 30px 0 0 4px;
-webkit-box-shadow:  
inset 0 0 8px #bbb,
0 1px 0 #aaa,
0 4px 0 #bbb,
0 10px 30px #ddd;
-moz-box-shadow:  
inset 0 0 8px #bbb,
0 1px 0 #aaa,
0 4px 0 #bbb,
0 10px 30px #ddd;
box-shadow:  
inset 0 0 8px #bbb,
0 1px 0 #aaa,
0 4px 0 #bbb,
0 10px 30px #ddd;}
div#keyboard ul.cf  {
list-style-type: none; 
width: 685px; 
margin: 0 auto;
}
div#keyboard ul.cf li {
float: left;        
margin: 0;
padding: 0; 
list-style-type: none !important;  
}
#to-search {
background: none repeat scroll 0 0 #FFF9D7;
border: 1px solid #E2C822;
cursor: pointer;
display: none;
padding: 2px 4px;
position: absolute;
right: 6px;
text-shadow: 0 1px 0 #FFFFFF;
top: 45px;
z-index: 5;
max-width:325px;
}
#ssg {
float: left;
font-family: tahoma;
font-size: 16px;
position: relative;
top: 1px;
}
div#wpvrk_keyboard_main_wrapper div#details h3 {
float: left;
width: 300px;
}
.key{
display: block;
position:relative;
color: #903; font: 18px arial;
text-decoration: none;
text-align: center;
width: 37px;
height: 33px;
margin: 5px;
background: #eff0f2;
-moz-border-radius: 4px;
border-radius: 4px;
border-top: 1px solid #f5f5f5;
-webkit-box-shadow: 
inset 0 0 25px #e8e8e8,
0 1px 0 #c3c3c3,
0 2px 0 #c9c9c9,
0 2px 3px #333;
-moz-box-shadow: 
inset 0 0 25px #e8e8e8,
0 1px 0 #c3c3c3,
0 2px 0 #c9c9c9,
0 2px 3px #333;
box-shadow: 
inset 0 0 25px #e8e8e8,
0 1px 0 #c3c3c3,
0 2px 0 #c9c9c9,
0 2px 3px #333;
text-shadow: 0px 1px 0px #f5f5f5;
}
.key:active, .keydown {
color: #888;
background: #ebeced;
margin: 7px 5px 3px;
-webkit-box-shadow:
inset 0 0 25px #ddd,
0 0 3px #333;
-moz-box-shadow: 
inset 0 0 25px #ddd,
0 0 3px #333;
box-shadow: 
inset 0 0 25px #ddd,
0 0 3px #333;
border-top: 1px solid #eee;}
.fn span {
display: block;
margin: 14px 5px 0 0;
text-align: right;
font: bold 6pt arial;
}
#esc {
margin: 6px 15px 0 0;
font-size: 7.5pt;
}
#numbers li a span {
display: block;
color:#aaa;
z-index:-999;
font-size:11px;
}
#numbers li a b {
margin: 3px 0 3px;
display: block;
}
#numbers li .alt b {
display: block;
margin: 0 0 3px;
}
#numbers li #delete span {
text-align: right;
margin: 16px 4px 0 0;
}
ul#qwerty.additional li a.key	{
height: 31px;
padding-top: 3px;
}
#qwerty li a span {
text-transform:uppercase;
display: block;
margin: 0px 0 0;
font-size: 8px;
color:#aaa;		height: 8px;
}
#qwerty li #tab span {
text-align: left;
margin: 12px 0 0 10px;
text-transform:none;
font-size: 11px;
}	
#qwerty li .alt b {
display: block; 
margin: 3px 0 0;
}
#qwerty li .alt span {
margin: 2px 0 0;
}
#asdfg li a span {
display: block;
text-transform:uppercase;
margin: 0px 0 0;
font-size: 8px;color:#aaa;
}
#asdfg li .alt span {
margin: 0;
}
#asdfg li .alt b {
display: block; 
margin: 3px 0 0;
}
#asdfg li #caps b {
display: block;
background: #999;
width: 4px;
height: 4px;
border-radius: 10px;
margin: 9px 0 0 10px;
-webkit-box-shadow: inset 0 1px 0 #666;
-moz-box-shadow:inset 0 1px 0 #666;
box-shadow:inset 0 1px 0 #666;
}
#asdfg li #caps span {
font-size: 11px;
margin: 10px 0 0 10px;
text-align: left;
text-transform: none;
}
ul#bottomrow.cf li a.key {
height: 31px;
padding-top: 3px; 
font-family: Arial Unicode MS;
}
#asdfg li #enter span {
text-align: right;text-transform:none;
margin: 15px 10px 0 0;
font-size: 11px;color:#aaa;
}
#zxcvb li a span {
display: block;
margin: 0px 0 0;
font-size: 8px;
text-transform:uppercase;
color:#aaa;
}
#zxcvb li .shiftleft span {
text-align: left;
text-transform:none;
margin: 4px 0 0 10px;
font-size: 11px;color:#aaa;
}
#zxcvb li .shiftright span {
color: #AAAAAA;
font-size: 11px;
margin: 16px 10px 0 0;
text-align: right;
text-transform: none;
}
#zxcvb li .alt b {
display: block;
margin: 4px 0 0;
}
#zxcvb li .alt span {
margin: 0;
}
#bottomrow li #fn span, #bottomrow li #control span, #bottomrow li #optionleft span, #bottomrow li #commandleft span {
display: block;
text-align: left;
margin: 31px 0 0 8px;
font-size: 12px;
color:#aaa;
}
#bottomrow li #optionright span, #bottomrow li #commandright span {
display: block;
text-align: right;
margin: 31px 8px 0 0;
font-size: 12px;
color:#aaa;
}
#bottomrow ol li #left span, #bottomrow ol li #right span, #bottomrow ol li #up span, #bottomrow ol li #down span {
display: block;
margin: 9px 0 0;
}
.fn {
height: 26px; 
width: 46px;
}
#delete {
width: 55px;
}
#tab {
width: 54px;
}
#caps {
width: 65px;
}
#enter {
width: 73px;
}
.shiftleft, .shiftright {
width: 92px;
}
#fn, #control, .option, .command, #spacebar {
height: 49px;
}
#control {
width: 56px;
}
.option {
width: 46px;
}
.command {
width: 67px;
}
#spacebar {
width: 288px;
}
#left img, #up img, #down img, #right img {border: none;}
div#keyboard ul ol {list-style-type: none;}
#down {height: 23px;}
#up, #left, #right {height: 24px;}
#left, #right {margin: 30px 5px 5px;}
#left:active, #right:active {margin: 32px 5px 3px;}
#up {margin: 5px 5px 1px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px;}
#up:active {margin: 8px 5px -2px;}
#down {margin: 0 5px 5px; border-top-left-radius: 0px; border-top-right-radius: 0px;}
#down:Active {margin: 3px 5px 4px;}
div#keyboard ul, ol {padding: 0px; margin: 0;} .cf:before, .cf:after {content:""; display:table;}
.cf:after {clear:both;} .cf {zoom:1;}
ul#qwerty.additional { 
padding-left: 81px;
width: 683px;
}
div#details {
clear: both;
height: 85px;
width: 680px;
} .wpakp-wrapper {
margin: 4px 15px 0 15px;
}
#icon-keyboard {
background: url(//tlv.education/wp-content/plugins/wp-arabic-virtual-keyboard/images/keyboard-icon.png) no-repeat scroll 0 0 transparent;
float: left;
height: 35px;
margin: 7px 8px 0 0;
width: 35px;	
}
div.wpakp-wrapper h2 {
color: #464646;
font-family: "HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue",sans-serif;
font-size: 23px;
line-height: 29px;
padding: 9px 15px 4px 0;
font-weight:normal;
}
div#wpwrap div#wpcontent div#wpbody div#wpbody-content div.wpakp-wrapper div.updated, div.error {
margin: 5px 15px 2px 2px;
}
div#adminmenumain div#adminmenuwrap ul#adminmenu li#toplevel_page_wpavk_admin div.wp-menu-image.dashicons-before img { 
padding: 0 !important; 
}