.rating { 
  border: none;
}

.rating > input { display: none; } 
.rating > label:before { 
  margin: 5px;
  font-size: 1.25em;
  font-family: FontAwesome;
  display: inline-block;
  content: "\f005";
}

.rating > .half:before { 
  content: "\f089";
  position: absolute;
      transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
}

.rating > label { 
  color: #ddd; 
  float: left; 
}

/***** CSS Magic to Highlight Stars on Hover *****/

.rating > input:checked ~ label, /* show gold star when clicked */
.rating:not(:checked) > label:hover, /* hover current star */
.rating:not(:checked) > label:hover ~ label { color: #FFD700;  } /* hover previous stars in list */

.rating > input:checked + label:hover, /* hover current star when changing rating */
.rating > input:checked ~ label:hover,
.rating > label:hover ~ input:checked ~ label, /* lighten current selection */
.rating > input:checked ~ label:hover ~ label { color: #FFED85;  } 

ul,ol{
  text-align: right !important;
}
body h1,h2,h3,h4,h5,strong,span,table,thead,tbody, a , li, select,label,input {
  font-family:'Tajawal', sans-serif  !important;
}

div.heading-title h1, div.heading-title h2, div.heading-title h3, div.heading-title h4, div.heading-title h5, div.heading-title h6 {
 padding-right: 15px !important; 
 padding-left: 15px !important;
}
ul,ol,label,input{
  text-align: right !important;
}
div.toggle >  label {
  text-align: right !important;
}
section.page-header h1{
 text-align: right;
}
.text-align{
  text-align: right;
}
.centerContent{
  display: inline-block !important;
  text-align: right !important;
}
#nav-bullet li a[data-title]:before {
  content: attr(data-title);
  position: absolute;
  right: -130px !important;
  top: -14px;
  background: #222;
  color: #fff;
  border-radius: 6px;
  padding: 4px 8px;
  display: inline-block;
  transition: all .2s ease;
  white-space: nowrap;
}
#leftSidebar {
 top: 40%; 
 overflow-x: hidden;
 padding: 8px 0;
 position: fixed;
 bottom: 0;
 left: 0;
 right: auto;
 z-index: 1; /* needs to stay on top of the mainStack AND the sidePanel */
 /* for demo only: */
 background-color: transparent;
}

#leftSidebar > ul {
 /* all of these are for demo only: */
 list-style: none;
 margin: 0;
 padding: 0;
 width: 100%;
 text-align: left
}
#leftSidebar > ul > li {
 width: 100%;
 /*padding: 10px 20px;*/
 padding-left: 20px;
 padding-left: 20px;
}
#leftSidebarList > li > a > i{
 color:#c1d3cc;
}
#leftSidebarList > li.active > a > i{
 color:#00bccc;
}

#leftSidebarList a .hover-text {
 /* position: absolute; */
 left: 15px;
 top: 7px;
 opacity: 0;
 -webkit-transition: opacity 0.5s ease;
 transition: opacity 0.5s ease;
 padding-left: 15px;
}
#leftSidebarList a:hover .hover-text {
 opacity: 1;
}

.gradientBorder {
 border-width: 0px 0px 0px 1px;
 border-style: solid;
 border-image: -webkit-linear-gradient(top, transparent, rgba(255, 255, 255, 0.2), transparent) 1 100%;;
}

.headerTable td{
 border:0px;
 text-align: right;
}
.headerTable{
 padding-right:   10px;
 margin-bottom : 0px;
 display: block !important;
    line-height: 1.3 !important;
    min-width: 300px !important;
}
@media only screen and (max-width: 992px)
{
 #topNav button.btn-mobile {
  display: block;
  float: right;
  margin-right: 0;
  -webkit-transition: none;
  -moz-transition: none;
  -o-transition: none;
  transition: none;
}
}

#topBar ul.top-links>li {
  border-left: 0px ;
  border-right: 0;
}

/*PAGE*/
body {
 font-family: 'Tajawal', sans-serif  !important;
 font-weight: 300;
 font-size: 16px;
}
body, p, h1, h2, h3, h4, h5, h6,li,div {
 font-family: 'Tajawal', sans-serif  !important;
 font-weight: 300;

}
header{
 font-family: 'Tajawal', sans-serif  !important;
 font-weight: 300;

}

body, p, h1, h2, h3, h4, h5, h6 {
 font-family: 'Tajawal', sans-serif  !important;
 font-weight: 300;

}

ol { list-style: arabic-indic; }

.info-bar h1, .info-bar h2, .info-bar h3, .info-bar h4, .info-bar h5, .info-bar h6, .info-bar p {
 font-size: 18px;
}

.box-gradient > div > p {
 font-size: 17px;
}

.input-group-btn:last-child > .btn {
 border-top-right-radius: 0;
 border-bottom-right-radius: 0;
 border-top-left-radius: 3px;
 border-bottom-left-radius: 3px;
}

#phoneCode {
 border-left: 2px;
 border-left-width: 2px;
 border-left-style: solid;
 border-right: 0;
 border-right-width: 0px;
 border-right-style: none;
 border-top-right-radius: 0;
 border-bottom-right-radius: 0;
 border-top-left-radius: 3px;
 border-bottom-left-radius: 3px;
 border-color: rgb(221, 221, 221);
}

.show-panel{
 right: auto !important;
 left: 0 !important;
}

/* no letter spacing for arabic.. */
.letter-spacing-0, .letter-spacing-1, .letter-spacing-2, .letter-spacing-3, 
.letter-spacing-4, .letter-spacing-5, .letter-spacing-6, .letter-spacing-7, 
.letter-spacing-8, .letter-spacing-9, .letter-spacing-10 {
 letter-spacing: 0em !important;
}



/*HEADER*/

#topBar ul.top-links {
 padding-right: 0;
}
#topMain.nav-pills>li>a {
 font-size:16px;
} 
#topBar ul.top-links > li > a {
 font-size: 13px;
}
.dropdown-langs > li {
 width: 80px;
}

/*FOOTER*/
#footer ul.footer-links>li>a:before {
 transform: scale(-1, 1);
}

#footer address .footer-sprite {
 padding-right: 50px;
}

#footer address .footer-sprite.address {
 background-position: 100% 0;
}

#footer address .footer-sprite.phone {
 background-position:100% -135px;
}   
#footer address .footer-sprite.email {
 background-position:100% -247px;
}

#footer h4 {
 font-size: 17px;
 text-align: right;
}

/*ESSENTIALS OVERWRITES*/
@media only screen and (max-width:767px){
 div.side-nav .side-nav-head{height:44px;background-color:rgba(0,0,0,0.1);margin-bottom:30px;}
 div.side-nav .side-nav-head>h4{padding-right:15px;}
 div.side-nav .side-nav-head button{right:inherit;left: 0;}
}

.info-bar div.row>div i {
 margin-left: 7px; 

}


