/* Effective stylesheet produced by snapshot save */
html, body { height: 100%; }
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; }
audio:not([controls]) { display: none; height: 0px; }
html { font-family: sans-serif; }
body { margin: 0px; }
img { border: 0px none; }
svg:not(:root) { overflow: hidden; }
figure { margin: 0px; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0px none; padding: 0px; }
*, *:before, *:after { box-sizing: border-box; }
html { font-size: 62.5%; }
body { font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; font-size: 16px; line-height: 1.5; color: rgb(19, 57, 57); background-color: rgb(255, 255, 255); }
img { vertical-align: middle; }
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 { border: 0px none; font: inherit; vertical-align: baseline; margin: 0px; padding: 0px; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
img { vertical-align: middle; }
html, body {  }
body { font-family: 'Sintony',helvetica,arial,sans-serif; font-weight: normal; font-style: normal; line-height: 1; background-color: rgb(19, 57, 57); color: rgb(255, 255, 255); direction: ltr; font-size: 100%; margin: 0px; padding: 0px; }
a { text-decoration: none; }
.wrapper { height: 100%; width: 100%; }
.container { width: 100%; height: 100%; display: table; text-align: center; background: url("selector-bg.jpg") no-repeat scroll center center / cover  rgb(19, 57, 57); }
.center-container { display: table-cell; vertical-align: middle; text-align: center; padding: 50px 0px 0px; }
.logo-container { margin-bottom: 50px; }
.sides-container { margin: auto; display: inline-block; }
.left-side-section, .right-side-section { float: left; padding: 0px 90px; margin-bottom: 60px; }
.left-side-section { border-right: 0px solid rgba(255, 255, 255, 0.25); }
.right-side-section {  }
.side-inner-content { width: 353px; }
figure { width: 353px; height: 283px; display: inline-block; margin-bottom: 30px; position: relative; }
.left-side-section figure { float: right; }
.right-side-section figure { float: left; }
.selector { width: 353px; height: 56px; font-size: 16px; line-height: 60px; font-weight: bold; color: rgb(255, 255, 255); text-align: center; border: 1px solid rgb(168, 192, 181); display: inline-block; margin-bottom: 10px; transition: background-color 0.3s ease-out 0s, color 0.3s ease-out 0s, border 0.3s ease-out 0s; }
.selector:hover { color: rgb(0, 182, 136); background-color: rgb(255, 255, 255); border: 1px solid rgb(255, 255, 255); }
.onhover { position: absolute; top: 0px; left: 0px; opacity: 0; transition: background-color 0.3s ease-out 0s, color 0.3s ease-out 0s, border 0.3s ease-out 0s, opacity 0.3s ease-out 0s; }
figure img { width: 100%; }
/* Left */
.side-inner-content {
    width: 100%;
}
figure {

    height: 390px;
    }
    
@media screen and (max-width: 1084px) {
  .left-side-section { border-right: medium none; }
  .left-side-section, .right-side-section { float: none; }
}
@media screen and (max-width: 535px) {
  .sides-container { width: 100%; }
  .side-inner-content { width: 100%; }
  figure { width: 100%; height: auto; }
  .left-side-section, .right-side-section { padding: 0px 60px; margin-bottom: 60px; }
  .selector { width: 100%; height: auto; }
}
@media screen and (max-width: 380px) {
  .selector { font-size: 12px; line-height: 18px; padding: 6px; }
}