/* Globals */
@import url('http://fonts.googleapis.com/css?family=Raleway:400,100,200,300,500,600,700,800,900');
@import url('http://fonts.googleapis.com/css?family=Lora:400,500,600,700');

/* Base structure */
html, body {
  height: 100%;
  background-color: #333;
}

body {
  color: #333;
  text-align: center;
  font-family: 'Lora', serif;
  text-rendering: optimizelegibility;
}

/* Links */
a, a:focus, a:hover {
  outline: none;
  cursor: pointer;
  text-decoration: none;
}

a {
  color: #fff;
  transition: 0.5s all ease;
}

a:focus, a:hover, .section.contacts a:hover, .leaflet-container a:hover, .mastfoot a:hover {
  color: #d0b471;
  transition: 0.5s all ease;
}

/* Text selection */
::-moz-selection {
  background: #d0b471;
  color: #fff;
}
::selection {
  background: #d0b471;
  color: #fff;
}

blockquote {
  border-color: #f2ebd9;
}

/* See email button */
.seeemail {
  position: absolute;
  right: 3%;
  top: 0px;
  background-color:rgba(208, 180, 113, 0.5);
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
  padding: 0.6vw;
}
.seeemail span.seeemail-icon {
  background: url("../img/letter.svg") no-repeat center center;
  background-size: contain;
  width: 5vw;
  height: 2vw;
  display: block;
}
.seeemail:hover {
  transition: 0.5s all ease;
  padding-top: 2vw;
}

/* See more button */
.seemore {
  height: 3vw;
  width: 3vw;
  min-width: 30px;
  min-height: 30px;
  position: absolute;
  left: 50%;
  bottom: 0px;
  transform: translate(-50%, -50%);
  background: url("../img/arrow.svg");
  background-size: cover;
  opacity: .7;
}

/* Generic section settings */
.section {
  width: 100%;
  min-height: 70%;
  background: white;
}

.section-head {
  font-weight: 400;
  font-size: 3.8vw;
  letter-spacing: 0.3vw;
  text-transform: uppercase;
  position: relative;
  margin-bottom: 4vh;
  display: inline-block;
}
.section-head:before {
  left: 100%;
  margin-left: 2vw;
}
.section-head:after {
  right: 100%;
  margin-right: 2vw;
}
.section-head:before, .section-head:after {
  content: '';
  position: absolute;
  border-top: 2px solid #ceb475;
  top: 50%;
  width: 100%;
  max-width: 3.6vw;
}

/* Padding for spacing */
.section.inner {
  padding: 3vh 3vw 3vh 3vw;
}

h1.lead-descr.container {
  margin-top: 0px;
  margin-bottom: 0px;
}

.lead-descr {
  font-family: 'Raleway', sans-serif;
  font-weight: 300;
  font-size: 1.3vw;
}

/* Headline section and it's properties */
.section.headline {
  color: #fff;
  min-height: 96%;
  box-shadow: inset 0 0 100px rgba(0, 0, 0, .5);
  background: url("../img/headline.jpg") center 0 no-repeat;
  background-size: cover;
  position: relative;
}

.cover-heading {
  color: #d0b471;
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: .2vw;
  font-size: 2.8vw;
  padding-bottom: .6vh;
}

.cover-heading-lg {
  width: 100%;
  height: 18vh;
  background: url("../img/heading.svg") no-repeat center bottom;
  background-size: 30vw;
}

.cover-subtitle {
  font-family: 'Raleway', sans-serif;
  font-weight: 400;
  text-transform: uppercase;
  font-size: 1.1vw;
  letter-spacing: .22vw;
}

.cover-fade {
  animation-name: leadFade;
  animation-iteration-count: 1;
  animation-timing-function: ease-out;
  animation-duration: 1s;
  margin-top: 15vh;
}

.cover-name {
  font-weight: 400;
  font-size: 4vw;
  text-transform: uppercase;
}

/* Practice areas section and it's properties */
.section.practice-areas {
  min-height: 40%;
}

.practice-area {
  display: inline-block;
  padding-left: 5vw;
  line-height: 3.5vw;
}

.practice-area-1 {
  background: url("../img/musseum.svg") no-repeat center left;
  background-size: 3.5vw;
  display: inline-block;
  padding-left: 5vw;
  line-height: 3.5vw;
  background-size: 3.5vw;
}

/* About us section and it's properties */
.section.about-us {
  color: #fff;
  text-shadow: 0 0 2px rgba(0,0,0,1);
  background: url("../img/about.jpg") center 0 no-repeat;
  background-size: cover;
}

/* Email section and it's properties */
.section.email {
  background: url("../img/email.jpg") center 0 no-repeat;
  background-size: cover;
  color: #fff;
  text-shadow: 0 0 2px rgba(0,0,0,1);
}

.section.email .div-form {
  padding-top: 5vh;
}
.section.email input, .section.email textarea, .section.email button {
  transition: 0.5s all ease;
  background-color:rgba(0, 0, 0, 0.7);
  color: #fff;
}
.section.email input:focus, .section.email textarea:focus {
  border-color: #d0b471;
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(208, 180, 113, .6);
}
.section.email button:hover {
  background-color:rgba(0, 0, 0, 0.8);
  color: #d0b471;
  transition: 0.5s all ease;
}
.section.email button:focus {
  color: #d0b471;
}
.section.email button:active {
  box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
  background: #392e13;
}
.alert-simple {
  color: #0f1620;
  background-color: #fff;
  border-color: #d0b471;
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(208, 180, 113, .6);
}
.modal-dialog {
  position:absolute;
  top:50% !important;
  transform: translate(0, -50%) !important;
  -ms-transform: translate(0, -50%) !important;
  -webkit-transform: translate(0, -50%) !important;
  margin:auto 5%;
  width:90%;
  height:1px;
}

/* Map section and it's properties */
.section.map {
  height: 50vh;
  min-height: 50vh;
}

/* Contacts section and it's properties */
.section.contacts {
  color: #777;
  font-weight: 300;
  padding-top: 5vh;
  min-height: 1%;
}

.section.contacts a {
  color: #777;
  transition: 0.5s all ease;
}

.section.contacts .hide-e {
  font-family: 'Raleway', sans-serif;
}

.section.contacts address .addr-street {
  color: #d0b471;
  text-transform: uppercase;
  letter-spacing: .16vw;
  font: 1.5vw/3vw 'Lora', serif;
}

.section.contacts address .addr-phone {
  margin: 0 auto;
  padding: 0;
}
.section.contacts address .addr-phone span.phones {
  color: #0f1620;
  display:inline-block;
  text-align: end;
  letter-spacing: .2vw;
  font: 2.3vw/3.2vw 'Lora', serif;
  padding-bottom: 5vh;
}
.section.contacts address .addr-phone span.phones > span {
  display: block;
}
.section.contacts address .addr-phone span.phones a span {
  font-size: 1.8vw;
}

/* Footer section and it's properties */
.section.footer {
  min-height: 1%;
}
.mastfoot {
  color: #777;
  font: 1.2vw/2vw 'Raleway', sans-serif;
  text-align: center;
  width: 100%;
}
.mastfoot a {
  color: #777;
  transition: 0.5s all ease;
}

/* Multiple sections properties */
.section.practice-areas .lead-descr, .section.profile .lead-descr {
  color: #666;
}
.section.about-us .cover .lead-descr, .section.profile .cover .lead-descr {
  text-align: left;
}

.tooltip .tooltip-inner {
  padding: 10px;
}

@keyframes leadFade {
  0% {
    transform: translateY(-5vh);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

@media ( max-width : 1280px) {
  .cover-heading {
    letter-spacing: .3vw;
    font-size: 3.3vw;
  }
  .cover-subtitle {
    font-size: 1.6vw;
    letter-spacing: .3vw;
  }
  .cover-name {
    font-size: 4.5vw;
  }
  .lead-descr {
    font-size: 1.8vw;
  }
  .section.contacts address .addr-street {
    font-size: 2vw;
    line-height: 3.2vw;
  }
  .section.contacts address .addr-phone span.phones {
    font-size: 2.8vw;
    line-height: 3.8vw;
  }
  .section.contacts address .addr-phone span.phones a span {
    font-size: 2.3vw;
  }
  .mastfoot {
    font-size: 1.7vw;
    line-height: 2.5vw;
  }
}
@media ( max-width : 1025px) {
  .cover-heading {
    letter-spacing: .3vw;
    font-size: 3.5vw;
  }
  .cover-subtitle {
    font-size: 1.8vw;
    letter-spacing: .3vw;
  }
  .cover-name {
    font-size: 4.7vw;
  }
  .lead-descr {
    font-size: 2vw;
  }
  .section.contacts address .addr-street {
    font-size: 2.2vw;
    line-height: 3.4vw;
  }
  .section.contacts address .addr-phone span.phones {
    font-size: 3vw;
    line-height: 4vw;
  }
  .mastfoot {
    font-size: 1.9vw;
    line-height: 2.7vw;
  }
}
@media ( max-width : 800px) {
  .cover-heading {
    letter-spacing: .4vw;
    font-size: 4vw;
  }
  .cover-subtitle {
    font-size: 2.3vw;
    letter-spacing: .4vw;
  }
  .cover-name {
    font-size: 5.2vw;
  }
  .lead-descr {
    font-size: 2.5vw;
  }
  .section.contacts address .addr-street {
    font-size: 2.7vw;
    line-height: 3.9vw;
  }
  .section.contacts address .addr-phone span.phones {
    font-size: 3.5vw;
    line-height: 4.5vw;
  }
  .section.contacts address .addr-phone span.phones a span {
    font-size: 2.8vw;
  }
  .mastfoot {
    font-size: 2.2vw;
    line-height: 3vw;
  }
}
@media ( max-width : 680px) {
  .section-head:before, .section-head:after {
    display: none;
  }
  .cover-subtitle {
    font-size: 2.6vw;
    letter-spacing: .4vw;
  }
  .lead-descr {
    font-size: 2.8vw;
  }
  .practice-area-1 {
    padding-left: 5vw;
    line-height: 4vw;
    background-size: 4vw;
  }
  .section.contacts address .addr-street {
    font-size: 3vw;
    line-height: 4.2vw;
  }
  .section.contacts address .addr-phone span.phones {
    font-size: 3.8vw;
    line-height: 4.8vw;
  }
  .mastfoot {
    font-size: 2.5vw;
    line-height: 3.3vw;
  }
}
@media ( max-height : 400px) {
  .cover-heading-lg {
    height: 15vh;
  }
  .cover-fade {
    margin-top: 10vh;
  }
}
@media (orientation: portrait) {
  .section.headline {
    min-height: 70%;
  }
  .section.practice-areas {
    min-height: 30%;
  }
  .section.about-us {
    min-height: 50%;
  }
  .section.contacts {
    min-height: 30%;
    padding-top: 5vh;
  }
  .section.contacts address .addr-phone span.phones {
    padding-bottom: 2.5vh;
  }
}