body{
    background-color: #f3f3f3;
  font-family: JF-Flat;
}
@font-face {
  font-family: 'JF-Flat';
  src: url(fonts/JF-Flat-regular.eot), url(../fonts/JF-Flat-regular.ttf), url(../fonts/JF-Flat-regular.woff);
}
@media (min-width: 768px){
.navbar-right:last-child {
    margin-left: -15px;
    margin-right: 135px;
}
}
h4{font-weight: 600 }
a:hover{text-decoration: none; }
/*background colors*/
.bg-white{background: #fff;}
.bg-orange{background: #ff9800;}
.bg-green{background: #4caf50;}
.bg-blue{background: #2196f3;}
.bg-red{background: #f44336;}
.bg-lightgray{background: #eee;}
.bg-gray{background: #f3f3f3;}
.bg-darkgray{background: #757575;}
.bg-transparent{background: transparent;}
.bg-header{background:linear-gradient(rgba(0, 0, 0, 0.60), rgba(0, 0, 0, 0.60) ),url('../img/bg/header.jpg')no-repeat;background-size:coverbackground-size:cover}
.bg-header{background:linear-gradient(rgba(0, 0, 0, 0.60), rgba(0, 0, 0, 0.60) ),url('../img/bg/header.jpg')no-repeat;background-size:coverbackground-size:cover}
/*font colors*/
.text-white{color: #fff;}
.text-white a{color: #fff;}
.text-white:hover{color: #fff;}
.text-black{color: #000;}
.text-black a{color: #000;}
.text-black:hover{color: #000000;}
.text-orange{color: #ff9800;height: 32px;padding-top: 4px;}
.text-orange a{color: #ff9800;height: 32px;padding-top: 4px;}
.text-orange a:hover{color: #ff9800;height: 32px;padding-top: 4px;}
.text-green{color: #4caf50;}
.text-blue{color: #2196f3;}
.text-red{color: #f44336;}
.text-gray{color: #f3f3f3;}
.text-darkgray{color : #757575;}
/*font size*/
.text10{font-size: 10px} .text12{font-size: 12px} .text14{font-size: 14px} .text18{font-size: 18px} .text20{font-size: 20px} .text22{font-size: 22px} .text24{font-size: 24px}
/*padding*/
.padding10{padding: 10px;} .padding12{padding: 12px;}.padding15{padding: 15px;} .padding20{padding: 20px;} .padding25{padding: 25px;} .padding30{padding: 30px;} .padding-top10{padding-top: 10px;} .padding-top15{padding-top: 15px;} .padding-top20{padding-top: 20px;} .padding-top25{padding-top: 25px;} .padding-top30{padding-top: 30px;} .padding-bottom10{padding-bottom: 10px;} .padding-bottom15{padding-bottom: 15px;} .padding-bottom20{padding-bottom: 20px;} .padding-bottom25{padding-bottom: 25px;} .padding-bottom30{padding-bottom: 30px;} .padding-left10{padding-left: 10px;} .padding-left15{padding-left: 15px;} .padding-left20{padding-left: 20px;} .padding-left25{padding-left: 25px;} .padding-left30{padding-left: 30px;} .padding-right10{padding-right: 10px;} .padding-right15{padding-right: 15px;} .padding-right20{padding-right: 20px;} .padding-right25{padding-right: 25px;} .padding-right30{padding-right: 30px;}
/*margin*/
.margin10{margin: 10px;} .margin15{margin: 15px;} .margin20{margin: 20px;} .margin25{margin: 25px;} .margin30{margin: 30px;} .margin-top10{margin-top: 10px;} .margin-top15{margin-top: 15px;} .margin-top20{margin-top: 20px;} .margin-top25{margin-top: 25px;} .margin-top30{margin-top: 30px;} .margin-bottom10{margin-bottom: 10px;} .margin-bottom15{margin-bottom: 15px;} .margin-bottom20{margin-bottom: 20px;} .margin-bottom25{margin-bottom: 25px;} .margin-bottom30{margin-bottom: 30px;} .margin-left10{margin-left: 10px;} .margin-left15{margin-left: 15px;} .margin-left20{margin-left: 20px;} .margin-left25{margin-left: 25px;} .margin-left30{margin-left: 30px;} .margin-right10{margin-right: 10px;} .margin-right15{margin-right: 15px;} .margin-right20{margin-right: 20px;} .margin-right25{margin-right: 25px;} .margin-right30{margin-right: 30px;}
/*.container{ margin-top:15px;}*/
/*matrial shadows*/
.thumbnail {background-color: #fff; border: none; border-radius: 0px; text-align:center; padding: 20px; min-height: 300px; }
.box{min-height: 520px;padding: 20px 0 15px 0;}
.box-img{ height: 155px; overflow: hidden;} 
.box-img>img{min-height: 155px; min-width:100%;}
.box-text{min-height: 130px; overflow: hidden; }
.title-margin{z-index: 50; margin-bottom: 10px; }
.shadow-depth-0:hover{-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); }
.shadow-depth-1{-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); }
.shadow-depth-1:hover{-webkit-box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); -moz-box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); }
.shadow-depth-2{-webkit-box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); -moz-box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); }
.shadow-depth-3{-webkit-box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.24), 0 17px 50px 0 rgba(0, 0, 0, 0.19); -moz-box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.24), 0 17px 50px 0 rgba(0, 0, 0, 0.19); box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.24), 0 17px 50px 0 rgba(0, 0, 0, 0.19); }
.shadow-depth-4{-webkit-box-shadow: 0 16px 28px 0 rgba(0, 0, 0, 0.22), 0 25px 55px 0 rgba(0, 0, 0, 0.21); -moz-box-shadow: 0 16px 28px 0 rgba(0, 0, 0, 0.22), 0 25px 55px 0 rgba(0, 0, 0, 0.21); box-shadow: 0 16px 28px 0 rgba(0, 0, 0, 0.22), 0 25px 55px 0 rgba(0, 0, 0, 0.21); }
.rating {overflow: hidden; display: inline-block; font-size: 0; position: relative; }
.rating-input {float: left; width: 20px; height: 20px; padding: 0; margin: 0 0 0 -20px; opacity: 0; }
.rating:hover .rating-star:hover, .rating:hover .rating-star:hover ~ .rating-star, .rating-input:checked ~ .rating-star {background-position: 0 0; }
.rating-star, .rating:hover .rating-star {position: relative; float: left; display: block; width: 20px; height: 20px; background: url('img/star.png') 0 -20px; }
.dropdown.mega-dropdown.active>a{color : #ff9800;}
.dropdown.mega-dropdown.active::after{    position: absolute; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\f0d8"; bottom: -10px; font-size: 31px; color: #ff9800;}
.mega-dropdown-menu{border:none;}
.code-nav>li>a{color:#fff; font-size: 16px; padding:10px;}
.code-nav>li>a:focas{color:#ff9800; background: transparent; padding: 15px 15px 15px 0;}
.code-nav>li>a:hover{color:#ff9800; background: transparent;}
.nav>li>a:focus, .nav>li>a:hover {text-decoration: none; background-color: transparent; }
.nav .open>a, .nav .open>a:focus, .nav .open>a:hover{color:#111; background: transparent;}
.navbar{ margin: 0; }
/*megamenu*/
.home-slider-container{
  min-height: 400px;
}
.home-slider-item>p{
  text-align: center;
  position: relative;
  bottom: 60px;
  padding: 20px;
  color: #fff;
  background: rgba(0,0,0,0.5);
}
.home-slider-next{
    position: absolute;
    right: 0;
    top: 300px;
    background: rgba(0,0,0,.6);
    color: #fff;
    cursor: pointer;
    z-index: 50;
}
.home-slider-prev{
    position: absolute;
    left: 0;
    top: 300px;
    background: rgba(0,0,0,.6);
    color: #fff;
    cursor: pointer;
    z-index: 50;
}
.single-slider-container{
  min-height: 400px;
}
.single-slider-item>p{
  text-align: right;
  position: relative;
  bottom: 60px;
  padding: 20px;
  color: #fff;
  background: rgba(0,0,0,0.5);
}
.single-slider-next{
    position: absolute;
    right: 0;
    top: 150px;
    background: rgba(0,0,0,.6);
    color: #fff;
    cursor: pointer;
    z-index: 50;
}
.single-slider-prev{
    position: absolute;
    left: 0;
    top: 150px;
    background: rgba(0,0,0,.6);
    color: #fff;
    cursor: pointer;
    z-index: 50;
}
.keywords{
  border-radius: 20px;
  /*overflow:hidden;*/
}
.category-slider-container{
  min-height: 400px;
}
.category-slider-item>p{
  text-align: center;
  position: relative;
  bottom: 60px;
  padding: 20px;
  color: #fff;
  background: rgba(0,0,0,0.5);
}
.category-slider-next>i{
    position: relative;
    padding: 5px 15px;
    top: 200px;
    border-radius: 100%;
    border:solid 1px #ff9800;
    color: #ff9800;
    cursor: pointer;
    /*z-index: 50;*/
}
.category-slider-prev>i{
    position: relative;
    padding: 5px 15px;
    top: 200px;
    border-radius: 100%;
    border:solid 1px #ff9800;
    color: #ff9800;
    cursor: pointer;
}
.category-slider-next>i:hover{
    border:solid 1px #fdc97b;
    color: #fdc97b;
}
.category-slider-prev>i:hover{
    border:solid 1px #fdc97b;
    color: #fdc97b;
}
.news_laterarrow{padding-top: 5px; color: #ddd;}
.orange-box{border : solid 2px #ff9800;}
.home-tabs-head{ padding-top: 0!important; overflow:hidden; border-radius: 20px 20px 0 0;}
.home-tabs-head>li.active>a{background: #ffb112!important; color: #fff!important;}
.home-tabs-head>li>a{ padding: 15px 45px 15px 45px; color: #fff;}
.widget{ border-radius: 20px; overflow:hidden; }
.widget>h3{ margin: 0 0 10px;}
.nav-tabs {display: inline-block; border-bottom: none; padding-top: 15px; font-weight: bold; }
/*boxs*/
.wide-box-img-container{height: 300px; overflow:hidden; }
.wide-box-img{ min-width: 100%; min-height: 300px;}
.small-box{padding: 5px; border:#eee solid 1px; margin-bottom: 5px;}
.small-box:hover{border:#ff9800 solid 1px;}
.small-box-img-container{height: 80px; overflow:hidden;}
.small-box-img{width:100%; min-height: 80px;}
.normal-box{padding: 5px; border:#eee solid 1px; margin-bottom: 5px;}
.normal-box:hover{border:#ff9800 solid 1px;}
.normal-box-img-container{height: 180px; overflow:hidden;}
.normal-box-img{width:100%; min-height: 180px;}
/*cats heads*/
.cat-tabs-head-container{border-radius: 0 20px 20px 0;padding: 0; overflow: hidden;}
.cat-tabs-head{list-style: none; margin:0; padding: 0; width:100%;}
.cat-tabs-head>li{width: 100%;text-align: center; border-bottom:solid #eee 1px; cursor: pointer; padding: 15px 0 10px 0;}
.cat-tabs-data-container{border-radius: 20px 0 0 20px;}
.nav-tabs > li > a, 
.nav-tabs > li > a:hover, 
.nav-tabs > li > a:focus, 
.nav-tabs > li.active > a, 
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
  border: none;
  border-radius: 0;
}
.nav-list > li { 
  padding: 10px;
}
.nav-list > li > a { 
  color: #fff;
}
.nav-list > li > a:hover { text-decoration: none; }
.nav-list > li > a > span {
  display: block;
  font-weight: bold;
  text-transform: uppercase;
}
.mega-dropdown { position: static !important; }
.mega-dropdown-menu {
  text-align: center;
  width: 100%;
  background-color: #ff9800;
}
.mega-dropdown-menu>.container-fluid>.tab-content>.tab-pane {color: #fff;}
/*megamenu*/
@media screen and (max-width: 1080px) {
   .navbar-nav>li>a {color: #ff9800; margin: 20px 0 0; font-size: 20px; }
  .login_button {
    margin: 20px 0 0 0;
    border-radius: 0;
    box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        font-size: 16px;
  }
  .navbar-header{
    width: 15%; margin-top: -10px;
}
}
@media screen and (max-width: 1000px) {
	.navbar-header{
    width: 18%; margin-top: -10px;
}
  .navbar-nav {
    margin-right: 0;
  }
}
@media screen and (max-width: 768px) {
  .navbar-nav>li>a {
    color: #000;
    margin: 20px 0 0;
    font-size: 20px;
    padding: 20px 40px 0 0;
  }
  .navbar{
    z-index: 5000; 
    width: 100%
}
.navbar-header{
    width: 100%; margin-top: -10px;
}
  .navbar-nav {
    margin-right: 0;
  }
  .navbar-toggle{
    background: #eee;
    opacity: 1;
    margin-top: 30px;
    color: #ff9800;
  }
  .navbar-toggle>span{
    background: #ff9800
  }
  .navbar-collapse,.collaps,.in{
    position: relative;
    background: rgba(255,255,255,.9);
    width: 100%;
    z-index: 5000;
  }
}
.header{margin-top: -100px; }
.add-ads{
  border-radius: 20px;
  font-size: 18px;
}
  .flat-form{
    border-radius: 0;
    height: 35px;
    background: rgba(243, 243, 243,0.8);
  }
  .line-form{
    border-radius: 0;
    background: transparent;
    border:none;
    border-bottom: 2px #fff solid;
    color: #fff;
  }
  .bg-input{
    height: 50px;
  }
  .btn-orange{
    border-radius: 50px;
    padding: 5px 20px 5px 20px;
  }
  .hafe-orange-btn{
    border-radius: 50px 0 0 50px;
  }
  .hafe2-orange-btn{
    border-radius: 20px 0 0 20px;
  }
   .hafe-gray-btn{
    border-radius: 0 20px 20px 0;
  }

  .white-ul{
  list-style: none;
  padding: 0
}
.white-ul>li>a{
  color: #fff;
}
.white-ul>li{
  margin: 8px;
    font-size: 12px;
}
.footer-ul{
  display: inline-flex;
  list-style: none;
}
.footer-ul>li{
  padding: 20px
}
.pagination>li>a, .pagination>li>span {
    position: relative;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #ff9800;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd;
}
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
    z-index: 3;
    color: #fff;
    cursor: default;
    background-color: #ff9800;
    border-color: #ff9800;
}
.search-input{
  height: 40px;
  border-radius: 0 50px 50px 0;
  background: rgba(255,255,255,.8);
  border :none;
}
.btn-orange-border{
  border:solid 2px #ff9800;
  border-radius: 20px;
}
.btn-single-orange{
    padding: 5px 15px;
    border-radius: 100%;
    border:solid 1px #ff9800;
    color: #ff9800;
}
.btn-white-border{
  border:solid 2px #fff;
  border-radius: 20px;
}
.search-btn{
  height: 40px;
  border-radius: 50px 0 0 50px;
  background: rgba(255,152,0,.8);
  color: #fff;
  border :none;
}
.breadcrumb {
    padding: 8px 15px;
    margin-bottom: 20px;
    list-style: none;
    background-color: #ff9800;
    border-radius: 50px 0 0 50px;
    width: 50%;
}
.breadcrumb>li>a {
  color: #fff;
}
.breadcrumb>.active {
  color: #fff;
}
.videos-container{
  height: 400px;  
}
.videos-holder{
  height: 400px;
  overflow-y: scroll;
}
.videoslideitem{
  border :none ;
}
.videos-holder::-webkit-scrollbar {
  width: 5px;
}
.videos-holder::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.2); 
    border-radius: 5px;
}
.videos-holder::-webkit-scrollbar-thumb {
    border-radius: 5px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
} 
  ::-webkit-scrollbar {
      width: 20px;
  } 

  ::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.2); 
    border-radius: 5px;
}
::-webkit-scrollbar-thumb {
    border-radius: 5px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
}
.modalload {
    display:    none;
    top:        0;
    left:       0;
    height:     100%;
    padding: 100px;
    background: rgba( 255, 255, 255, .8 ) 
                url('http://i.stack.imgur.com/FhHRx.gif') 
                50% 50% 
                no-repeat;
}