/* @import "bootstrap.min"; */
body {
  background: #f0f0f0;
  margin: 0;
  padding: 0;
  font-family: 'Helvetica Neue', Helvetica, Arial;
  line-height: 18px;
  font-size: 12px;
  color: #222222; }

h1, h2, h3, h4 {
  margin: 0 0 15px 0;
  padding: 0;
  font-weight: normal; }

h1 {
  font-size: 500%; }

h2 {
  font-size: 210%; }

h3 {
  font-size: 150%; }

p {
  margin: 0 0 10px 0; }

a {
  color: #222222; }

/* ________________________________________________________ */
.rtl {
  direction: rtl; }

.clear {
  clear: both; }

.pull-left {
  float: left; }

.pull-right {
  float: right; }

.no-border {
  border: 0px !important; }

.cv-wrapper, .cover-letter-wrapper {
  background: #fff;
  width: 80%;
  padding: 35px;
  margin: 0 auto 15px auto;
  overflow: hidden;
  box-shadow: 0 0 6px #cccccc; }

#title {
  margin: 0 0 10px 0;
  line-height: 70px;
  text-align: center;
  color: #4862A3; }
  #title #credit {
    margin-bottom: 20px;
    font-size: 11px;
    color: #999;
    text-align: center; }
    #title #credit a {
      color: #999; }

p label {
  float: left;
  margin: 5px 10px 0 0;
  min-width: 50px;
  font-size: 14px; }
  p label span.colon {
    float: right; }
  p label span.value {
    float: left;
    margin-top: 5px;
    width: 70%;
    display: block; }

.item {
  margin: 0 0 20px 0; }
  .item .date {
    font-size: 15px; }

.online {
  color: #095f04; }

.basic-info {
  padding: 0 0 0 180px; }
  .basic-info p {
    float: left;
    width: 48%;
    margin: 0 0 0 0; }
    .basic-info p.full {
      width: 100%;
      float: none; }
  .basic-info .r {
    float: right; }

/* education _____________________________ */
.section {
  margin-bottom: 30px;
  padding-bottom: 10px; }
  .section .title {
    color: #4862A3;
    border-bottom: 1px solid #4862A3;
    padding-bottom: 10px; }
  .section span.value {
    padding: 5px 0 0 0;
    display: block; }
  .section span.r {
    float: right;
    text-align: right; }
  .section h3 span.l, .section h3 span.r {
    float: left;
    width: 49%;
    line-height: 20px; }

.section-education .school,
.section-work .job_title {
  display: block;
  margin: 5px 0 5px 0;
  font-size: 120%; }

.header.photo {
  margin-left: 190px; }
  .header.photo #title {
    text-align: left; }
  .header.photo .basic-info {
    float: none;
    padding: 0; }

.cover-letter-wrapper {
  margin-top: 100px; }

.bio-wrapper {
  margin: 10px auto;
  width: 615px; }
  .bio-wrapper .icons {
    background-image: image-url("/assets/astm-social-b2056929.png"); }
  .bio-wrapper h1 {
    margin: 3px auto;
    padding: 3px 0;
    width: 100%;
    font-size: 20px;
    text-align: center;
    color: #ffffff;
    background-color: #4862A3;
    border: 1px solid #ccc; }
  .bio-wrapper .main-wrapper-border {
    border: solid 1px #ccc;
    height: 110px;
    background: #ffffff; }
    .bio-wrapper .main-wrapper-border .logo {
      margin: 5px;
      width: 93px;
      height: 98px;
      border-right: solid 1px #ccc;
      background-position: 0px -202px; }
    .bio-wrapper .main-wrapper-border .logo img {
      width: 95px;
    }
    .bio-wrapper .main-wrapper-border .job-title {
      margin: 0px 5px;
      padding: 0px 0px 6px 0px;
      width: 495px;
      font-size: 13px;
      font-weight: bold;
      font-family: arial;
      color: #8D8D8D;
      border-bottom: solid 1px #ccc; }
    .bio-wrapper .main-wrapper-border .name {
      margin: 5px 5px 2px 5px;
      width: 495px;
      font-size: 15px;
      font-weight: bold;
      font-family: arial;
      color: #646464; }
    .bio-wrapper .main-wrapper-border .contacts {
      margin: 5px;
      padding: 0 8px 0 0;
      height: 15px;
      font-size: 10px;
      font-family: arial;
      color: #8D8D8D;
      border-right: 1px solid #ccc; }
      .bio-wrapper .main-wrapper-border .contacts a {
        color: #8D8D8D;
        text-decoration: none; }
        .bio-wrapper .main-wrapper-border .contacts a:hover {
          background: none; }
    .bio-wrapper .main-wrapper-border .social-icons {
      margin: 5px 0px 0px 5px;
      padding-top: 5px;
      width: 81%;
      border-top: solid 1px #ccc; }
      .bio-wrapper .main-wrapper-border .social-icons .social {
        margin: 0px 5px 0px 0px;
        width: 16px;
        height: 16px; }
      .bio-wrapper .main-wrapper-border .social-icons .facebook {
        background-position: -40px -54px; }
      .bio-wrapper .main-wrapper-border .social-icons .twitter {
        background-position: -10px -80px; }
      .bio-wrapper .main-wrapper-border .social-icons .skype {
        background-position: -10px -29px; }
      .bio-wrapper .main-wrapper-border .social-icons .hotmail {
        background-position: -100px -3px; }
      .bio-wrapper .main-wrapper-border .social-icons .gmail {
        background-position: -40px -28px; }
      .bio-wrapper .main-wrapper-border .social-icons .linked {
        background-position: -9px -2px; }
      .bio-wrapper .main-wrapper-border .social-icons .github {
        background-position: -70px -54px; }
      .bio-wrapper .main-wrapper-border .social-icons .bitbucket {
        background-position: -40px -105px; }
      .bio-wrapper .main-wrapper-border .social-icons .gitlab {
        background-position: -10px -157px; }
      .bio-wrapper .main-wrapper-border .social-icons .stack-over-flow {
        background-position: -100px -81px; }
      .bio-wrapper .main-wrapper-border .social-icons .skill-pages {
        background-position: -40px -2px; }
      .bio-wrapper .main-wrapper-border .social-icons .mva {
        background-position: -129px -80px; }
      .bio-wrapper .main-wrapper-border .social-icons .sound-cloud {
        background-position: -129px -4px; }
      .bio-wrapper .main-wrapper-border .social-icons .tumblr {
        background-position: -70px -80px; }
      .bio-wrapper .main-wrapper-border .social-icons .behance {
        background-position: -10px -55px; }
      .bio-wrapper .main-wrapper-border .social-icons .tsu {
        background-position: -40px -130px; }
      .bio-wrapper .main-wrapper-border .social-icons .wuzzuf {
        background-position: -10px -105px; }
      .bio-wrapper .main-wrapper-border .social-icons .bayt {
        background-position: -40px -80px; }
      .bio-wrapper .main-wrapper-border .social-icons .strikingly {
        background-position: -100px -130px; }
      .bio-wrapper .main-wrapper-border .social-icons .pinterest {
        background-position: -129px -130px; }
      .bio-wrapper .main-wrapper-border .social-icons .medium {
        background-position: -129px -105px; }
      .bio-wrapper .main-wrapper-border .social-icons .hacker-rank {
        background-position: -69px -156px; }
      .bio-wrapper .main-wrapper-border .social-icons .docker {
        background-position: -39px -156px; }
  .bio-wrapper .about-wrapper {
    margin: 3px auto;
    padding: 10px;
    font-size: 12px;
    color: #8D8D8D;
    line-height: 20px;
    background-color: #ffffff;
    border: 1px solid #ccc; }
  .bio-wrapper .experiences {
    width: 60%; }
    .bio-wrapper .experiences .main-wrapper-border {
      float: left;
      height: auto;
      min-height: 410px; }
      .bio-wrapper .experiences .main-wrapper-border ul {
        float: left;
        margin: 0px 0px 0px 0px;
        padding: 0px;
        list-style: none; }
        .bio-wrapper .experiences .main-wrapper-border ul li {
          float: left;
          margin: 1px 0px 1px 0px;
          padding: 2px 0px 0px 2px;
          width: 100%;
          font-size: 13px; }
          .bio-wrapper .experiences .main-wrapper-border ul li .position {
            float: left;
            margin-right: 5px;
            padding: 0px 5px;
            color: #8D8D8D;
            font-size: 11px;
            border: solid 1px #8D8D8D; }
          .bio-wrapper .experiences .main-wrapper-border ul li .language {
            float: left;
            margin-right: 5px;
            padding: 0px 5px;
            color: #929aff;
            border: 1px solid #929aff; }
            .bio-wrapper .experiences .main-wrapper-border ul li .language.ror {
              color: #ff9292;
              border: 1px solid #ff9292; }
            .bio-wrapper .experiences .main-wrapper-border ul li .language.angular {
              color: #4ec698;
              border: 1px solid #4ec698; }
            .bio-wrapper .experiences .main-wrapper-border ul li .language.devops {
              color: #f7bc09;
              border: 1px solid #f7bc09; }
          .bio-wrapper .experiences .main-wrapper-border ul li .date {
            float: left;
            margin-right: 5px;
            padding: 0px 5px;
            color: #ccc;
            border: 1px solid #ccc; }
  .bio-wrapper .tools {
    margin-left: 6px;
    width: 39%; }
    .bio-wrapper .tools .main-wrapper-border {
      float: left;
      height: 552px;
      min-height: 410px; 
    }
      .bio-wrapper .tools .main-wrapper-border ul {
        float: left;
        margin: 0px;
        padding: 0px;
        width: 100%;
        list-style: none;}
        .bio-wrapper .tools .main-wrapper-border ul li {
          float: left;
          margin: 5px 5px 5px 5px;
          padding: 0 2px;
          font-size: 13px;
          color: #4862A3;
          background-color: #c1d0f5;
          border: solid 1px #4862A3; }
  .bio-wrapper .todo {
    width: 100%; }
    .bio-wrapper .todo .main-wrapper-border {
      float: left;
      width: 100%;
      height: auto; }
      .bio-wrapper .todo .main-wrapper-border ul {
        float: left;
        margin: 0px 0px 0px 0px;
        padding: 0px;
        width: 100%;
        list-style: none; }
        .bio-wrapper .todo .main-wrapper-border ul li {
          float: left;
          margin: 1px 0px 1px 0px;
          padding: 5px 0px 5px 5px;
          width: 99%;
          font-size: 12px;
          color: #ccc;
          border-bottom: solid 1px #ccc; }
          .bio-wrapper .todo .main-wrapper-border ul li.done {
            color: #646464; }
          .bio-wrapper .todo .main-wrapper-border ul li .date {
            float: left;
            margin-right: 5px;
            font-weight: bold; }
          .bio-wrapper .todo .main-wrapper-border ul li .title {
            float: left;
            padding-left: 5px;
            font-weight: bold;
            border-left: 1px solid #ccc; }
          .bio-wrapper .todo .main-wrapper-border ul li .details {
            float: left;
            padding: 5px 0px 0px;
            width: 100%; }
  .bio-wrapper footer {
    float: left;
    margin-top: 10px;
    padding: 5px;
    width: 100%;
    border: solid 1px #ccc; }
    .bio-wrapper footer img {
      margin: 0 11px 0 12px;
      width: 115px; }
      .bio-wrapper footer img.bigger {
        width: 135px; }

.article-title {
  padding: 10px;
  color: #ffffff;
  background-color: #4862A3; }

.media {
  margin: 5px 0; }
  .media .media-body {
    font-size: 13px;
    line-height: 22px; }
    .media .media-body .row-line {
      float: left;
      width: 100%;
      margin: 3px 0; }
      .media .media-body .row-line strong {
        color: #4862A3; }
        .media .media-body .row-line strong a {
          font-weight: normal; }
      .media .media-body .row-line h2 {
        margin-bottom: 0; }
        .media .media-body .row-line h2 a {
          font-size: 20px;
          color: #4862A3; }
    .media .media-body.details {
      min-height: 500px; }

.pagination span {
  float: left;
  margin: 0 5px 0 0;
  padding: 5px 10px;
  border: solid 1px #cccccc; }
  .pagination span:hover {
    background-color: #4862A3; }
    .pagination span:hover a {
      color: #ffffff; }
  .pagination span.current {
    color: #ffffff;
    background-color: #4862A3; }

@media screen and (max-width: 980px) {
  body {
    background: #ffffff; }
  .cv-wrapper, .cover-letter-wrapper {
    box-shadow: none;
    padding: 0;
    padding: 5px; }
  .basic-info {
    padding: 0 0 0 60px; } }