body {
      background-color: lightslategray;
}

div.main {
      background: #2D2B30;
      display: flex;
      justify-content: center;
      flex-direction: column;
      /*width: 100%;*/
      max-width: 1350px;
      margin: auto;
}

div.toprow {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
}

div.toprowpage .info .title {
      color: #FFFFFF;
      font-size: 1.8em;
      font-weight: bold;
      margin-top: 1em;
      line-height: 2;
}

div.info {
      display: flex;
      flex-direction: column;
      justify-content: center;
      font-family: Arial, sans-serif;
      font-size: 1em;
      font-weight: bold;
      line-height: 1.6;
      color: #FFFFFF;
}

div.info .name {
      display: flex;
      color: #FFFFFF;
      font-family: Arial Black, Arial, sans-serif;
      font-size: 12vw;
      line-height: 1.6;
      white-space: nowrap;
      margin: 0;
}

div.info .name.companyname {
      font-size: 6vw;
}

div.titlecontactbox {
      display: flex;
      text-align: left;
      flex-direction: column;
      justify-content: center;
/*      overflow: hidden;*/
}

div.contactbox {
      display: grid;
      grid-template-columns: 180px 220px;
      margin: 0 0 20px 0;
      text-align: left;
      /*border: 1px orange solid;*/
}

.zontline {
      width: 70vw;
}

div.imagebox {
      display: flex;
      justify-content: center;
      text-align: center;
}

div.middlerow {
      display: block;
      margin: 20px 0px 0 20px;
}

div.section {
      font-family: Arial, sans-serif;
      font-size: 1em;
      font-weight: bold;
      line-height: 1.6;
      color: #FFFFFF;
}

div.bottomrow {
      background: #2D2B30;
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      margin: 0px 20px 0 20px;
}

.title {
      color: #F37D3D; /*orange*/
      font-family: Arial, sans-serif;
      font-size: 1.3em;
      font-weight: bold;
      line-height: 1.6;

}

div.titlecontactbox .title {
      font-size: 1.3em;
      max-width: 280px;
}

.subtitle {
      color: #FFFFFF;
      font-family: Arial, sans-serif;
      font-size: 1.1em;
      font-weight: bold;
      line-height: 1.6;
}

div.titlecontactbox .subtitle {
      font-size: 1em;
}

ul {
      margin-top: 0;
}

.small {
      color: #D1CFD4; /*off white*/
      font-family: Arial, sans-serif;
      font-size: 1em;
      line-height: 1.6;
}

em {
      color: #F37D3D;
      font-weight: bold;
}

.contact {
      color: #D1CFD4;
      font-family: Arial, sans-serif;
      font-size: 1em;
      line-height: 2.2;
      /*border: 1px red solid;*/
}

/****************************************/

@media screen and (min-width: 700px) {

      div.toprow {
            display: flex;
            justify-content: flex-end;
            flex-wrap: nowrap;
            flex-basis: 100%;
      }

      .zontline {
            width: 25em;
      }

      div.titlecontactbox {
            text-align: left;
      }

      div.middlerow {
            margin: 10px 50px 0 50px;
      }

      div.bottomrow {
            margin: 10px 50px 0 50px;
      }

}

@media screen and (min-width: 500px) {

      div.toprow {
            display: flex;
            justify-content: flex-start;
            flex-basis: 100%;
      }

      .zontline {
            width: 25em;
      }

      div.info {
            display: block;
            margin: 0 auto 0 50px;
      }

      div.info .name {
            font-size: 4em;
            margin: 0 auto 0 0;
      }

      div.info .name.companyname {
            font-size: 2.2em;
      }

      div.titlecontactbox .title {
            font-size: 1.3em;
            max-width: 100%;
      }

      div.titlecontactbox .subtitle {
            font-size: 1.1em;
      }

      div.imagebox {
            margin: 0 100px 0 50px;
      }

}

/****************************************/

.phoneicon {
      width:32px;
      vertical-align: middle;
      object-position: -2px;
}

.linkedinicon {
      width:32px;
      vertical-align: middle;
}
      
.emailicon {
      width:32px;
      vertical-align: middle;
      object-position: -2px;
}
      
.pdficon {
      width:34px;
      vertical-align: middle;
      object-position: -4px;
}

a {
      text-decoration: none;
}

li a:hover {
      color: #F37D3D;
}

a:link, a:visited, a:hover {
      color: #D1CFD4;
}