/* 
----------------------------------------------------------------------------------------------------
 CSS reset
----------------------------------------------------------------------------------------------------
*/
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0;
  margin: 0;
  outline: none; }

/* 
----------------------------------------------------------------------------------------------------
 Structure
----------------------------------------------------------------------------------------------------
*/
html, body {
  -webkit-font-smoothing: antialiased;
  cursor: default;
  width: 100%;
  height: 100%; }

/* 
----------------------------------------------------------------------------------------------------
 Diagonal shapes
----------------------------------------------------------------------------------------------------
*/
.car-diamond {
  position: relative;
  float: left;
  display: block;
  width: 50vw;
  height: 100vh; }
  .car-diamond .diamond {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }
  .car-diamond .diamond-mobile {
    display: none; }
  .car-diamond .car {
    position: absolute;
    display: block;
    top: 26%;
    right: 39%;
    text-align: center; }
    .car-diamond .car img {
      /*position: absolute;
      display: block;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      width: 30vw;*/

      position: absolute;
      display: block;
      left: 50%;
      top: 0;
      transform: translate(-50%, -50%);
      width: 45vw;
    }
    .car-diamond .car h2 {
      position: absolute;
      display: block;
      left: calc( 50% - 3vw);
      top: 12.9vw;
      transform: translate(-50%, 0);
      width: 16vw;
      color: #fff;
      font: bold 1.8vw Arial;
      text-align: left; }

/* 
----------------------------------------------------------------------------------------------------
 Responsive
----------------------------------------------------------------------------------------------------
*/
@media only screen and (max-width: 600px) {
  .car-diamond {
    width: 100vw;
    height: 21vh; }
    .car-diamond .diamond {
      display: none; }
    .car-diamond .diamond-mobile {
      display: block;
      position: absolute;
      top: 0;
      right: 0;
      width: 36%;
      height: 100%; }
    .car-diamond .car {
      top: 58%;
      right: 23.1%;
      text-align: left; }
      .car-diamond .car img {
        top: calc( 50% - 2.1vh);
        width: 39vw; }
      .car-diamond .car h2 {
        position: absolute;
        display: block;
        left: -63vw;
        top: -6.3vw;
        transform: none;
        width: 45vw;
        color: #000;
        font: bold 4.5vw Arial;
        text-align: left; } }

/* 
----------------------------------------------------------------------------------------------------
 Print
----------------------------------------------------------------------------------------------------
*/
