@font-face {
font-family: 'HacenTunisia';
src: url('fonts/HacenTunisia.eot');
src: url('fonts/HacenTunisia.otf') format('truetype'),
     url('fonts/HacenTunisia.woff') format('woff'),
     url('fonts/HacenTunisia.eot?#iefix') format('embedded-opentype'),
     url('fonts/HacenTunisia.svg#QuadrantaBold') format('svg');
	 
	  
}

  body{
      margin:0;

		 font-family: 'HacenTunisia';
   }

  .media-boxes-load-more{
  cursor: pointer;
width: 150px;
text-align: center;
color: #FFF;
background-color: #2E8795;
font-size: 14px !important;
height: 15px;
padding: 10px 15px;
margin: 20px auto;
line-height: 15px;
box-shadow: 0px 1px 1px #2E8795;
box-sizing: content-box !important;
  }
.media-boxes-no-more-entries{
    cursor: pointer;
    width: 150px;
    text-align: center;
    color: #FFF;
    background-color: #2E8795;
    font-size: 14px !important;
    height: 15px;
    padding: 10px 15px;
    margin: 20px auto;
    line-height: 15px;
    box-shadow: 0px 1px 1px #2E8795;
    box-sizing: content-box !important;
}
  .media-box{
		padding-right: 10px;
    font-size: 16px;
      margin-top: 30px;
      height:230px!important;
  }

  .media-box-container{
    -webkit-box-shadow: 0 1px 3px rgba(34,25,25,0.4);
       -moz-box-shadow: 0 1px 3px rgba(34,25,25,0.4);
         -o-box-shadow: 0 1px 3px rgba(34,25,25,0.4);
        -ms-box-shadow: 0 1px 3px rgba(34,25,25,0.4);
            box-shadow: 0 1px 3px rgba(34,25,25,0.4);
  }

  .media-box-content{
    padding: 4px;
    background: white;
    color: rgb(51, 51, 51);
    line-height: 20px;
	text-align: center;

  }

  .media-box-title{
  	text-align: right;
    letter-spacing: 0px;
    line-height: 1.1;
    font-weight: 500;
    color: #2E8795;
    font-size: 20px;
    height:70px;


  }
   .media-box-title:hover{
       text-align: right;
       letter-spacing: 0px;
       line-height: 1.1;
       font-weight: 500;
       color:rgba(28, 78, 90, 1);;
       font-size: 20px;
  height:50px;
  }
  
  .media-box-date{
  text-align: right;
    font-size: 14px;
    line-height: 15px;
    color: rgba(143, 143, 143, 0.98);
    margin-top: 5px;
	 direction: ltr;

  }

  .media-box-text{
    font-size: 12px;
    margin: 13px 0px 13px 0 !important;
    color: #484848;
  }

  .media-box-more a{
    text-decoration: none !important;
    color: inherit;
    padding: 0;
    margin: 0;
    color: #224C5E;
    font-weight: 500;
  }

/* ====================================================================== *
      [2] LOAD MORE
 * ====================================================================== */
    


  .media-boxes-no-more-entries{
   
  }


/* ====================================================================== *
      [3] ISOTOPE FILTER
 * ====================================================================== */
  
  .media-boxes-filter{
 
    font-size: 0px;
    list-style: none;
    margin: 0 0 5px 0;
    padding: 0px;
    width: 100%;
    text-align: right;
	 padding-right: 25px;
	 background: #1F4F7B;
  }

  .media-boxes-filter li{
    display: inline-block;
    line-height: 16px;
    margin: 0 8px 0 0;
    padding: 4px 0 8px 0;
	 border-left: 0px solid White;
	

    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
       -moz-box-sizing: border-box;    /* Firefox, other Gecko */
            box-sizing: border-box;         /* Opera/IE 8+ */
  }

  .media-boxes-filter li:last-child{
    background: none;
  }

  .media-boxes-filter li a{
    display: block;
    cursor: pointer;
    color: White;
    font-size: 16px;
    font-weight: 300;
    text-decoration: none;
    margin: 2 px;
    padding: 10px 14px; 
  }

  .media-boxes-filter li a:hover{
	color:White;
	border-top: 0px solid #224c5e;
	background-color: #A01111;
  }

  .media-boxes-filter li a.selected{
    background: #224C5E; 
    color: #fff;
  }

/* ====================================================================== *
      [4] THUMBNAIL OVERLAY EFFECT
 * ====================================================================== */

  .thumbnail-overlay{
    background: #fff; /* fallback for IE8 */
    background-color: rgba(255,255,255, .30);
    color: #484848;
  }

  /* The style for centering the caption (vertically and horizontally) */
  .thumbnail-overlay>div.aligment{
    height: 100%;
    width: 100%;
    display: table !important;
  }

  .thumbnail-overlay>div.aligment>div.aligment{
    padding: 10px;
    display: table-cell !important;
    vertical-align: middle; /* FOR VERTICAL ALIGN */
    text-align:center; /* FOR HORIZONTAL ALIGN */
  }

  .overlay-title{
    font-weight: 500;
    font-size: 16px;
    display: block;
    line-height: 16px;
    margin-bottom: 5px;
  }

  .overlay-description{
    font-weight: 400;
    font-size: 12px;
    display: block;
    line-height: 16px;
  }

  .mb-icon-plus, .mb-icon-link, .mb-icon-movie, .mb-icon-sound, .mb-icon-play{
    width: 50px;
    height: 50px;
    display: inline-block;
    border: 2px solid #484848;
    margin: 6px;
  
    -webkit-border-radius: 50%; /* Safari 3-4, iOS 1-3.2, Android 1.6- */
       -moz-border-radius: 50%; /* Firefox 1-3.6 */
            border-radius: 50%; /* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */


    background-repeat:no-repeat;
    background-position: center center;

    -webkit-transition: -webkit-transform .2s;
       -moz-transition:    -moz-transform .2s;
         -o-transition:      -o-transform .2s;
        -ms-transition:     -ms-transform .2s;
            transition:         transform .2s;
  }
  
  .mb-icon-plus{
    background-image: url('icons/icon-plus.png');
  }

  .mb-icon-movie{
    background-position: 49.9% 50%;
    background-image: url('icons/icon-movie.png');
  }
  
  .mb-icon-sound{
    background-image: url('icons/icon-headphones.png');
  }

  .mb-icon-link{
    background-image: url('icons/icon-link.png');
  }
  
  .mb-icon-plus:hover, .mb-icon-link:hover, .mb-icon-movie:hover, .mb-icon-sound:hover{
      -webkit-transform: scale(1.1);
       -moz-transform: scale(1.1);
        -ms-transform: scale(1.1);
         -o-transform: scale(1.1);
            transform: scale(1.1);          
              
      cursor: pointer;
  }

  .mb-play-container{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-image: url('icons/blank.gif'); /* IE hack, since IE doesn't recognize the hover state in places where there's nothing */
  }

  .mb-icon-play{
    border: 2px solid #fff;
    background-position: 56% 50%;
    background-image: url('icons/icon-play.png');
    background-color: rgba(0,0,0,.4);
    position: absolute;
    top: 50%;
    right: 50%;
    margin-top: -25px;
    margin-right: -25px;

    -webkit-transition: background-color .2s, -webkit-transform .2s;
       -moz-transition: background-color .2s,    -moz-transform .2s;
         -o-transition: background-color .2s,      -o-transform .2s;
        -ms-transition: background-color .2s,     -ms-transform .2s;
            transition: background-color .2s,         transform .2s;
  }

  .mb-play-container:hover .mb-icon-play{
    -webkit-transform: scale(1.1);
       -moz-transform: scale(1.1);
        -ms-transform: scale(1.1);
         -o-transform: scale(1.1);
            transform: scale(1.1);          
  }


/* ====================================================================== *
      [5] MAGNIFIC POPUP
 * ====================================================================== */

  .mb-open-popup{
    cursor: pointer;
  }

  .mfp-container{

  }
  
  .mfp-arrow.mfp-arrow:before, 
  .mfp-arrow.mfp-arrow:after { border:none !important; }

  .mfp-arrow.mfp-arrow-left {
    background:url('icons/icon-arrow-left.png') 50% 50% no-repeat !important;
  }
  
  .mfp-arrow.mfp-arrow-right {
    background:url('icons/icon-arrow-right.png') 50% 50% no-repeat !important;
  }
  
  .mfp-close{
    background:url('icons/icon-close.png') right no-repeat !important;
  }

  





	
  .media-box {
    /* Box-model */
    display: none; /* hidden by default, the plugin will take care of showing it */
    float: right;
 margin-bottom: 100px;
 
	/*width: 20%;*/
  }

  .media-box-hidden{
    display: none; /* hide the hidden boxes */
  }
	
  .media-boxes-container{
  	margin-right: 0 !important;
  	margin-bottom: 0 !important;
	margin-top: -10px !important;
  }
  
  .media-box-loaded{
    display: block; /* class to show the boxes once the plugin has been initialized */
  }

 /* ====================================================================== *
    [2] MEDIA BOX THUMBNAIL
 * ====================================================================== */

  .media-box .media-box-image{
    position: relative;
    overflow: hidden;
    width: 100%;
  }
  
  /* Hack to center the image */
  .media-box-image div[data-width][data-height]{
    position: relative;
    overflow: hidden;
  }
  .media-box-image div[data-width][data-height] img{
    position: absolute;
    top:-100%; left:0; right: 0; bottom:-100%;
    margin: auto;
  }
  /* End Hack */

  .media-box .media-box-image img{
    width: 100%;
    max-width: 100%;
    display: block;
  }
  
  .media-box img{
    max-width: 100%;
  }
  
  /* Loading and broken thumbnail effects */

  .media-box-image div[data-thumbnail], .media-box-image div[data-popup]{
    background-position: center center;
    background-repeat: no-repeat;
  }

  .image-with-dimensions{
    background-color: black;
    background-image: url('icons/loading-image.gif');
  }

  .broken-image-here{
    background-color: #224C5E;
    background-image: url('icons/broken-image.png');
  }

  .broken-image-here:not([data-height]){
    min-height: 150px;
  }
/* ====================================================================== *
    [3] MEDIA BOX CONTENT
 * ====================================================================== */

  .media-box-container{
    overflow: hidden;
  }


/* ====================================================================== *
    [4] THUMBNAIL OVERLAY EFFECT
 * ====================================================================== */

  .thumbnail-overlay{
      position: absolute;
      
      -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
      -moz-box-sizing: border-box;    /* Firefox, other Gecko */
      box-sizing: border-box;         /* Opera/IE 8+ */

      width: 100%;
  }

  /* REVEAL EFFECT */
  .position-reveal-effect .media-box-thumbnail-container{
      z-index: 2;
      position: absolute;
      width: 100%;
      top: 0;
      right: 0;
  }
  
  .position-reveal-effect .thumbnail-overlay{
      z-index: 1;
      position: absolute;
      right: 0;
  }

/* ====================================================================== *
    [5] MAGNIFIC POPUP
 * ====================================================================== */
  
  .mfp-arrow:focus {
    opacity: 0.65;
    filter: alpha(opacity=65);
  }

  .mfp-arrow:hover {
    opacity: 1 !important;
    filter: alpha(opacity=100) !important;
  }

  /* at start */
  .my-mfp-slide-bottom .mfp-figure {
    opacity: 0;
    -webkit-transition: all 0.2s ease-out;
       -moz-transition: all 0.2s ease-out;
         -o-transition: all 0.2s ease-out;
            transition: all 0.2s ease-out;
    
    -webkit-transform: scale(0.8);
       -moz-transform: scale(0.8);
        -ms-transform: scale(0.8);
         -o-transform: scale(0.8);
            transform: scale(0.8);

  }

  /* animate in */
  .my-mfp-slide-bottom.mfp-ready .mfp-figure {
    opacity: 1;
    -webkit-transform: scale(1); 
       -moz-transform: scale(1); 
        -ms-transform: scale(1); 
         -o-transform: scale(1); 
            transform: scale(1); 
  }

  /* animate out */
  .my-mfp-slide-bottom.mfp-removing .mfp-figure {
    opacity: 0;
    -webkit-transform: scale(0.8); 
       -moz-transform: scale(0.8); 
        -ms-transform: scale(0.8); 
         -o-transform: scale(0.8); 
            transform: scale(0.8); 
  }

  /* Dark overlay, start state */
  .my-mfp-slide-bottom.mfp-bg {
    opacity: 0;
    -webkit-transition: opacity 0.3s ease-out; 
       -moz-transition: opacity 0.3s ease-out; 
         -o-transition: opacity 0.3s ease-out; 
            transition: opacity 0.3s ease-out;
  }
  /* animate in */
  .my-mfp-slide-bottom.mfp-ready.mfp-bg {
    opacity: 0.8;
  }
  /* animate out */
  .my-mfp-slide-bottom.mfp-removing.mfp-bg {
    opacity: 0;
  }
  .search1 {
	width: 285px;
	margin-left: auto;
	padding-left: 21px;
	padding-top: 35px;
	margin: 0 auto;
	
}

.search1 input.field {
	float: left;
	width: 230px;
	padding: 0 8px;
	height: 24px;
	line-height: 24px;
	border: 1px solid #d3d3d3;
	font-size: 14px;
	color: #8a8a8a;
	background: #ededed;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-o-border-radius: 5px;
}

.search1 input.search-btn {
	float: right;
	font-size: 0;
	line-height: 0;
	text-indent: -4000px;
	cursor: pointer;
	width: 32px;
	height: 32px;
	border: 0;
	background: url(../../../img/srch.png) no-repeat 0 0;
}