.background-wrapper, .active-slider { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; overflow: hidden;
  img { width: 100%; height: auto; }
  .map { height: 100%; }
  .background-color { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -2;
    &.background-color-white { background-color: $color-white; }
    &.background-color-black { background-color: $color-black; }
  }
}

.bg-transfer { background-size: cover; background-position: center center; position: absolute; top: 0; left: 0; height: 100%; overflow: hidden; z-index: -1; width: 100%;
  img { display: none !important; }
  &.bg-fixed { background-attachment: fixed; background-size: 100%; background-position: top center; }
}

.center { text-align: center; }

.note { @include opacity(.4); font-size: 12px; margin: 8px 0; }

.shadow { @include box-shadow(0px 1px 10px rgba(0,0,0,.07)); }

.opacity-90 { @include opacity(.9); }
.opacity-80 { @include opacity(.8); }
.opacity-70 { @include opacity(.7); }
.opacity-60 { @include opacity(.6); }
.opacity-50 { @include opacity(.5); }
.opacity-40 { @include opacity(.4); }
.opacity-30 { @include opacity(.3); }
.opacity-20 { @include opacity(.2); }
.opacity-19 { @include opacity(.19); }
.opacity-18 { @include opacity(.18); }
.opacity-17 { @include opacity(.17); }
.opacity-16 { @include opacity(.16); }
.opacity-15 { @include opacity(.15); }
.opacity-14 { @include opacity(.14); }
.opacity-13 { @include opacity(.13); }
.opacity-12 { @include opacity(.12); }
.opacity-11 { @include opacity(.11); }
.opacity-10 { @include opacity(.1); }
.opacity-9 { @include opacity(.09); }
.opacity-8 { @include opacity(.08); }
.opacity-7 { @include opacity(.07); }
.opacity-6 { @include opacity(.06); }
.opacity-5 { @include opacity(.05); }
.opacity-4 { @include opacity(.04); }
.opacity-3 { @include opacity(.03); }
.opacity-2 { @include opacity(.02); }
.opacity-1 { @include opacity(.01); }
.opacity-0 { @include opacity(.00); }

.text-align-left { text-align: left; }
.text-align-right { text-align: right; }

.underline { text-decoration: underline; }

.width-10 { width: 10%; }
.width-20 { width: 20%; }
.width-25 { width: 25%; }
.width-30 { width: 30%; }
.width-33 { width: 33%; }
.width-40 { width: 40%; }
.width-50 { width: 50%; }
.width-60 { width: 60%; }
.width-70 { width: 70%; }
.width-80 { width: 80%; }
.width-90 { width: 90%; }
.width-100 { width: 100%; }

.height-10 { height: 10%; }
.height-20 { height: 20%; }
.height-30 { height: 30%; }
.height-40 { height: 40%; }
.height-50 { height: 50%; }
.height-60 { height: 60%; }
.height-70 { height: 70%; }
.height-80 { height: 80%; }
.height-90 { height: 90%; }
.height-100 { height: 100%; }

.height-200px { height: 200px !important; }
.height-250px { height: 250px !important; }
.height-300px { height: 300px !important; }
.height-350px { height: 350px !important; }
.height-400px { height: 400px !important; }
.height-450px { height: 450px !important; }
.height-500px { height: 500px !important; }
.height-550px { height: 550px !important; }
.height-600px { height: 600px !important; }
.height-650px { height: 650px !important; }
.height-700px { height: 700px !important; }
.height-750px { height: 750px !important; }
.height-800px { height: 800px !important; }
.height-850px { height: 850px !important; }
.height-900px { height: 900px !important; }
.height-950px { height: 950px !important; }
.height-1000px { height: 1000px !important; }

.space { height: 60px; }

.vertical-aligned-wrapper { display: table; height: 100%;
  .vertical-aligned-element { display: table-cell; vertical-align: middle; float: none;
    &.top { vertical-align: top; }
    //&.middle { vertical-align: middle; }
    &.bottom { vertical-align: bottom; }
  }
}