@font-face {
    font-family: 'Roboto_light';
    src: url('fonts/Roboto-Light.ttf');
}
@font-face {
    font-family: 'Roboto-Regular';
    src: url('fonts/Roboto-Regular.ttf');
}
@font-face {
    font-family: 'Bazoo';
    src: url('fonts/bazoo.ttf');
}
@font-face {
    font-family: 'Bazoo';
    font-style: italic;
    src: url('fonts/bazooi.ttf');
}

body{



}

.robotoreg{
  font-size:14px;
  font-family: 'Roboto_light', sans-serif;
}


.zitrus{
  text-rendering: optimizeLegibility;
  margin:2px;

  font-size:14px;
  font-family: 'Bazoo', sans-serif;

}
.infotext{
  margin:2px;
  font-size:13px;
  font-family: 'Roboto_light', sans-serif;
}
.p1
{
  margin:2px;
  font-size:14px;
  font-family: 'Roboto_light', sans-serif;
}
.rubrik{
  margin:2px;
  margin-bottom:7px;
  font-size:15px;
  font-family: 'Roboto-Regular', sans-serif;
}
.word{
  margin:2px;
  margin-bottom:7px;
  font-size:18px;
  font-family: 'Bazoo', sans-serif;
}
.robotword{
  margin:2px;
  margin-bottom:7px;
  font-size:20px;
  font-family: 'Roboto-Regular', sans-serif;
}
.minitext{
  margin:2px;
  font-size:12px;
  font-family: 'Roboto-light', sans-serif;
}
[contenteditable="true"]:focus {
    outline: none;
}




.grid {
  background: #EEE;
  max-width: 720px;
}

/* clearfix */
.grid:after {
  content: '';
  display: block;
  clear: both;
}

/* ---- grid-item ---- */
.GI {
  width: 160px;
  height: 160px;
  float: left;

}

.GIW2 { width: 340px; }
.GIW3 { width: 520px; }
.GIW4 { width: 700px; }

.GIH2 { height: 340px; }
.GIH3 { height: 520px; }
.GIH4 { height: 700px; }

.grid-imageW1 { width: 170px; height: 170px; }
.grid-imageW2 { width: 350px; height: 350px; }
.grid-imageW3 { width: 530px; height: 530px; }
.grid-imageW4 { width: 710px; height: 710px;}

.grid-item {
  width: 160px;
  height: 160px;
  float: left;

}

.grid-item--width2 { width: 340px; }
.grid-item--width3 { width: 520px; }
.grid-item--width4 { width: 700px; }

.grid-item--height2 { height: 340px; }
.grid-item--height3 { height: 520px; }
.grid-item--height4 { height: 700px; }

.grid-image--width1 { width: 170px; height: 170px; }
.grid-image--width2 { width: 350px; height: 350px; }
.grid-image--width3 { width: 530px; height: 530px; }
.grid-image--width4 { width: 710px; height: 710px;}