.main-wrapper section.mosaique-wrapper div.mosaique .image-grid .projects {
  display: table; }
  .main-wrapper section.mosaique-wrapper div.mosaique .image-grid .projects a .letter {
    color: #000;
    font-size: 68px;
    font-family: 'Philosopher', sans-serif;
    text-transform: uppercase;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease; }
  .main-wrapper section.mosaique-wrapper div.mosaique .image-grid .projects a .legend-container {
    opacity: 0;
    max-width: 330px;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease; }
    .main-wrapper section.mosaique-wrapper div.mosaique .image-grid .projects a .legend-container .title {
      font-size: 21px;
      margin-bottom: 10px;
      font-family: 'Philosopher', sans-serif; }
    .main-wrapper section.mosaique-wrapper div.mosaique .image-grid .projects a .legend-container .more {
      text-transform: uppercase;
      letter-spacing: 3px;
      font-size: 12px;
      font-family: 'proxima_nova_ltlight'; }
      .main-wrapper section.mosaique-wrapper div.mosaique .image-grid .projects a .legend-container .more .line {
        width: 0;
        height: 3px;
        background-color: #000;
        transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        opacity: 1;
        float: left;
        margin-top: 8px;
        margin-right: 5px; }
      .main-wrapper section.mosaique-wrapper div.mosaique .image-grid .projects a .legend-container .more .mtext {
        float: left; }
    .main-wrapper section.mosaique-wrapper div.mosaique .image-grid .projects a .legend-container .line-top {
      width: 0;
      height: 3px;
      background-color: #000;
      margin-bottom: 10px;
      transition: all 0.3s ease;
      -webkit-transition: all 0.3s ease;
      -moz-transition: all 0.3s ease;
      -ms-transition: all 0.3s ease;
      -o-transition: all 0.3s ease; }
  .main-wrapper section.mosaique-wrapper div.mosaique .image-grid .projects:hover a {
    color: #000; }
    .main-wrapper section.mosaique-wrapper div.mosaique .image-grid .projects:hover a .letter {
      opacity: 0; }
    .main-wrapper section.mosaique-wrapper div.mosaique .image-grid .projects:hover a .legend-container {
      opacity: 1; }
      .main-wrapper section.mosaique-wrapper div.mosaique .image-grid .projects:hover a .legend-container .line-top {
        width: 93px; }
    .main-wrapper section.mosaique-wrapper div.mosaique .image-grid .projects:hover a .legend-container .more .line {
      width: 70px; }

.main-wrapper .projects-wrapper {
  position: relative;
  display: table;
  width: 100%;
  height: 100%;
  background-size: cover !important; }
  .main-wrapper .projects-wrapper.bg-1 {
    background: transparent url("/res/projects/gr1.jpg") center top no-repeat; }
  .main-wrapper .projects-wrapper.bg-2 {
    background: transparent url("/res/projects/gr2.jpg") center top no-repeat; }
  .main-wrapper .projects-wrapper.bg-3 {
    background: transparent url("/res/projects/gr3.jpg") center top no-repeat; }
  .main-wrapper .projects-wrapper.bg-4 {
    background: transparent url("/res/projects/gr4.jpg") center top no-repeat; }
  .main-wrapper .projects-wrapper .projects-container {
    margin: 0 auto;
    margin-top: 150px;
    max-width: calc(100% - 472px);
    position: relative;
    border-bottom: 1px dotted #000; }
    .main-wrapper .projects-wrapper .projects-container .letter {
      color: #000;
      font-size: 80px;
      line-height: 80px;
      font-family: 'Philosopher', sans-serif;
      padding: 0px 40px;
      text-transform: uppercase;
      display: table;
      border-bottom: 4px solid #000; }
    .main-wrapper .projects-wrapper .projects-container .data {
      max-width: 630px;
      margin-left: 90px;
      margin-top: 40px;
      padding-bottom: 150px; }
      .main-wrapper .projects-wrapper .projects-container .data .title {
        font-size: 33px;
        line-height: 33px;
        font-family: 'Philosopher', sans-serif;
        letter-spacing: 1px;
        margin-bottom: 20px;
        max-width: 90%; }
      .main-wrapper .projects-wrapper .projects-container .data .text {
        font-family: 'Philosopher', sans-serif;
        font-size: 17px;
        line-height: 30px; }
  .main-wrapper .projects-wrapper .projects-random {
    margin: 0 auto;
    max-width: calc(100% - 472px);
    margin-top: 100px;
    margin-bottom: 400px;
    position: relative;
    text-align: center; }
    .main-wrapper .projects-wrapper .projects-random .line {
      margin: 0 auto;
      height: 4px;
      width: 93px;
      background-color: #000; }
    .main-wrapper .projects-wrapper .projects-random .title {
      margin: 0 auto;
      font-size: 33px;
      line-height: 33px;
      font-family: 'Philosopher', sans-serif;
      letter-spacing: 1px;
      margin-bottom: 15px;
      max-width: 500px; }
    .main-wrapper .projects-wrapper .projects-random .more {
      margin: 0 auto;
      text-align: center;
      margin-top: 30px;
      margin-bottom: 70px;
      font-size: 12px;
      letter-spacing: 1px;
      border: 1px solid #000;
      padding: 5px 15px;
      display: table;
      transition: all 0.3s ease;
      -webkit-transition: all 0.3s ease;
      -moz-transition: all 0.3s ease;
      -ms-transition: all 0.3s ease;
      -o-transition: all 0.3s ease; }
      .main-wrapper .projects-wrapper .projects-random .more a {
        text-transform: uppercase; }
      .main-wrapper .projects-wrapper .projects-random .more:hover {
        background-color: #000;
        color: #fff; }
        .main-wrapper .projects-wrapper .projects-random .more:hover a {
          color: #fff; }

@media screen and (max-width: 1700px) {
  .main-wrapper .projects-wrapper .projects-container,
  .main-wrapper .projects-wrapper .projects-random {
    max-width: calc(100% - 280px); } }

@media screen and (max-width: 768px) {
  .main-wrapper .projects-wrapper .projects-container,
  .main-wrapper .projects-wrapper .projects-random {
    max-width: 80%; } }

@media screen and (max-width: 600px) {
  .main-wrapper .projects-wrapper .projects-container .data {
    margin-left: 0; } }

/*# sourceMappingURL=projects.css.map */