.about{
}

.about .about-header{
 display: block;
 height: 400px;
 background: #eee;
}
.about .about-header > div{
 padding: 40px;
}
.about .about-header h1, .about .about-header h2{
 display: table;
 padding: 0 10px;
 margin: 0;
 height: 38px;
 border: 1px #fff solid;
 color: #fff;
 border-radius: 3px;
 font: 17pt 'Nassim';
 line-height: 38px;
}
.about .about-header h1{
 margin-bottom: 10px;
}

.about .about-content{
 max-width: 1000px;
 padding: 40px 20px;
 margin: 0 auto;
}
.about .about-content > span{
 display: block;
 font: 24pt 'Nassim';
 padding: 0 20px 40px 20px;
}

.about .about-description{
 font-size: 0;
}
.about .about-description > div{
 display: inline-block;
 vertical-align: top;
 width: 50%;
}
.about .about-description > div > span{
 display: block;
 padding: 0 20px;
 font: 14pt 'Nassim';
 white-space: pre-wrap;
 text-align: justify;
}

.about .about-image{
 padding-top: 30px;
}
.about .about-image > img{
 display: block;
 width: 400px;
 height: 400px;
 background: #333;
 margin: auto;
}
.about .about-image > span{
 display: block;
 padding: 10px;
 font: 14pt 'Nassim';
 text-align: center;
}






/*
  languages compatibility
  right to left
*/
.content-rtl .about .about-header h1 , .content-rtl .about .about-header h2{
 margin-left: auto;
 direction: rtl;
}

.content-rtl .about .about-description , .content-rtl .about .about-content > span{
 direction: rtl;
}


/*
  languages compatibility
  left to right
*/
.content-ltr .about .about-header h1 , .content-ltr .about .about-header h2{
 margin-right: auto;
 direction: ltr;
}

.content-ltr .about .about-description , .content-ltr .about .about-content > span{
 direction: ltr;
}


/*
  Responsivity
*/
@media all and (max-width: 800px)
{
 .about .about-description > div{
  display: block;
  margin: auto;
  width: auto;
 }
}