/* cyrillic */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400;
  src: local('Playfair Display'), local('PlayfairDisplay-Regular'), url(https://fonts.gstatic.com/s/playfairdisplay/v10/2NBgzUtEeyB-Xtpr9bm1CUR-13DsDU150T1bKbJZejI.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400;
  src: local('Playfair Display'), local('PlayfairDisplay-Regular'), url(https://fonts.gstatic.com/s/playfairdisplay/v10/2NBgzUtEeyB-Xtpr9bm1CfoVn-aGdXvQRwgLLg-TkDk.woff2) format('woff2');
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400;
  src: local('Playfair Display'), local('PlayfairDisplay-Regular'), url(https://fonts.gstatic.com/s/playfairdisplay/v10/2NBgzUtEeyB-Xtpr9bm1Cdhy5e3cTyNKTHXrP9DO-Rc.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
/* cyrillic */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  src: local('Playfair Display Bold'), local('PlayfairDisplay-Bold'), url(https://fonts.gstatic.com/s/playfairdisplay/v10/UC3ZEjagJi85gF9qFaBgIKHabUDGjprROP0Kzi4LtY8.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  src: local('Playfair Display Bold'), local('PlayfairDisplay-Bold'), url(https://fonts.gstatic.com/s/playfairdisplay/v10/UC3ZEjagJi85gF9qFaBgILCFnVHHm1VfBoEzRr6gqH0.woff2) format('woff2');
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  src: local('Playfair Display Bold'), local('PlayfairDisplay-Bold'), url(https://fonts.gstatic.com/s/playfairdisplay/v10/UC3ZEjagJi85gF9qFaBgIIsv7neNnoQYDmljOSnH1QE.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}


.group:after {
  content: "";
  display: table;
  clear: both;
}

* {
    padding:0;
    margin:0;
    box-sizing: border-box;
}

.wrap {
  position:relative;
  width:1200px;
  max-width:100%;
  margin:0 auto;
  background-color:#383838;
}

#burger,
#mobnav {
  display:none;
}

body {
    font-size:62.5%;
    background-color:#171717;
    color:#fff;
    font-family: 'Playfair Display', serif;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

header {
  float:left;
  clear:left;
  width:100%;
  width:100%;
  padding:4.5%;
}

  #logo {
        width:316px;
        max-width:50%;
        float:left;
    }
  
    #logo img {
        max-width:100%;
        display:block;
    }
  
  .tagline {
    float:right;
    color:#dd9c00; /* orange */
    font-size:1.9em;
    clear:right;
    margin-top:1.5em;
    font-style: italic;
  }
  
  .contact-info {
    float:right;
    color:#fff;
    text-align: right;
    margin-top:2.5em
  }
  
    .contact-info p.tel {
      color:#dd9c00; /* orange */
      text-transform: uppercase;
      letter-spacing: 1px;
      font-size:1.4em;
    }
    
    .contact-info p {
      font-size: 2.5em;
    }
    
      .contact-info p a {
        color:#fff;
        text-decoration: none;
      }
      
      .contact-info p.smaller {
        font-size:1.75em;
      }
    
  #lampada {
    float:right;
    width:150px;
    margin-left:2%;
  }
  
  #cinoa {
    float:right;
    width:104px;
    margin-left:4%;
  }
    
    nav {
      float:left;
      clear:left;
      width:100%;
      border-top:1px solid #fff;
    }
  
      nav ul {
        list-style: none;
      }
      
        #mainnav {
          float:left;
          width:100%;
          padding:0 5%;
        }
      
        #mainnav li {
          float:left;
        }
        
          #mainnav li a {
            float:left;
            width:100%;
            color:#fff;
            text-decoration: none;
            text-transform: uppercase;
            font-size:1.5em;
            padding:1em 1.75em;
            transition: 0.5s color ease;
          }
          
            #mainnav li a:hover,
            #mainnav li a.active{
              color:#dd9c00; /* orange */
            }

.hero {
  float:left;
  clear:left;
  width:100%;
  background-color:#666;
}

.align_left {
  float:left;
}

.align_right {
  float:right;
}

.align_center {
  text-align: center;
}

img.align_left {
  margin:0.5em 1em 1em 0;
}

img.align_right {
  margin:0.5em 0 1em 1em;
}

img.align_center {
  display:block;
  margin-left:auto;
  margin-right:auto;
}

img {
  max-width:100%;
  height:auto;
}
  
footer {
  clear:both;
  float:left;
  width:100%;
  padding:4.5%;
  border-top:1px solid #fff;
  color:#fff;
}

  #flogo {
    float:left;
    width:220px;
    max-width:90%;
  }
  
  .ftext {
    float:right;
    text-align: right;
    font-size:1.2em;
  }
  
  .ftext h4 {
    color:#dd9c00; /* orange */
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom:1em;
  }
  
  .ftext p {
    margin-bottom:0.5em;
  }
  
  .copyright {
    font-size:0.8em;
    color:#ccc;
    margin:1em 0 0 0;
  }
  
    .copyright a {
      color:#ccc;
    }

@media screen and (max-width:1121px){
  #mainnav li a {
    font-size:1.3em;
  }
}
  
@media screen and (max-width:970px) {
  #burger,
  #mobnav{
    display:block;
  }
  
  #mainnav {
    display:none;
  }
  
  #burger {
    margin:1em auto;
    dislay:block;
    width:32px;
  }
  
    #burger img {
      max-width:100%;
      display:block;
    }
  
  #mobnav,
  #mobnav li{
    float:left;
    clear:left;
    width:100%;
  }
  
    #mobnav li a{
      float:left;
      color:#fff;
      text-decoration: none;
      font-size:1.4em;
      padding:1em;
      width:100%;
      padding:1em;
      border-bottom:1px solid #aaa;
      text-align: center;
      text-transform: uppercase;
    }
    
      #mobnav li a:hover {
        color:#dd9c00; /* orange */
      }
}

@media screen and (max-width:799px) {
  #flogo,
  .ftext{
    float:none;
    margin:0 auto;
    display:block;
  }
  
  #flogo {
    margin-top:2em;
  }
  
    .ftext {
      text-align: center;
      width:100%;
      margin-top:2em;
    }
}

@media screen and (max-width:749px) {
  .tagline,
  #lampada,
  #cinoa{
    display:none;
  }
}

@media screen and (max-width:565px) {
  .contact-info{
    display:none;
  }
  
  #logo {
    max-width:90%;
    display:block;
    margin:0 auto;
    float:none;
  }

}