root
{
  font-size: 130%;
}
*
{
  box-sizing: border-box;
}
html, body
{
  margin: 0;
  padding: 0;
  width: 100%;
  min-height: 100%;
  font-size: 1rem;
  line-height: 200%;
  font-family: 'Catamaran', sans-serif;
}
html {
  height: 100%;
}
body {
  position: relative;
}
section
{
  width: 100%;
  min-height: 100%;
}
#home
{
  float: right;
  vertical-align:top;
  display:inline-block;
  background-color:#f40;
  color:#fff;
  text-decoration:none;
  padding:.5rem;
  font-weight:bold;
  margin-left:.5rem;
  border-radius: 0 0 12px 12px;
}
.utility {
}
main {
  clear: both;
  padding-bottom: 260px;
  background-color: #f5f5f5;
}
main #cover
{
  background-image: url("/images/sef-servizi-e-forwarding-porto-di-salerno.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #039;
  color: #ffffff;
}
main #cover .container
{
  margin: auto;
  max-width: 68rem;
  padding: 1rem;
  padding-top: 0rem;
}
main #cover .row
{
  max-width: 70rem;
}
#logo {
  float: left;
}
main #cover h1
{
  font-size: 3rem;
  font-weight: 900;
  line-height: 3.5rem;
  text-shadow: 2px 2px #008;
  margin-top: .3em;
  margin-bottom: 0;
  float: left;
}
main #cover h2
{
  font-size: 2.5rem;
  line-height: 3rem;
  font-weight: 300;
  text-shadow: #000 2px 2px;
}
main #cover span
{
  /*color: #ffbb00;*/
}
main #cover p
{
  font-size: 1.3em;
  font-weight: 200;
  line-height: 1.5em;
  margin-top: 1.5em;
}
main #cover p img
{
  width: 9em;
  margin-top: 1em;
}
main #cover a
{
  display: inline-block;
}
main #cover .row ul
{
  list-style: none;
  padding:0;
  margin:0;
}
main #cover .row li
{
  display: inline-block;
  background-color: #f40;
  font-size: 1.5rem;
  padding:0.5rem;
  margin:0.1rem;
  border-radius: 0 0 12px 12px;
}
main #cover .row li a
{
  font-size: inherit;
  font-weight: inherit;
  margin: 0;
  padding: 0;
  color:#fff;
  text-decoration:none;
  cursor: pointer;
}
main #cover .services
{
  clear: both;
  padding-top: 1em;
  padding-bottom: 1em;
}
main #cover .postit
{
  margin-top: 4rem;
  display: block;
  vertical-align: top;
}
main #cover .postit>div
{
  display: none;
  vertical-align: top;
  padding: 2rem;
  margin: .5rem;
  color: #000;
  opacity: .9;
  border-radius: .5rem;
  background-color: #fff;
  /*min-height: 30rem;*/
  /*max-width: 22rem;*/
}
main #cover .postit>div p
{
  font-size: 1.2rem;
  font-weight: 400;
  line-height: 1.7rem;
}
main #cover .postit>div ul
{
  list-style: disc;
  font-size: 1.2rem;
  font-weight: 400;
  line-height: 1.5rem;
}
main #cover .postit>div li
{
  padding-bottom:1rem;
}
main #cover .postit>div h3
{
  font-size: 1.5rem;
  font-weight: bold;
  line-height: 1.3rem;
  /*max-width: 18rem;*/
  text-align: center;
  color: #f30;
}
#utility a {
  line-height: 1.7em;
}
@media only screen and (max-width: 425px)
{
  main #cover h1
  {
    font-size: 2.8rem;
    line-height: 3.3rem;
  }
  main #cover h2
  {
    font-size: 1.5rem;
    line-height: 2.1rem;
    font-weight: bold;
  }
}
@media only screen and (min-width: 768px)
{
  main #cover h2
  {
    font-size: 2em;
    line-height: 2.5rem;
    font-weight: bold;
  }
  main #cover .postit>div ul, main #cover .postit>div p
  {
    /*max-width: 17.5rem;*/
  }
}

#features
{
  padding: 1rem;
  padding-top: 3rem;
  padding-bottom: 3rem;
  background-color: #f5f5f5;
  color: #333;
}
#features .container
{
  text-align: center;
}
#features .row
{
  max-width: 70rem;
  margin:auto;
}
#features p
{
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 2rem;
  text-align: left;
}
footer
{
  position: absolute;
  display: block;
  width: 100%;
  left: 0;
  bottom: 0;
  padding: 1rem;
  background-color: #039;
  border-top: .5rem solid #0ab;
  color: #ffffff;
}
footer .row span
{
  white-space: nowrap;
}
footer .row
{
  color: #ffffff;
  max-width: 70rem;
  margin: auto;
  text-align: center;
  line-height: 1.5rem;
  font-size: 1.2rem;
  font-weight: 400;
}
.contacts>div
{
  min-width: 18rem;
}