@font-face {
	font-family: 'Gess';
    src: url("../fonts/GESSBold.otf");
    font-weight: bold;
}
@font-face {
	font-family: 'AlQalamQuran';
    src: url("../fonts/AlQalamQuran.ttf");
    font-weight: bold;
    
}
@font-face {
	font-family: 'mcs_GF6';
    src: url("../fonts/mcs_GF6.ttf");
    font-weight: bold;
}

@font-face {
	font-family: 'Heshamfree';
    src: url("../fonts/Hesham-free.ttf");
    font-weight: bold;
}
@font-face {
	font-family: 'Gess';
    src: url("../fonts/GESSMedium.otf");
    font-weight: 500;
}
@font-face {
	font-family: 'DroidSansArabic';
    src: url("../fonts/DroidSansArabic.ttf");
}
@font-face {
    font-family: "JFFlat-Regular";
    src: url("../fonts/JF-Flat-Regular.eot"); 
    src: url("../fonts/JF-Flat-Regular.eot?#iefix") format("embedded-opentype"),
      url("../fonts/JF-Flat-Regular.otf") format("opentype"),
      url("../fonts/JF-Flat-Regular.svg") format("svg"),
      url("../fonts/JF-Flat-Regular.ttf") format("truetype"),
      url("../fonts/JF-Flat-Regular.woff") format("woff"),
      url("../fonts/JF-Flat-Regular.woff2") format("woff2");
    font-weight: normal;
    font-style: normal;
  }
html.full-screen,
html.full-screen body{
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
}
body {
	font: normal 14px/1.4 DroidSansArabic, Gess, Helvetica, Arial, sans-serif;
    color: #000000;
     -ms-text-size-adjust: 100%;
     -webkit-text-size-adjust: 100%;
     -webkit-font-smoothing: antialiased;
     background: #FFF;
     direction: rtl;
}
a, .btn {
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}

a {
	color: #47A8FC;
	text-decoration: none!important;
}
a:hover {
	/*color: #f29210;*/
}
a:focus {
	outline: none;
}
p{
    font-family: DroidSansArabic, Gess, Helvetica, Arial, sans-serif;
    font-size: 14px;
}
::-moz-selection {
	color: #fff;
	background-color: #114b90;
}
::selection {
	color: #fff;
	background-color: #114b90;
}
a:hover, .btn:hover, .form-control:hover, a:focus, .btn:focus, .form-control:focus {
	transition-duration: .1s;
}
.fw-regular { font-weight: 400; }
.fw-meduim { font-weight: 500; }
.fw-semi-bold { font-weight: 600; }
.fw-light { font-weight: 300; }
.fw-bold { font-weight: bold; }

h1,
h2,
h3,
h4,
h5,
h6{
    font-family: 'Gess', Helvetica, Arial, sans-serif;
    color: #000000;
}
h1{
    font-size: 55px;
}
h2{
    font-size: 42px;
}
h3{
    font-size: 34px;
}
h4{
    font-size: 24px;
}
h5{
    font-size: 20px;
}
h6{
    font-size: 16px;
}
.date{
    margin-top: 10px;
    font-family: 'JFFlat-Regular', Helvetica, sans-serif;
    font-weight: 400;
    font-size: 12px;
    display: block;
}
span,
p,
ul li{
    font-family: 'JFFlat-Regular', Helvetica, sans-serif;
}
.br-bottom{
    display: block;
    height: 3px;
    width: 25px;
    background: #4EACFD;
    margin: auto;
}
@media(max-width:991px){
    .center-xs{
        text-align: center;
    }
    h1{
        font-size: 29px;
    }
    h2{
        font-size: 27px;
    }
    h3{
        font-size: 24px;
    }
    h4{
        font-size: 19px;
    }
    h5{
        font-size: 17px;
    }
    h6{
        font-size: 16px;
    }
}
.offset-top{
    margin-top: 130px;
}
.main-color{
    color: #28baf7;
}
.main-background{
    background: #28baf7;
}
.btn-main{
    background: #28baf7;
    display: inline-block;
    text-decoration: none;
    padding: 10px 25px;
    color: #FFF;
    font-size: 15px;
    font-weight: 400;
    border:none;
    /*border-radius: 25px;*/
    outline: none;
    text-align: center;
}
.btn-main:focus{
    outline: none;
    color: #FFF;
}
.btn-white{
    background: #FFF;
    color: #000000;
}
.btn-white:hover{
    background: #ef5075;
    color: #FFF;
}
.btn-red{
    background: #ef5075;
}
.btn-xs{
    padding: 10px 15px;
}
.btn-main:hover{
    color: #FFF;
}
.btn-lg{
    padding: 13px 30px;
}
.btn{
    border-radius: 0px !important;
}
.btnmore{
    width: 150px;
    height: 50px;
    font-size: 16px;
}
.white-bg{
    background: #FFF;
    height: auto;
    overflow: hidden;
    padding: 10px 20px;
}
.vertical-center{
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    transform: translateY(-50%);
    height: auto;
    overflow: hidden;
}
.dir-ltr{
    direction: ltr;
}
.border-bottom{
    height: 3px;
    width: 40px;
    background: #45c3f8;
    margin: auto;
    margin-top: 8px;
}
@media(max-width:480px){
    .offset-top{
        margin-top: 75px;
    }
}
.space-div{
    margin-top: 20px;
    display: block;
    height: auto;
    overflow: hidden;
}

.animated  {
    -webkit-animation-duration : 20ms  ;
    animation-duration : 20ms  ;
  
    -webkit-animation-delay : 20ms  ;
    animation-delay : 20ms  ;
}
.animate-out {
    -webkit-animation-delay : 0ms  ;
    animation-delay : 0ms  ;
}
.owl-carousel .owl-dots {
    position: absolute;
    bottom: 20px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    transform: translateX(-50%);
}
.owl-carousel .owl-dots .owl-dot{
    display: inline-block;
}
.owl-carousel .owl-dots span {
    background: none repeat scroll 0 0 rgba(149, 152, 154, 0.36);
    border-radius: 20px;
    display: block;
    height: 11px;
    margin: 5px 2px;
    opacity: 1;
    width: 11px;

}
.owl-carousel .owl-dots .owl-dot.active span{
    background: #4EACFD;
    width: 13px;
    height: 13px;
    transition: all .2s ease;
}

/*****
    Fix Problem Bootstrap grid
*****/
.row.display-flex {
  display: flex;
  flex-wrap: wrap;
}
.row.display-flex > [class*='col-'] {
  display: flex;
  flex-direction: column;
}
/*****
   Equals grid
*****/
.row.equal {
    display: flex;
    flex-wrap: wrap;
}
.vacol-xs-1, .vacol-xs-2, .vacol-xs-3, .vacol-xs-4, .vacol-xs-5, .vacol-xs-6, .vacol-xs-7, .vacol-xs-8, .vacol-xs-9, .vacol-xs-10, .vacol-xs-11, .vacol-xs-12,
.vacol-sm-1, .vacol-sm-2, .vacol-sm-3, .vacol-sm-4, .vacol-sm-5, .vacol-sm-6, .vacol-sm-7, .vacol-sm-8, .vacol-sm-9, .vacol-sm-10, .vacol-sm-11, .vacol-sm-12,
.vacol-md-1, .vacol-md-2, .vacol-md-3, .vacol-md-4, .vacol-md-5, .vacol-md-6, .vacol-md-7, .vacol-md-8, .vacol-md-9, .vacol-md-10, .vacol-md-11, .vacol-md-12,
.vacol-lg-1, .vacol-lg-2, .vacol-lg-3, .vacol-lg-4, .vacol-lg-5, .vacol-lg-6, .vacol-lg-7, .vacol-lg-8, .vacol-lg-9, .vacol-lg-10, .vacol-lg-11, .vacol-lg-12 {
	position: relative;
	min-height: 1px;
	padding-left:15px;
	padding-right:15px;
}
.varow-xs {
	display: table;
	width: 100%;
	table-layout: fixed;
}
.vacol-xs-1, .vacol-xs-2, .vacol-xs-3, .vacol-xs-4, .vacol-xs-5, .vacol-xs-6, .vacol-xs-7, .vacol-xs-8, .vacol-xs-9, .vacol-xs-10, .vacol-xs-11, .vacol-xs-12 {
	display: table-cell;
	vertical-align: middle;
}
.vacol-xs-12 { width: 100%; }
.vacol-xs-11 { width: 91.66666667%; }
.vacol-xs-10 { width: 83.33333333%; }
.vacol-xs-9 { width: 75%; }
.vacol-xs-8 { width: 66.66666667%; }
.vacol-xs-7 { width: 58.33333333%; }
.vacol-xs-6 { width: 50%; }
.vacol-xs-5 { width: 41.66666667%; }
.vacol-xs-4 { width: 33.33333333%; }
.vacol-xs-3 { width: 25%; }
.vacol-xs-2 { width: 16.66666667%; }
.vacol-xs-1 { width: 8.33333333%; }

@media screen and (min-width: 768px) {
	.varow-sm {
		display: table;
		width: 100%;
		table-layout: fixed;
	}
	.vacol-sm-1, .vacol-sm-2, .vacol-sm-3, .vacol-sm-4, .vacol-sm-5, .vacol-sm-6, .vacol-sm-7, .vacol-sm-8, .vacol-sm-9, .vacol-sm-10, .vacol-sm-11, .vacol-sm-12 {
		display: table-cell;
		vertical-align: middle;
	}
	.vacol-sm-12 { width: 100%; }
	.vacol-sm-11 { width: 91.66666667%; }
	.vacol-sm-10 { width: 83.33333333%; }
	.vacol-sm-9 { width: 75%; }
	.vacol-sm-8 { width: 66.66666667%; }
	.vacol-sm-7 { width: 58.33333333%; }
	.vacol-sm-6 { width: 50%; }
	.vacol-sm-5 { width: 41.66666667%; }
	.vacol-sm-4 { width: 33.33333333%; }
	.vacol-sm-3 { width: 25%; }
	.vacol-sm-2 { width: 16.66666667%; }
	.vacol-sm-1 { width: 8.33333333%; }
}
@media screen and (min-width: 992px) {
	.varow-md {
		display: table;
		width: 100%;
		table-layout: fixed;
	}
	.vacol-md-1, .vacol-md-2, .vacol-md-3, .vacol-md-4, .vacol-md-5, .vacol-md-6, .vacol-md-7, .vacol-md-8, .vacol-md-9, .vacol-md-10, .vacol-md-11, .vacol-md-12 {
		display: table-cell;
		vertical-align: middle;
	}
	.vacol-md-12 { width: 100%; }
	.vacol-md-11 { width: 91.66666667%; }
	.vacol-md-10 { width: 83.33333333%; }
	.vacol-md-9 { width: 75%; }
	.vacol-md-8 { width: 66.66666667%; }
	.vacol-md-7 { width: 58.33333333%; }
	.vacol-md-6 { width: 50%; }
	.vacol-md-5 { width: 41.66666667%; }
	.vacol-md-4 { width: 33.33333333%; }
	.vacol-md-3 { width: 25%; }
	.vacol-md-2 { width: 16.66666667%; }
	.vacol-md-1 { width: 8.33333333%; }
}
@media screen and (min-width: 1200px) {
	.varow-lg {
		display: table;
		width: 100%;
		table-layout: fixed;
	}
	.vacol-lg-1, .vacol-lg-2, .vacol-lg-3, .vacol-lg-4, .vacol-lg-5, .vacol-lg-6, .vacol-lg-7, .vacol-lg-8, .vacol-lg-9, .vacol-lg-10, .vacol-lg-11, .vacol-lg-12 {
		display: table-cell;
		vertical-align: middle;
	}
	.vacol-lg-12 { width: 100%; }
	.vacol-lg-11 { width: 91.66666667%; }
	.vacol-lg-10 { width: 83.33333333%; }
	.vacol-lg-9 { width: 75%; }
	.vacol-lg-8 { width: 66.66666667%; }
	.vacol-lg-7 { width: 58.33333333%; }
	.vacol-lg-6 { width: 50%; }
	.vacol-lg-5 { width: 41.66666667%; }
	.vacol-lg-4 { width: 33.33333333%; }
	.vacol-lg-3 { width: 25%; }
	.vacol-lg-2 { width: 16.66666667%; }
	.vacol-lg-1 { width: 8.33333333%; }
}

.row-pad-none {
    margin-left:  0px;
    margin-right:  0px;
}
.row-pad-none [class^="vacol-"], .row-pad-xs [class*=" vacol-"],
.row-pad-none [class^="col-"], .row-pad-xs [class*=" col-"] {
    padding-left: 0px;
    padding-right: 0px;
}
.row-pad-xs {
    margin-left: -5px;
    margin-right: -5px;
}
.row-pad-xs [class^="vacol-"], .row-pad-xs [class*=" vacol-"],
.row-pad-xs [class^="col-"], .row-pad-xs [class*=" col-"] {
    padding-left: 5px;
    padding-right: 5px;
}
.row-pad-xxs {
    margin-left: -3px;
    margin-right: -3px;
}
.row-pad-xxs [class^="vacol-"], .row-pad-xs [class*=" vacol-"],
.row-pad-xxs [class^="col-"], .row-pad-xs [class*=" col-"] {
    padding-left: 3px;
    padding-right: 3px;
}
.row-pad-sm {
    margin-left: -10px;
    margin-right: -10px;
}
.row-pad-sm [class^="vacol-"], .row-pad-sm [class*=" vacol-"],
.row-pad-sm [class^="col-"], .row-pad-sm [class*=" col-"] {
    padding-left: 10px;
    padding-right: 10px;
}
.row-pad-md {
    margin-left: -15px;
    margin-right: -15px;
}
.row-pad-md [class^="vacol-"], .row-pad-md [class*=" vacol-"],
.row-pad-md [class^="col-"], .row-pad-md [class*=" col-"] {
    padding-left: 15px;
    padding-right: 15px;
}
.row-pad-lg {
    margin-left: -20px;
    margin-right: -20px;
}
.row-pad-lg [class^="vacol-"], .row-pad-lg [class*=" vacol-"],
.row-pad-lg [class^="col-"], .row-pad-lg [class*=" col-"] {
    padding-left: 20px;
    padding-right: 20px;
    
}
/************
    NavBar
************/
.navbar{
    border-radius: 0px;
}
.navbar-default{
    background: #ffffff;
    border-bottom: none;
    margin-bottom: 0;
}
.navbar-default .dropdown-menu>li>a{
    padding: 8px 22px;
    border-right: 4px solid transparent;
}
.navbar-default  .dropdown-menu{
    min-width: 190px;
    margin-top: -1px;
    border-top: none;
    margin-right: -1px;
}
.navbar-default .dropdown-menu>li.active>a,
.navbar-default .dropdown-menu>li>a:hover{
    /*border-color: #4EACFD;*/
    padding-right: 24px;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    transition: all 200ms ease;
}

.navbar-default .navbar-nav>li>a:not(.logo){
    color: #272727;
    font-size: 15px;
    font-family: 'DroidSansArabic', Helvetica, Arial, sans-serif;
    font-weight: 600;
    /*border-top: 4px solid transparent;*/
    position: relative;
}
.navbar-default .navbar-nav>li>a:not(.logo):after{
    content: '';
    position: absolute;
    bottom: 15px;
    left: 50%;
    width: 0px;
    margin-left: -10px;
    height: 2px;
    transition: all 200ms ease;
}
.navbar-default .navbar-nav>li.active>a:not(.logo):after,
.navbar-default .navbar-nav>li>a:not(.logo):hover:after{
    width: 20px;
    background: #4EACFD;
    transition: all 200ms ease;
}
.navbar-default .navbar-nav>li.active>a:not(.logo),
.navbar-default .navbar-nav>li>a:not(.logo):hover{
    color: #4EACFD;
    /*border-color: #4EACFD;*/
}
.navbar-default .navbar-nav>li>a.logo{
    padding-top: 10px;
    padding-bottom: 10px;
}

.navbar-default .navbar-nav>li.langs ul li img{
    width: 24px;
}
.nav .open>a, .nav .open>a:focus, .nav .open>a:hover{
    border-color: #4EACFD;
}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover{
    background: transparent;
}
.navbar-default .navbar-nav>li.langs ul li{
    height: 25px;
    width: 25px;
    border-radius: 100%;
    /*background: #e5e5e5;*/
    line-height: 25px;
    text-align: center;
    margin-right: 5px;
}
.navbar-default .navbar-nav>li.langs ul li{
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    transition: all 200ms ease;
}
.navbar-default .navbar-nav>li.langs ul li:hover,
.navbar-default .navbar-nav>li.langs ul li.active{
    /*background: #60bff6;*/
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    transition: all 200ms ease;
}
.navbar-default .navbar-nav>li.langs ul li a{
    display: block;
    margin: auto;
    margin: 0px;
    padding: 0px;
    font-family: Raleway, Montserrat, Helvetica, Arial, sans-serif;
    font-size: 11.5px;
    text-decoration: none;
    color: #FFF;
}
.navbar-default .navbar-brand img{
    /* height: 44px;
    width: 120px; */
    max-width: 134px;
}
.navbar-default .navbar-brand h1{
    color: #181818;
    font-size: 15px;
    margin: 17px 0px 0px;
    font-weight: 600;
    transform: translateZ(0);
}

.navbar-right .social-media{
    margin-top: 25px;
}
.social-media li{
    margin:0px;
    padding: 0px;
    margin-right: 4px;
}
.navbar-right .social-media li a{
  background: #656670;
    border-radius: 50%;
}
.social-media li a{
  
    display: inline-block;
    width: 27px;
    height: 27px;
    padding: 0px;
    text-align: center;
    line-height: 28px;
    color: #FFF;
}
.social-media li.facebook a{
    background: #3b5998
}
.social-media li.twitter a{
    background: #55acee;
}
.social-media li.youtube a{
    background: #bb0000;
}
.social-media li.facebook a:hover{
    background: #3b5998
}
.social-media li.twitter a:hover{
    background: #55acee;
}
.social-media li.youtube a:hover{
    background: #bb0000;
}
.social-media li a:hover,
.social-media li a{
    border-top: transparent;
    color: #FFF;
}

@media (min-width: 768px){
    .navbar-nav>li>a {
        padding-top: 25px;
        padding-bottom: 25px;
    }   
    .navbar-default .navbar-nav>li.langs ul{
        padding-top: 25px;
        padding-bottom: 22px;
        padding-right: 15px;
    }
    
}
@media(max-width:480px){
    .navbar-default .navbar-brand h1{
        margin-top: -5px;
    }
     .navbar-right .social-media {
         margin-top: 0;
         margin-bottom: 10px;
     }

    .navbar-right .social-media li{
        display: inline-block;
        
    }
}
@media(max-width:767px){
    .owl-nav{
        display: none;
    }
    .owl-carousel .owl-item .play{
        top: 50%;
        left: -20px;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        transform: translateY(-50%);
    }
    .main-section .parent.vertical-center{
        top: auto;
        transform: none;
    }
    .navbar-default .navbar-brand img{
        max-width: 94px;
    }
}
.animated  {
    -webkit-animation-duration : 2s  ;
    animation-duration : 2s  ;
  
    -webkit-animation-delay : 300ms  ;
    animation-delay : 300ms  ;
}
.animate-out {
    -webkit-animation-delay : 0ms  ;
    animation-delay : 0ms  ;
}

/*
  Animate Text
*/
.para{
    /*opacity: 0;*/
}
.paraFadeIn {
    -webkit-animation: slideIn 1s ease 0.3s forwards;
    animation: slideIn 1s ease 0.3s forwards;
}
@-webkit-keyframes slideIn {
    0%{
        -webkit-transform: translateY(50px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
        opacity: 1;
    }
}
@keyframes slideIn {
    0% {
        -webkit-transform: translateY(50px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
        opacity: 1;
    }
}

@keyframes slideRight {
    0% {
        right: 40px;
        opacity: 0;
    }
    100% {
        right:32px;
        opacity: 1;
    }
}

@keyframes slideLeft{
    0% {
        left: 40px;
        opacity: 0;
    }
    100% {
        left:32px;
        opacity: 1;
    }
}

.overlay{
    position: absolute;
    height: 100%;
    width: 100%;
    background: rgba(16, 18, 28, 0.7);
    top: 0px;
    left: 0px;
}
/**
    full-screen-slide
**/
.full-screen-slide .item,
.full-screen-slide{
    height: 100vh;
    width: 100%;
    position: relative;
}
.full-screen-slide .item,
.full-screen-slide{
    height: calc(100vh - 75px);
}
.full-screen-slide .item:before,
.full-screen-slide:before{
    content: '';
    position: absolute;
    top: 0px;
    left:0px;
    height: 100%;
    width:100%;
    z-index: -1;
    background: #FFF;
}
/******
    Qui Sommes Nous
*****/
section.qui-sommes-nous{
    width: 100%;
    background: #FFF;
    color: #444444;
    z-index: 1031;
    /*position: relative;*/
    padding: 50px 0px 40px;
}
.bloc-slide {
    /* border: 20px solid #fff; */
    z-index: 9999999;
    /*position: fixed;*/
    position: fixed;
    width: 100%;
    height: auto;
    top: 0;
    left: 0;
    background: #FFF;
    /*max-height: 630px;*/
    overflow: hidden;
   /*min-height: 100vh;
    max-height: 100%;*/
    height: 100vh;
    overflow-y: auto;
}
.main-popup .close,
section.qui-sommes-nous .close{
    position: absolute; 
    background: #28baf7;
    padding: 20px 20px;
    opacity: 1;
    /* right: 50%; */
    /* -webkit-transform: translateX(-50%); */
    /* transform: translateX(-50%); */
     top: 0px; 
    z-index: 999;
    display: block;
    width: 70px;
    margin: auto;
    float:none;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}
.main-popup .close img,
section.qui-sommes-nous .close img{
    width: 30px;
}
.main-popup .close.center{
    right: auto;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    transform: translateX(-50%);
}
.main-popup .close.blue{
    background:#50B5F4;
}

section.qui-sommes-nous h1{
    font-family: 'DroidSansArabic', Helvetica, Arial, sans-serif;
    margin-bottom: 20px;
    color: #212329;
    font-size: 47px;
}
section.qui-sommes-nous div img{
    max-width: 100%;
    display: block;
    margin: auto;
    margin-bottom: 30px;
}
section.qui-sommes-nous p{
    color: #444;
    font-size: 15px;
    line-height: 1.8;
    margin-bottom:15px;
} 
@media(max-width:991px){
    section.qui-sommes-nous .vertical-center{
        top: auto;
        transform: none;
    }
}
/*****
    Videos
*****/
section.videos{
    
}

.overlay-debouche {
	visibility: hidden;
	-webkit-transform: translateY(60%) scale(0);
	transform: translateY(60%) scale(0);
	-webkit-transition: -webkit-transform 0.4s, visibility 0s 0.4s;
	transition: transform 0.4s, visibility 0s 0.4s;
}
.overlay-debouche.open {
	visibility: visible;
	-webkit-transform: translateY(0%) scale(1);
	transform: translateY(0%) scale(1);
	-webkit-transition: -webkit-transform 0.4s;
	transition: transform 0.4s;
}

.overlay-contact {
	visibility: hidden;
	-webkit-transform: translateY(60%) scale(0);
	transform: translateY(60%) scale(0);
	-webkit-transition: -webkit-transform 0.4s, visibility 0s 0.4s;
	transition: transform 0.4s, visibility 0s 0.4s;
	border: 0;
}

.overlay-contact.open {
	visibility: visible;
	-webkit-transform: translateY(0%) scale(1);
	transform: translateY(0%) scale(1);
	-webkit-transition: -webkit-transform 0.4s;
	transition: transform 0.4s;
}

.trigger-overlay-contact-form {
	visibility: hidden;
	-webkit-transform: translateY(60%) scale(0);
	transform: translateY(60%) scale(0);
	-webkit-transition: -webkit-transform 0.4s, visibility 0s 0.4s;
	transition: transform 0.4s, visibility 0s 0.4s;
}
.trigger-overlay-contact-form.open {
	visibility: visible;
	-webkit-transform: translateY(0%) scale(1);
	transform: translateY(0%) scale(1);
	-webkit-transition: -webkit-transform 0.4s;
	transition: transform 0.4s;
}
@media(max-width:767px){
    .post-banner .date{
        font-size: 17px;
    }
    .details-post .post-content,
    .post .post-content{
        padding: 10px 15px;
        margin-top: 10px;
    }
    .post-banner h2{
        font-size: 35px;
    }
}
ul.social-media{
    margin-top: 20px;
    margin-bottom: 0;
}
ul.social-media li{
    background: #000;
}
ul.social-media  li.facebook{
    background:#3b5998;
}
ul.social-media  li.facebook{
    background:#007bb5;
}
ul.social-media  li.whatsapp{
    background:#4dc247;
}
ul.social-media  li.linkedin{
    background: #007bb5;
}
ul.social-media  li.google-plus{
    background: #dd4b39;
}
ul.social-media  li.twitter{
    background:  #55acee;
}
/**
    popup
**/
.main-bg{
    background: #FFF;
}
.ns-appl .top-content{
    height: 50vh;
}
.ns-appl .top-content h4{
    font-size: 39px;
    margin-bottom: 0px;
}
.ns-appl .top-content h1{
    font-family: "Gess",Arial, Helvetica, sans-serif;
    margin-top: 0px;
    font-size: 65px;
    font-weight: bold;
    margin-bottom: 0;
}
.ns-appl .top-content span{
    color: #FFF;
    font-size: 22px;
    font-weight: 400;
}
.ns-appl .content{
    background:#FFF;
}
.ns-appl .content .text{
    margin-top: -80px;
    background: #FFF;
    position: relative;
    z-index: 2;
    padding: 25px 25px;
    color: #404040;
}
.ns-appl .content .text p{
    line-height: 1.6;
    color: #404040;
    font-family: 'DroidSansArabic', Helvetica, Arial, sans-serif;
}
.ns-appl .content .text p.last-para{
    font-family: "Gess",Arial, Helvetica, sans-serif;
    font-size: 17px;
    margin-top: 13px;
    
}
.ns-appl .content .text p.last-para span{
    font-size: 16px;
    color: #404040;
    font-family: 'DroidSansArabic', Helvetica, Arial, sans-serif;
}

/**
    Contact
**/

section.contact{
    font-family: 'DroidSansArabic', Helvetica, Arial, sans-serif;  
    /*padding-top: 80px;  */
}
section.contact h1{
    margin-bottom: 8px;
    font-family: "Gess",Arial, Helvetica, sans-serif;
}
section.contact p{
    margin-bottom: 30px;
    color: #FFF;
    font-size: 15px;
    
}
section.contact label{
    color: #FFF;
    margin-top: 8px;
    font-size: 14px;
    text-align: left;
}
section.contact input,
section.contact textarea{
    border-radius: 0px;
    /*border:none;*/
    box-shadow: none;
}
section.contact input{
    height: 45px;
}
section.contact textarea{
    height: 100px;
    resize: none;
}
section.contact .btn-main{
    border-radius: 0px;
    padding: 11px 35px;
    margin-top: 15px;
}
section.contact .btn-main,
section.contact .btn-main:focus{
    outline: none;
    box-shadow: none;
}
section.contact .social-media{
    margin-top: 25px;
}
section.contact .social-media li{
    border-radius: 50%;
    overflow: hidden;
}
section.contact .social-media li a{
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    
}
@media(max-width:991px){
    section.contact .vertical-center{
        top: auto;
        transform: none;
    }
    .contact{
        padding-top:80px;
    }
    .contact div img{
        display: block;
        margin:auto;
        max-width: 100%;
        margin-top:20px;
    }
}
.owl-carousel.owl-rtl .owl-item.active{
    position: relative;
}
.owl-carousel.owl-rtl .owl-item.active:after{
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(255,255,255,0.18);
    top: 0px;
    left: 0px;
}
/* .owl-carousel.owl-rtl .owl-item.active .vertical-center{
    display: none;
} */

#full-screen-slide .vertical-center{
    padding-right: 198px;
}
.space-top{
    margin-top: 20px;
    height: 510px;
}
.space-top h1{
    margin-top: 0px;
    margin-bottom: 0px;
}
.space-top .play{
    top: 50%;
    left: 20%;
    -webkit-transform: translate(-50%,-20%);
    -moz-transform: translate(-50%,-20%);
    transform: translate(-50%,-20%);
}
img.mfp-img{
    padding: 0px 0px 40px!important;
}
.mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close{
    position: absolute;
    color: #FFF;
    right: 0px;
    display: inline-block;
    background: #4EACFD;
    padding: 0px 17px;
    width: auto;
    opacity: 1;
    font-size: 35px;
}
.mfp-ready .mfp-figure{
    background: #FFF;
}


.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    margin-bottom: 10px;
}

.video-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/***
    Media
**/
.media{
    min-height: calc(100vh - 90px);
}
.partage{

}
.partage li{
    padding: 0px 2px;
}
.partage li a {
    display: inline-block;
    height: 35px;
    width: 35px;
    line-height: 40px;
    text-align: center;
    background: #000;
}
.partage li a.facebook{
    background: #3b5998;
}
.partage li a.twitter{
    background:#55acee;
}
.partage li a.google{
    background: #dd4b39;
}
.partage li a.linkedin{
    background: #007bb5;
}
.partage li a.whatsapp{
    background:  #4dc247;
}
.partage li a.pinterest{
    background: #cb2027;
}
.partage li a.youtube{
    background: #ff0000;
}
.partage li a i{
    color: #FFF;
    font-size: 18px;
}
.ft-gess{
    font-family: "Gess",Arial, Helvetica, sans-serif!important;
    font-weight: bold;
    font-size: 35px!important;
}



/****
    header
****/
header{position :relative;}
#last-news{
    background: #28baf7;
    height: 45px;
    
}
#last-news span.typed{
    display: inline-block;
    height: 40px;
    font-size: 24px;
    font-weight: bold;
    font-family:'AlQalamQuran';
    margin-top: -5px;
}
#last-news span.typed span{
    font-size: 15px;
}
#last-news > div{
    text-align: center;
    /*padding: 15px 0px;*/
    color: #FFF;
    padding-top: 8px;
}

.posts-items{
    height: auto;
    /*margin-top: 50px;*/
    padding: 20px 0px 0px;

}
.post{
   
    height: 510px;
    background: #FFF;
    overflow: visible;
    margin-bottom: 50px;
}
.post a{
    display: block;
    height: auto;
    overflow: hidden;
    transition: all 200ms linear;
    box-shadow: 4px 4px 20px #f9f9f9,4px 4px 20px #f9f9f9;
}
.post a:hover{
    transform: scale(1.05);
    transition: all 200ms linear;
    box-shadow: 2px 2px 27px #f5f5f5, 1px 1px 12px #f5f5f5;
}
.large:hover{
    transform: scale(1.05);
    transition: all 200ms linear;
    box-shadow: 2px 2px 27px #f5f5f5, 1px 1px 12px #f5f5f5;
}
.slide a:hover{
    transform: scale(1.05);
    transition: all 200ms linear;
    box-shadow: 2px 2px 27px #f5f5f5, 1px 1px 12px #f5f5f5;
}
.post.large{
    box-shadow: 4px 4px 20px #f9f9f9,4px 4px 20px #f9f9f9;
    height: 450px;
    transition: all 200ms linear;
}
.post .image-container{

}
.post .image-container img{
    width: 100%;
    /*max-height: 260px;*/
}
.post .description{
    padding: 10px 15px;
    background: #FFF;
}
.post .description span{
    color: #000;
}
.post .description h2{
    font-size: 22px;
    margin-top: 5px;
    /*height: 2.4em;*/
    line-height: 1.2;
    /*overflow: hidden;*/
}
.post .description p{
    color: #8e8e8e;
    font-size: 13px;
}
.post .description .date + p{
    font-size: 14px;
}
.post.large{
    position: relative;
}
.post.large .description{
    position: absolute;
    max-width: 400px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 50px;
}
.post.large .description{
    padding: 20px;
}
.post.large .description h2{
    height: auto;
}
.post.large .description .date+p{
    color: #444;
    font-size: 14px;
    line-height: 1.5;
}
@media(max-width:991px){
    .post .image-container img{
        max-height: 260px;
    }
    .post.large .description{
        right: 0px;
        bottom: 0px;
        top: auto;
        transform: none;
        max-width: 300px;
    }
}
/***
    Footer
***/
.footer-contact{
    background: #394a57;
    padding: 80px 0px;
}
.footer-contact img{
    max-width: 100%;
    display: block;
    margin: auto;
}
.footer-contact h3{
    color: #FFF;
    font-size: 19px;
    margin: 4px 0px;
}
.footer-contact ul.list-unstyled{

}
.footer-contact ul.list-unstyled{
    margin-top: 10px;
}
.footer-contact ul.list-unstyled li{
    margin-bottom: 5px;
}
.footer-contact ul.list-unstyled li a{
    color: #FFF;
}
.footer-contact ul.list-unstyled li a:hover{
    color: #28baf7;
}
.footer-contact ul.list-inline{

}
.footer-contact ul.list-inline li{
    
}
.footer-contact ul.list-inline li a{
    color: #FFF;
    font-size: 19px;
}
.footer-contact ul.list-inline li a:hover{
    color: #28baf7;
}
.footer-contact p{
    color: #bbc4cb;
}
.footer-contact h3 + form > .input-group{
    margin-top: 17px;
}
.footer-contact h3 + form > .input-group input{
    border-radius: 0px;
    border:none;
    height: 40px;
}
.footer-contact h3 + form > .input-group button{
    border-radius: 0px;
    border-color:#28baf7;
    height: 40px;
    background: #28baf7;
    color: #FFF;
}
.copyrit{
    padding: 16px 0px;
}
.copyrit p{
    margin: 0px;
    color: #FFF;
}

/***
    Section 1 
***/
#last-news-slide .item a,
#last-news-slide .item,
#last-news-slide{
    height: 460px;
    position: relative;
    display: block;
}
#last-news-slide .item .vertical-center{
    top: 70%;
    -webkit-transform: translateY(-70%);
    -moz-transform: translateY(-70%);
    transform: translateY(-70%);
}
#last-news-slide .item .description{
    z-index: 999;
    background: #FFF;
    position: relative;
    max-width: 400px;
    right: 50px;
    padding: 20px;
    height: 207px
}
#last-news-slide .item .description h2{
    height: auto;
    font-size: 24px;
}
#last-news-slide .item .description .date{
    margin-top: 10px;
}
#last-news-slide .item .description .date+p{
    color: #444;
    font-size: 14px;
    line-height: 1.5;
}
#last-news-slide .owl-nav{
    background: #000000;
    position: absolute;
    /*top: 71px;*/
    top: 137px;
    right: 50px;
    z-index: 999;
    width: 99px;
    height: 40px;
    overflow: hidden;
}
#last-news-slide .owl-nav:before{
    content: '';
    position: relative;
    height: 50px;
    width: 92px;
}
#last-news-slide .owl-nav .owl-prev,
#last-news-slide .owl-nav .owl-next{
    position: absolute;
    top: 0px;
    height: 50px;
    padding: 9px 8px;
    -webkit-transition:all 200ms ease;
    -moz-transition:all 200ms ease;
    transition:all 200ms ease; 
}
#last-news-slide .owl-nav .owl-prev:hover,
#last-news-slide .owl-nav .owl-next:hover{
    background: #28baf7;
    -webkit-transition:all 200ms ease;
    -moz-transition:all 200ms ease;
    transition:all 200ms ease;
}
#last-news-slide .owl-nav .owl-prev{
    left: 0px;
}
#last-news-slide .owl-nav .owl-next{
    right: 0px;
}
#last-news-slide .owl-nav img{
    max-width: 30px;
    height: 20px;
}

#last-news-slide .owl-nav .current-slide{
    color: #FFF;
    display: block;
    position: absolute;
    left: 40%;
    top: 10px;
}
@media(max-width:991px){
    #last-news span.typed{
        font-weight: 13px;
        font-weight: 400;
    }
    #last-news{
        height: auto;
        padding: 10px 0px;
    }
    #last-news-slide .item .vertical-center{
        top: 70%;
        -webkit-transform: translateY(-70%);
        -moz-transform: translateY(-70%);
        transform: translateY(-70%);
    }
    #last-news-slide .item .description{
        max-width: 95%;
        right: 10px;
    }
}
/**
    Animation
**/
@media(min-width:992px){
    .animatable {
        /* initially hide animatable objects */
        visibility: hidden;
        
        /* initially pause animatable objects their animations */
        -webkit-animation-play-state: paused;   
        -moz-animation-play-state: paused;     
        -ms-animation-play-state: paused;
        -o-animation-play-state: paused;   
        animation-play-state: paused; 
      }
      
      /* show objects being animated */
      .animated {
        visibility: visible;
        -webkit-animation-fill-mode: both;
        -moz-animation-fill-mode: both;
        -ms-animation-fill-mode: both;
        -o-animation-fill-mode: both;
        animation-fill-mode: both;
        -webkit-animation-duration: 600ms;
        -moz-animation-duration: 600ms;
        -ms-animation-duration: 600ms;
        -o-animation-duration: 600ms;
        animation-duration: 600ms;
        -webkit-animation-play-state: running;
        -moz-animation-play-state: running;
        -ms-animation-play-state: running;
        -o-animation-play-state: running;
        animation-play-state: running;
      }
}

  
  /* CSS Animations (extracted from http://glifo.uiparade.com/) */
  @-webkit-keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-20px);
    }	100% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
  }
  
  @-moz-keyframes fadeInDown {
    0% {
        opacity: 0;
        -moz-transform: translateY(-20px);
    }
  
    100% {
        opacity: 1;
        -moz-transform: translateY(0);
    }
  }
  
  @-o-keyframes fadeInDown {
    0% {
        opacity: 0;
        -o-transform: translateY(-20px);
    }
  
    100% {
        opacity: 1;
        -o-transform: translateY(0);
    }
  }
  
  @keyframes fadeInDown {
    0% {
        opacity: 0;
        transform: translateY(-20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
  }
  
  
  
  @-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    20% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
  }
  
  @-moz-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    20% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
  }
  
  @-o-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    20% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
  }
  
  @keyframes fadeIn {
    0% {
        opacity: 0;
    }
    60% {
        opacity: 0;
    }
    20% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
  }
  @-webkit-keyframes bounceInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-2000px);
    }
    60% {
        -webkit-transform: translateX(20px);
    }
  
    80% {
        -webkit-transform: translateX(-5px);
    }
  
    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
  }
  
  @-moz-keyframes bounceInLeft {
    0% {
        opacity: 0;
        -moz-transform: translateX(-2000px);
    }
  
    60% {
        -moz-transform: translateX(20px);
    }
  
    80% {
        -moz-transform: translateX(-5px);
    }
  
    100% {
        opacity: 1;
        -moz-transform: translateX(0);
    }
  }
  
  @-o-keyframes bounceInLeft {
    0% {
        opacity: 0;
        -o-transform: translateX(-2000px);
    }
  
    60% {
        opacity: 1;
        -o-transform: translateX(20px);
    }
  
    80% {
        -o-transform: translateX(-5px);
    }
  
    100% {
        opacity: 1;
        -o-transform: translateX(0);
    }
  }
  
  @keyframes bounceInLeft {
    0% {
        opacity: 0;
        transform: translateX(-2000px);
    }
  
    60% {
        transform: translateX(20px);
    }
  
    80% {
        transform: translateX(-5px);
    }
  
    100% {
        opacity: 1;
        transform: translateX(0);
    }
  }
  @-webkit-keyframes bounceInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(2000px);
    }
  
    60% {
        -webkit-transform: translateX(-20px);
    }
  
    80% {
        -webkit-transform: translateX(5px);
    }
  
    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
  }
  
  @-moz-keyframes bounceInRight {
    0% {
        opacity: 0;
        -moz-transform: translateX(2000px);
    }
  
    60% {
        -moz-transform: translateX(-20px);
    }
  
    80% {
        -moz-transform: translateX(5px);
    }
  
    100% {
        opacity: 1;
        -moz-transform: translateX(0);
    }
  }
  
  @-o-keyframes bounceInRight {
    0% {
        opacity: 0;
        -o-transform: translateX(2000px);
    }
  
    60% {
        -o-transform: translateX(-20px);
    }
  
    80% {
        -o-transform: translateX(5px);
    }
  
    100% {
        opacity: 1;
        -o-transform: translateX(0);
    }
  }
  
  @keyframes bounceInRight {
    0% {
        opacity: 0;
        transform: translateX(2000px);
    }
  
    60% {
        transform: translateX(-20px);
    }
  
    80% {
        transform: translateX(5px);
    }
  
    100% {
        opacity: 1;
        transform: translateX(0);
    }
  }
  @-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(20px);
    }	100% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
  }
  
  @-moz-keyframes fadeInUp {
    0% {
        opacity: 0;
        -moz-transform: translateY(20px);
    }
  
    100% {
        opacity: 1;
        -moz-transform: translateY(0);
    }
  }
  
  @-o-keyframes fadeInUp {
    0% {
        opacity: 0;
        -o-transform: translateY(20px);
    }
  
    100% {
        opacity: 1;
        -o-transform: translateY(0);
    }
  }
  
  @keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
  
    100% {
        opacity: 1;
        transform: translateY(0);
    }
  }
  @-webkit-keyframes bounceIn {
    0% {
        opacity: 0;
        -webkit-transform: scale(.3);
    }
    50% {
        -webkit-transform: scale(1.05);
    }
  
    70% {
        -webkit-transform: scale(.9);
    }
  
    100% {
        opacity: 1;
        -webkit-transform: scale(1);
    }
  }
  
  @-moz-keyframes bounceIn {
    0% {
        opacity: 0;
        -moz-transform: scale(.3);
    }
  
    50% {
        -moz-transform: scale(1.05);
    }
  
    70% {
        -moz-transform: scale(.9);
    }
  
    100% {
        opacity: 1;
        -moz-transform: scale(1);
    }
  }
  
  @-o-keyframes bounceIn {
    0% {
        opacity: 0;
        -o-transform: scale(.3);
    }
  
    50% {
        -o-transform: scale(1.05);
    }
  
    70% {
        -o-transform: scale(.9);
    }
  
    100% {
        opacity: 1;
        -o-transform: scale(1);
    }
  }
  
  @keyframes bounceIn {
    0% {
        opacity: 0;
        transform: scale(.3);
    }
  
    50% {
        transform: scale(1.05);
    }
  
    70% {
        transform: scale(.9);
    }
  
    100% {
        opacity: 1;
        transform: scale(1);
    }
  }
  @-webkit-keyframes moveUp {
    0% {
        opacity: 1;
        -webkit-transform: translateY(40px);
    }	100% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
  }
  
  @-moz-keyframes moveUp {
    0% {
        opacity: 1;
        -moz-transform: translateY(40px);
    }
  
    100% {
        opacity: 1;
        -moz-transform: translateY(0);
    }
  }
  
  @-o-keyframes moveUp {
    0% {
        opacity: 1;
        -o-transform: translateY(40px);
    }
  
    100% {
        opacity: 1;
        -o-transform: translateY(0);
    }
  }
  
  @keyframes moveUp {
    0% {
        opacity: 1;
        transform: translateY(40px);
    }
  
    100% {
        opacity: 1;
        transform: translateY(0);
    }
  }
  
  @-webkit-keyframes fadeBgColor {
    0%{
        background:none;
    }
  70%{
        background:none;
    }
    100%{
        background:#464646;
    }
  }
  @-o-keyframes fadeBgColor {
    0%{
        background:none;
    }
  70%{
        background:none;
    }
    100%{
        background:#464646;
    }
  }
  @keyframes fadeBgColor {
    0%{
        background:none;
    }
  70%{
        background:none;
    }
    100%{
        background:#464646;
    }
  }
  .animated.animationDelay{
    animation-delay:.4s;
    -webkit-animation-delay:.4s;
  }
  .animated.animationDelayMed{
    animation-delay:200ms;
    -webkit-animation-delay:200ms;
  }
  .animated.animationDelayLong{
    animation-delay:200ms;
    -webkit-animation-delay:200ms;
  }
  .animated.fadeBgColor {
    -webkit-animation-name: fadeBgColor;
    -moz-animation-name: fadeBgColor;
    -o-animation-name: fadeBgColor;
    animation-name: fadeBgColor;
  }
  .animated.bounceIn {
    -webkit-animation-name: bounceIn;
    -moz-animation-name: bounceIn;
    -o-animation-name: bounceIn;
    animation-name: bounceIn;
  }
  .animated.bounceInRight {
    -webkit-animation-name: bounceInRight;
    -moz-animation-name: bounceInRight;
    -o-animation-name: bounceInRight;
    animation-name: bounceInRight;
  }
  .animated.bounceInLeft {
    -webkit-animation-name: bounceInLeft;
    -moz-animation-name: bounceInLeft;
    -o-animation-name: bounceInLeft;
    animation-name: bounceInLeft;
  }
  .animated.fadeIn {
    -webkit-animation-name: fadeIn;
    -moz-animation-name: fadeIn;
    -o-animation-name: fadeIn;
    animation-name: fadeIn;
  }
  .animated.fadeInDown {
    -webkit-animation-name: fadeInDown;
    -moz-animation-name: fadeInDown;
    -o-animation-name: fadeInDown;
    animation-name: fadeInDown;
  }
  .animated.fadeInUp {
    -webkit-animation-name: fadeInUp;
    -moz-animation-name: fadeInUp;
    -o-animation-name: fadeInUp;
    animation-name: fadeInUp;
  }
  .animated.moveUp {
    -webkit-animation-name: moveUp;
    -moz-animation-name: moveUp;
    -o-animation-name: moveUp;
    animation-name: moveUp;
  }
  

/***
    rubrique
****/
.rubrique {
}
.rubrique h1{
    font-size: 45px;
    font-family: 'JFFlat-Regular', Helvetica, sans-serif;
    font-weight: 400;
}
.rubrique .post{
    margin-bottom: 80px;
}
.last-post{
    height: 400px;
    overflow: hidden;
    margin-top: 50px;
    box-shadow: 4px 4px 20px #f9f9f9,4px 4px 20px #f9f9f9;
}
.last-post .last-post-description{
    padding: 20px 40px;
}
.last-post .last-post-description h2{
    font-size: 38px;
}
.last-post .last-post-description p{
    font-size: 14px;
    color: #444444;
    margin-top: 15px;
    line-height: 1.5;
    text-align: justify;
}
.last-post .last-post-description span.date{
    color: #8d8d8d;
}
.last-post .image-container img{
    /*height: 400px;*/
    width: 100%;
}
@media(max-width:991px){
    .last-post{
        overflow: auto;
        height: auto;
    }
    .last-post .image-container img{
        max-height: 260px;
    }
    .last-post .last-post-description h2{
        font-size: 25px;
    }
}
/***
    Post
***/
.details-post{
    padding-bottom: 50px;
    border-bottom: 1px solid #EDEDED;
}
.details-post .image-post{
    position: relative;
    height: 500px;
    margin-bottom: 40px;
}
.details-post .image-post img{
    width: 100%;
    display: block;
    margin: auto;
}
.details-post .banner-description{
    background: rgba(255, 255, 255, 0.85);
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    max-width: 460px;
    padding: 30px 20px;
}
.details-post .banner-description h1{
    font-size: 38px;
}
.details-post .banner-description span.date{
    color: #8d8d8d;
}
.details-post .content-post{
    padding: 20px 30px;
}
.details-post .content-post p b{
    font-family: 'Gess'!important;
    font-weight: bold;
}
.details-post .content-post h1,
.details-post .content-post h2,
.details-post .content-post h3,
.details-post .content-post h4,
.details-post .content-post h5,
.details-post .content-post h6{
    margin: 8px 0px;
}

.details-post .content-post h1{
    font-size: 28px;
}
.details-post .content-post h2{
    font-size: 25px;
}
.details-post .content-post h3{
    font-size: 22px;
}
.details-post .content-post h4{
    font-size: 19px;
}
.details-post .content-post h5{
    font-size: 17px;
}
.details-post .content-post h6{
    font-size: 15px;
}
.details-post .content-post > div{
    background: #FFF;
    position: relative;
    z-index: 2;
    /*margin-top:-80px;*/
    padding: 40px 80px;
}
.details-post .content-post > div,
.details-post .content-post div p{
    color:#000;
}
.details-post .content-post div p{
    line-height: 1.7;
    font-size: 16px;
    text-align: justify;
    margin-bottom: 20px;
    
}
.details-post .content-post div p.ar-font{
    text-align: center;
    margin-top: 23px;
    font-family: 'Heshamfree';
    font-size: 27px;
    color: #000;
}
.details-post .post p{
    margin-bottom: 10px!important;
}

.details-post .content-post > div img{
    margin:auto;
    display: block;
    max-width: 100%;
    margin-bottom:20px;
    border: 1px solid #ededed;
    border-radius: 5px;
    background: #FFF;
    padding: 7px;
}
.details-post .content-post .post img{
    border: none;
    border-radius: 0px;
    padding: 0px;
    margin-bottom:5px;
}
.details-post .banner-post{
    padding: 50px 0px;
}
.details-post .banner-post span{
    font-size: 16px;
    color: #e31e36;
}
.details-post .banner-post h1{
    font-size: 32px;
    margin-top:8px;
}
.autres-articles{

    margin-bottom:30px;
}
.autres-articles .post{
    height: 450px;
}
.autres-articles .post .description{
    padding-bottom: 25px;
}
.autres-articles .post .image-container img{
    max-height: 260px;
}
.autres-articles h2{
    font-size: 29px;
    font-weight: bold;
}
.autres-articles .items{
    height: auto;
    margin-top:30px;
    margin-bottom:20px;
}
.autres-articles .items .item{
    position: relative;
    box-shadow: 4px 4px 20px #f9f9f9,4px 4px 20px #f9f9f9;
}
.autres-articles .items .item:hover{
    box-shadow: 0 1px 15px #EEE  , 0 0 15px #EEE;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    transition: all 200ms ease;
}
.autres-articles .items .item span{
    display: block;
    font-size: 15px;
    color: #e31e36;
    /*margin-top:15px;*/
}
.autres-articles .items .item img{
    width: 100%;
}
.autres-articles .items .item h4{
    font-size: 17px;
    line-height: 1.3;
    color:#242424;
    margin-bottom:5px;
}
.autres-articles .items .item p{
    color: #858585;
    font-size: 15px;
}
.autres-articles .items .item .item-description{
    background: #FFF;
    padding:20px 15px;

}
@media(max-width:991px){
    .details-post .banner-post{
        padding: 40px 0px 20px;
    }
    .details-post .banner-post h1{
        font-size: 23px;
        font-weight: bold;
    }
    .details-post .content-post{
        padding: 20px 0px;
    }
    .details-post .content-post > div{
        margin-top: 0px;
        padding: 20px 0px;
    }
    .details-post .content-post div p{
        font-size: 15px;
    }
    .autres-articles .items .item{
        margin-bottom: 15px;
    }
}

/***
    Commentaires
***/
.commentaire-items{
    height: auto;
    overflow: hidden;
    margin-top: 15px;
}
.commentaire-items h3{
    margin-bottom: 15px!important;
}
.commentaire-items .item{
    background: #fdf7f7;
    padding: 20px 15px;
    border: 1px solid #feeded;
    margin-bottom: 18px;
}
.commentaire-items .item h6{
    margin-top: 0;
}
.commentaire-items .item p{
    margin-bottom: 5px!important;
    color: #444;
}

.add-comment{
    margin-top:15px;       
}
.add-comment textarea,
.add-comment input{
    border:1px solid #dedede;
    border-radius: 0px;
    box-shadow:none;
}
.add-comment textarea:focus,
.add-comment input:focus,
.add-comment textarea:active,
.add-comment input:active{
    outline: none;
    border-color: #9a9a9a;
}
.add-comment input{
    height: 45px;
}
.add-comment textarea{
    resize: vertical;
    min-height: 120px;
}

/**
    Contact
**/
.contact-form{
    width: 60%;
    margin-top:20px;   
}
.contact-form input{
    height: 45px;
   
}
.contact-form input,
.contact-form textarea{
    border: 1px solid #e4e4e4!important;
    box-shadow: none!important;
}
.contact-form textarea{
    resize: vertical;
    min-height: 120px;
}
.contact-form .btn-main{
    background: #50B5F4;
    margin-top: 0px!important;
}

/* css 06 dec 2017 */
    .namerub 
    {
        margin-top: 20px;
        color: #000;
        font-size: 16px;
    }
    .rightmenu{
        position: absolute;
        left: 10px;
        z-index: 999;
        bottom: 13px;
    }
   
    .sidebar a {
        padding: 22px 8px 8px 8px;
        text-decoration: none;
        font-size: 16px;
        color: #212121;
        display: block;
        transition: 0.3s;
        font-weight: 600;
    }
    
    .sidebar a:hover {
        color: #28baf7;
    }
    .sidebar .closebtn{
        top: 0;

    }
    .sidebar .closebtn img{
        left: 0px;
        top: 0px;
        background: #28baf7;
        color: #fff;
        width: 40px;
        height: 40px;
        position: absolute;
        padding: 10px 10px 10px 10px;
     }
   
    
    .sidebar{
        height: 100%;
        width: 250px;
        background:#fff;
        z-index: 1050;
        position: fixed;
        left:0px;
        top:0px;
        
        -webkit-transition : all 200ms ease;
        -moz-transition : all 200ms ease;
        transition : all 200ms ease;
     
    }
    .sidebar>div{
        background: #fff;
        height: 100%;
        width: 100%;
        z-index: 1;
        padding: 60px 15px;
    }
    .sidebar:not(.sidebarhiden):before{
        content: "";
        position: fixed;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0,.8);
        top: 0;
        left: 0;
        z-index: -1;

    }
    .sidebarhiden{
        left:-250px;
        -webkit-transition : all 200ms ease;
        -moz-transition : all 200ms ease;
        transition : all 200ms ease;

    }
    .Logomenu {
        position: absolute;
        display: block;
        margin-top: 30px;
        width: 120px;
        top: -24px;
    }
    .souligneside{
        display: inline-block;
        height: 35px;
        width: 8px;
        background-color: #28baf7;
        opacity: 0;
        position: absolute;
        right: 0px;
        margin-top: -5px;
    }
    .sidebar a:hover .souligneside{
        opacity: 1;
    }
    .navside{
        margin-top: 60px;
        margin-right: 7px;
    }
    .navside .navbar-right .social-media {
        margin-top: 5px;
        right: 20px;
        position: absolute;
    }
    @media (max-width: 767px){
       /*.container .navbar-right .social-media li {
            display: none;
        }
        .navbar-default .navbar-nav>li>a{
            display: none;
        }
        .navbar-default .navbar-toggle{
            display: none;
        } */
        .navbar-default .navbar-toggle{
            display: none;
        }
        .navbar-right .social-media{
            margin-right: 15px;
        }
    }
    @media (max-width: 325px){
        #last-news span.typed {
            display: inline-block;
            height: 40px;
            font-size: 10px;
            font-weight: bold;
        }
        #last-news-slide .item,
        #last-news-slide{
            height: 460px;
            position: relative;
            margin-top: 16px;
        }
        .post {
            margin-top: 40px;
        }
       /* .rightmenu {
            top: 50px;
        }*/
    }
    @media (max-width: 1024px){
        .navbar-default .navbar-brand img {
            max-width: 100px;
        }
        
        #last-news-slide{
            height: 460px;
            position: relative;
            margin-top: 16px;
        }
        .post {
            margin-top: 16px;
        }
    
}
@media(max-width:767px){
    .contact-form{
        width: 100%;
    }
    .post {
        margin-top: 40px;
    }
    /*.rightmenu{
        top: 78px;
    }*/
    .navbar-default .navbar-brand img{
        display: block;
        margin-top: -5px;
    }
}

#last-news-slide .owl-item.active > a{
    z-index: 999;
    position: relative;
    display: block;
    height: 100%;
    width: 100%;
}
.signature{
    font-family: 'Heshamfree';
    font-size: 65px;
}
.moral{
    position: relative;
    margin-left: 54px;
    padding: 0px 20px 0px 26px;
    line-height: 1.7;
    font-size: 18px;
    color: #848484;
    border-right: 5px solid #28baf7;
    margin-bottom: 25px;
    font-family: 'JFFlat-Regular', Helvetica, sans-serif;
    display: block;
    font-size: 16px;
    color: #e32170;
}

.post-commentaire{
    height: 450px!important;
}

.verset-image{
    position: relative;
    display: inline-block;
    padding: 0px 25px;
    font-family: 'AlQalamQuran';
    font-size: 24px!important;
}
.verset-image:before,
.verset-image:after{
    content: '';
    position: absolute;
    top: 2px;
    width: 30px;
    height: 34px;
    background-repeat: no-repeat;
}
.verset-image:before{
    background-image: url('../img/v-r.svg');
    right: -5px;
}
.verset-image:after{
    background-image: url('../img/v-r.svg');
    transform: rotate(181deg);
    left: -5px;
}


.container-load-more{

}
.rubrique .container-load-more .post{
    height: 450px!important;
}


@media(min-width: 768px){
    .rightmenu{
        display: none;
    }
}