@font-face {
  font-family: 'Droid Arabic Kufi';
  font-style: normal;
  font-weight: 400;
  src: url(fonts/Droid_ar_K/DroidKufi-Regular.ttf) format('truetype');
}
@font-face {
  font-family: 'Droid Arabic Kufi';
  font-style: normal;
  font-weight: 700;
  src: url(fonts/Droid_ar_K/DroidKufi-Bold.ttf) format('truetype');
}
/* =======================  body side ========================  */
body{
 background-color:#fff;
 /* margin-top:195px; */

 font-family: Verdana, sans-serif;
 font-size: 1.2em;
}

/*  =========================================== */

header, nav, section, article, footer, aq_rabber
{
	border:1px solid grey; margin:5px; padding:4px;
}
nav ul {
	margin:0; padding:0;
}
nav ul li {
	display:inline; margin:5px;
}

.body_div{
   width:100%;

  display: block;
  text-align:center;
  vertical-align: middle;
  position:relative;
  background-color:#ffffff;
  padding-top : 10px;
  margin-bottom:15px;
}
.body_div2{
   width:100%;
  height: 70%;
  display: block;
  text-align:center;
  vertical-align: middle;
  position:relative;
  background-color:#ffffff;
  padding-top : 10px;
}
.footer_div{	text-align:center;
	position : fixed;
	display: block;
	width:100%;
	height: 150px;
	bottom:0;
	background-color:#e9eaeb;
}
.footer_div2{
	text-align:center;
	display: block;
	position : fixed;
	width:100%;
	height: 50px;
	bottom:0;
	background-color:#e9eaeb;
}
.top_div{
	position : relative;
	display: block;
	height: 150px;
	background-color:#e9eaeb;
}
.top_div2{
	position : relative;
	display: block;
	height: 50px;
	background-color:#e9eaeb;
}
header{
  height:50px;
  width:100%;
  display: block;
}
header ul{
	margin:0; padding:0;
}
header ul li{
	display:inline; padding:1px;
}
/*  =========================================== */

.header_divm{
  display:block;
 width:100%;
 position:relative; /* fixed */
 top:0px;
 height:185px;
 text-algin:center;
}
.header_aq{
  right: 0;
  left: 0;

    padding-top:10px;
  align: center;
  /* line-height:200px; */
  vertical-align:middle;
}

.head_div{
 margin-top: 0px;
 position:relative;
}
.left_padd{
 left:100px;
}
.right_padd{
 right:100px;
}
.head_div_over{
	 display: table-cell;
     z-index: 1030;
     height:30px;
     position:absolute;
     margin-top: 0px;
}
.header_bgc_txt_color{
 background-color:#e9eaeb;

}
.H_TXT_B{
   color:#1c81c1;
   font-family: 'Tahoma';
   font-size:25px;
   font-weight:none;
}
.H_TXT_B2{
   color:#1c81c1;
   font-family: 'Arial';
   font-size:25px;
   font-weight:bold;
}
.inline_div{
  display : inline-block;
  padding-right:5px;
}
.div_right{
 float:right;
 margin-right: 20px;
}
.div_right2{
 float:right;
 margin-right: -80px;
}
.div_left{
 float:left;
 margin-left: 20px;
}
.div_left2{
 float:left;
 margin-right: -80px;
}
.align_r{

  float :right;
}
.align_l{
  float :left;
}
.text_r{
  text-align:right;
}
.logo_img{
  background-image: url("imgs/note_logo.png");
  background-repeat: no-repeat;
  width:286;
  height:165px;
  z-index: 1000;
}
.rotate_img_h{
   -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);

}
.rotate_img_v{
   -webkit-transform: rotateX(180deg);
    -moz-transform: rotateX(180deg);
    -ms-transform: rotateX(180deg);
    -o-transform: rotateX(180deg);
    transform: rotateX(180deg);

}
.ptuk_logo{
  background-image: url("imgs/logo_ptuk.png");
  background-repeat: no-repeat;
  width:160;
  height:156px;
  z-index: 1000;
}
.bg_img{
 background-image: url("imgs/star_bg.png");
   /*
    opacity: 0.9;
    filter: alpha(opacity=40);   */ /* For IE8 and earlier */
}
.top_margin{
  top:195px;
}
.fixed_rabber{
   position: relative; /* fixed */
   z-index:1200px;
   top:0px; /* 185px; */
}
.rabber{
 height:10px;
 width:100%;
 background-color:#337ab7;
}
.rabber_header{
 height:1px;
 width:100%;
 background-color:#337ab7;
  position:relative;
}
.rabber_footer{
  height:10px;
 width:100%;
 background-color:#337ab7;
  position:releative; /* fixed */
/* bottom:100px; */ /* because footer height in footer_aq class */
}
.bg_color{
  height:100%;
  background-color:#337ab7;
}
.p_text{
 color : #ffffff;
 font-size:13px;
 font-family:Tahoma;
}
.center_text{
   text-align:center;
}
.c_height{
 height:40px;
 line-height:40px;
 vertical-align:middle;
}
.footer_aq{
 display:block;
 width:100%;
 position:fixed;
 bottom:0px;
 height:100px;
 text-algin:center;
 background-color:#e9eaeb;
}
.login_bgc_txt_color{
 padding:30 20 20 20;
 background-color:#337ab7;
 border-radius : 10px;
  color:#fff;
}
.div_marign_top{
  margin-top : 20px;
}
.aq_col-lg-12_right{
  float:right;
}
.login_width{
  width:280px;
}
.aq_inline_div{
 display : inline-block;
 cursor:pointer;
}
.form-group{  margin-bottom:8px;
}
.center_div{
  margin: auto;
}
.main2_body_div{
  width: 100%;
  display: block;
  position: relative;
  background-color:#e9eaeb;
}
.left_side_div
{
  width:117px;
  background-color: #ddd;
}
.right_side_div
{
  width:117px;

}
.body_side_div
{
  width:65%;
  padding: 10px;
   background-color: #ffffff;
}
.rightbfr_side_div
{
  width:290px;
  height:100%;
  background-color: #c0c0c0;
}

input[type="text"],input[type="number"],input[type="password"],select,textarea {
   text-align:right;
   font-family: Tahoma;
}
button{
    font-family: Tahoma;
}

.data_div{
 display: inline-block;

 margin-bottom: 55px;
 text-align: right;
 width: 90%;
 padding: 10px;
 border-radius: 5px;
 background-color: #eeeeee;
}
#f_h{
  display: block;
  line-height:100%;
  width:100%;
  background-color: transparent;
  vertical-align:middle;
  border: 1px solid #8f0222;
  border-radius: 5px;
}
#forms_body{
 /*
  border: 1px solid #8f0222;
  border-radius: 5px;
  */
  color:#ff0000;
  margin-top: 10px;
  margin-bottom: 10px;
 /*  height:85%; */
  position: relative;
  padding: 10 0 10 0;
  font-family: Tahmoa;
  font-size: 11px;
}
.bg_color1{   background-color: #55acee;
}
.bg_color_b{ background-color: #3b5998;
}
.bg_color_mn{
   background-color: #8f0222;
}
.bg_color_m{
   background-color: #d0d0d0;
}
.bg_mfr{  background-color: #eeeeee;
}
.img_del{ cursor:pointer;
}
.aq_hideme
{
    display:none;
   /*  visibility:hidden; */
}
.aq_showme
{
    display:inline-block;
   /* visibility:visible; */
}
.in_form_in2{
 display: inline-block;
  position: relative;
  width:182px;
  padding: 4px;
  margin:0 5 5 0;
  text-align:right;
  border-radius: 5px;
  border : 1px solid #d0d0d0;
}
.in_form_in{
 text-align:right;
 vertical-align:top; display: inline-block;
  position: relative;
  padding: 10px;
  border-radius: 5px;
  border : 1px solid #d0d0d0;
}
.in_form_intext{  padding-left:10px;  color:#fff;
  font-size:13px;
  font-family:'Droid Arabic Kufi';
}

.in_form_intextr{
  padding-left:10px;
  color:#8f0222;
  font-size:13px;
  font-family:'Droid Arabic Kufi';
}
.in_form{
  display: inline-block;
    margin : auto;
  background-color: #d0d0d0;
  position: relative;
  padding: 10px;
  border-radius: 5px;
  border : 1px solid #8f0222;
}
.in_form2{
  display: inline-block;
  width: 74%;
  height:100%;
    margin : auto;
  background-color: #d0d0d0;
  position: relative;
  padding: 10px;
  border-radius: 5px;
  border : 1px solid #8f0222;
}
.in_form_s{
  display: inline-block;
  width: 30%;
  height:97%;

  background-color: #fff;
  position: relative;
  padding: 10px;
  border-radius: 5px;
}
.in_form_b{
  display: inline-block;
  width: 100%;
  height:97%;

  background-color: #fff;
  position: relative;
  padding: 10px;
  border-radius: 5px;
}
.in_menu{
  display: inline-block;
    position: relative;
  padding: 0 0 0 8;
}

.in_menu2{
  display: inline-block;
  height:97%;
   float: left;
  position: relative;
  padding: 0 8 0 0;
}

.header_text{
  color:#000;
  font-size:15px;
  font-family:'Droid Arabic Kufi';
}
/*
.list-group-item:first-child{
  color: #fff;
  background-color: #5bc0de;
}
*/
.selected_child_aq{  color: #fff;
  background-color: #5bc0de;
}

.menu_div{
display: block;
background-color: #d0d0d0;
 height: 35px;
 margin: auto;
    border-radius: 5px;
    border: 1px;

 width: 90%;
}
.menu_align_right{
 float: right;
}
a{
 font-family: 'Droid Arabic Kufi';
 font-size:13px;
}

.forms_title{

  display: inline-block;
  height: 30px;
   padding: 0 0 0 15;
  font-family: 'Droid Arabic Kufi';
  font-weight:none;
  font-size:15px;
  position: relative;

}
.forms_title2{

  display: inline-block;
  height: 30px;
  padding: 0 10 0 15;
  font-family: 'Droid Arabic Kufi';
  font-weight:none;
  font-size:15px;
  position: relative;
}
.bgcolor_ft{
 height: 30;
    padding: 10px;
    width: 100%;
    color: #fff;
    background: #8f0222;
}
#arrow4:after {
    content: '';
    height: 0;
    display: block;
    border-color: transparent #8f0222 transparent transparent ;
    border-width: 15px;
    border-style: solid;
    position: absolute;
    top: 0;
    left: -15px;
}
#arrow5:after {
    content: '';
    height: 0;
    display: block;
    border-color: transparent #8f0222 transparent transparent ;
    border-width: 15px;
    border-style: solid;
    position: absolute;
    top: 0;
    left: -15px;
}
#arrow5:before {
    content: '';
    height: 0;
    display: block;
    border-color: #8f0222 transparent #8f0222 #8f0222;
    border-width: 15px;
    border-style: solid;
    position: absolute;
    top: 0;
    right: -15px;
}
.arrow_t_final{

  display: inline-table;
  height: 30px;
     width: auto;
  padding: 0 10 0 0;
  float:left;
  font-family: Tahoma;
  font-weight:none;
  font-size:15px;
  position: relative;
}
#arrow_last:before{
    content: '';
    height: 0;
    display: block;
    border-color: #8f0222 transparent #8f0222 #8f0222;
    border-width: 15px;
    border-style: solid;

    position: absolute;
    top: 0;
    right: -15px;
}
#ul_table_aq{
 width:100%;
 padding: 5 5 5 5;
 border : 1px solid #8f0222;
 border-radius: 5px;
 background-color: #f5f5f5;
}
/*
#ul_table_aq:first-child{
  background-color: #8f0222;
  color: #fff;
}
*/
#div_table{
	display:table;

  width:100%;
 padding: 5 0 5 0;
 border : 1px solid #8f0222;
 border-radius: 5px;
 background-color: #f5f5f5;

}
#div_table2{
	display:table;

  width:100%;
 padding: 5 0 5 0;
 border : 0px solid #8f0222;
 border-radius: 5px;
 background-color: #f5f5f5;

}
#div_table22{
	display:table;

  width:100%;
 padding: 5 0 5 0;
 border : 0px solid #8f0222;
 border-radius: 5px;
 background-color: #f5f5f5;

}
.row {
	display:table-row;
}
.cell{
	display:table-cell;
	border : 1px solid #cecece;

	vertical-align: middle;
	padding: 0 10 0 10;
	height: 25px;
}
.li_table_aq{
 padding: 10 10 10 10;
 border : 1px solid #8f0222;
 border-radius: 5px;
}
.brn_bgcolor{
   background-color: #8f0222;
   color: #ffffff;
   font-size:13px;
   font-weight:bold;
   font-family: Tahoma,Verdana;
}
.gray_bgcolor{
   background-color: #f5f5f5;
   color: #8f0222;
   font-size:11px;
   font-weight:none;
   font-family: Tahoma,Verdana;
}
/*    ============== start animation =============   */

.div {
    width: 100px;
    height: 100px;
    background: red;
    position: relative;
    -webkit-animation: mymove 5s infinite; /* Chrome, Safari, Opera */
    animation: mymove 5s infinite;
}
.m_side_h{
  font-size:14;
  font-weight:None;
  font-family:Arial;
  background-color: #dd7e33;
}

.m_side_h2{
  font-size:14;
  font-weight:None;
  font-family:Arial;
  background-color: #ff7000;
}


.m_side_h3{
  font-size:14;
  font-weight:bold;
  font-family:Arial;
  color:#8f0222;
  background-color: #d0d0d0;
      padding: 10px;
    border-radius: 5 5 0 0;
    border: 1px solid #8f0222;
    margin-bottom:0px;
}
.sides_border{  border-left: 1px solid #8f0222;
  border-right: 1px solid #8f0222;
}
.aq_links_color{	color:#8f0222;
}
#abstract_txt_div{  padding:10px;
  z-index:1500;
  height:200px;
  width:50%;
  border: 1px solid #8f0222;
  border-radius:5px;
  background-color:#5bc0de;
  position:absolute;
  margin: auto;
  top:-30px;
}
#copy_txt_div{
  padding:10px;
  z-index:1500;
  height:200px;
  width:50%;
  border: 1px solid #8f0222;
  border-radius:5px;
  background-color:#5bc0de;
  position:absolute;
  margin: auto;
  top: 50px;
}
#author_txt_div{  padding:10px;
  z-index:1500;
  height:200px;
  width:auto;
  border: 1px solid #8f0222;
  border-radius:5px;
  background-color:#5bc0de;
  position:absolute;
  margin-right: 22%;
  top:0px;
}
#classify_txt_div{
  padding:10px;
  z-index:1500;
  height:auto;
  width:50%;
  border: 1px solid #8f0222;
  border-radius:5px;
  background-color:#5bc0de;
  position:absolute;
  margin: auto;
  top:95px;
}
.classify_class_div{   padding:10px;
  z-index:1500;
  height:auto;
  width:50%;
  border: 1px solid #8f0222;
  border-radius:5px;
  background-color:#5bc0de;
  position:absolute;
  margin: auto;
  top:95px;
}
.borrows_class_div{
   padding:10px;
  z-index:1500;
  height:90%;
  width:48%;
  border: 1px solid #8f0222;
  border-radius:5px;
  background-color:#5bc0de;
  position:absolute;
  left: 10px;
  top:10px;
  margin: auto;
}
#main_titles_heads_div .item{	color:#fff;  background-color:#3b5998;
}
/* Chrome, Safari, Opera */
@-webkit-keyframes mymove {
    from {left: 0px;}
    to {left: 200px;}
}

@keyframes mymove {
    from {left: 0px;}
    to {left: 200px;}
}
/*       -----------------------------  */

.Sharer {
    position: fixed;
    margin: 0;
    top: 50%;
    width: 50px;
    overflow: hidden;
    right: 0;

}

.Sharer_link {
    background-color: #1C94C6;
    padding: 0 10 0 10;
    margin: 0px;
    width:100%;
    height:35px;
    color: #fff;
    border-radius: 2px;
    -webkit-transition: background .3s ease;
    transition: background .3s ease;
    white-space: nowrap;
    display: inline-block;
    text-align:center;
    line-height:35px;

}

.Sharer_link.u-facebook {
    background-color: #3b5998;
}
.Sharer_link:first-child {
    margin-left: 0;
}

.Sharer_link.u-twitter {
    background-color: #55acee;
}
.Sharer_link:last-child {
    margin-right: 0;
}
/* =========================================  */

.aqel_btn_valign{	line-height:40px;  vertical-align:middle;
}
.aqel_btns{
   height:30px;
   font-family: 'Droid Arabic Kufi';

    border: 1px solid transparent;
    border-radius: 4px;

}
.aqel_btns_color{
 color: #fff;
    border-color: #46b8da;
        background-image: linear-gradient(to bottom, #5bc0de 0%, #2aabd2 100%);
}
.aqel_btns_brwm{
	color: #8f0222;
    border-color: #6d0019;
        background-image: linear-gradient(to bottom, #cecece 0%, #a0a0a0 100%);

}
.aqel_btn_width{  width:100px;
}
/* ================================ */

/* ================================ */

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 20px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    border: 1px solid #888;
    border-radius : 5px;
    width: 80%;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 0.4s;
    animation-name: animatetop;
    animation-duration: 0.4s
}
/*  mmmmmmmmmmmmm  */
.logo_nn{
    display : block;
    height: 92%;
    background-image: url(imgs/note_logo.png), url(imgs/logo_ptuk.png);
    background-position: right, left;
    background-repeat: no-repeat, no-repeat;
}
.logo_nn1{
    display : inline-block;
    float:right;

}
.logo_nn2{
   display : inline-block;
   float:left;

}
/* Add Animation */
@-webkit-keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}

@keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}

/* The Close Button */
.close {
    color: white;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}

.modal-header {
    padding: 2px 16px;
    background-color: #d2800a;
    color: white;
}

.modal-body {padding: 10 16 30 16;}

.modal-footer {
    padding: 2px 16px;
    background-color: #d2800a;
    color: white;
}

/*======================================   */


.aqel_scroll{

      background-color: #ffffff;
      overflow: scroll; /* showing scrollbars */
      overflow-x:hidden;
      -moz-appearance: none !important;


}
aqel_scroll::-webkit-scrollbar {
		  width: 15px;
		  -moz-appearance: none !important;

	} /* this targets the default scrollbar (compulsory) */

aqel_scroll::-webkit-scrollbar-track {
		  background-color: #b46868;
	} /* the new scrollbar will have a flat appearance with the set background color */

aqel_scroll::-webkit-scrollbar-thumb {
		  background-color: rgba(0, 0, 0, 0.2);
		  -moz-appearance: none !important;
	} /* this will style the thumb, ignoring the track */

aqel_scroll::-webkit-scrollbar-button {
		  background-color: #7c2929;
		   -moz-appearance: none !important;
	} /* optionally, you can style the top and the bottom buttons (left and right for horizontal bars) */

aqel_scroll::-webkit-scrollbar-corner {
		  background-color: black;
	} /* if both the vertical and the horizontal bars appear, then perhaps the right bottom corner also needs to be styled */

/*    ============== End animation =============   */


