@import url("http://fonts.googleapis.com/css?family=Noto+Sans:400,400italic,700");

@import url("font-awesome.min.css");

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {  
  margin-top: 0px;  
  margin-right: 0px;  
  margin-bottom: 0px;  
  margin-left: 0px;  
  padding-top: 0px;  
  padding-right: 0px;  
  padding-bottom: 0px;  
  padding-left: 0px;  
  border-top-width: 0px;  
  border-right-width: 0px;  
  border-bottom-width: 0px;  
  border-left-width: 0px;  
  border-top-style: none;  
  border-right-style: none;  
  border-bottom-style: none;  
  border-left-style: none;  
  font: inherit;  
  vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {  
  display: block;
}

body {  
  line-height: 1;
}

ol, ul {  
  list-style-type: none;  
  list-style-position: outside;  
  list-style-image: none;
}

blockquote, q {  
  quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {  
  content: none;
}

table {  
  border-collapse: collapse;  
  border-spacing: 0px;
}

body {
}

*, *:before, *:after {  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.container {  
  margin-left: auto;  
  margin-right: auto;
}

.container {  
  width: 960px;
}

@media screen and (min-width: 737px) {
  .container { width: 1200px; }
}

@media screen and (min-width: 737px) and (max-width: 1200px) {
  .container { width: 1000px; }
}

@media screen and (max-width: 736px) {
  .container { width: 100% ! important; }
}

.row {  
  border-bottom-width: 1px;  
  border-bottom-style: solid;  
  border-bottom-color: transparent;  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.row > * {  
  float: left;  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.row:after, .row:before {  
  content: "";  
  display: block;  
  clear: both;  
  height: 0px;
}

.row.uniform > * > :first-child {  
  margin-top: 0px;
}

.row.uniform > * > :last-child {  
  margin-bottom: 0px;
}

.row > * {  
  padding-top: 0px;  
  padding-right: 0px;  
  padding-bottom: 0px;  
  padding-left: 40px;
}

.row {  
  margin-top: 0px;  
  margin-right: 0px;  
  margin-bottom: -1px;  
  margin-left: -40px;
}

.row.uniform > * {  
  padding-top: 40px;  
  padding-right: 0px;  
  padding-bottom: 0px;  
  padding-left: 40px;
}

.row.uniform {  
  margin-top: -40px;  
  margin-right: 0px;  
  margin-bottom: -1px;  
  margin-left: -40px;
}

@media screen and (min-width: 737px) {
  .row > * { padding: 50px 0px 0px 50px; }
  .row { margin: -50px 0px -1px -50px; }
  .row.uniform > * { padding: 50px 0px 0px 50px; }
  .row.uniform { margin: -50px 0px -1px -50px; }
}

@media screen and (min-width: 737px) and (max-width: 1200px) {
  .row > * { padding: 35px 0px 0px 35px; }
  .row { margin: -35px 0px -1px -35px; }
  .row.uniform > * { padding: 35px 0px 0px 35px; }
  .row.uniform { margin: -35px 0px -1px -35px; }
}

@media screen and (max-width: 736px) {
  .row > * { padding: 20px 0px 0px 20px; }
  .row { margin: -20px 0px -1px -20px; }
  .row.uniform > * { padding: 20px 0px 0px 20px; }
  .row.uniform { margin: -20px 0px -1px -20px; }
}

body {  
  background-color: #eeeeee;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;  
  font-family: 'Noto Sans', sans-serif;  
  color: #898e96;
}

input, textarea, select {  
  font-family: 'Noto Sans', sans-serif;  
  color: #898e96;
}

h1, h2, h3, h4, h5, h6 {  
  font-weight: 700;  
  color: #696c71;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {  
  text-decoration: none;
}

strong, b {  
  font-weight: 700;  
  color: #696e76;
}

em, i {  
  font-style: italic;
}

a {  
  color: #3a71d8;
}

sub {  
  position: relative;  
  top: 0.5em;  
  font-size: 0.8em;
}

sup {  
  position: relative;  
  top: -0.5em;  
  font-size: 0.8em;
}

hr {  
  border-right-color: initial;  
  border-top-width: 1px;  
  border-right-width: 0px;  
  border-bottom-width: 0px;  
  border-left-width: 0px;  
  border-top-style: solid;  
  border-right-style: none;  
  border-bottom-style: none;  
  border-left-style: none;  
  -moz-border-top-colors: none;  
  -moz-border-right-colors: none;  
  -moz-border-bottom-colors: none;  
  -moz-border-left-colors: none;  -o-border-image: none;
  -webkit-border-image: none;
  border-image: none;
}

blockquote {  
  border-left-width: 0.5em;  
  border-left-style: solid;  
  border-left-color: #dddddd;  
  padding-top: 1em;  
  padding-right: 0px;  
  padding-bottom: 1em;  
  padding-left: 2em;  
  font-style: italic;
}

p, ul, ol, dl, table {  
  margin-bottom: 1em;
}

header {  
  margin-bottom: 1em;
}

header .byline {  
  display: block;  
  margin-top: 0.5em;  
  margin-right: 0px;  
  margin-bottom: 0px;  
  margin-left: 0px;  
  padding-top: 0px;  
  padding-right: 0px;  
  padding-bottom: 0.5em;  
  padding-left: 0px;
}

footer {  
  margin-top: 1em;
}

br.clear {  
  clear: both;
}

section, article {  
  margin-bottom: 3em;
}

section > :last-child, section:last-child, article > :last-child, article:last-child {  
  margin-bottom: 0px;
}

.row > section, .row > article {  
  margin-bottom: 0px;
}

.image {  
  display: inline-block;
}

.image img {  
  display: block;  
  width: 100%;  -webkit-border-radius: 5px 5px 5px 5px;
  border-radius: 5px 5px 5px 5px;
}

.image.featured {  
  display: block;  
  width: 100%;  
  margin-top: 0px;  
  margin-right: 0px;  
  margin-bottom: 2em;  
  margin-left: 0px;
}

.image.full {  
  display: block;  
  width: 100%;
}

.image.left {  
  float: left;  
  margin-top: 0px;  
  margin-right: 2em;  
  margin-bottom: 2em;  
  margin-left: 0px;
}

.image.centered {  
  display: block;  
  margin-top: 0px;  
  margin-right: 0px;  
  margin-bottom: 2em;  
  margin-left: 0px;
}

.image.centered img {  
  margin-top: 0px;  
  margin-right: auto;  
  margin-bottom: 0px;  
  margin-left: auto;  
  width: auto;
}

.image-border {  
  position: relative;
}

.image-border .border {  
  position: absolute;  
  top: 0px;  
  left: 0px;  
  width: 100%;  
  height: 100%;
}

.image-border1 .border {  
  background-color: transparent;  
  background-image: url("images/images_06.png");  
  background-repeat: no-repeat;  
  background-attachment: scroll;  
  background-position: left top;
}

.image-border2 {  
  position: absolute;  
  z-index: 2;
}

.image-border2 .border {  
  background-color: transparent;  
  background-image: url("images/tablet-img.png");  
  background-repeat: no-repeat;  
  background-attachment: scroll;  
  background-position: center top;  
  z-index: 1;
}

.image-border3 .border {  
  background-color: transparent;  
  background-image: url("images/images_07.png");  
  background-repeat: no-repeat;  
  background-attachment: scroll;  
  background-position: left top;
}

.image-border4 .border {  
  background-color: transparent;  
  background-image: url("images/images_09.png");  
  background-repeat: no-repeat;  
  background-attachment: scroll;  
  background-position: left top;
}

ul.default {  
  list-style-type: disc;  
  list-style-position: outside;  
  list-style-image: none;  
  padding-left: 1em;
}

ul.default li {  
  padding-left: 0.5em;
}

ul.style1 li {  
  padding-top: 1.5em;  
  padding-right: 0px;  
  padding-bottom: 0px;  
  padding-left: 0px;  
  margin-top: 1.5em;  
  margin-right: 0px;  
  margin-bottom: 0px;  
  margin-left: 0px;  
  border-top-width: 1px;  
  border-top-style: solid;  
  border-top-color: rgba(0, 0, 0, 0.1);
}

ul.style1 li:first-child {  
  padding-top: 0px;  
  margin-top: 0px;  
  border-top-width: medium;  
  border-top-style: none;  
  border-top-color: initial;  -webkit-box-shadow: none;
  box-shadow: none;
}

ul.style1 a {  
  text-decoration: none;  
  color: #898e96;
}

ul.style1 a:hover {  
  text-decoration: underline;
}

ul.style2 > li {  
  position: relative;  
  padding-top: 0.7em;  
  padding-right: 0px;  
  padding-bottom: 0.7em;  
  padding-left: 2.5em;
}

ul.style2 > li:before {  
  position: absolute;  
  left: 0px;  
  top: 0.35em;  
  display: block;  
  color: #3a71d8;  
  width: 30px;  
  height: 30px;  
  line-height: 30px;  
  text-align: center;  
  font-size: 1.4em;
}

ul.style2 > li:first-child {  
  padding-top: 0px;  
  border-top-width: medium;  
  border-top-style: none;  
  border-top-color: initial;
}

ul.style2 > li:first-child:before {  
  top: 0px;
}

ul.style2 a {  
  text-decoration: none;  
  color: #898e96;
}

ul.style2 a:hover {  
  text-decoration: underline;
}

ul.style3 li {  
  padding-top: 1.5em;  
  padding-right: 0px;  
  padding-bottom: 1.5em;  
  padding-left: 0px;  
  border-top-width: 1px;  
  border-top-style: solid;  
  border-top-color: rgba(0, 0, 0, 0.1);
}

ul.style3 li:first-child {  
  padding-top: 0px;  
  border-top-width: medium;  
  border-top-style: none;  
  border-top-color: initial;
}

ul.style3 a {  
  text-decoration: none;
}

ul.style3 a:hover {  
  text-decoration: underline;
}

ul.style3 h3 {  
  margin-bottom: 1em;  -epub-text-transform: uppercase;
  text-transform: uppercase;  
  font-weight: 700;
}

ul.style3 .list-icon {  
  float: left;  
  display: inline-block;  
  margin-top: 0.2em;  
  margin-right: 1em;  
  padding-bottom: 2em;  
  background-color: #3a71d8;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;  
  width: 56px;  
  height: 56px;  
  font-size: 1.5em;  
  text-align: center;  
  line-height: 56px;  -webkit-border-radius: 5px 5px 5px 5px;
  border-radius: 5px 5px 5px 5px;  
  color: white;
}

ul.icons > li {  
  position: relative;  
  padding-top: 2em;  
  padding-right: 0em;  
  padding-bottom: 2em;  
  padding-left: 5em;  
  border-top-width: 1px;  
  border-top-style: solid;  
  border-top-color: rgba(0, 0, 0, 0.1);
}

ul.icons > li:before {  
  position: absolute;  
  left: 0px;  
  top: 1.2em;  
  display: block;  
  background-color: #3a71d8;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;  
  color: white;  
  width: 56px;  
  height: 56px;  
  line-height: 56px;  
  text-align: center;  
  font-size: 2em;  -webkit-border-radius: 5px 5px 5px 5px;
  border-radius: 5px 5px 5px 5px;  
  cursor: default;
}

ul.icons > li:first-child {  
  padding-top: 0px;  
  border-top-width: medium;  
  border-top-style: none;  
  border-top-color: initial;
}

ul.icons > li:first-child:before {  
  top: 0px;
}

ul.icons h3 {  
  margin-bottom: 0.5em;  -epub-text-transform: uppercase;
  text-transform: uppercase;  
  font-weight: 700;  
  font-size: 1em;
}

ul.social {  
  text-align: center;
}

ul.social li {  
  display: inline-block;  
  padding-top: 0px;  
  padding-right: 3px;  
  padding-bottom: 0px;  
  padding-left: 3px;
}

ul.social li span {  
  display: none;
}

ul.social li a {  
  display: inline-block;  
  color: white;
}

ul.social li a:before {  -o-transition: background-color 0.25s ease-in-out 0s;
  -webkit-transition: background-color 0.25s ease-in-out 0s;
  transition: background-color 0.25s ease-in-out 0s;  
  display: inline-block;  
  width: 30px;  
  height: 30px;  
  background-color: #3a71d8;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;  -webkit-border-radius: 50% 50% 50% 50%;
  border-radius: 50% 50% 50% 50%;  
  line-height: 30px;  
  text-align: center;  
  font-size: 1em;  
  color: white;
}

ul.social li a:hover:before {  
  background-color: #4a81e8;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;
}

ul.social li a:active:before {  
  background-color: #2a61c8;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;
}

ul.info li {  
  padding-top: 1.5em;  
  padding-right: 0px;  
  padding-bottom: 1.5em;  
  padding-left: 0px;  
  border-top-width: 1px;  
  border-top-style: solid;  
  border-top-color: rgba(0, 0, 0, 0.1);
}

ul.info li:first-child {  
  padding-top: 0px;  
  border-top-width: medium;  
  border-top-style: none;  
  border-top-color: initial;  -webkit-box-shadow: none;
  box-shadow: none;
}

ul.info h3 {  
  display: inline-block;  
  padding-bottom: 0.5em;  
  font-size: 1.2em;
}

ul.info a {  
  text-decoration: none;  
  color: #898e96;
}

ul.info a:hover {  
  text-decoration: underline;
}

ul.menu {  
  cursor: default;
}

ul.menu li {  
  display: inline-block;  
  line-height: 1em;  
  border-left-width: 1px;  
  border-left-style: solid;  
  border-left-color: #dddddd;  
  padding-top: 0px;  
  padding-right: 0px;  
  padding-bottom: 0px;  
  padding-left: 0.5em;  
  margin-top: 0px;  
  margin-right: 0px;  
  margin-bottom: 0px;  
  margin-left: 0.5em;
}

ul.menu li:first-child {  
  border-left-width: 0px;  
  border-left-style: none;  
  border-left-color: initial;  
  padding-left: 0px;  
  margin-left: 0px;
}

ul.actions {  
  cursor: default;
}

ul.actions li {  
  display: inline-block;  
  margin-top: 0px;  
  margin-right: 0px;  
  margin-bottom: 0px;  
  margin-left: 0.5em;
}

ul.actions li:first-child {  
  margin-left: 0px;
}

ol.default {  
  list-style-type: decimal;  
  list-style-position: outside;  
  list-style-image: none;  
  padding-left: 1.25em;
}

ol.default li {  
  padding-left: 0.25em;
}

.meta {  
  font-size: 0.7em;
}

.meta a {  
  text-decoration: underline !important;  
  color: #3a71d8 !important;
}

.meta a:hover {  
  text-decoration: none !important;
}

.meta .date {  
  position: relative;  
  display: inline-block;
}

.meta .date:before {  -webkit-opacity: 0.25;
  opacity: 0.25;  
  margin-right: 0.5em;
}

.meta .more {  
  position: relative;  
  display: inline-block;  
  padding-top: 0em;  
  padding-right: 0em;  
  padding-bottom: 0em;  
  padding-left: 1em;
}

.meta .more:before {  
  content: "|";  
  display: block;  
  position: absolute;  
  width: 16px;  
  height: 16px;  
  left: 0px;  
  top: 0px;  
  color: #898e96;
}

form input[type="text"], form input[type="password"], form select, form textarea {  -o-transition: background-color 0.25s ease-in-out 0s;
  -webkit-transition: background-color 0.25s ease-in-out 0s;
  transition: background-color 0.25s ease-in-out 0s;  
  width: 100%;  
  padding-top: 0.9em;  
  padding-right: 0.9em;  
  padding-bottom: 0.9em;  
  padding-left: 0.9em;  
  font-size: 1.2em;  
  font-family: 'Noto Sans', sans-serif;  
  font-weight: 300;  -webkit-border-radius: 6px 6px 6px 6px;
  border-radius: 6px 6px 6px 6px;  
  background-color: #fafafa;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;  
  border-top-width: 1px;  
  border-right-width: 1px;  
  border-bottom-width: 1px;  
  border-left-width: 1px;  
  border-top-style: solid;  
  border-right-style: solid;  
  border-bottom-style: solid;  
  border-left-style: solid;  
  border-top-color: #e8e8e8;  
  border-right-color: #e8e8e8;  
  border-bottom-color: #e8e8e8;  
  border-left-color: #e8e8e8;  
  outline-width: medium;  
  outline-style: none;  
  outline-color: initial;
}

form input[type="text"]:focus, form input[type="password"]:focus, form select:focus, form textarea:focus {  
  background-color: #f0f2f5;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;
}

form textarea {  
  height: 10em;
}

form *::-moz-focus-inner {  
  border-top-width: 0px;  
  border-right-width: 0px;  
  border-bottom-width: 0px;  
  border-left-width: 0px;  
  border-top-style: none;  
  border-right-style: none;  
  border-bottom-style: none;  
  border-left-style: none;
}

form .button {  
  margin-right: 1em;
}

table {  
  width: 100%;
}

table.default {  
  width: 100%;
}

table.default tbody tr:nth-child(2n+2) {  
  background-color: #f4f4f4;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;
}

table.default td {  
  padding-top: 0.5em;  
  padding-right: 1em;  
  padding-bottom: 0.5em;  
  padding-left: 1em;
}

table.default th {  
  text-align: left;  
  font-weight: bold;  
  padding-top: 0.5em;  
  padding-right: 1em;  
  padding-bottom: 0.5em;  
  padding-left: 1em;
}

table.default thead {  
  background-color: #444444;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;  
  color: white;
}

table.default tfoot {  
  background-color: #eeeeee;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;
}

.button {  -o-transition: background-color 0.25s ease-in-out 0s;
  -webkit-transition: background-color 0.25s ease-in-out 0s;
  transition: background-color 0.25s ease-in-out 0s;  
  position: relative;  
  display: inline-block;  
  margin-top: 1em;  
  padding-top: 0em;  
  padding-right: 1em;  
  padding-bottom: 0px;  
  padding-left: 1em;  
  background-color: #3a71d8;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;  
  color: white !important;  
  border-top-width: 0px;  
  border-right-width: 0px;  
  border-bottom-width: 0px;  
  border-left-width: 0px;  
  border-top-style: none;  
  border-right-style: none;  
  border-bottom-style: none;  
  border-left-style: none;  
  font-size: 1.1em;  -webkit-border-radius: 5px 5px 5px 5px;
  border-radius: 5px 5px 5px 5px;  
  line-height: 2.3em;  
  text-decoration: none;  
  font-weight: 700;  
  text-align: center;
}

.button.icon:before {  
  display: inline-block;  
  position: relative;  
  top: -0.15em;  
  padding-right: 0.5em;  
  font-size: 0.85em;
}

.button:hover {  
  background-color: #4a81e8;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;
}

.button:active {  
  background-color: #2a61c8;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;
}

.button.alt {  
  background-color: #292c31;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;
}

.button.alt:hover {  
  background-color: #393c41;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;
}

.button.alt:active {  
  background-color: #191c21;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;
}

.button.big {  
  padding-top: 0.5em;  
  padding-right: 1.5em;  
  padding-bottom: 0.5em;  
  padding-left: 1.5em;
}

.bubble-top {  -o-transition: background-color 0.25s ease-in-out 0s;
  -webkit-transition: background-color 0.25s ease-in-out 0s;
  transition: background-color 0.25s ease-in-out 0s;  
  display: block;  
  outline-width: 0px;  
  outline-style: none;  
  outline-color: initial;  
  margin-top: 0px;  
  margin-right: auto;  
  margin-bottom: 2em;  
  margin-left: auto;  
  width: 60px;  
  height: 60px;  
  background-color: #3a71d8;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;  
  position: relative;  -webkit-border-radius: 50% 50% 50% 50%;
  border-radius: 50% 50% 50% 50%;  
  text-align: center;  
  line-height: 60px;  
  font-size: 1.4em;  
  font-weight: 700;  
  color: white;  
  text-decoration: none;
}

.bubble-top:after {  -o-transition: border-color 0.25s ease-in-out 0s;
  -webkit-transition: border-color 0.25s ease-in-out 0s;
  transition: border-color 0.25s ease-in-out 0s;  
  content: "";  
  position: absolute;  
  width: 0px;  
  height: 0px;  
  border-left-width: 10px;  
  border-left-style: solid;  
  border-left-color: transparent;  
  border-right-width: 10px;  
  border-right-style: solid;  
  border-right-color: transparent;  
  border-bottom-width: 15px;  
  border-bottom-style: solid;  
  border-bottom-color: #3a71d8;  
  left: 35%;  
  top: -10px;
}

.bubble-top:hover {  
  background-color: #4a81e8;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;
}

.bubble-top:hover:after {  
  border-bottom-color: #4a81e8;
}

.bubble-top:active {  
  background-color: #2a61c8;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;
}

.bubble-top:active:after {  
  border-bottom-color: #2a61c8;
}

.icon {  
  text-decoration: none;
}

.icon:before {  
  display: inline-block;  
  font-family: FontAwesome;  
  font-size: 1.25em;  
  text-decoration: none;  
  font-style: normal;  
  font-weight: normal;  
  line-height: 1;
}

#header {  
  position: relative;  
  background-color: #3a71d8;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;
}

#banner {  
  color: white;
}

#banner header {  
  text-align: center;
}

#banner header h2 {  
  color: white;
}

#banner header span {  
  display: block;  
  color: rgba(255, 255, 255, 0.5);
}

#main {  
  position: relative;  
  background-color: white;  
  background-image: none;  
  background-repeat: repeat;  
  background-attachment: scroll;  
  background-position: 0% 0%;
}

#footer {  
  position: relative;  
  border-top-width: 1px;  
  border-top-style: solid;  
  border-top-color: #e6e7e7;
}

#copyright {  
  position: relative;  
  color: #575a5e;
}

#copyright .container {  
  position: relative;  
  border-top-width: 1px;  
  border-top-style: solid;  
  border-top-color: #cacdd2;  
  border-bottom-width: 1px;  
  border-bottom-style: solid;  
  border-bottom-color: #cacdd2;
}

#copyright span {  
  color: #575a5e;
}

#featured {  
  position: relative;  
  text-align: center;
}

#featured .pennant {  
  display: inline-block;  
  color: #3a71d8;  
  cursor: default;
}

#box1 {  
  position: relative;  
  background-color: transparent;  
  background-image: url("images/shadow-bg.png");  
  background-repeat: no-repeat;  
  background-attachment: scroll;  
  background-position: center bottom;  
  z-index: 1;
}

#box2 {  
  position: absolute;  
  bottom: 0px;
}

#box3 {  
  position: absolute;  
  bottom: 0px;
}

#box3:before {  
  content: "";  
  position: absolute;  
  display: inline-block;  
  width: 100%;  
  height: 100%;  
  left: -4.55em;  
  bottom: -2px;  
  z-index: 5;
}

#slider {  
  position: relative;  
  background-color: transparent;  
  background-image: url("images/monitor-bg.png");  
  background-repeat: no-repeat;  
  background-attachment: scroll;  
  background-position: center top;
}

#slider .viewer {  
  position: relative;  
  overflow: hidden;
}

#slider .viewer:before {  
  content: "";  
  position: absolute;  
  display: block;  
  width: 100%;  
  height: 100%;  
  top: 0px;  
  background-color: transparent;  
  background-image: url("images/monitor-shine.png");  
  background-repeat: no-repeat;  
  background-attachment: scroll;  
  background-position: center top;  
  z-index: 1;
}

#slider .viewer .reel {  
  display: none;
}

#slider .viewer .reel .slide {  
  overflow: hidden;
}

@media screen and (min-width: 737px) {
  body, input, textarea, select { line-height: 1.65em; font-size: 11pt; }
  header h2 { line-height: 1.4em; font-size: 1.5em; }
  ul.social { position: absolute; right: 0px; }
  ul.social li:last-child { padding-right: 0px; }
  #header .container { position: relative; padding: 3em 0em; }
  #logo h1 { position: absolute; display: block; margin: 0px; top: 0px; font-size: 1.8em; }
  #logo h1 a { text-decoration: none; line-height: 3.5em; font-weight: 700; color: white; }
  #nav { position: absolute; right: 0px; top: 2.5em; }
  #nav > ul > li { float: left; padding: 0px 1.2em; }
  #nav > ul > li > ul { display: none; }
  #nav > ul > li:last-child { padding-right: 0px; }
  #nav > ul > li > a, #nav > ul > li > span { transition: color 0.25s ease-in-out 0s; display: block; letter-spacing: 0.06em; text-decoration: none; font-weight: 600; font-size: 1.1em; outline: 0px none; color: rgba(255, 255, 255, 0.65); }
  #nav > ul > li:hover a, #nav > ul > li:hover span { color: white; }
  #nav > ul > li.active a { padding-bottom: 5px; border-bottom: 2px solid rgba(255, 255, 255, 0.75); color: white; }
  .dropotron { top: 0px; text-align: left; min-width: 13em; background: none repeat scroll 0% 0% #292c31; line-height: 1em; padding: 1em 0px; border-radius: 8px 8px 8px 8px; }
  .dropotron a, .dropotron span { display: block; padding: 0.9em 1.7em; border-bottom: 0px none; font-size: 0.9em; text-decoration: none; color: #dadbde; }
  .dropotron li:first-child > a, .dropotron li:first-child > span { border-top: 0px none; }
  .dropotron li.active > a, .dropotron li.active > span { color: white; }
  .dropotron li:hover > a, .dropotron li:hover > span { color: white; }
  .dropotron.level-0 { font-size: 1.1em; margin-top: 1.7em; border-top-left-radius: 0px; border-top-right-radius: 0px; }
  .dropotron.level-0:before { content: ""; position: absolute; top: -1.2em; left: 5.5em; width: 1.3em; height: 1.3em; border-bottom: 0.8em solid #2c2c2c; border-left: 0.8em solid transparent; border-right: 0.8em solid transparent; }
  body.homepage .dropotron.level-0 { margin-top: 1.5em; border-top-left-radius: 8px; border-top-right-radius: 8px; }
  #banner { margin-top: 4em; padding: 4em 0em 0em; border-top: 1px solid rgba(255, 255, 255, 0.15); }
  #banner header h2 { padding: 0em 2em; line-height: 1.2em; letter-spacing: 0.03em; font-size: 2.8em; }
  #banner header span { padding-top: 1em; font-size: 1em; }
  #main { padding: 6em 0em 4em; }
  #content header { margin-bottom: 2em; }
  #content header h2 { font-size: 2em; }
  #content header .byline { font-size: 1.4em; font-weight: 300; }
  #content h3 { padding: 2em 0em 1.5em; font-size: 1.2em; }
  #sidebar header { margin-bottom: 2em; }
  #sidebar header h2 { font-size: 1.4em; }
  #footer { margin-top: 4em; padding-top: 6em; }
  #footer header { margin-bottom: 2.5em; }
  #footer .image.featured { margin-top: 0.5em; margin-bottom: 2.5em ! important; }
  #copyright { padding: 4em 0em; }
  #copyright .container { padding: 0.7em 0em 1.1em; }
  #copyright span { font-size: 1em; }
  #featured { padding: 6em 0em; }
  #featured h3 { margin-bottom: 1em; font-size: 1.5em; }
  #featured .pennant { margin-bottom: 1em; font-size: 3.5em; }
  #featured .button { margin-top: 1em; }
  #box1 { height: 422px; margin-bottom: 4em; }
  #box2 { bottom: 0px; left: 0px; z-index: 2; margin-left: 26%; width: 417px; height: 422px; padding: 36px 35px 35px; background: url("images/tablet-img.png") no-repeat scroll center bottom transparent; }
  #box2:after { content: ""; position: absolute; display: block; width: 100%; height: 100%; top: 0px; background: url("images/tablet-shadow.png") no-repeat scroll center bottom transparent; }
  #box3 { position: absolute; right: 0px; bottom: 0px; z-index: 11; width: 282px; height: 272px; padding: 62px 28px 0px; margin-right: 26%; background: url("images/mobile-img.png") no-repeat scroll center bottom transparent; }
  #box3:after { content: ""; position: absolute; display: block; width: 100%; height: 100%; top: 0px; background: url("images/mobile-shadow.png") no-repeat scroll center bottom transparent; }
  #box3:before { content: ""; position: absolute; display: block; width: 100%; height: 100%; top: 0px; left: -77px; background: url("images/shadow-bg02.png") no-repeat scroll 0% 0% transparent; }
  #slider { width: 850px; height: 530px; margin: 0px auto 2em; }
  #slider .previous-button, #slider .next-button { transition: background-color 0.25s ease-in-out 0s; position: absolute; top: 200px; width: 41px; height: 41px; background: none repeat scroll 0% 0% rgba(255, 255, 255, 0.3); border-radius: 100% 100% 100% 100%; }
  #slider .previous-button:before, #slider .next-button:before { line-height: 43px; }
  #slider .previous-button:hover, #slider .next-button:hover { background: none repeat scroll 0% 0% rgba(255, 255, 255, 0.75); }
  #slider .previous-button { left: 30px; }
  #slider .next-button { right: 30px; }
  #slider .icon { display: inline-block; text-align: center; line-height: 41px; font-weight: 900; color: #3a71d8; }
  #slider .viewer { position: relative; top: 18px; width: 593px; height: 359px; margin: 0px auto; }
  #slider .viewer .reel .slide img { display: block; width: 100%; }
}

@media screen and (min-width: 737px) and (max-width: 1200px) {
  body { min-width: 1000px; line-height: 1.5em; font-size: 10pt; }
  #box2 { margin-left: 20%; }
  #box3 { margin-right: 20%; }
  #main { padding: 2em 0em 4em; }
}

#navPanel, #titleBar {  
  display: none;
}

@media screen and (max-width: 736px) {
  html, body { overflow-x: hidden; }
  body { line-height: 1.75em; font-size: 11pt; letter-spacing: 0px; min-width: 320px; }
  h2 { font-size: 1.3em; }
  .container { padding: 0px 15px; }
  section, article { clear: both; margin: 2em 0px ! important; }
  section > :first-child, section:first-child, article > :first-child, article:first-child { margin-top: 0px ! important; }
  header { margin-bottom: 2em; }
  header h2 { line-height: 1.4em; font-size: 1.3em; }
  form input[type="text"], form input[type="password"], form select, form textarea { padding: 0.7em; font-size: 1em; }
  form .button { display: block; margin-right: 0px ! important; }
  .button { display: block; margin-top: 1.5em ! important; padding: 0.5em; }
  ul.icons > li { padding-left: 6em; }
  ul.social li a:before { width: 45px; height: 45px; line-height: 45px; font-size: 1.25em; }
  .meta { font-size: 0.8em; }
  #page-wrapper { backface-visibility: hidden; transition: transform 0.5s ease 0s; padding-bottom: 1px; }
  #titleBar { backface-visibility: hidden; transition: transform 0.5s ease 0s; display: block; height: 44px; left: 0px; position: fixed; top: 0px; width: 100%; z-index: 10001; background: none repeat scroll 0% 0% transparent; }
  #titleBar .toggle { position: absolute; left: 0px; top: 0px; width: 80px; height: 60px; }
  #titleBar .toggle:before { content: ""; position: absolute; left: 7px; top: 7px; background: none repeat scroll 0% 0% rgba(0, 0, 0, 0.2); width: 60px; height: 35px; border-radius: 4px 4px 4px 4px; }
  #titleBar .toggle:after { content: ""; display: block; width: 20px; height: 12px; position: absolute; left: 27px; top: 19px; background: url("images/toggle.svg") no-repeat scroll 0px 0px transparent; }
  #navPanel { backface-visibility: hidden; transform: translateX(-275px); transition: transform 0.5s ease 0s; display: block; height: 100%; left: 0px; overflow-y: auto; position: fixed; top: 0px; width: 275px; z-index: 10002; background: none repeat scroll 0% 0% #292c31; box-shadow: -10px 0px 10px 0px rgba(0, 0, 0, 0.1) inset; }
  #navPanel .link { display: block; color: #888888; text-decoration: none; height: 44px; line-height: 44px; padding: 0px 1em; }
  #navPanel .link:first-child { border-top: 0px none; }
  #navPanel .link.depth-0 { color: white; }
  #navPanel .indent-1 { display: inline-block; width: 1em; }
  #navPanel .indent-2 { display: inline-block; width: 2em; }
  #navPanel .indent-3 { display: inline-block; width: 3em; }
  #navPanel .indent-4 { display: inline-block; width: 4em; }
  #navPanel .indent-5 { display: inline-block; width: 5em; }
  #navPanel .depth-0 { color: white; }
  body.navPanel-visible #page-wrapper { transform: translateX(275px); }
  body.navPanel-visible #titleBar { transform: translateX(275px); }
  body.navPanel-visible #navPanel { transform: translateX(0px); }
  #logo { padding: 2em 0em; }
  #logo a { display: block; line-height: 2em; text-align: center; font-size: 1.6em; color: white; }
  .homepage #logo { padding-top: 3em; }
  #nav { display: none; }
  #banner { padding: 3em 0em 2em; border-top: 1px solid rgba(255, 255, 255, 0.15); }
  #banner header h2 { line-height: 1.3em; letter-spacing: 0.03em; font-size: 1.3em; }
  #banner header span { padding-top: 1em; font-size: 1em; }
  #main { padding: 3em 0em; }
  #content header { margin-bottom: 2em; }
  #content header h2 { font-size: 1.4em; }
  #content header .byline { font-size: 1.1em; font-weight: 300; }
  #content h3 { padding: 1.5em 0em; font-size: 1.2em; }
  .contact #sidebar { overflow: hidden; padding-top: 2em ! important; }
  #footer { padding-top: 3em; margin-top: 3em; }
  .contact #footer { margin-top: 0px ! important; }
  #copyright { padding: 4em 0em; text-align: center; }
  #copyright .container { padding: 1.5em 15px 1em; }
  #featured { padding: 4em 0em 3em; }
  #featured section { overflow: hidden; margin-bottom: 2em ! important; }
  #featured h3 { margin-bottom: 1em; font-size: 1.5em; }
  #featured .pennant { margin: 0.5em 0em; font-size: 4em; line-height: 1em; }
  #featured .button { margin-top: 1em; }
  #box1 { position: relative; width: 220px; height: 140px ! important; margin-bottom: 1em; background-size: 100% auto; left: 50%; margin-left: -110px; }
  #box2 { display: block; left: 1.5em; width: 70%; background: url("images/tablet-img.png") no-repeat scroll center top / 100% 100% transparent; padding: 1.1em 0.9em 0em; }
  #box2:after { content: ""; position: absolute; display: block; width: 100%; height: 100%; top: 0px; background: url("images/tablet-shadow.png") repeat scroll 0% 0% / 100% 100% transparent; }
  #box2 img { display: block; width: 100%; }
  #box3 { display: block; right: 1.5em; width: 50%; background: url("images/mobile-img.png") no-repeat scroll right top / 100% 100% transparent; padding: 1.5em 0.75em 0em; }
  #box3:after { content: ""; position: absolute; display: block; width: 100%; height: 100%; bottom: 0px; background-image: url("images/mobile-shadow.png"); background-size: 100% 100%; }
  #box3 img { display: block; width: 100%; }
  #slider { width: 240px; height: 190px; background-size: 100% auto; margin: 0px auto 2em; }
  #slider .viewer { position: relative; top: 8px; margin: 0px auto; width: 224px; height: 180px; }
  #slider .viewer .reel .slide img { display: block; width: 100%; }
  #slider .previous-button, #slider .next-button { display: none; }
}

#I {  
  display: inline-block;  
  position: relative;  
  float: none;  -moz-column-count: 2;
  -webkit-column-count: 2;
  column-count: 2;
}

#C {  -moz-columns: 2 auto;
  -webkit-columns: 2 auto;
  columns: 2 auto;  -moz-column-gap: 20px;
  -webkit-column-gap: 20px;
  column-gap: 20px;  -moz-column-rule-style: none;
  -webkit-column-rule-style: none;
  column-rule-style: none;  -webkit-align-items: stretch;
  align-items: stretch;  -webkit-align-self: stretch;
  align-self: stretch;  -webkit-justify-content: flex-start;
  justify-content: flex-start;  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;  
  float: none;  
  display: inline;  
  clear: both;
}

#c {  -moz-column-gap: 10px;
  -webkit-column-gap: 10px;
  column-gap: 10px;
}

#t {  -moz-column-count: 2;
  -webkit-column-count: 2;
  column-count: 2;
}

#content {
}

