/*!
 *
 *
 *
 *
 */
@import url(http://fonts.googleapis.com/earlyaccess/droidarabickufi.css);

html,body { -webkit-font-smoothing: antialiased;  min-height: 100%; background: #fff;color: #666;
    font-family: 'Droid Arabic Kufi',Tahoma; font-weight: 400; font-size: 12px; line-height: 20px;}
ul{padding: 0}
a {color: #333;text-decoration: none}
a:hover,a:active,a:focus {outline: none;text-decoration: none;color: #00AEEF;}
img{max-width: 100%; }

h2{font-size: 18px; font-weight: 400;}
/* Layouts */
.wrapper { position: relative;width: 100%;height: auto; min-height: 100%;overflow-x: hidden;}
.wrapper:before,.wrapper:after {display: table;content: " ";}
.wrapper:after {clear: both;}

.navbar{border-radius: 0; }
header{background: #283545; margin-bottom: 10px;}

header .login-box{background: #FCC50E; width: 400px; padding: 15px; border-radius: 8px; margin: 15px; float: left; }
header .login-box .avatar{text-align: center}
header .login-box .avatar img{max-width: 100%; height: 80px; border-radius: 5px; }
.login-card{width: 450px; margin: 10px auto; }

.main-links{background: #f9f9f9; border: 1px #ededed solid; margin-bottom: 15px; border-radius: 5px; padding: 15px; text-align: center; }
.main-links .btn {margin: 3px 1px; }

.footer{background: #283545; min-height: 140px; padding: 15px 0; }
.footer h3.head-title{color: #fff; font-size: 18px; margin-bottom: 15px;}
.footer .links li{ list-style: inside; color: #ccc; padding: 5px; margin-bottom: 3px;}
.footer .links li a{color: #fff;}
.footer .links li:hover a{color: #FCC50E;}
.footer .logo{text-align: center; margin-bottom: 20px;}
.footer .logo img{width: 250px;}
.footer .social-media-icons{text-align: center; margin: 10px 0;}
.footer .social-media-icons a{ display: inline-block; margin: 5px; font-size: 22px; color: #ccc;}
.footer .social-media-icons a:hover{color: #fff;}

.footer-icons-bar{display: none; background: #111; position: fixed; width: 100%; bottom: 0; right: 0; padding: 0; text-align: center; color: #fff; }
.footer-icons-bar a{display: inline-block; width: 13%; color: #fff; padding: 10px; }
.footer-icons-bar a img{max-width: 99%; }
.footer-icons-bar a:hover{background: #000; }


.slider{margin-bottom: 10px;}

.box{margin-bottom: 10px; }
.box .box-title{background: #A1C849; color: #fff; padding: 8px 15px; }
.box .box-body{border: 1px #dfdfdf solid; padding: 10px; }

.user-box{margin-bottom: 10px; }
.user-box .title{background: #fcc50e; ; border-radius: 10px; padding: 11px; font-size: 14px; color: #fff; }
.user-box .body{background: #a1c849; padding: 8px; margin: 0 10px; }
.user-box .foot{background: #fcc50e; padding: 8px; font-size: 12px; font-family: Tahoma, Geneva, sans-serif; font-weight: bold; text-align: center; }
.account-links li {list-style: url('../images/acc_links_arrow.png') inside; float: right; width: 50%; }
.account-links li a{display: inline-block; padding: 8px; margin: 10px 3px;font-family: Arial, Helvetica, sans-serif; text-decoration: underline; font-size: 16px; font-weight: bold; }

.tbl-responsive{overflow-x: scroll;}

.post-list{border-bottom: 2px #ededed solid; margin-bottom: 10px; padding: 10px 0;}
.post-list .thumb-img{float: right; width: 180px; height: 110px; margin-left: 10px; }
.post-list .thumb-img img{width: 100%; height: 100%; }
.post-list h2{margin-top: 0px;  }
.post-list h2 a{color: #fcc50e;}
.post-list .icons span{ display: inline-block; margin: 8px;}

.post-view {border: 1px #ededed solid; padding: 10px;}
.post-view h1{font-size: 22px;color: #4AA3CF;border-bottom: 1px #ededed solid;padding: 8px;margin: 10px 0 ;}
.post-view .image{max-width: 500px; text-align: center; margin: 10px auto;}
.post-view .video{max-width: 600px; text-align: center; margin: 10px auto;}
.post-view .image img{max-width: 100%; border: 5px #ededed solid; border-radius: 4px;}
.post-view .icons{background: #f9f9f9; border-radius: 4px; padding: 8px; text-align: center; color: #999; margin-bottom: 15px;}
.post-view .icons span{display: inline-block; margin: 0 10px;}
.post-view .icons i{ color: #FCC50E;}

.media-list{position: relative; width: 100%; height: 200px; margin: 10px 0; text-align: center; overflow: hidden; border-bottom: 3px #BCD747 solid;}
.media-list .thumb-img{width: 100%; height:100%;}
.media-list .thumb-img img{width: 100%; height:100%;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
.media-list:hover .thumb-img img{
    -webkit-transform: scale(1.1,1.1);
    -moz-transform: scale(1.1,1.1);
    -o-transform: scale(1.1,1.1);
    transform: scale(1.1,1.1);
}
.media-list .desc{ position: absolute; bottom: -80px; right: 0; width: 100%; height: 80px; background: rgba(0,0,0,0.8); color: #fff;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
.media-list:hover .desc{bottom: 0px;}
.media-list .desc h2{font-size: 15px; }
.media-list .desc h2 a{color: #fff; }
.media-list .desc .icons{font-size: 10px; }

.photos-gallery{position: relative; width: 100%; height: 180px; margin: 10px 0; text-align: center; overflow: hidden; border-bottom: 3px #BCD747 solid;}
.photos-gallery img{ width: 100%; height: 100%;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
.photos-gallery:hover img{
    -webkit-transform: scale(1.1,1.1);
    -moz-transform: scale(1.1,1.1);
    -o-transform: scale(1.1,1.1);
    transform: scale(1.1,1.1);
}

.top-details{background: #f9f9f9; border-radius: 5px; padding: 20px 15px; margin: 10px 0;  }

#video-slider {height: 320px;margin: 30px 0 0;overflow: hidden;position: relative;padding: 0 50px 10px;}
#video-slider .viewport { height: 320px;overflow: hidden; position: relative;}
#video-slider .buttons {display: block;position: absolute;
    top: 40%;left: 0;width: 35px;height: 35px;color: #333;font-weight: bold;text-align: center;
    line-height: 35px;text-decoration: none;font-size: 22px;
}
#video-slider .next {right: 0;left: auto;top: 40%;}
#video-slider .buttons:hover {color: #C01313;background: #fff;}
#video-slider .disable {visibility: hidden;}
#video-slider .overview {list-style: none;position: absolute;padding: 0;margin: 0;width: 305px;left: 0;top: 0;}
#video-slider .overview li {position: relative; float: left;margin: 0 20px 0 0;padding: 1px;height: 3000px;width: 305px;}
.video-tv{background: url(../images/tv-img.png) no-repeat; width: 305px; height: 299px; position: relative; }
.video-tv img{position: absolute;top: 80px; right: 68px; width: 212px; height: 170px; border-radius: 8px; }

.page-boxes{margin-bottom: 10px; padding: 10px; background: #f9f9f9; text-align: center; }
.page-boxes img {max-width: 100%; height: 140px; }
.page-boxes h4 {font-size: 16px; }

.img-box{background: #f9f9f9; border: 1px #ccc solid; text-align: center; width: 140px; height: 140px; line-height: 140px; }
.img-box img{max-width: 100%; max-height: 100%; }

.page-card{background: #fff; padding: 15px; border: 1px #dfdfdf solid; }
.page-card .required{color: #ff0000; }

.teachers-list{background: #f9f9f9; border: 1px #dfdfdf solid; padding: 8px; margin-bottom: 15px; position: relative;}
.teachers-list img{width: 40px; height: 40px;}
.teachers-list span{font-size: 12px; font-weight: bold;}
.teachers-list i.badge{background: #ff0000; position: absolute; left: 10px; top: -10px; color: #fff; }
.teachers-list i.badge a{color: #fff; }

.discussions-box .discussions-text-box{ background: #f9f9f9; border-radius: 5px; margin: 10px; padding: 15px;}
.discussions-box .discussions-text-box textarea{ background: #fff; border: none; margin: 10px 0; padding: 15px;}
.discussions-box .msg-box{background: #f9f9f9; border: 1px #dfdfdf solid; border-radius: 5px; margin: 10px; padding: 15px;}
.discussions-box .msg-box.bg-2{background: #FFF8E1; border: 1px #CA9B02 solid; }
.discussions-box .msg-box.bg-2 .info{background: #FCC50E; border-bottom: 1px #FCC50E solid; color: #fff; padding: 15px; margin-bottom: 10px;}
.discussions-box .msg-box .info{background: #ccc; border-bottom: 1px #999 solid; color: #000; padding: 15px; margin-bottom: 10px;}
.discussions-box .msg-box .name{color: #DB0000; font-size: 16px; font-weight: bold; margin: 10px 0;}
.discussions-box .msg-box .name img{width: 40px; height: 40px; margin-left: 8px;}
.discussions-box .msg-box p{padding: 15px; background: #fff; border: 1px #ccc dashed;}

.contact-us{ background: #f9f9f9; border-radius: 5px; padding: 20px 30px; }
.contact-us .required{color: #ff0000; }

@media only screen and (max-width: 949px){

}
@media only screen and (max-width: 768px){
    .logo{text-align: center; margin-bottom: 15px;}
    header .login-box {float: none; margin: 15px auto; text-align: center; max-width: 370px; }
    .navbar-left {display: none; }
    .footer-icons-bar{display: block;}
}
@media only screen and (max-width: 640px){
    .login-card{width: 320px;}
}
@media only screen and (max-width: 480px){
    .logo{max-width: 320px;}
    header .login-box {max-width: 290px; }
}
@media only screen and (max-width: 320px){
}