@font-face {
    font-family: 'Droid';
    src: url('fonts/DroidKufi-Regular.ttf') format('truetype')
}

@font-face {
    font-family: "Al-Jazeera-Arabic-Bold";
    src: url("fonts/Al-Jazeera-Arabic-Bold.ttf") format("truetype")
}

@font-face {
    font-family: "Droid Arabic Kufi";
    src: url("fonts/NotoKufiArabic-Regular.ttf") format("truetype")
}

@font-face {
  font-family:'Droid Arabic Kufi';
  src: url('fonts/DroidKufi-Regular.eot');
  src: url('fonts/DroidKufi-Regular.eot?#iefix') format('embedded-opentype'), url('fonts/DroidKufi-Regular.woff') format('woff'), url('fonts/DroidKufi-Regular.woff2') format('woff2'), url('fonts/roidKufi-Regular.ttf') format('truetype'), url('fonts/DroidKufi-Regular.svg#Droid Arabic Kufi') format('svg');
  font-weight: 400;
  font-style: normal
}
@font-face {
  font-family: 'Droid Arabic Kufi';
  src: url('fonts/DroidKufi-Bold.eot');
  src: url('fonts/DroidKufi-Bold.eot?#iefix') format('embedded-opentype'), url('fonts/DroidKufi-Bold.woff') format('woff'), url('fonts/DroidKufi-Bold.woff2') format('woff2'), url('fonts/DroidKufi-Bold.ttf') format('truetype'), url('fonts/DroidKufi-Bold.svg#Droid Arabic Kufi') format('svg');
  font-weight: 700;
  font-style: normal
}

body {
    background: #C2A995 url('_img/page.png') top center fixed;
    font-family: 'Al-Jazeera-Arabic-Bold', Tahoma, Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
    font-size: 16px;
    color: #51361b
}

.navbar_sty {
    background: #f4e8dd url('_img/sty_grad.png') repeat-x;
    /*background-size: contain;*/
    border-radius: 0;
    -webkit-box-shadow: 0 0 2px 1px #150e04;
    -moz-box-shadow: 0 0 2px 1px #150e04;
    box-shadow: 0 0 2px 1px #150e04;
    border: 1px solid #322412;
    padding: 10px;
    margin: 2px auto 0;
    position: relative;
    /*z-index: 499;*/
    text-align: right
}
.elem {}

ul.link_sty a,
ul.link_sty a:link {
    color: #FAFDFF
}

ul.link_sty > li > a {

    border: 1px solid transparent;
    padding: 5px 10px;
    margin: 5px 5px;
    display: block;
    height: 40px;
    text-decoration: none;
    line-height: 30px
}

ul.link_sty li > a {
    color: #2d1000 !important
}

ul.link_sty li > a:hover,
ul.link_sty li > a:active {

    background-color: #fefdfb !important;
    border: 1px solid #442600;
    padding: 5px 10px;
    margin: 5px 5px;
    color: #442600 !important;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease

}


.navbar-default
.navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {

	background: #7d5b30 url('_img/sty_grad.png') repeat-x;
	background-size: contain;
	border: 1px solid #442600;
	padding: 5px 10px;
	margin: 5px 5px;
	color: #2d1000 !important;
	text-decoration: none
}

.navbar-default .navbar-toggle {
    border-color: #2d1000
}

.dropdown-menu {
    min-width: 200px;
    background-color: #f4e8dd;
    -webkit-background-clip: padding-box;
    background-clip: padding-box
}

.dropdown-menu > li > a {
    border: 1px solid transparent;
    padding: 5px 10px;
    margin: 5px 5px
}

.dropdown-menu > li > a > .badge {
    float: left;
    margin: -17px auto;
    color: #f4e8dd;
    background-color: #442600
}

.dropdown-menu>.active>a, .dropdown-menu>.active>a:focus, .dropdown-menu>.active>a:hover
	{
	background: #7d5b30 url('_img/sty_grad.png') repeat-x;
	/*background-size: contain;*/
	-webkit-border-radius: 0 0 3px 3px;
	-moz-border-radius: 0 0 3px 3px;
	border-radius: 0 0 3px 3px;
	border: 1px solid #442600;
	padding: 5px 10px;
	margin: 5px 5px;
	color: #2d1000 !important;
	text-decoration: none
}


.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
    color: #2d1000 !important;
    background-color: #faf3e8
}

.nav .open > a,
.nav .open > a:hover,
.nav .open > a:focus {
    border-color: #442600
}

.navbar-default .navbar-toggle .icon-bar {
    background-color: #51361b
}

.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
    background-color: #f4e8dd
}

.dropdown-menu .divider {
    background-color: #51361b
}

.sty_header {
    border: 1px solid #442600;
    background-repeat: no-repeat;
    background-image: url('_img/header.jpg');
    -webkit-box-shadow: 0 0 2px 1px #150e04;
    -moz-box-shadow: 0 0 2px 1px #150e04;
    box-shadow: 0 0 2px 1px #150e04
}

h4, .h4, h5, .h5, h6, .h6 {
    padding-right: 5px
}

.sty_blockcontent {
    background: #fefdfb;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px;
    border: 1px solid #442600;
    padding: 10px;
    margin: 0 auto 5px;
    color: #3F260D;
    font-size: 16px;
    line-height: 30px;
    font-weight: normal;
    font-style: normal
}

.sty_content {
    background: rgba(247, 235, 217, 0.7);
    -webkit-box-shadow: 0 0 2px 1px #150e04;
    -moz-box-shadow: 0 0 2px 1px #150e04;
    box-shadow: 0 0 2px 1px #150e04;
    border: 1px solid #442600;
    border-radius: 0 0 5px 5px;
    margin-bottom: 5px
}
.title_video {
    background: #414344;
	padding: 10px;
	margin: 0 auto 5px;
	color: #fefdfb;
	font-weight: normal;
	font-size:14px;
}
.block_video {
	background-color: #414344;
	border:#414344 5px solid;
	border-radius: 5px;
	margin-bottom: 5px
}

.sty_vmenublockheader {
    color: #2d1000;
    background: #7d5b30 url('_img/sty_grad.png') repeat-x;
    background-size: contain;
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0;
    border: 1px solid #322412;
    padding: 5px;
    margin: 5px auto 0px;
}

.sty_vmenublockcontent {
    background: #fefdfb;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px;
    border: 1px solid #442600;
    margin: 0 auto;
	padding: 5px
}

.sty_article_content {
    background: #fefdfb;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px;
    border: 1px solid #442600;
    /*margin: 0 auto;*/
    padding: 5px 20px;
	line-height: 30px;
	margin-bottom: 10px;

}

.sty_Book_content {
    border: #51361b 6px solid;
	background-color: #51361b;
	border-radius: 5px;
	padding: 5px
}


.sty_message {
    background: #d7ffa9;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: 1px solid #442600;

    padding: 20px 15px 20px 15px;
    line-height: 30px;
    margin: 10px 0 10px 0

}

ul.sty_vmenu, ul.sty_vmenu ul {
    list-style: none;
    display: block
}

ul.sty_vmenu, ul.sty_vmenu li {
    display: block;
    margin: 0;
    padding: 2px;
    width: auto;
    line-height: 0
}

ul.sty_vmenu > li > a {
    padding: 0 10px;
    margin: 0 auto;
    font-size: 14px;
    text-decoration: none;
    color: #5A3314;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: 1px solid transparent;
    min-height: 25px;
    line-height: 25px
}

ul.sty_vmenu a {
    display: block;
    cursor: pointer;
    z-index: 1;
    position: relative
}

ul.sty_vmenu > li > a:hover,
ul.sty_vmenu > li > a.active:hover {
    background: #51361b;
    padding: 0 10px;
    margin: 0 auto
}

ul.sty_vmenu a:hover,
ul.sty_vmenu a.active:hover {
    color: #FFFFFF
}

/*.img-thumbnail {
    -webkit-box-shadow: 0 0 1px 1px #333;
    -moz-box-shadow: 0 0 1px 1px #333;
    box-shadow: 0 0 1px 1px #333
}*/

blockquote {
    background: #f2ddc8 url('_img/postquote.png') no-repeat scroll;
    padding: 6px 6px 6px 30px;
    margin: 10px 10px 10px 50px;
    border: 1px solid #442600;
    color: #3F260D;
    font-weight: normal
}

.sty_footer {
    color: #2d1000;
    direction: ltr;
    text-align: center;
    background: #f4e8dd url('_img/sty_grad.png') repeat-x;
    background-size: contain;
    border-radius: 0;
    -webkit-box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.5);
    border: 1px solid #322412;
    padding: 10px;
    margin: 2px auto 0;
    text-align: center
}

.sty_footer a {
    color: #2d1000;
    text-decoration: underline
}

::-moz-selection { /* Code for Firefox */
    color: #f4e8dd;
    background: #51361b
}

::selection {
    color: #f4e8dd;
    background: #51361b
}

.img_thum {
    border: #f2ddc8 solid 1px;
    background: #f2ddc8 url('_img/golde.png');
    background-size: contain;
    -webkit-box-shadow: 0 1px 2px 1px #150e04;
    -moz-box-shadow: 0 1px 2px 1px #150e04;
    box-shadow: 0 1px 2px 1px #150e04;
    padding: 10px;
    margin-bottom: 15px

}

.img_thum a:hover,
.img_thum a.active:hover {
    color: #FFFFFF
}

.Grline {
    color: #442600;
    background: #f4e8dd url('_img/Gr_line.png') repeat-x;
    background-size: contain;
    padding-left: 15px
}

.btn_sty {
    background: #51361b;
    border: 1px solid #51361b;
    color: #f4e8dd;
    margin: 5px
}

.btn:hover,
.btn:focus,
.btn.focus {
    color: #51361b;
    background: #f4e8dd;
    text-decoration: none;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease
}

.bg_grad_shad {
    background: -webkit-linear-gradient(#8b645d 15%, #b3865d 30%, #f0c2aa 45%, #ffeddf 50%, #f0c2aa 60%, #b3865d 70%, #8b645d 90%); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#8b645d 15%, #b3865d 30%, #f0c2aa 45%, #ffeddf 50%, #f0c2aa 60%, #b3865d 70%, #8b645d 90%); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#8b645d 15%, #b3865d 30%, #f0c2aa 45%, #ffeddf 50%, #f0c2aa 60%, #b3865d 70%, #8b645d 90%); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#8b645d 15%, #b3865d 30%, #f0c2aa 45%, #ffeddf 50%, #f0c2aa 60%, #b3865d 70%, #8b645d 90%); /* Standard syntax */
    -webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.7);
    box-shadow: 0 3px 7px rgba(0, 0, 0, 0.7)
}

/* scroll to top */
.scrollup {
    position: fixed;
    width: 32px;
    height: 32px;
    bottom: 0px;
    right: 20px;
    background: #51361b
}

a.scrollup {
    outline: 0;
    text-align: center
}

a.scrollup:hover,
a.scrollup:active,
a.scrollup:focus {
    opacity: 1;
    text-decoration: none
}

a.scrollup i {
    margin-top: 10px;
    color: #fff
}

a.scrollup i:hover {
    text-decoration: none
}

.pagination > li > a,
.pagination > li > span {
    color: #51361b;
    background-color: #f4e8dd;
    border: 1px solid #51361b
}

.pagination > li > a:focus,
.pagination > li > a:hover,
.pagination > li > span:focus,
.pagination > li > span:hover {
    color: #51361b;
    background-color: #fefdfb;
    border-color: #51361b
}

.pagination > .active > a,
.pagination > .active > a:focus,
.pagination > .active > a:hover,
.pagination > .active > span,
.pagination > .active > span:focus,
.pagination > .active > span:hover {
    color: #fff;
    background-color: #51361b;
    border-color: #51361b
}

.form-control {
	color: #51361b;
	background-color: #ffddb5;
	border: 1px solid #c8ab99
}

.form-control:focus {
	border-color: #51361b;
	outline: 0;
	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .030), 0 0 3px #8a6d3b;
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, .030), 0 0 3px #51361b;
}

.form-control::-moz-placeholder {
	color: #ac7339;
	opacity: 1;
}