@import url("normalize.css");
@import url("https://fonts.googleapis.com/css?family=Alfa+Slab+One|Raleway:300,400i,700&subset=latin-ext");
.wrapper {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto auto auto auto auto;
  grid-row-gap: 5px;
  grid-template-areas: "ghead" "gtitle" "gdetails" "gcontent" "gfooter"; }
  @media only screen and (min-width: 800px) {
    .wrapper {
      grid-tamplate-columns: 2fr 1fr;
      grid-template-rows: auto auto 5fr auto;
      grid-template-areas: "gtitle gtitle" "ghead gdetails" "gcontent gcontent" "gfooter gfooter"; } }

.obj_details {
  grid-area: gdetails;
  padding: 8px; }

.obj_header {
  grid-area: ghead; }

.obj_name {
  grid-area: gtitle;
  position: sticky;
  top: 0px;
  background: #b0c5cf;
  padding: 8px;
  font-size: 24px;
  color: #f8f8f8; }
  @media only screen and (min-width: 800px) {
    .obj_name {
      position: fixed;
      width: 100vh;
      top: -15px; } }

.obj_details {
  grid-area: gdetails; }
  @media only screen and (min-width: 800px) {
    .obj_details {
      display: inline;
      margin: 8px;
      margin-top: 60px;
      margin-left: 16px; } }

.obj_content {
  grid-area: gcontent;
  padding: 8px; }
  .obj_content .article_footer {
    color: #8a8a8a;
    padding: 0 0 0 15px;
    font-style: italic;
    font-size: 12px; }

.main_footer {
  grid-area: gfooter; }

.wrapper {
  margin: 0px; }
  .wrapper .obj_header .obj_images {
    padding: 10px; }
    @media only screen and (min-width: 800px) {
      .wrapper .obj_header .obj_images {
        display: inline; } }
    .wrapper .obj_header .obj_images img {
      display: block;
      margin-left: auto;
      margin-right: auto;
      margin-top: 10px;
      height: 60vh; }
      @media only screen and (min-width: 800px) {
        .wrapper .obj_header .obj_images img {
          display: inline; } }
  .wrapper .main_footer {
    padding: 10px;
    background: #c4c4c4;
    color: #f8f8f8;
    font-style: normal; }
    .wrapper .main_footer p {
      display: block;
      text-align: center;
      font-size: 8px; }
    .wrapper .main_footer section {
      display: block;
      margin-left: auto;
      margin-right: auto;
      margin-top: 10px; }
      .wrapper .main_footer section img {
        margin-top: 10px;
        margin-left: auto;
        margin-right: auto;
        display: block;
        width: 30vw; }

h2 {
  font-size: 20px; }
