﻿.resolutionDiv {
  background: none repeat scroll 0 0 #FFFFFF;
  border: 1px solid #CCCCCC;
  display: none;
  font-size: 12px;
  height: 50px;
  left: 0;
  line-height: 50px;
  margin: 0 auto;
  position: fixed;
  right: 0;
  text-align: center;
  width: 90%;
  z-index: 100;
  opacity: 0.8;
}
.resolutionDiv:hover {
  opacity: 1;
}
.resolutionDiv:after {
  content: "Main Resolution";
}
@media (max-width: 480px) {
  .resolutionDiv:after {
    content: "max-width: 480px";
  }
}
@media (min-width: 480px) and (max-width: 800px) {
  .resolutionDiv:after {
    content: "(min-width: 480px) and (max-width: 800px)";
  }
}
@media (min-width: 800px) and (max-width: 1100px) {
  .resolutionDiv:after {
    content: "(min-width: 800px) and (max-width: 1100px)";
  }
}
*,
*:after,
*:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#ms-designer-ribbon *,
#ms-designer-ribbon *:after,
#ms-designer-ribbon *:before {
  /* Removes padding behavior on widths */
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
a:visited {
  color: inherit;
}
/* Targets all elements */
[class*='bit-'] {
  float: right;
  padding: 10px;
}
[class*='bit-S2'] {
  float: right;
  padding: 10px;
}
[class*='bit-S3'] {
  float: left;
  padding: 10px;
}
/* Floats last ".bit-" to the right */
[class*='bit-']:last-of-type {
  padding-left: 10px;
  float: left;
}
[class*='bit-S1']:last-of-type {
  padding-right: 10px;
  float: right;
}
/* Clearfix */
.frame:after {
  content: "";
  display: table;
  clear: both;
}
/* Main Widths */
.bit-1 {
  width: 100%;
}
.bit-2 {
  width: 50%;
}
.bit-3 {
  width: 33.33%;
}
.bit-4 {
  width: 25%;
}
.bit-5 {
  width: 20%;
}
.bit-6 {
  width: 16.6666666667%;
}
.bit-7 {
  width: 14.2857142857%;
}
.bit-8 {
  width: 12.5%;
}
.bit-9 {
  width: 11.1111111111%;
}
.bit-10 {
  width: 10%;
}
.bit-11 {
  width: 9.09090909091%;
}
.bit-12 {
  width: 8.33%;
}
.bit-36p {
  width: 36%;
}
.bit-40p {
  width: 40%;
}
.bit-64p {
  width: 64%;
}
.bit-66p {
  width: 66.66%;
}
.bit-75p {
  width: 75%;
}
.bit-S1 {
  width: 382px;
}
.bit-S2 {
  width: 324px;
}
.bit-S3 {
  width: 300px;
}
.bit-S4 {
  width: 706px;
}
.padding-v-none {
  padding: 0 10px !important;
}
.padding-h-none {
  padding: 10px 0 !important;
}
.padding-none {
  padding: 0 !important;
}
/* Landscape mobile & down
===============================*/
@media (max-width: 480px) {
  .bit-1,
  .bit-2,
  .bit-3,
  .bit-4,
  .bit-5,
  .bit-6,
  .bit-7,
  .bit-8,
  .bit-9,
  .bit-10,
  .bit-11,
  .bit-12,
  .bit-S1,
  .bit-S2,
  .bit-S3,
  .bit-S4,
  .bit-36p,
  .bit-40p,
  .bit-66p,
  .bit-64p,
  .bit-75p {
    width: 100%;
  }
  .frame .bit-4:nth-child(2) {
    float: right;
  }
  .frame .bit-4:nth-child(3) {
    clear: both;
    float: left;
  }
  .frame .bit-4:nth-child(4) {
    float: right;
  }
  .frame {
    width: auto !important;
    /*margin: 0 @gutter !important;*/
  }
}
/* Mobile to Tablet Portrait
===============================*/
@media (min-width: 480px) and (max-width: 800px) {
  .bit-4,
  .bit-6,
  .bit-8,
  .bit-10,
  .bit-12 {
    width: 50%;
  }
  .bit-1,
  .bit-2,
  .bit-3,
  .bit-5,
  .bit-7,
  .bit-9,
  .bit-11,
  .bit-36p,
  .bit-40p,
  .bit-66p,
  .bit-64p,
  .bit-75p {
    width: 100%;
  }
  .frame {
    width: auto !important;
    /*margin: 0 @gutter !important;*/
  }
  .bit-vote {
    width: 100%;
  }
  .bit-S1,
  .bit-S2,
  .bit-S3,
  .bit-S4 {
    width: 100%;
  }
}
/* Landscape Tablet to Desktop
===============================*/
@media (min-width: 800px) and (max-width: 1100px) {
  .bit-2,
  .bit-7 {
    width: 100%;
  }
  .bit-4,
  .bit-8,
  .bit-10,
  .bit-12 {
    width: 50%;
  }
  .frame {
    width: auto !important;
    /*margin: 0 @gutter !important;*/
  }
}
/*# sourceMappingURL=responsive.css.map */