/* 
    Created on : 3.7.2016, 20:02:57
    Author     : Martin
*/
@import url(https://fonts.googleapis.com/css?family=Poiret+One|Raleway&subset=latin-ext);
/* 
    Created on : 3.7.2016, 20:05:14
    Author     : Martin
*/
/* 
    Created on : 3.7.2016, 22:37:53
    Author     : Martin
*/
/* 
    Created on : 3.7.2016, 22:44:22
    Author     : Martin
*/
html, body, ol, ul, li, nav {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline; }

body {
  font: 14px/1.2 "Raleway", sans-serif;
  text-align: justify;
  background: url("../img/controller.jpg") white repeat scroll;
  margin-top: 70px; }

h1, h2, h3, h4, h5, h6 {
  font-family: "Poiret One", cursive;
  text-align: center;
  color: #0081e9;
  margin: 0px; }
  h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    font-style: normal; }

h1 {
  font-size: 2.5em;
  font-weight: 700;
  font-variant: small-caps; }

_::-webkit-full-page-media, _:future, :root h1 {
  font-variant: normal; }

h2 {
  color: #131313;
  font-size: 1.7em;
  margin-right: 15px;
  padding: 12px 5px;
  background: #0073CF;
  border-radius: 7px 0px 100px 0px;
  box-shadow: inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75); }

h3 {
  font-size: 1.7em; }

h4 {
  font-size: 1.5em; }

h5 {
  font-size: 1.3em; }

h6 {
  font-size: 1.1em; }

a, .link-style {
  text-decoration: none;
  color: #0073CF;
  transition: text-shadow 0.3s, font-weight 0.2s;
  -ms-transition: text-shadow 0.3s, font-weight 0.2s;
  -webkit-transition: text-shadow 0.3s, font-weight 0.2s;
  -o-transition: text-shadow 0.3s, font-weight 0.2s;
  -moz-transition: text-shadow 0.3s, font-weight 0.2s;
  font-variant: small-caps;
  transition: text-shadow 0.3s, font-weight 0.2s;
  -ms-transition: text-shadow 0.3s, font-weight 0.2s;
  -webkit-transition: text-shadow 0.3s, font-weight 0.2s;
  -o-transition: text-shadow 0.3s, font-weight 0.2s;
  -moz-transition: text-shadow 0.3s, font-weight 0.2s; }
  a:hover, .link-style:hover {
    text-shadow: 0px 0px 6px #707070;
    font-weight: 700;
    transition: text-shadow 0.3s, font-weight 0.2s;
    -ms-transition: text-shadow 0.3s, font-weight 0.2s;
    -webkit-transition: text-shadow 0.3s, font-weight 0.2s;
    -o-transition: text-shadow 0.3s, font-weight 0.2s;
    -moz-transition: text-shadow 0.3s, font-weight 0.2s; }

.link-style {
  cursor: pointer; }

_::-webkit-full-page-media, _:future, :root a {
  font-variant: normal; }

_::-webkit-full-page-media, _:future, :root .link-style {
  font-variant: normal; }

strong {
  color: #131313;
  font-size: 1.05em; }

.small_caps {
  font-variant: small-caps;
  font-size: 1.2em; }

_::-webkit-full-page-media, _:future, :root .small-caps {
  font-variant: normal; }

.block_a {
  display: block; }

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

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

.float_left {
  float: left; }

.center {
  text-align: center;
  margin: 0px auto; }

.clear {
  clear: both; }

.circled {
  border-radius: 100%; }

.blue {
  color: #0073CF; }

.red {
  color: #EC0101; }

.green {
  color: #018807; }

.white {
  color: white; }

.margin-left {
  margin-left: 20px; }

ol {
  margin-left: 50px;
  margin-right: 30px; }

.quotebox {
  margin-left: 40px;
  margin-right: 50px;
  margin-bottom: 15px; }
  .quotebox .quote {
    padding-left: 15px;
    border-left: #0073CF 3px solid;
    font-style: italic;
    font-size: 0.95em; }
  .quotebox .byline {
    margin-top: 5px;
    text-align: right;
    font-weight: 700; }

hr {
  margin: 0px 20px; }

blockquote {
  margin-left: 40px;
  border-left: #0073CF 3px solid;
  font-style: italic;
  font-size: 0.95em;
  letter-spacing: 0.02em; }

@media only screen and (min-width: 1100px) {
  #higher {
    position: relative;
    top: -150px;
    margin-right: 30px;
    width: 720px; } }

.load-more {
  color: #038fff;
  text-align: center;
  border-radius: 5px;
  font-size: 1.3em;
  padding: 12px;
  margin: 0px auto;
  width: 150px;
  background: #131313;
  box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 70px -1px rgba(100, 100, 100, 0.65);
  display: block; }

.black-blue {
  background: url("../img/kindajean.png") #131313 repeat;
  box-shadow: inset 0px -230px 10px -10px rgba(0, 16, 29, 0.7); }

.cancel_button {
  float: right;
  color: #0073CF;
  font-size: 0.9em;
  border: 3px solid white;
  box-shadow: 0px 0px 10px 1px #3D3D3D, inset 0px 5px 15px -1px rgba(100, 100, 100, 0.65);
  background: #131313;
  padding: 4px;
  border-radius: 100%;
  width: 15px;
  height: 15px;
  text-align: center;
  cursor: pointer;
  position: relative;
  left: 14px;
  bottom: 14px; }

#share_fb {
  height: 32px;
  width: 32px;
  background: url("../img/share_fb.png"); }

#publication-date {
  margin-top: 0px;
  color: #707070;
  text-align: right;
  padding-bottom: 15px;
  margin-bottom: 0px;
  font-family: "Poiret One", cursive;
  font-weight: 700; }

#spinner {
  margin: 50px; }
  #spinner img {
    display: block;
    margin: 0px auto;
    width: 70px;
    height: 70px; }

#spinner-load img {
  display: block;
  margin: 0px auto;
  width: 22px;
  height: 22px; }

#spinner-rating {
  margin: 10px; }
  #spinner-rating img {
    display: block;
    margin: 0px auto; }

.spinner-rating-smaller {
  height: 10px; }

#spinner-big img {
  display: block;
  margin: 53px auto;
  width: 150px;
  height: 150px; }

.basic-foggy {
  min-width: 100%;
  min-height: 100%;
  background: rgba(30, 30, 30, 0.85);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 5;
  display: none; }

.grey-row {
  background: #e3e3e3; }

.title-font {
  font-family: "Poiret One", cursive;
  font-weight: 700; }

/* 
    Created on : 3.7.2016, 23:07:46
    Author     : Martin
*/
section {
  width: 90%;
  min-width: 300px;
  margin: 0px auto; }
  @media only screen and (min-width: 768px) {
    section {
      width: 750px; } }
  @media only screen and (min-width: 1100px) {
    section {
      width: 1080px; } }

article {
  min-width: 300px;
  margin: 40px auto;
  box-shadow: 0px 0px 20px 1px #575757;
  border-radius: 5px;
  border: none;
  background: url("../img/crossword.png") white repeat fixed;
  text-align: justify;
  /*float: left;
  width: 750px;
  margin: 40px 30px 40px 0px;
  box-shadow: 0px 0px 20px 1px lighten($grey,10);
  border-radius: 5px;
  border: none;
  background: url("../img/crossword.png") white repeat fixed;
  text-align: justify;
  h1 {
      border-radius: 0px 0px 100px 100px;
      background: $black;
      box-shadow: inset 0px 20px 70px -1px rgba(100,100,100,0.75);
      padding: 10px 0px;
      margin: 0 20px;
  }
  p {
      padding: 0px 20px;
  }
  ul {
      padding: 30px;
      margin-left: 20px;
  }
  table {
      margin: 20px;
  }
  .embeddedContent {
      text-align: center;
      margin: 30px;
  }
  .social_buttons {
      text-align: center;
      img {
          margin-right: 5px;
          margin-left: 5px;
      }
  }*/ }
  article img {
    max-width: 95%;
    height: auto; }
  article h1 {
    border-radius: 0px 0px 100px 100px;
    background: #131313;
    box-shadow: inset 0px 20px 70px -1px rgba(100, 100, 100, 0.75);
    padding: 10px 10px;
    margin: 0 20px; }
  article p {
    padding: 0px 20px; }
  article ul {
    padding: 30px;
    margin-left: 20px; }
  article table {
    margin: 20px; }
  article .embeddedContent {
    text-align: center;
    margin: 30px; }
    article .embeddedContent iframe {
      margin-left: auto;
      margin-right: auto;
      max-width: 100%;
      height: 56.25vw;
      max-height: 315px;
      display: block; }
  article .social_buttons {
    text-align: center; }
    article .social_buttons img {
      margin-right: 5px;
      margin-left: 5px; }
  article twitterwidget {
    margin-left: auto;
    margin-right: auto; }
  article .EmbeddedTweet {
    height: 100%; }
  @media only screen and (min-width: 768px) {
    article {
      width: 750px; } }
  @media only screen and (min-width: 1100px) {
    article {
      float: left;
      margin: 40px 30px 40px 0px; } }

#sidebar {
  margin: 0px auto; }
  @media only screen and (min-width: 768px) {
    #sidebar {
      width: 750px; } }
  @media only screen and (min-width: 1100px) {
    #sidebar {
      margin-top: 40px;
      width: 300px;
      float: left; } }

.sidebox {
  box-shadow: 0px 0px 20px 1px #575757;
  border-radius: 5px;
  border: none;
  background: url("../img/crossword.png") white repeat fixed;
  margin-bottom: 30px;
  text-align: left; }
  .sidebox p {
    padding: 0px 10px 0px 10px;
    margin-bottom: 0px;
    font-size: 0.8em; }
    .sidebox p:last-child {
      padding-bottom: 10px; }
  .sidebox #boxart {
    text-align: center;
    margin: 20px auto; }
    .sidebox #boxart img {
      background: white;
      box-shadow: 0px 0px 20px 1px #004983, inset 0px 20px 70px -1px rgba(100, 100, 100, 0.65); }
  .sidebox #platform_miniature img {
    height: 200px; }

#item-sidebox {
  text-align: center;
  color: #636363;
  font-family: "Poiret One", cursive;
  font-weight: 700;
  font-size: 1.1em; }
  #item-sidebox span {
    font-family: "Raleway", sans-serif;
    color: #131313; }
    #item-sidebox span strong {
      font-variant: normal;
      font-size: 1.1em; }

.article article, .article #comments {
  margin-right: 0px;
  margin-left: 0px; }
  @media only screen and (min-width: 1100px) {
    .article article, .article #comments {
      margin-right: 0px;
      margin-left: 30px; } }
.article .article-ad {
  margin-right: 0px;
  margin-left: 0px;
  margin-bottom: 40px; }
  @media only screen and (min-width: 1100px) {
    .article .article-ad {
      margin-right: 0px;
      margin-left: 28px; } }

.article > div.right {
  float: none; }
  @media only screen and (min-width: 1100px) {
    .article > div.right {
      float: right; } }

#article_list {
  box-shadow: none;
  background: none; }
  #article_list div {
    box-shadow: 0px 0px 20px 1px #575757;
    min-height: 145px;
    background: url("../img/crossword.png") white repeat fixed;
    border-radius: 5px;
    border: none;
    margin-bottom: 30px; }
    #article_list div p:first-child {
      float: left;
      margin: 0px;
      padding: 0px;
      /*@media only screen and (max-width: 550px) {
          width: 120px;
      }*/ }
      @media only screen and (max-width: 550px) {
        #article_list div p:first-child {
          float: none;
          margin: 15px auto;
          width: 257px; } }
      #article_list div p:first-child img {
        border-radius: 5.5px 0px 200px 5.5px;
        box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 70px -1px rgba(100, 100, 100, 0.65);
        margin-right: 5px;
        background: #0073CF;
        max-width: 100%;
        /*@media only screen and (max-width: 550px) {
            width: 120px;
            border-radius: 8px 10px 100px 8px;
        }*/ }
        @media only screen and (max-width: 550px) {
          #article_list div p:first-child img {
            width: 257px;
            border-radius: 0px 0px 30px 30px;
            margin-right: 0px; } }
    #article_list div p {
      padding: 0px 15px 0px 0px;
      margin-top: 10px;
      margin-bottom: 0px; }
    @media only screen and (max-width: 550px) {
      #article_list div p.preview-text {
        clear: both;
        padding-left: 15px;
        padding-top: 5px; } }
    #article_list div p:last-child {
      padding-bottom: 10px;
      margin-top: 8px; }
    #article_list div h2 {
      background: none;
      box-shadow: none;
      margin-right: 40px;
      padding-left: 262px;
      transition: all 0.5s ease-out;
      -ms-transition: all 0.5s ease-out;
      -webkit-transition: all 0.5s ease-out;
      -o-transition: all 0.5s ease-out;
      -moz-transition: all 0.5s ease-out;
      /*@media only screen and (max-width: 550px) {
          padding-left: 120px;
          margin-right: 15px;
          &:hover {
              padding-left: 130px;
              margin-right: 5px;
              box-shadow: none;
          }
      }*/ }
      #article_list div h2:hover {
        box-shadow: 0px 0px 20px 1px #707070, inset 0px 20px 80px -1px rgba(80, 80, 80, 0.75);
        margin-right: 15px;
        padding-left: 287px; }
      @media only screen and (max-width: 550px) {
        #article_list div h2 {
          padding: 0px 15px;
          margin: 0px; }
          #article_list div h2:hover {
            padding: 0px 15px;
            margin: 0px;
            box-shadow: none; } }

#editor {
  width: 100%;
  min-width: 300px;
  overflow-x: auto; }
  @media only screen and (min-width: 768px) {
    #editor {
      width: 750px; }
      #editor input {
        width: 400px; }
      #editor textarea {
        width: 391px;
        margin-top: 5px; } }
  @media only screen and (min-width: 1100px) {
    #editor {
      width: 1080px; } }
  #editor form {
    margin: 20px 50px; }
    #editor form label {
      margin-right: 20px; }
    #editor form input[type="checkbox"] {
      width: 23px; }
    #editor form input[type="number"] {
      width: 50px;
      height: 57px;
      font-size: 1.4em;
      text-align: center;
      font-weight: 600;
      margin-right: 5px; }
    #editor form input[type="submit"] {
      margin-left: 40px;
      width: 120px;
      height: 120px;
      font: 2em "Poiret One", cursive; }
    #editor form textarea {
      margin-top: 5px; }
    #editor form #frm-createEditSpecialForm-topicNew, #editor form #frm-createEditSpecialForm-topic {
      min-width: 250px; }
    #editor form #frm-createEditSpecialForm-topicNew {
      width: 250px; }
  #editor table {
    border-collapse: collapse;
    margin: 0px auto; }
    #editor table th:last-child {
      padding-top: 20px; }
  #editor a {
    font-size: 1.2em; }
  #editor #description, #editor #hashtags-info {
    color: #3D3D3D;
    font-size: 0.87em;
    padding: 0px 10px;
    width: 380px;
    padding-top: 3px; }

.editor_separator {
  width: 100%;
  border-top: 1px dashed #0073CF;
  margin-top: 10px;
  padding-top: 10px; }
  .editor_separator span {
    padding: 0px 11.5px 2px 11.5px;
    font-weight: 800;
    font-size: 2em;
    color: #0073CF;
    box-shadow: 0px 0px 7px 1px #038fff;
    border-radius: 100%; }

.alphabet {
  text-align: center; }

.right_note {
  padding: 10px 10px 0px 0px;
  float: right;
  color: #0073CF;
  cursor: pointer;
  text-align: right; }
  .right_note p {
    max-width: 20px; }

.edit_options {
  position: absolute;
  padding: 20px 5px 3px 20px;
  background: #131313;
  box-shadow: 0px 0px 15px 1px #3D3D3D, inset 0px 10px 40px -1px rgba(100, 100, 100, 0.75);
  color: #0073CF;
  margin-left: -70px;
  margin-top: -70px;
  border-radius: 10px;
  display: none;
  min-width: 75px; }
  @media only screen and (min-width: 950px) {
    .edit_options {
      margin-left: 3px;
      border-radius: 10px 10px 10px 0px; } }
  .edit_options p {
    padding: 0px;
    margin: 0px; }
    .edit_options p:last-child {
      font-variant: small-caps;
      transition: text-shadow 0.3s, font-weight 0.2s;
      -ms-transition: text-shadow 0.3s, font-weight 0.2s;
      -webkit-transition: text-shadow 0.3s, font-weight 0.2s;
      -o-transition: text-shadow 0.3s, font-weight 0.2s;
      -moz-transition: text-shadow 0.3s, font-weight 0.2s; }
      .edit_options p:last-child:hover {
        text-shadow: 0px 0px 6px #707070;
        font-weight: 700;
        transition: text-shadow 0.3s, font-weight 0.2s;
        -ms-transition: text-shadow 0.3s, font-weight 0.2s;
        -webkit-transition: text-shadow 0.3s, font-weight 0.2s;
        -o-transition: text-shadow 0.3s, font-weight 0.2s;
        -moz-transition: text-shadow 0.3s, font-weight 0.2s; }

_::-webkit-full-page-media, _:future, :root .edit_options p:last-child {
  font-variant: normal;
  text-transform: uppercase; }

.options_margin p {
  margin-right: 17px;
  margin-bottom: 15px; }

.comment {
  float: right;
  margin-left: 12px;
  position: relative;
  top: -3px;
  font-size: 1.2em; }
  .comment a {
    color: #131313; }
  .comment img {
    position: relative;
    top: 2px; }

#administration {
  font-family: "Poiret One", cursive;
  font-weight: 600;
  font-size: 1.6em;
  margin: 0px auto; }
  #administration a {
    color: #131313;
    font-variant: normal; }
  #administration p {
    border-bottom: 1px dotted #131313;
    margin: 0px auto;
    width: 280px;
    padding: 30px 0px 10px 10px;
    margin-bottom: 10px; }
    @media only screen and (min-width: 500px) {
      #administration p {
        width: 400px; } }
  #administration p:last-child {
    margin-bottom: 35px; }
  @media only screen and (min-width: 1100px) {
    #administration {
      margin: 0px 80px;
      float: left; } }
  #administration #article {
    background: url("../img/article.png") right bottom no-repeat; }
  #administration #review {
    background: url("../img/review.png") right bottom no-repeat; }
  #administration #special {
    background: url("../img/special.png") right bottom no-repeat; }
  #administration #game {
    background: url("../img/game.png") right bottom no-repeat; }
  #administration #platform {
    background: url("../img/platform.png") right bottom no-repeat; }
  #administration #studio {
    background: url("../img/studio.png") right bottom no-repeat; }
  #administration #event {
    background: url("../img/event.png") right bottom no-repeat; }

#article_manage {
  margin: 0px 15px;
  margin-bottom: 30px; }
  @media only screen and (min-width: 500px) {
    #article_manage {
      width: 400px;
      margin: 0px auto; } }
  @media only screen and (min-width: 1100px) {
    #article_manage {
      margin: 0px 30px 30px 0px;
      float: left;
      max-width: 440px; } }
  #article_manage .manage_title {
    font-family: "Poiret One", cursive;
    font-weight: 600;
    font-size: 1.8em;
    font-variant: small-caps;
    margin: 30px 0px 10px -20px;
    text-align: left; }
  #article_manage ul {
    list-style-type: none;
    margin-top: 5px;
    padding: 0px;
    padding-left: 30px; }
    #article_manage ul li {
      padding: 4px 0px;
      font-size: 1.08em; }
    #article_manage ul li:before {
      content: "\0021aa";
      display: inline-block;
      margin-left: -1.3em;
      width: 1.3em; }
    #article_manage ul .bold_link {
      color: #0073CF;
      cursor: pointer;
      transition: text-shadow 0.3s, font-weight 0.2s;
      -ms-transition: text-shadow 0.3s, font-weight 0.2s;
      -webkit-transition: text-shadow 0.3s, font-weight 0.2s;
      -o-transition: text-shadow 0.3s, font-weight 0.2s;
      -moz-transition: text-shadow 0.3s, font-weight 0.2s; }
      #article_manage ul .bold_link:hover {
        text-shadow: 0px 0px 6px #707070;
        transition: text-shadow 0.3s, font-weight 0.2s;
        -ms-transition: text-shadow 0.3s, font-weight 0.2s;
        -webkit-transition: text-shadow 0.3s, font-weight 0.2s;
        -o-transition: text-shadow 0.3s, font-weight 0.2s;
        -moz-transition: text-shadow 0.3s, font-weight 0.2s; }
    #article_manage ul .edit_options {
      font-size: 0.8em;
      padding: 15px;
      margin-left: -104px;
      margin-top: 4px;
      border-radius: 10px 0px 10px 10px;
      background-color: rgba(19, 19, 19, 0.9);
      text-align: center; }
      #article_manage ul .edit_options p:last-child {
        padding-top: 5px;
        cursor: pointer; }

_::-webkit-full-page-media, _:future, :root #article_manage .manage_title {
  font-variant: normal; }

.article_date {
  text-align: right;
  color: #575757;
  font-size: 0.8em;
  font-family: "Poiret One", cursive;
  font-weight: 700; }

.no_articles {
  text-align: center;
  font-weight: 900;
  font-size: 1.3em;
  font-family: "Poiret One", cursive;
  color: #575757;
  padding-bottom: 20px;
  margin-bottom: 0px; }

.review_summary div {
  margin-top: 20px;
  margin-left: auto;
  margin-right: auto; }
  @media only screen and (min-width: 500px) {
    .review_summary div {
      width: 375px; } }
  @media only screen and (min-width: 768px) {
    .review_summary div {
      float: left; } }
  .review_summary div ul {
    padding-top: 5px;
    padding-left: 0px;
    padding-right: 0px; }
    @media only screen and (min-width: 500px) {
      .review_summary div ul {
        margin-left: 0px; } }
    @media only screen and (min-width: 768px) {
      .review_summary div ul {
        padding-left: 30px;
        padding-right: 30px;
        margin-left: 20px; } }
  .review_summary div li {
    border-bottom: 1px dotted #3D3D3D;
    margin: 8px 0px;
    padding-right: 5%;
    text-indent: 5%;
    font-size: 1.25em;
    line-height: 30px;
    margin-right: 20px; }
  .review_summary div h3 {
    font-size: 2.0em; }
.review_summary #pros {
  list-style-image: url("../img/pros.png");
  list-style-position: inside; }
.review_summary #cons {
  list-style-image: url("../img/cons.png");
  list-style-position: inside; }

#rating {
  font-family: "Poiret One", cursive;
  color: #038fff;
  text-align: left;
  text-align: center;
  border-radius: 100%;
  line-height: 165px;
  font-size: 3.3em;
  width: 165px;
  height: 165px;
  margin: 15px 25px 25px 25px;
  font-weight: 600;
  background: #131313;
  box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 70px -1px rgba(100, 100, 100, 0.65); }

#review_conclusion div {
  font-family: "Poiret One", cursive;
  color: #038fff;
  text-align: left;
  text-align: center;
  border-radius: 100%;
  line-height: 145px;
  font-size: 3.3em;
  width: 165px;
  height: 165px;
  margin: 25px auto;
  font-weight: 600;
  background: #131313;
  box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 70px -1px rgba(100, 100, 100, 0.65); }
  @media only screen and (min-width: 500px) {
    #review_conclusion div {
      float: left;
      margin: 25px 25px; } }
#review_conclusion p {
  font-variant: small-caps; }
  #review_conclusion p::first-letter {
    font-size: 250%;
    font-family: "Poiret One", cursive;
    margin: 0px;
    padding: 0px;
    /*margin-top: -16px;
    margin-right: 5px;
    float: left;*/ }
#review_conclusion h3 {
  font-size: 2.5em;
  color: #3D3D3D; }

_::-webkit-full-page-media, _:future, :root #review_conclusion p {
  font-variant: normal; }

.terms {
  margin: 30px;
  margin-left: 50px; }
  .terms li {
    margin-bottom: 15px; }

#related-articles p, #most-read p {
  font-size: 1.1em;
  font-family: "Poiret One", cursive;
  font-weight: 800;
  margin: 0px;
  padding: 0px;
  /*img {
      border-radius: 5.5px;
      box-shadow: 0px 0px 20px 1px lighten($grey,10), inset 0px 20px 70px -1px rgba(100,100,100,0.65);
      background: $blue;
      width: 100%;
      height: 100%;
  }*/ }
  #related-articles p:first-child, #most-read p:first-child {
    width: 100px;
    padding-right: 15px; }
    #related-articles p:first-child img, #most-read p:first-child img {
      border-radius: 5.5px;
      box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 70px -1px rgba(100, 100, 100, 0.65);
      background: #0073CF;
      width: 100%;
      height: 100%; }

#related-articles > div, #most-read > div {
  margin: 15px 15px 0px 15px;
  border-bottom: 1px dotted #3D3D3D;
  padding-bottom: 10px; }
  #related-articles > div:last-child, #most-read > div:last-child {
    border: none; }

#most-read .most-read-date, #related-articles .most-read-date {
  font-size: 0.85em;
  margin-top: 5px;
  margin-left: 115px;
  text-align: right; }
  #most-read .most-read-date img, #related-articles .most-read-date img {
    width: 14px;
    position: relative;
    top: 1px; }
  #most-read .most-read-date a, #related-articles .most-read-date a {
    color: black; }

.delete-publication, .delete-item {
  display: none;
  border: 3px solid white;
  width: 280px;
  min-height: 200px;
  position: fixed;
  top: 50%;
  left: 50%;
  margin-left: -140px;
  margin-top: -100px;
  z-index: 6;
  /*.cancel_button {
      box-shadow: 0px 0px 5px 0px lighten($grey,10);
  }*/ }
  @media only screen and (min-width: 460px) {
    .delete-publication, .delete-item {
      width: 400px;
      margin-left: -200px; } }
  .delete-publication p, .delete-item p {
    font-size: 1.0em;
    margin: 10px;
    margin-top: 30px;
    line-height: 1.8em; }
  .delete-publication .delete-option, .delete-item .delete-option {
    margin-top: 20px;
    text-align: center; }
    .delete-publication .delete-option span, .delete-item .delete-option span {
      font-size: 1.3em;
      cursor: pointer;
      color: #0073CF;
      transition: text-shadow 0.3s, font-weight 0.2s;
      -ms-transition: text-shadow 0.3s, font-weight 0.2s;
      -webkit-transition: text-shadow 0.3s, font-weight 0.2s;
      -o-transition: text-shadow 0.3s, font-weight 0.2s;
      -moz-transition: text-shadow 0.3s, font-weight 0.2s; }
      .delete-publication .delete-option span:first-of-type, .delete-item .delete-option span:first-of-type {
        margin-right: 70px; }
      .delete-publication .delete-option span:hover, .delete-item .delete-option span:hover {
        text-shadow: 0px 0px 6px #707070;
        font-weight: 700;
        transition: text-shadow 0.3s, font-weight 0.2s;
        -ms-transition: text-shadow 0.3s, font-weight 0.2s;
        -webkit-transition: text-shadow 0.3s, font-weight 0.2s;
        -o-transition: text-shadow 0.3s, font-weight 0.2s;
        -moz-transition: text-shadow 0.3s, font-weight 0.2s; }

#editor #frm-createAddEventForm th {
  min-width: 190px; }
#editor #frm-createAddEventForm input[type="submit"] {
  margin-left: 100px; }
#editor #frm-createAddEventForm input[type="text"] {
  margin-right: 20px; }
#editor #frm-createAddEventForm #event-date-row input {
  width: 200px; }
#editor #frm-createAddEventForm #event-date-row .check-date-button {
  width: 185px; }
  #editor #frm-createAddEventForm #event-date-row .check-date-button a {
    font-family: "Poiret One", cursive;
    font-weight: 700; }
#editor #frm-createAddEventForm #event-date-row .related-events {
  border-left: 1px solid #3D3D3D;
  vertical-align: top;
  padding-left: 15px; }
  #editor #frm-createAddEventForm #event-date-row .related-events h6 {
    padding-top: 5px;
    font-size: 1.15em;
    text-align: left;
    min-width: 340.8px; }
  #editor #frm-createAddEventForm #event-date-row .related-events p {
    padding: 0px;
    text-align: center; }
  #editor #frm-createAddEventForm #event-date-row .related-events ul {
    margin-left: 5px;
    padding-right: 0px;
    padding-top: 7px; }
  #editor #frm-createAddEventForm #event-date-row .related-events li {
    margin-top: 7px; }
#editor #frm-createAddEventForm .event-examples p {
  padding: 0px;
  font-weight: 700; }
#editor #frm-createAddEventForm .event-examples ul {
  padding-top: 0px;
  padding-right: 0px; }

#search-h3 {
  margin: 10px 30px;
  max-width: 490px;
  padding: 10px 20px;
  border-radius: 100px;
  border-bottom: 1px dotted #707070;
  color: #636363; }
  @media only screen and (min-width: 600px) {
    #search-h3 {
      margin: 10px auto; } }
  #search-h3 a {
    color: #707070; }
  #search-h3 .active {
    color: black;
    text-shadow: 0px 0px 6px #707070; }

@media only screen and (min-width: 500px) {
  #article-content-padding {
    padding: 10px; } }
#article-content-padding p {
  line-height: 1.3em; }

/* 
    Created on : 17.9.2016, 20:39:08
    Author     : Martin
*/
.games_list, .studio_logo {
  min-height: 150px;
  margin: 0px 30px;
  padding-top: 15px;
  border-bottom: 1px dotted #bdbdbd;
  transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out; }
  @media only screen and (min-width: 530px) {
    .games_list .game_info, .studio_logo .game_info {
      transition: all 0.5s ease-out;
      -ms-transition: all 0.5s ease-out;
      -webkit-transition: all 0.5s ease-out;
      -o-transition: all 0.5s ease-out;
      -moz-transition: all 0.5s ease-out;
      margin-left: 104px;
      margin-right: 40px; }
    .games_list:hover .game_info, .studio_logo:hover .game_info {
      transition: all 0.5s ease-out;
      -ms-transition: all 0.5s ease-out;
      -webkit-transition: all 0.5s ease-out;
      -o-transition: all 0.5s ease-out;
      -moz-transition: all 0.5s ease-out;
      margin-left: 144px;
      margin-right: 0px; }
    .games_list:hover p:first-child img, .studio_logo:hover p:first-child img {
      height: 120px; }
    .games_list:hover h2, .studio_logo:hover h2 {
      transition: all 0.5s ease-out;
      -ms-transition: all 0.5s ease-out;
      -webkit-transition: all 0.5s ease-out;
      -o-transition: all 0.5s ease-out;
      -moz-transition: all 0.5s ease-out;
      margin-left: 144px;
      margin-right: 0px; } }
  @media only screen and (max-width: 530px) {
    .games_list .game_info, .studio_logo .game_info {
      clear: both; } }
  .games_list p:first-child, .studio_logo p:first-child {
    float: left;
    margin-right: 5px;
    padding-bottom: 0px; }
    .games_list p:first-child img, .studio_logo p:first-child img {
      transition: all 0.5s ease-out;
      -ms-transition: all 0.5s ease-out;
      -webkit-transition: all 0.5s ease-out;
      -o-transition: all 0.5s ease-out;
      -moz-transition: all 0.5s ease-out;
      box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 70px -1px rgba(100, 100, 100, 0.65);
      background: white;
      height: 80px; }
  .games_list p, .studio_logo p {
    padding: 0px 15px 15px 0px;
    margin-top: 10px; }
  .games_list h2, .studio_logo h2 {
    padding-left: 0px;
    padding-right: 0px;
    margin-right: 0px;
    text-align: left;
    background: none;
    box-shadow: none;
    transition: all 0.5s ease-out;
    -ms-transition: all 0.5s ease-out;
    -webkit-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    margin-left: 104px;
    margin-right: 40px; }
  .games_list:last-child, .studio_logo:last-child {
    border: none; }
  .games_list:hover, .studio_logo:hover {
    min-height: 150px; }
    .games_list:hover .game_hover, .studio_logo:hover .game_hover {
      visibility: visible; }
  .games_list .game_hover, .studio_logo .game_hover {
    text-align: left;
    visibility: hidden;
    font-size: 0.7em; }
    .games_list .game_hover p, .studio_logo .game_hover p {
      float: left;
      text-align: left; }
  .games_list .game_description, .studio_logo .game_description {
    padding-bottom: 0px;
    padding-right: 0px;
    margin-bottom: 0px; }

#game_headboard {
  min-width: 320px;
  border: 3px solid white;
  box-shadow: 0px 0px 10px 1px #575757, inset 0px -280px 180px -10px rgba(0, 0, 0, 0.75);
  background: url("../img/kindajean.png");
  position: relative;
  top: 20px; }
  @media only screen and (max-width: 767.9px) {
    #game_headboard {
      box-shadow: 0px 0px 10px 1px #575757, inset 0px -280px 180px -10px rgba(0, 0, 0, 0.75) !important;
      background: url("../img/kindajean.png") !important;
      display: flex;
      flex-direction: column; }
      #game_headboard .game-row-1 {
        order: 2;
        display: flex;
        flex-direction: row; }
        #game_headboard .game-row-1 .game-developer {
          order: 1; }
        #game_headboard .game-row-1 .game-publisher {
          order: 3; }
        #game_headboard .game-row-1 .game-review {
          order: 2; }
      #game_headboard .game-row-2 {
        order: 1;
        display: flex;
        flex-direction: column; }
        #game_headboard .game-row-2 .game_logo {
          order: 1; }
        #game_headboard .game-row-2 .game-release {
          order: 2; }
        #game_headboard .game-row-2 .game-platform {
          order: 3;
          margin-top: -154px;
          margin-left: 162px; } }
  @media only screen and (max-width: 550px) {
    #game_headboard {
      box-shadow: 0px 0px 10px 1px #575757, inset 0px -430px 180px -10px rgba(0, 0, 0, 0.75) !important; }
      #game_headboard .game-row-1 {
        flex-direction: column; }
        #game_headboard .game-row-1 .game-developer {
          order: 1; }
        #game_headboard .game-row-1 .game-publisher {
          order: 2;
          margin-top: -154px;
          margin-left: 162px; }
        #game_headboard .game-row-1 .game-review {
          order: 3;
          margin-left: auto;
          margin-right: auto;
          visibility: hidden; } }
  @media only screen and (min-width: 768px) {
    #game_headboard {
      width: 744px;
      height: 400px; } }
  @media only screen and (min-width: 1100px) {
    #game_headboard {
      width: 1074px;
      height: 400px; } }
  #game_headboard h1 {
    border-radius: 0px 0px 100px 100px;
    background-color: #131313;
    background-color: rgba(19, 19, 19, 0.8);
    box-shadow: inset 0px 20px 70px -1px rgba(100, 100, 100, 0.75);
    padding: 5px 0px;
    margin: 0 20px;
    font-size: 2.0em; }
  #game_headboard .game_row {
    clear: both;
    width: 306px;
    margin: 0px auto; }
    @media only screen and (min-width: 768px) {
      #game_headboard .game_row {
        width: 582px; } }
    @media only screen and (min-width: 768px) {
      #game_headboard .game_row:last-child {
        width: 734px;
        position: relative;
        bottom: 10px; } }
    @media only screen and (min-width: 1100px) {
      #game_headboard .game_row:last-child {
        position: static; } }
    @media only screen and (min-width: 550.1px) {
      #game_headboard .game_row:first-of-type {
        width: 462px; } }
    @media only screen and (min-width: 768px) {
      #game_headboard .game_row:first-of-type {
        margin-top: 40px;
        width: 582px; } }
    @media only screen and (min-width: 1100px) {
      #game_headboard .game_row:first-of-type {
        margin-top: 0px; } }
  @media only screen and (min-width: 768px) {
    #game_headboard .lower {
      position: relative;
      top: 30px; } }
  #game_headboard .game_statistic {
    height: 130px;
    width: 130px;
    box-shadow: 0px 0px 20px 1px #131313, inset 0px 20px 70px -1px rgba(80, 80, 80, 0.65);
    border: 2px solid black;
    background: #131313;
    border-radius: 50%;
    margin: 0px 10px 20px 10px;
    background-color: #131313;
    background-color: rgba(19, 19, 19, 0.8); }
    @media only screen and (min-width: 768px) {
      #game_headboard .game_statistic {
        margin: 30px; } }
    #game_headboard .game_statistic a {
      color: black; }
  #game_headboard .game_logo {
    height: 300px;
    width: 300px;
    margin: 20px 0px;
    border: 3px solid white;
    box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75);
    border-radius: 50%;
    background-color: #131313;
    font-size: 2.7em;
    font-weight: 800;
    font-variant: small-caps;
    font-family: "Poiret One", cursive;
    color: #0065b6;
    text-shadow: 0px 0px 6px #131313;
    display: table;
    position: relative;
    z-index: 3; }
    @media only screen and (min-width: 550.1px) {
      #game_headboard .game_logo {
        margin-top: 80px; } }
    @media only screen and (min-width: 768px) {
      #game_headboard .game_logo {
        margin: 20px 20px 10px 20px; } }
    @media only screen and (min-width: 768px) {
      #game_headboard .game_logo {
        margin: 20px; } }
    #game_headboard .game_logo p {
      text-align: center;
      display: table-cell;
      vertical-align: middle; }
  #game_headboard .game_label {
    text-align: center;
    margin: 0px;
    padding-top: 10px;
    height: 30px;
    background: url("../img/game_label_bg.png") no-repeat;
    font-variant: small-caps;
    font-weight: 600; }
  #game_headboard .game_statement {
    text-align: center;
    margin: 0px;
    padding-top: 35px;
    height: 55px;
    font-size: 2.0em;
    font-weight: 800;
    font-variant: small-caps;
    font-family: "Poiret One", cursive;
    color: #0065b6;
    text-shadow: 0px 0px 6px #131313; }
  #game_headboard .game_platform {
    text-align: center;
    margin: 15px;
    margin-bottom: 5px;
    height: 70px;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 1.4em;
    font-weight: 800;
    font-variant: small-caps;
    font-family: "Poiret One", cursive;
    color: #0065b6;
    text-shadow: 0px 0px 6px #131313;
    display: table;
    width: 100px; }
    #game_headboard .game_platform span {
      display: table-cell;
      vertical-align: middle; }
    #game_headboard .game_platform a {
      color: #0073CF; }
  #game_headboard #game_release {
    padding-top: 12px;
    height: 78px;
    display: table;
    width: 130px; }
    #game_headboard #game_release span {
      display: table-cell;
      vertical-align: middle; }

_::-webkit-full-page-media, _:future, :root #game_headboard .game_logo {
  font-variant: normal; }

_::-webkit-full-page-media, _:future, :root #game_headboard .game_label {
  font-variant: normal;
  text-transform: uppercase; }

_::-webkit-full-page-media, _:future, :root #game_headboard .game_statement {
  font-variant: normal; }

_::-webkit-full-page-media, _:future, :root #game_headboard .game_platform {
  font-variant: normal; }

#game_lowheadboard {
  margin: -150px auto 0px auto;
  width: 90%;
  position: absolute;
  border: none; }
  @media only screen and (min-width: 550.1px) {
    #game_lowheadboard {
      margin: -50px auto 0px auto;
      background: #131313;
      border-radius: 0px 0px 80px 80px;
      box-shadow: 0px 5px 10px 0px #575757, inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75);
      height: 85px;
      position: relative;
      width: 95%; } }
  @media only screen and (min-width: 550.1px) and (max-width: 767.9px) {
    #game_lowheadboard {
      bottom: 646.5px; } }
  @media only screen and (min-width: 768px) {
    #game_lowheadboard {
      width: 700px;
      margin: -559.5px 25px 0px 25px;
      border-radius: 0px 0px 100px 100px;
      position: absolute;
      background-color: rgba(0, 0, 0, 0.85); } }
  @media only screen and (min-width: 1100px) {
    #game_lowheadboard {
      width: 1000px;
      margin: -117px 40px 0px 40px;
      background: #131313;
      background-color: none; } }
  #game_lowheadboard div {
    float: left;
    width: 175px;
    text-align: center;
    color: #0073CF;
    font-family: "Poiret One", cursive; }
    @media only screen and (max-width: 550px) {
      #game_lowheadboard div {
        float: none;
        margin: 0px auto;
        width: auto; } }
    #game_lowheadboard div p:last-of-type {
      font-variant: small-caps;
      font-family: "Raleway", sans-serif;
      font-size: 1.1em;
      min-height: 38px;
      line-height: 26px;
      margin-top: 7px;
      color: white; }
      #game_lowheadboard div p:last-of-type span {
        display: inline-block;
        vertical-align: middle;
        line-height: normal; }
    #game_lowheadboard div p:first-of-type {
      font-weight: 700; }
    #game_lowheadboard div p {
      margin: 13px 0px 7px 0px; }
    #game_lowheadboard div a {
      color: white; }
    #game_lowheadboard div .active-star {
      color: #FFCC00; }
    #game_lowheadboard div .hover-star {
      color: #FFCC00;
      text-shadow: 0px 0px 6px #707070;
      font-weight: 700; }
  @media only screen and (max-width: 767.9px) {
    #game_lowheadboard .game-mp {
      display: none; } }
  #game_lowheadboard .game-genre {
    min-width: 160px; }
    @media only screen and (min-width: 550.1px) {
      #game_lowheadboard .game-genre {
        margin-left: 15px;
        width: 35%; } }
    @media only screen and (min-width: 768px) {
      #game_lowheadboard .game-genre {
        width: 175px;
        margin-left: 0px; } }
  #game_lowheadboard .game-average-rating {
    min-width: 140px;
    width: 50%;
    float: left; }
    @media only screen and (min-width: 550.1px) {
      #game_lowheadboard .game-average-rating {
        width: 45%; } }
    @media only screen and (min-width: 768px) {
      #game_lowheadboard .game-average-rating {
        width: 165px; } }
    @media only screen and (min-width: 1100px) {
      #game_lowheadboard .game-average-rating {
        margin-left: 300px; } }
  #game_lowheadboard .game-my-rating {
    min-width: 125px;
    width: 50%;
    float: left; }
    @media only screen and (min-width: 550.1px) {
      #game_lowheadboard .game-my-rating {
        margin-right: 0px;
        width: 45%; } }
    @media only screen and (min-width: 768px) {
      #game_lowheadboard .game-my-rating {
        width: 175px;
        margin-right: 0px; } }
  @media only screen and (min-width: 550.1px) {
    #game_lowheadboard #snippet--rating {
      width: 60%; } }
  @media only screen and (min-width: 768px) {
    #game_lowheadboard #snippet--rating {
      width: auto; } }
  #game_lowheadboard #rating-login {
    font-variant: normal;
    font-size: 0.95em; }
    #game_lowheadboard #rating-login a {
      color: #FFCC00;
      font-family: "Poiret One", cursive;
      font-weight: 800;
      font-size: 1.25em; }
  #game_lowheadboard #rating-release {
    font-size: 0.85em; }

_::-webkit-full-page-media, _:future, :root #game_lowheadboard div p:last-of-type {
  font-variant: normal; }

#game-edit-pen {
  position: absolute; }

#game_articles div, #search-publications div {
  min-height: 145px;
  margin: 0px 30px;
  padding: 20px 0px;
  border-bottom: 1px dotted #bdbdbd; }
  #game_articles div p:first-child, #search-publications div p:first-child {
    float: left;
    margin: 0px;
    padding: 0px; }
    @media only screen and (max-width: 550px) {
      #game_articles div p:first-child, #search-publications div p:first-child {
        width: 130px; } }
    @media only screen and (max-width: 470px) {
      #game_articles div p:first-child, #search-publications div p:first-child {
        width: 200px;
        float: none;
        margin: 0px auto; } }
    #game_articles div p:first-child img, #search-publications div p:first-child img {
      border-radius: 5.5px;
      box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 70px -1px rgba(100, 100, 100, 0.65);
      margin-right: 20px;
      background: #0073CF; }
      @media only screen and (max-width: 550px) {
        #game_articles div p:first-child img, #search-publications div p:first-child img {
          width: 120px; } }
      @media only screen and (max-width: 470px) {
        #game_articles div p:first-child img, #search-publications div p:first-child img {
          width: 200px; } }
  #game_articles div p, #search-publications div p {
    padding: 0px;
    margin-top: 10px; }
  @media only screen and (max-width: 550px) {
    #game_articles div p.preview-text, #search-publications div p.preview-text {
      clear: both;
      padding-top: 5px; } }
  #game_articles div h2, #search-publications div h2 {
    background: none;
    box-shadow: none; }

#search-publications .no_articles {
  color: #0073CF;
  margin: 25px 15px; }
#search-publications .clear {
  margin: 0px;
  padding: 0px;
  min-height: 0;
  border-bottom: 1px solid transparent; }
#search-publications .search-item-div p:first-child {
  width: 135px; }
  #search-publications .search-item-div p:first-child img {
    width: 115px;
    background: white; }

.platforms_list {
  height: 280px;
  max-width: 354px;
  margin: 0px auto; }
  @media only screen and (min-width: 768px) {
    .platforms_list {
      width: 354px;
      margin-left: 20px;
      border: 1px dotted #bdbdbd;
      border-top: none;
      border-left: none;
      float: left; } }
  .platforms_list .platfrom_info {
    transition: all 0.5s ease-out;
    -ms-transition: all 0.5s ease-out;
    -webkit-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    position: absolute;
    height: 120px;
    width: 90%;
    max-width: 354px;
    min-width: 300px;
    background-color: #131313;
    background-color: rgba(19, 19, 19, 0.9);
    box-shadow: 0px 0px 20px 1px #131313, inset 0px 20px 70px -1px rgba(80, 80, 80, 0.65);
    font-family: "Poiret One", cursive;
    font-variant: normal;
    font-size: 1.1em;
    text-shadow: 0px 0px 6px #131313;
    font-weight: 600;
    visibility: hidden;
    opacity: 0; }
    .platforms_list .platfrom_info table {
      margin: 0px auto;
      text-align: center;
      vertical-align: middle;
      padding: 15px; }
      .platforms_list .platfrom_info table tbody {
        width: 100%; }
      .platforms_list .platfrom_info table td {
        padding-bottom: 5px;
        width: 150px; }
      .platforms_list .platfrom_info table .developer {
        height: 30px; }
  .platforms_list .platform_view {
    margin: 15px 0px;
    text-align: center;
    font-size: 1.4em; }
    .platforms_list .platform_view img {
      height: 200px; }
  .platforms_list:hover .platfrom_info {
    transition: all 0.5s ease-out;
    -ms-transition: all 0.5s ease-out;
    -webkit-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    visibility: visible;
    opacity: 1; }

@media only screen and (min-width: 768px) {
  .right_platforms_list {
    margin-left: 0px;
    margin-right: 20px;
    border-right: none; } }

#platforms_list {
  margin: 25px 0px; }

#platform_headboard {
  min-width: 300px;
  min-height: 410px;
  border: 3px solid white;
  margin-bottom: 20px;
  position: relative;
  top: 20px;
  color: white;
  box-shadow: 0px 0px 10px 1px #575757, inset 0px -850px 180px -10px rgba(0, 0, 0, 0.75);
  background: url("../img/kindajean.png") #131313 repeat; }
  @media only screen and (min-width: 430px) {
    #platform_headboard {
      box-shadow: 0px 0px 10px 1px #575757, inset 0px -650px 180px -10px rgba(0, 0, 0, 0.75); } }
  @media only screen and (min-width: 640px) {
    #platform_headboard {
      box-shadow: 0px 0px 10px 1px #575757, inset 0px -390px 180px -10px rgba(0, 0, 0, 0.75); } }
  @media only screen and (min-width: 768px) {
    #platform_headboard {
      width: 744px;
      box-shadow: 0px 0px 10px 1px #575757, inset 0px 400px 180px -10px rgba(0, 0, 0, 0.75); } }
  @media only screen and (min-width: 1100px) {
    #platform_headboard {
      width: 1074px;
      box-shadow: 0px 0px 10px 1px #575757, inset 0px 230px 150px -10px rgba(0, 0, 0, 0.75); } }
  #platform_headboard .platform_picture {
    height: 250px;
    width: 250px;
    margin: 0px auto;
    margin-top: 30px;
    border: 3px solid white;
    box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75);
    border-radius: 50%;
    background-color: rgba(0, 115, 207, 0.3); }
    @media only screen and (min-width: 430px) {
      #platform_headboard .platform_picture {
        height: 300px;
        width: 300px; } }
    @media only screen and (min-width: 768px) {
      #platform_headboard .platform_picture {
        float: left;
        margin: 50px;
        margin-bottom: 15px; } }
    @media only screen and (min-width: 1100px) {
      #platform_headboard .platform_picture {
        margin-bottom: 50px; } }
    #platform_headboard .platform_picture img {
      width: 180px;
      height: 180px;
      margin: 35px; }
      @media only screen and (min-width: 430px) {
        #platform_headboard .platform_picture img {
          width: 230px;
          height: 230px; } }
  #platform_headboard .platform_info {
    margin: 30px 40px; }
    #platform_headboard .platform_info h1 {
      text-align: center;
      font-weight: 400;
      font-size: 3.1em;
      font-family: "Raleway", sans-serif;
      text-shadow: 0px 0px 6px #131313; }
    #platform_headboard .platform_info .platform_quote {
      font-family: "Poiret One", cursive;
      height: 100px;
      font-size: 1.1em; }
      @media only screen and (min-width: 430px) {
        #platform_headboard .platform_info .platform_quote {
          font-size: 1.3em; } }
  #platform_headboard .platform_row {
    width: 184px; }
    @media only screen and (min-width: 430px) {
      #platform_headboard .platform_row {
        width: 368px; } }
    @media only screen and (min-width: 640px) {
      #platform_headboard .platform_row {
        width: 552px; } }
    @media only screen and (min-width: 1100px) {
      #platform_headboard .platform_row {
        width: auto; } }
    @media only screen and (max-width: 1100px) {
      #platform_headboard .platform_row {
        clear: both;
        margin: 0px auto;
        padding-top: 30px; } }
  #platform_headboard .platform_statistic {
    height: 130px;
    width: 130px;
    box-shadow: 0px 0px 20px 1px #131313, inset 0px 20px 70px -1px rgba(80, 80, 80, 0.65);
    border: 2px solid black;
    background: #131313;
    border-radius: 50%;
    margin: 25px;
    margin-top: 10px;
    background-color: #131313;
    background-color: rgba(19, 19, 19, 0.8); }
    #platform_headboard .platform_statistic a {
      color: black; }
    @media only screen and (min-width: 1100px) {
      #platform_headboard .platform_statistic:first-of-type {
        margin-left: 60px; } }
    @media only screen and (max-width: 640px) and (min-width: 430px) {
      #platform_headboard .platform_statistic:last-of-type {
        margin-left: 117px; } }
  #platform_headboard .platform_label {
    text-align: center;
    margin: 0px;
    padding-top: 10px;
    height: 30px;
    background: url("../img/game_label_bg.png") no-repeat;
    font-variant: small-caps;
    font-weight: 600;
    color: black; }
  #platform_headboard .platform_statement {
    text-align: center;
    margin: 0px;
    padding-top: 35px;
    height: 55px;
    font-size: 2.0em;
    font-weight: 800;
    font-variant: small-caps;
    font-family: "Poiret One", cursive;
    color: #038fff;
    text-shadow: 0px 0px 6px #131313; }
  #platform_headboard #platform_release {
    padding-top: 12px;
    height: 78px;
    display: table;
    width: 130px; }
    #platform_headboard #platform_release span {
      display: table-cell;
      vertical-align: middle; }
  #platform_headboard .left_platform_quote {
    float: left;
    margin: -15px 15px 5px -20px; }
  #platform_headboard .right_platform_quote {
    float: right;
    margin: -20px -15px 0px 15px;
    position: relative;
    top: 30px; }

_::-webkit-full-page-media, _:future, :root #platform_headboard .platform_label {
  font-variant: normal;
  text-transform: uppercase; }

_::-webkit-full-page-media, _:future, :root #platform_headboard .platform_statement {
  font-variant: normal; }

.studio_logo img {
  border-radius: 100%;
  transform: rotate(-360deg);
  -ms-transform: rotate(-360deg);
  -webkit-transform: rotate(-360deg);
  -o-transform: rotate(-360deg);
  -moz-transform: rotate(-360deg);
  transition: all 0.7s ease-out;
  -ms-transition: all 0.7s ease-out;
  -webkit-transition: all 0.7s ease-out;
  -o-transition: all 0.7s ease-out;
  -moz-transition: all 0.7s ease-out; }
.studio_logo:hover img {
  transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  transition: all 0.7s ease-out;
  -ms-transition: all 0.7s ease-out;
  -webkit-transition: all 0.7s ease-out;
  -o-transition: all 0.7s ease-out;
  -moz-transition: all 0.7s ease-out; }

.games_list:hover p:first-child img {
  transform: rotate(10deg);
  -ms-transform: rotate(10deg);
  -webkit-transform: rotate(10deg);
  -o-transform: rotate(10deg);
  -moz-transform: rotate(10deg);
  transition: all 0.7s ease-out;
  -ms-transition: all 0.7s ease-out;
  -webkit-transition: all 0.7s ease-out;
  -o-transition: all 0.7s ease-out;
  -moz-transition: all 0.7s ease-out; }

#studio_headboard {
  min-width: 300px;
  min-height: 300px;
  border: 3px solid white;
  margin-bottom: 20px;
  position: relative;
  top: 20px;
  color: white;
  box-shadow: 0px 0px 10px 1px #575757, inset 0px -450px 150px -10px rgba(0, 16, 29, 0.7);
  background: url("../img/kindajean.png") #131313 repeat; }
  @media only screen and (min-width: 600px) {
    #studio_headboard {
      box-shadow: 0px 0px 10px 1px #575757, inset -350px -150px 120px 90px rgba(0, 16, 29, 0.7); } }
  @media only screen and (min-width: 768px) {
    #studio_headboard {
      width: 744px;
      box-shadow: 0px 0px 10px 1px #575757, inset 0px -230px 150px -10px rgba(0, 16, 29, 0.7); } }
  @media only screen and (min-width: 1100px) {
    #studio_headboard {
      width: 1074px; } }
  #studio_headboard .studio_picture {
    height: 244px;
    width: 244px;
    /*border: 3px solid white;
    box-shadow: 0px 0px 20px 1px lighten($grey,10), inset 0px 20px 70px -1px rgba(80,80,80,0.75);
    background-color: rgba(0, 115, 207, 0.30);*/
    padding: 25px;
    margin-right: auto;
    margin-left: auto;
    /*position: relative;
    top: 55px;*/
    transform: rotate(5deg);
    -ms-transform: rotate(5deg);
    -webkit-transform: rotate(5deg);
    -o-transform: rotate(5deg);
    -moz-transform: rotate(5deg);
    transition: all 0.7s ease-out;
    -ms-transition: all 0.7s ease-out;
    -webkit-transition: all 0.7s ease-out;
    -o-transition: all 0.7s ease-out;
    -moz-transition: all 0.7s ease-out; }
    @media only screen and (min-width: 600px) {
      #studio_headboard .studio_picture {
        float: left;
        margin-right: 30px;
        margin-left: 10px; } }
    #studio_headboard .studio_picture img {
      height: 244px;
      width: 244px;
      border: 3px solid white;
      box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75); }
  #studio_headboard .studio_corner {
    background: url("../img/studio_corner.png") transparent no-repeat;
    width: 300px;
    height: 300px;
    position: absolute;
    margin: 0px;
    margin-left: 10px;
    transform: rotate(5deg);
    -ms-transform: rotate(5deg);
    -webkit-transform: rotate(5deg);
    -o-transform: rotate(5deg);
    -moz-transform: rotate(5deg);
    transition: all 0.7s ease-out;
    -ms-transition: all 0.7s ease-out;
    -webkit-transition: all 0.7s ease-out;
    -o-transition: all 0.7s ease-out;
    -moz-transition: all 0.7s ease-out; }
    @media only screen and (max-width: 601px) {
      #studio_headboard .studio_corner {
        display: none; } }
  #studio_headboard .studio_info {
    margin: 30px 40px;
    margin-top: 0px; }
    @media only screen and (max-width: 768px) {
      #studio_headboard .studio_info {
        clear: both; } }
    #studio_headboard .studio_info h1 {
      text-align: center;
      font-weight: 400;
      font-size: 3.1em;
      font-family: "Raleway", sans-serif;
      text-shadow: 0px 0px 6px #131313;
      margin-top: 15px; }
      @media only screen and (min-width: 1100px) {
        #studio_headboard .studio_info h1 {
          margin-top: 50px; } }
    #studio_headboard .studio_info .studio_quote {
      font-family: "Poiret One", cursive;
      min-height: 100px;
      font-size: 1.1em; }
      @media only screen and (min-width: 440px) {
        #studio_headboard .studio_info .studio_quote {
          font-size: 1.3em; } }
  #studio_headboard .studio_statistic {
    width: 163.5px;
    margin: 8px 10px;
    float: left;
    color: white; }
  #studio_headboard .studio_label {
    margin: 0px;
    font-family: "Poiret One", cursive; }
  #studio_headboard .studio_statement {
    font-size: 1.4em;
    font-variant: small-caps;
    margin: 0px; }
  #studio_headboard .studio_row {
    width: 184px;
    margin: 0px auto;
    text-align: center; }
    @media only screen and (min-width: 440px) {
      #studio_headboard .studio_row {
        width: 367px; } }
    @media only screen and (min-width: 600px) {
      #studio_headboard .studio_row {
        width: auto;
        margin-top: 45px; } }
    @media only screen and (min-width: 768px) {
      #studio_headboard .studio_row {
        width: 744px;
        height: 120px;
        margin-top: 0px;
        background-color: #131313;
        background-color: rgba(19, 19, 19, 0.5);
        color: white; } }
    @media only screen and (min-width: 1100px) {
      #studio_headboard .studio_row {
        width: 1074px;
        height: 60px; } }
  #studio_headboard .left_studio_quote {
    float: left;
    margin: -15px 15px 5px -20px; }
  #studio_headboard .right_studio_quote {
    float: right;
    margin: -20px -15px 0px 15px;
    position: relative;
    top: 30px; }

_::-webkit-full-page-media, _:future, :root #studio_headboard .studio_statement {
  font-variant: normal;
  text-transform: uppercase; }

/* 
    Created on : 11.10.2016, 22:42:04
    Author     : Martin
*/
#gamer_headboard {
  margin-top: 90px;
  min-width: 300px;
  min-height: 300px;
  border: 3px solid white;
  color: white;
  box-shadow: 0px 0px 10px 1px #575757, inset 0px -280px 180px -10px rgba(0, 0, 0, 0.75);
  background: url("../img/kindajean.png") #131313 repeat fixed;
  text-align: center; }
  @media only screen and (min-width: 768px) {
    #gamer_headboard {
      width: 744px;
      text-align: left; } }
  @media only screen and (min-width: 1100px) {
    #gamer_headboard {
      width: 1074px;
      box-shadow: 0px 0px 10px 1px #575757, inset 0px 190px 150px -10px rgba(0, 0, 0, 0.75); } }
  #gamer_headboard .gamer_avatar {
    margin: 15px auto;
    width: 255px; }
    @media only screen and (min-width: 570px) {
      #gamer_headboard .gamer_avatar {
        float: left;
        margin: 30px 0px;
        margin-left: 15px; } }
    @media only screen and (min-width: 768px) {
      #gamer_headboard .gamer_avatar {
        margin: 0px;
        margin-left: 10px;
        width: 300px; } }
    @media only screen and (min-width: 1100px) {
      #gamer_headboard .gamer_avatar {
        margin-left: 36px; } }
  #gamer_headboard img {
    border: 3px solid white;
    box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75);
    border-radius: 50%;
    background-color: rgba(0, 115, 207, 0.3);
    height: 250px; }
    @media only screen and (min-width: 768px) {
      #gamer_headboard img {
        height: 300px;
        border: none;
        box-shadow: none;
        border-radius: 0px;
        background-color: transparent; } }
  @media only screen and (min-width: 1100px) {
    #gamer_headboard .gamer_profile {
      margin-left: 366px; } }
  #gamer_headboard .gamer_info {
    margin: 35px 10px 0px 10px;
    width: 196px; }
    @media only screen and (min-width: 768px) {
      #gamer_headboard .gamer_info {
        float: left; } }
    @media only screen and (min-width: 1100px) {
      #gamer_headboard .gamer_info {
        margin: 35px 20px 0px 20px; } }
  #gamer_headboard .gamer_label {
    margin: 0px;
    font-family: "Poiret One", cursive; }
  #gamer_headboard .gamer_statement {
    font-size: 1.6em;
    font-variant: small-caps;
    margin: 0px; }

_::-webkit-full-page-media, _:future, :root #gamer_headboard .gamer_statement {
  font-variant: normal;
  text-transform: uppercase; }

#profile-edit {
  float: right;
  color: #0073CF;
  width: 170px;
  position: absolute;
  margin-top: 8px;
  margin-left: 8px;
  text-align: left;
  border-radius: 5px; }
  @media only screen and (min-width: 768px) {
    #profile-edit {
      text-align: right;
      margin-left: 566px; } }
  @media only screen and (min-width: 1100px) {
    #profile-edit {
      margin-left: 890px; } }
  #profile-edit span {
    font-size: 2.0em;
    text-shadow: 0px 0px 6px #131313;
    cursor: pointer; }
    #profile-edit span:hover {
      text-shadow: 0px 0px 12px black; }
      @media only screen and (min-width: 1100px) {
        #profile-edit span:hover {
          text-shadow: 0px 0px 8px #707070; } }
  #profile-edit div {
    display: none;
    margin-right: 10px;
    margin-left: 10px; }
    @media only screen and (min-width: 768px) {
      #profile-edit div {
        margin-top: -5px;
        margin-right: 20px;
        margin-left: 0px; } }
  #profile-edit p {
    margin: 0px;
    padding: 10px;
    background: #131313;
    box-shadow: 0px 0px 7px 1px #131313, inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75);
    text-align: center;
    font-family: "Raleway", sans-serif; }
    #profile-edit p:hover {
      box-shadow: 0px 0px 7px 1px #131313; }
    #profile-edit p:last-child {
      border-radius: 0px 0px 5px 5px; }
    #profile-edit p:first-child {
      border-radius: 5px 5px 0px 0px; }

#gamer_sidebar .sidebox:first-child h2:hover {
  box-shadow: inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75);
  background: #0073CF;
  color: white;
  transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out; }

@media only screen and (min-width: 1100px) {
  #gamer_sidebar, #profile_sidebar {
    margin-top: -55px;
    margin-left: 15px; } }
#gamer_sidebar .sidebox:first-child, #profile_sidebar .sidebox:first-child {
  width: 100%;
  text-align: left;
  border-radius: 5px 5px 25px 25px; }
  @media only screen and (min-width: 1100px) {
    #gamer_sidebar .sidebox:first-child, #profile_sidebar .sidebox:first-child {
      width: 340px;
      border-radius: 5px 5px 5px 25px; } }
  #gamer_sidebar .sidebox:first-child h2, #profile_sidebar .sidebox:first-child h2 {
    margin-right: 0px;
    background: none;
    box-shadow: none;
    border-bottom: 1px dotted #a3a3a3;
    text-align: center;
    border-radius: 0px 0px 25px 25px;
    background: url("../img/crossword.png") white repeat fixed;
    font-variant: small-caps; }
    @media only screen and (min-width: 1100px) {
      #gamer_sidebar .sidebox:first-child h2, #profile_sidebar .sidebox:first-child h2 {
        border-radius: 0px 0px 0px 25px;
        text-align: left;
        padding-left: 30px; } }
  #gamer_sidebar .sidebox:first-child h2.active, #profile_sidebar .sidebox:first-child h2.active {
    background: #3D3D3D;
    color: white;
    box-shadow: inset 20px 20px 70px -1px rgba(40, 40, 40, 0.85);
    border-color: white; }
  #gamer_sidebar .sidebox:first-child .gamer_hover_div, #profile_sidebar .sidebox:first-child .gamer_hover_div {
    background: #0073CF;
    box-shadow: inset 0px -20px 70px -1px rgba(80, 80, 80, 0.75);
    transition: all 0.5s ease-out;
    -ms-transition: all 0.5s ease-out;
    -webkit-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out; }
  #gamer_sidebar .sidebox:first-child div.active, #profile_sidebar .sidebox:first-child div.active {
    background: #3D3D3D;
    box-shadow: inset 20px -20px 70px -1px rgba(40, 40, 40, 0.85); }
  #gamer_sidebar .sidebox:first-child div.gamer_1, #profile_sidebar .sidebox:first-child div.gamer_1 {
    border-radius: 5px 5px 0px 0px; }
    @media only screen and (min-width: 1100px) {
      #gamer_sidebar .sidebox:first-child div.gamer_1, #profile_sidebar .sidebox:first-child div.gamer_1 {
        border-radius: 5px 0px 0px 0px; } }
    #gamer_sidebar .sidebox:first-child div.gamer_1 h2, #profile_sidebar .sidebox:first-child div.gamer_1 h2 {
      border-radius: 5px 5px 25px 25px; }
      @media only screen and (min-width: 1100px) {
        #gamer_sidebar .sidebox:first-child div.gamer_1 h2, #profile_sidebar .sidebox:first-child div.gamer_1 h2 {
          border-radius: 5px 0px 0px 25px; } }

_::-webkit-full-page-media, _:future, :root #gamer_sidebar .sidebox:first-child h2 {
  font-variant: normal;
  text-transform: uppercase;
  font-size: 1.3em; }

_::-webkit-full-page-media, _:future, :root #gprofile_sidebar .sidebox:first-child h2 {
  font-variant: normal;
  text-transform: uppercase;
  font-size: 1.3em; }

.gamer_row {
  border-bottom: 1px dotted #3D3D3D;
  margin: 25px 20px 0px 20px;
  padding: 0px 13px 3px 13px;
  font-size: 1.2em;
  /*&:last-of-type {
      margin-bottom: 25px;
  }*/ }
  @media only screen and (min-width: 570px) {
    .gamer_row {
      margin: 25px 35px 0px 35px; } }
  .gamer_row p {
    margin: 0px;
    padding: 0px; }
    .gamer_row p:first-of-type {
      font-family: "Poiret One", cursive;
      font-weight: 800;
      font-size: 1.1em;
      text-align: center; }
      @media only screen and (min-width: 570px) {
        .gamer_row p:first-of-type {
          float: left;
          text-align: left; } }
    .gamer_row p:last-of-type {
      text-align: center;
      padding-top: 10px;
      color: #3D3D3D; }
      @media only screen and (min-width: 570px) {
        .gamer_row p:last-of-type {
          float: right;
          text-align: justify;
          text-align-last: right;
          padding-top: 0px;
          color: black;
          max-width: 370px; } }
  .gamer_row:first-of-type {
    margin-top: 30px; }
  .gamer_row .green, .gamer_row .red {
    margin: 0px 3px; }
  .gamer_row .green {
    margin-right: 2px; }

.profile-rating img {
  height: 20px;
  position: relative;
  top: 5px; }

#user_intro {
  margin: 50px 20px 70px 20px;
  font-family: "Poiret One", cursive;
  min-height: 60px;
  font-size: 1.3em;
  font-weight: 800; }
  @media only screen and (min-width: 570px) {
    #user_intro {
      margin: 50px 60px 70px 60px; } }
  #user_intro img:first-of-type {
    float: left;
    margin: -15px 15px 5px -20px; }
  #user_intro img:last-of-type {
    float: right;
    margin: -20px -15px 0px 15px;
    position: relative;
    top: 30px; }

#snippet--block {
  padding-bottom: 25px; }

#higher h3 {
  margin-top: 35px;
  margin-bottom: 0px;
  font-size: 2.0em; }

@media only screen and (min-width: 768px) {
  #frm-createUpdateProfileForm .gamer_profile:last-of-type {
    float: left; } }
@media only screen and (min-width: 1100px) {
  #frm-createUpdateProfileForm .gamer_profile:last-of-type {
    float: none; } }
#frm-createUpdateProfileForm .gamer_profile:last-of-type .gamer_info {
  height: 40px;
  margin-top: 0px; }
  #frm-createUpdateProfileForm .gamer_profile:last-of-type .gamer_info:first-child {
    margin: 0px auto; }
    @media only screen and (min-width: 570px) {
      #frm-createUpdateProfileForm .gamer_profile:last-of-type .gamer_info:first-child {
        margin-left: 300px;
        width: auto;
        margin-right: 30px; } }
    @media only screen and (min-width: 768px) {
      #frm-createUpdateProfileForm .gamer_profile:last-of-type .gamer_info:first-child {
        margin-left: 10px;
        width: 196px;
        margin-right: 0px; } }
    #frm-createUpdateProfileForm .gamer_profile:last-of-type .gamer_info:first-child p {
      color: #d6d6d6;
      font-size: 0.85em;
      text-align: center;
      margin-left: 10px; }
      @media only screen and (min-width: 768px) {
        #frm-createUpdateProfileForm .gamer_profile:last-of-type .gamer_info:first-child p {
          text-align: left; } }
      @media only screen and (min-width: 1100px) {
        #frm-createUpdateProfileForm .gamer_profile:last-of-type .gamer_info:first-child p {
          text-align: center;
          margin: 0px; } }
#frm-createUpdateProfileForm .gamer_hidden {
  display: none; }
  @media only screen and (min-width: 1100px) {
    #frm-createUpdateProfileForm .gamer_hidden {
      display: block; } }
#frm-createUpdateProfileForm input[type="text"] {
  font-variant: small-caps;
  width: 170px; }
#frm-createUpdateProfileForm input[disabled] {
  background: #e3e3e3;
  color: #707070; }
  #frm-createUpdateProfileForm input[disabled]:hover {
    box-shadow: 0px 0px 7px 1px #575757; }
#frm-createUpdateProfileForm textarea {
  width: 90%;
  max-width: 320px;
  min-width: 200px;
  height: 70px;
  font-variant: small-caps; }
  @media only screen and (min-width: 465px) {
    #frm-createUpdateProfileForm textarea {
      width: 320px; } }
#frm-createUpdateProfileForm .gamer_row p {
  text-align: justify;
  text-align-last: left; }
#frm-createUpdateProfileForm input[type="submit"] {
  width: 70px;
  height: 70px;
  font-weight: 700;
  font-family: "Poiret One", cursive;
  margin-top: -12px;
  font-size: 1.25em;
  box-shadow: 0px 0px 10px 1px #575757, inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75); }
  @media only screen and (min-width: 768px) {
    #frm-createUpdateProfileForm input[type="submit"] {
      margin-left: 55px; } }
  #frm-createUpdateProfileForm input[type="submit"]:hover {
    box-shadow: 0px 0px 7px 1px #0073CF, inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75); }
  #frm-createUpdateProfileForm input[type="submit"]:focus {
    box-shadow: 0px 0px 7px 1px #0073CF; }
#frm-createUpdateProfileForm .profile-save {
  text-align: right;
  padding: 20px 0;
  margin: 0px auto;
  width: 95px; }
  #frm-createUpdateProfileForm .profile-save input {
    margin: 0px;
    padding: 0px;
    width: 90px;
    height: 90px;
    font-size: 1.8em;
    font-weight: normal; }

_::-webkit-full-page-media, _:future, :root #frm-createUpdateProfileForm input[type="text"] {
  font-variant: normal; }

_::-webkit-full-page-media, _:future, :root #frm-createUpdateProfileForm textarea {
  font-variant: normal; }

#intro-edit {
  margin: 24px 20px; }
  @media only screen and (min-width: 768px) {
    #intro-edit {
      margin: 24px 70px; } }
  #intro-edit img:first-of-type {
    float: left;
    margin-right: 15px;
    margin-top: -10px; }
  #intro-edit img:last-of-type {
    margin-left: 10px;
    margin-bottom: -13px;
    float: right; }
    @media only screen and (min-width: 700px) {
      #intro-edit img:last-of-type {
        float: none; } }
  #intro-edit textarea {
    width: 65%;
    max-width: 360px;
    min-width: 200px; }
    @media only screen and (min-width: 700px) {
      #intro-edit textarea {
        width: 360px; } }

.gamers-row {
  margin: 0px auto;
  min-height: 200px;
  width: 240px; }
  @media only screen and (min-width: 550px) {
    .gamers-row {
      width: 480px; } }
  @media only screen and (min-width: 768px) {
    .gamers-row {
      width: 720px; } }
  .gamers-row .gamers-column {
    float: left;
    width: 240px;
    margin: 0px auto; }
    .gamers-row .gamers-column img {
      border-radius: 100%;
      box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 50px -1px rgba(100, 100, 100, 0.75);
      background: #3D3D3D;
      height: 130px;
      width: 130px;
      border: 2px solid white; }
    .gamers-row .gamers-column p {
      text-align: center;
      font-family: "Poiret One", cursive;
      font-weight: 700;
      font-size: 1.5em;
      color: #0073CF;
      margin: 0px;
      margin-top: 35px; }
      .gamers-row .gamers-column p:last-child {
        margin-top: 10px; }
    .gamers-row .gamers-column:last-child {
      margin-bottom: 20px; }

.rated-games {
  margin: 0px auto;
  margin-top: 20px;
  min-height: 250px;
  width: 240px; }
  @media only screen and (min-width: 550px) {
    .rated-games {
      width: 480px; } }
  @media only screen and (min-width: 768px) {
    .rated-games {
      width: 720px; } }
  .rated-games .rated-game {
    float: left;
    width: 240px;
    margin: 0px auto; }
    .rated-games .rated-game img {
      box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 70px -1px rgba(100, 100, 100, 0.65);
      background: white;
      width: 150px; }
    .rated-games .rated-game p {
      text-align: center;
      font-family: "Poiret One", cursive;
      font-size: 1.3em;
      margin: 0px;
      margin-top: 10px;
      color: white;
      font-weight: 700;
      /*&:last-child {
          background: lighten($black,5);
          box-shadow: 0px 0px 5px 1px lighten($grey,10), inset 0px 10px 40px -1px rgba(100,100,100,0.65);
          border-radius: 30px;
          width: 130px;
          padding: 6px 0px;
          margin: 0px auto 0px auto;
          position: relative;
          z-index: 3;
          left: 20px;
          bottom: 30px;
          color: white;
          font-weight: 500;
      }*/ }
      .rated-games .rated-game p:first-child {
        margin-top: 15px;
        min-height: 45px;
        line-height: 40px;
        color: black; }
        .rated-games .rated-game p:first-child span {
          display: inline-block;
          vertical-align: middle;
          line-height: normal; }
      .rated-games .rated-game p:last-child {
        background: #202020;
        box-shadow: 0px 0px 5px 1px #575757, inset 0px 10px 40px -1px rgba(100, 100, 100, 0.65);
        border-radius: 50%;
        width: 72px;
        font-size: 1.6em;
        padding: 22.8px 0px;
        margin: 0px auto 0px auto;
        position: relative;
        z-index: 3;
        left: 52px;
        bottom: 61px;
        font-weight: 500; }
      .rated-games .rated-game p .active-star {
        color: #e6b800;
        font-weight: 600; }
    .rated-games .rated-game .top-rating {
      color: #ffd11a;
      font-weight: 700; }
  .rated-games .no-notes {
    position: relative;
    top: 100px; }

.no-notes {
  text-align: center;
  font-weight: 900;
  font-size: 1.5em;
  font-family: "Poiret One", cursive;
  color: #575757;
  /*&:last-of-type {
      padding-bottom: 20px;
  }*/ }
  .no-notes span {
    color: #0073CF;
    font-size: 1.2em; }

.note-tape-top {
  display: none;
  position: absolute;
  transform: rotate(-20deg);
  -ms-transform: rotate(-20deg);
  -webkit-transform: rotate(-20deg);
  -o-transform: rotate(-20deg);
  -moz-transform: rotate(-20deg);
  margin-left: -37px; }
  @media only screen and (min-width: 570px) {
    .note-tape-top {
      display: block; } }

.note-tape-down {
  display: none;
  float: right;
  margin-top: -42px;
  margin-right: -53px;
  transform: rotate(-30deg);
  -ms-transform: rotate(-30deg);
  -webkit-transform: rotate(-30deg);
  -o-transform: rotate(-30deg);
  -moz-transform: rotate(-30deg); }
  @media only screen and (min-width: 570px) {
    .note-tape-down {
      display: block; } }

.diary-note, .diary-note-second {
  box-shadow: 0px 0px 10px 1px #575757;
  margin: 10px 20px 25px 20px;
  background: url("../img/linedpaper.png") white repeat scroll;
  background-attachment: scroll;
  transform: rotate(-1deg);
  -ms-transform: rotate(-1deg);
  -webkit-transform: rotate(-1deg);
  -o-transform: rotate(-1deg);
  -moz-transform: rotate(-1deg);
  line-height: 1.77em;
  /*h2 {
      //box-shadow: none;
      background: none;
      margin: 0px 20px;
      color: $blue;
      border-radius: 0px 0px 60px 60px;
  }*/ }
  .diary-note p, .diary-note-second p {
    padding: 0px; }
  .diary-note iframe, .diary-note-second iframe {
    max-width: 100%;
    height: 56.25vw;
    max-height: 315px;
    display: block; }

.diary-margin {
  margin: 0px 20px; }

.diary-note-second {
  transform: rotate(2deg);
  -ms-transform: rotate(2deg);
  -webkit-transform: rotate(2deg);
  -o-transform: rotate(2deg);
  -moz-transform: rotate(2deg); }
  .diary-note-second .note-tape-top {
    transform: rotate(-70deg);
    -ms-transform: rotate(-70deg);
    -webkit-transform: rotate(-70deg);
    -o-transform: rotate(-70deg);
    -moz-transform: rotate(-70deg);
    margin-top: 15px;
    margin-left: -68px; }
  .diary-note-second .note-tape-down {
    transform: rotate(-15deg);
    -ms-transform: rotate(-15deg);
    -webkit-transform: rotate(-15deg);
    -o-transform: rotate(-15deg);
    -moz-transform: rotate(-15deg);
    margin-right: -30px;
    margin-top: -38px; }

.note-rating {
  text-align: center;
  margin: 0px;
  padding: 0px;
  font-family: "Poiret One", cursive;
  font-size: 1.5em;
  font-weight: 800; }
  .note-rating span {
    position: relative;
    bottom: 8px;
    color: #018807; }
    .note-rating span:last-child {
      color: #EC0101; }
  .note-rating .grey {
    color: #707070; }
    .note-rating .grey:last-child {
      color: #707070; }

.note-tag {
  background: #3D3D3D;
  color: white;
  padding: 7.5px 12px;
  padding-left: 0px;
  font-size: 1.15em;
  font-family: "Poiret One", cursive;
  font-weight: 800;
  margin: 0px 20px; }
  .note-tag img {
    position: relative;
    right: 17px;
    top: 12px; }

.note-tags {
  margin-top: 0px;
  margin-bottom: 30px; }

#new-note-href {
  color: #038fff;
  font-family: "Poiret One", cursive;
  font-size: 2.5em;
  background: #3D3D3D;
  text-align: center;
  border-radius: 15px;
  font-size: 1.3em;
  padding: 15px;
  margin: 0px auto;
  margin-bottom: 20px;
  width: 190px;
  font-weight: 800;
  box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 50px -1px rgba(40, 40, 40, 0.65);
  display: block;
  cursor: pointer;
  font-variant: normal;
  margin-top: 30px;
  transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out; }
  #new-note-href:hover {
    box-shadow: 0px 0px 20px 1px #3D3D3D, inset 0px 20px 50px -1px rgba(20, 20, 20, 0.65);
    transition: all 0.5s ease-out;
    -ms-transition: all 0.5s ease-out;
    -webkit-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out; }

#frm-createEditNoteForm table {
  width: 95%;
  max-width: 557px;
  margin: 20px auto 10px auto; }
  @media only screen and (min-width: 768px) {
    #frm-createEditNoteForm table {
      float: left;
      margin-left: 30px;
      margin-right: 20px; } }
#frm-createEditNoteForm th {
  text-align: left;
  max-width: 200px;
  width: 150px; }
  @media only screen and (min-width: 768px) {
    #frm-createEditNoteForm th {
      padding-right: 10px; } }
#frm-createEditNoteForm input[type="text"] {
  width: 85%;
  min-width: 155px; }
  @media only screen and (min-width: 768px) {
    #frm-createEditNoteForm input[type="text"] {
      width: 360px; } }
#frm-createEditNoteForm input[type="submit"] {
  font-family: "Poiret One", cursive;
  width: 90px;
  height: 90px;
  font-size: 1.9em;
  font-weight: 500;
  padding: 0px; }
#frm-createEditNoteForm #diary-submit {
  margin: 10px auto;
  padding: 0px;
  padding-bottom: 20px;
  width: 90px; }
  @media only screen and (min-width: 768px) {
    #frm-createEditNoteForm #diary-submit {
      float: left;
      margin: 10px 10px 10px 0px;
      padding: 0px; } }
#frm-createEditNoteForm .wysibb {
  min-width: 255px;
  width: 90%;
  height: 300px;
  max-height: 300px;
  margin: 10px 0px;
  font-weight: normal; }
  @media only screen and (min-width: 768px) {
    #frm-createEditNoteForm .wysibb {
      width: 600px;
      margin: 20px 0px; } }
#frm-createEditNoteForm textarea {
  height: 290px;
  max-height: 290px;
  overflow: scroll;
  overflow-x: auto;
  border: none;
  box-shadow: none;
  border-radius: 0px; }
  @media only screen and (min-width: 768px) {
    #frm-createEditNoteForm textarea {
      height: 250px;
      max-height: 250px;
      width: 545px;
      max-width: 545px; } }
#frm-createEditNoteForm .wysibb-text-editor {
  height: 250px;
  max-height: 250px;
  overflow: scroll;
  overflow-x: auto; }
@media only screen and (max-width: 768px) {
  #frm-createEditNoteForm .wysibb .wysibb-toolbar {
    height: 300px; } }

/* 
    Created on : 3.7.2016, 23:20:19
    Author     : Martin
*/
nav {
  width: 100%;
  position: fixed;
  z-index: 11;
  top: 0px; }
  nav ul {
    width: 100%;
    list-style-type: none; }
    nav ul li {
      width: 100%;
      height: 45px;
      padding-top: 15px;
      text-align: center;
      font: 1.8em "Poiret One", cursive;
      color: #0073CF; }
      nav ul li a {
        color: #0073CF;
        text-decoration: none;
        font-weight: 500;
        display: block;
        font-variant: normal;
        text-shadow: 0px 0px 2px #0065b6; }
      nav ul li:hover {
        border-top: 3.5px solid #0073CF;
        padding-top: 13px;
        height: 43.5px;
        background: #3D3D3D;
        color: #038fff;
        box-shadow: inset 0px 20px 114px -1px rgba(0, 0, 0, 0.75); }
        nav ul li:hover a {
          color: #038fff; }
    nav ul #logo {
      width: 70px;
      cursor: pointer;
      background: url("../img/logo_small.png") #3D3D3D no-repeat;
      height: 55px;
      border-radius: 0px 0px 100px 0px;
      box-shadow: 0px 0px 7px 1px #131313; }
      nav ul #logo:hover {
        border: none;
        transform: skewX(0deg);
        -ms-transform: skewX(0deg);
        -webkit-transform: skewX(0deg);
        -o-transform: skewX(0deg);
        -moz-transform: skewX(0deg);
        height: 57px; }
      nav ul #logo a {
        display: none; }
  nav #user-panel {
    position: fixed;
    top: 40px;
    right: 50%;
    margin-right: -150px;
    padding: 0px;
    width: 300px;
    text-align: right; }
    nav #user-panel #userMenu {
      display: none;
      text-align: left;
      font-size: 0.99em;
      font-weight: 600;
      color: black; }
      nav #user-panel #userMenu form {
        padding-bottom: 0px;
        margin-bottom: 10px; }
        nav #user-panel #userMenu form label {
          font-family: "Poiret One", cursive; }
      nav #user-panel #userMenu h2 {
        box-shadow: inset 0px 10px 30px -1px rgba(80, 80, 80, 0.75);
        padding: 9px; }
      nav #user-panel #userMenu p {
        padding-bottom: 10px; }
      nav #user-panel #userMenu .menu_href {
        padding: 10px 0px; }
        nav #user-panel #userMenu .menu_href a {
          font-variant: normal; }
      nav #user-panel #userMenu #social-login {
        text-align: center;
        height: 40px;
        margin: 0px auto; }
        nav #user-panel #userMenu #social-login a {
          width: 140px;
          float: left;
          padding: 0px;
          margin: 0px 0px;
          margin-top: -10px; }
          nav #user-panel #userMenu #social-login a img {
            width: 90%;
            height: 90%; }
          nav #user-panel #userMenu #social-login a .login-text {
            font-family: "Raleway", sans-serif;
            font-size: 1.35em;
            font-variant: small-caps;
            position: relative;
            bottom: 35px;
            left: 7px; }
      nav #user-panel #userMenu .notif {
        width: 230px;
        height: 32px;
        margin: 20px 25px;
        padding: 0px 10px;
        text-align: left;
        border-bottom: 1px dotted #131313;
        font-size: 1.2em;
        line-height: 2.0em;
        background: url("../img/notification.png") 95% top no-repeat; }
        nav #user-panel #userMenu .notif a {
          color: black;
          text-shadow: none;
          font-weight: 700;
          font-variant: normal;
          font-family: "Poiret One", cursive; }
          nav #user-panel #userMenu .notif a:hover {
            text-shadow: 0px 0px 6px #707070;
            transition: text-shadow 0.3s, font-weight 0.2s;
            -ms-transition: text-shadow 0.3s, font-weight 0.2s;
            -webkit-transition: text-shadow 0.3s, font-weight 0.2s;
            -o-transition: text-shadow 0.3s, font-weight 0.2s;
            -moz-transition: text-shadow 0.3s, font-weight 0.2s; }
      nav #user-panel #userMenu .message {
        background: url("../img/message.png") 95% top no-repeat; }
  nav #avatar-panel {
    position: absolute;
    top: 0px;
    right: 0px;
    padding: 0px; }
    nav #avatar-panel #avatar {
      width: 60px;
      background: #3D3D3D;
      height: 60px;
      box-shadow: 0px 0px 7px 1px #131313, inset 0px 20px 50px -1px rgba(100, 100, 100, 0.75);
      cursor: pointer;
      border-radius: 0px 0px 0px 100px;
      padding: 0px 0px 10px 10px; }
    nav #avatar-panel #news_number {
      font-size: 1.15em; }
  @media only screen and (min-width: 850px) {
    nav {
      background: #e3e3e3;
      box-shadow: inset 0px 20px 70px -1px rgba(130, 130, 130, 0.65); }
      nav ul h2 {
        display: none; }
      nav ul li {
        float: left;
        width: 130px; }
        nav ul li:hover {
          transform: skewX(150deg);
          -ms-transform: skewX(150deg);
          -webkit-transform: skewX(150deg);
          -o-transform: skewX(150deg);
          -moz-transform: skewX(150deg); }
          nav ul li:hover a {
            transform: skewX(-150deg);
            -ms-transform: skewX(-150deg);
            -webkit-transform: skewX(-150deg);
            -o-transform: skewX(-150deg);
            -moz-transform: skewX(-150deg); }
      nav ul #logo {
        height: 45px;
        box-shadow: none;
        background-color: #0073CF; }
        nav ul #logo:hover {
          height: 47px; }
        nav ul #logo a {
          display: block; }
      nav #user-panel {
        position: absolute;
        top: 65px;
        right: 20px;
        margin-right: 0px; }
      nav #avatar-panel {
        right: 20px; }
        nav #avatar-panel #avatar {
          border-radius: 0px;
          padding: 0px;
          box-shadow: inset 0px 20px 50px -1px rgba(100, 100, 100, 0.75); } }
  @media only screen and (min-width: 1200px) {
    nav ul li {
      width: 170px; }
    nav ul #logo {
      width: 260px;
      margin-right: 10px;
      background: url("../img/logo.png") #0073CF no-repeat; } }

.menu_href {
  margin: 0px;
  background: #131313;
  box-shadow: 0px 0px 7px 1px #131313, inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75);
  text-align: center;
  font-family: "Raleway", sans-serif; }
  .menu_href a {
    font-size: 1.3em;
    padding-top: 10px; }
  .menu_href:hover {
    box-shadow: 0px 0px 7px 1px #131313; }
  .menu_href:last-child {
    border-radius: 0px 0px 5px 5px; }

.menu_items {
  width: 300px;
  margin: 0px auto;
  display: none;
  background: url("../img/crossword.png") white repeat fixed;
  box-shadow: 0px 0px 20px 1px #575757;
  border-radius: 5px;
  border: 1px solid #3D3D3D; }
  .menu_items #hidden-item {
    margin-top: 7px; }
  @media only screen and (min-width: 850px) {
    .menu_items {
      width: 650px;
      display: block;
      box-shadow: none;
      background: none;
      border-radius: none;
      border: none; }
      .menu_items #hidden-item {
        display: none; } }
  @media only screen and (min-width: 1200px) {
    .menu_items {
      width: 1070px; } }

.cz-language, .en-language {
  position: fixed;
  bottom: 80px;
  left: -10px;
  z-index: 10;
  transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  width: 35px;
  height: 35px; }
  .cz-language:hover, .en-language:hover {
    left: -5px; }

.en-language {
  /*bottom: -15px;
  left: 15px;
  z-index: 9;
  &:hover {
      z-index: 10;
      left: 15px;
      bottom: -7px;
  }*/
  bottom: 45px; }

/*width: 100%;
    background: lighten($grey, 65);
    position: fixed;
    z-index: 11;
    top: 0px;
    box-shadow: inset 0px 20px 70px -1px rgba(130,130,130,0.65);
    ul {
        list-style-type: none;
        li {
            float: left;
            width: 170px;
            height: 45px;
            padding-top: 15px;
            text-align: center;
            font: 1.8em $h_font;
            color: $blue;
            a {
                color: $blue;
                text-decoration: none;
                font-weight: 500;
                display: block;
                font-variant: normal;
                text-shadow: 0px 0px 2px darken($blue,5);
            }
            &:hover {
                border-top: 3.5px solid $blue;
                padding-top: 13px;
                height: 44px;
                background: $grey;
                color: lighten($blue,10);
                @include skewX(150deg);
                box-shadow: inset 0px 20px 114px -1px rgba(0,0,0,0.75);
                a {
                    color: lighten($blue,10);
                    @include skewX(-150deg);
                }
            }
            &:last-child {
                position: absolute;
                right: 20px;
                padding: 0px;
                width: 300px;
                text-align: right;
                &:hover {
                    padding: 0px;
                    border: none;
                    height: 60px;
                    @include skewX(0deg);
                    background: none;
                    box-shadow: none;
                    #news_number {
                        right: 36px;
                    }
                }
                a {
                    @include skewX(0deg);
                    color: lighten($blue,10);
                }
                img {
                    text-align: right;
                    width: 60px;
                    background: $grey;
                    height: 60px;
                    box-shadow: inset 0px 20px 50px -1px rgba(100,100,100,0.75);
                    cursor: pointer;
                }
                div {
                    display: none;
                    text-align: left;
                    font-size: 0.55em;
                    font-weight: 600;
                    color: black;
                    form {
                        padding-bottom: 0px;
                        margin-bottom: 0px;
                    }
                    h2 {
                        box-shadow: inset 0px 10px 30px -1px rgba(80,80,80,0.75);
                        padding: 9px;
                    }
                    p {
                        padding-bottom: 10px;
                    }
                    img {
                        box-shadow: none;
                        background: none;
                    }
                    #social-login {
                        //margin-top: -30px;
                        text-align: center;
                        //width: 300px;
                        height: 40px;
                        margin: 0px auto;
                            a {
                            width: 140px;
                            float: left;
                            padding: 0px;
                            margin: 0px 0px;
                            margin-top: -10px;
                            img {
                                width: 90%;
                                height: 90%;
                            }
                            .login-text {
                                font-family: $text_font;
                                font-size: 1.35em;
                                font-variant: small-caps;
                                position: relative;
                                //font-weight: 700;
                                bottom: 35px;
                                left: 7px;
                            }
                        }
                    }
                    .notif {
                        width: 230px;
                        height: 32px;
                        margin: 20px 25px;
                        padding: 0px 10px;
                        text-align: left;
                        border-bottom: 1px dotted $black;
                        font-size: 1.2em;
                        line-height: 2.0em;
                        background: url("../img/notification.png") 95% top no-repeat;
                        a {
                            color: black;
                            text-shadow: none;
                            font-weight: 700;
                            &:hover {
                                text-shadow: 0px 0px 6px lighten($grey, 20);
                                @include a_transition();
                            }
                        }
                    }
                    .message {
                        background: url("../img/message.png") 95% top no-repeat;
                    }
                }
            }
        }
        #logo {
            width: 260px;
            margin-right: 10px;
            background: url("../img/logo.png") $blue no-repeat;
            height: 45px;
            border-radius: 0px 0px 100px 0px;
            box-shadow: inset 0px 20px 70px -1px rgba(100,100,100,0.65);
            &:hover {
                border: none;
                @include skewX(0deg);
                height: 47px;
            }
        }
    }*/
/* 
    Created on : 7.6.2017, 15:37:49
    Author     : Martin
*/
#released-soon .released-soon-games, #released-soon .owned-platforms-box, #owned-platforms .released-soon-games, #owned-platforms .owned-platforms-box {
  padding: 15px; }
#released-soon .released-soon-game, #released-soon .owned-platforms-platform, #owned-platforms .released-soon-game, #owned-platforms .owned-platforms-platform {
  padding: 7px 0px;
  border-bottom: 1px dotted #3D3D3D; }
  #released-soon .released-soon-game:first-child, #released-soon .owned-platforms-platform:first-child, #owned-platforms .released-soon-game:first-child, #owned-platforms .owned-platforms-platform:first-child {
    padding-top: 0px; }
#released-soon .released-soon-game:last-child, #owned-platforms .released-soon-game:last-child {
  border: none;
  padding-bottom: 0px; }
#released-soon .owned-platforms-platform, #owned-platforms .owned-platforms-platform {
  padding: 7px 5px 0px 5px;
  font-size: 1.15em; }
#released-soon p, #owned-platforms p {
  margin: 0px;
  padding: 0px;
  font-size: 1.1em;
  font-weight: 700;
  font-family: "Poiret One", cursive; }
#released-soon .released-soon-title, #owned-platforms .released-soon-title {
  margin-left: 90px; }
#released-soon .released-soon-date, #owned-platforms .released-soon-date {
  float: left;
  width: 90px; }
#released-soon .owned-platforms-name, #owned-platforms .owned-platforms-name {
  float: left;
  width: 140px; }
#released-soon .owned-platforms-number, #owned-platforms .owned-platforms-number {
  margin-left: 150px;
  font-size: 1.0em;
  font-variant: small-caps; }
  #released-soon .owned-platforms-number span, #owned-platforms .owned-platforms-number span {
    min-width: 45px;
    float: left;
    text-align: right;
    margin-right: 7px; }

_::-webkit-full-page-media, _:future, :root #owned-platforms .owned-platforms-number {
  font-variant: normal;
  text-transform: uppercase;
  font-size: 0.8em; }

#new-comments .new-comments-comments, #user-last-comments .new-comments-comments {
  padding: 15px; }
#new-comments p, #user-last-comments p {
  margin: 0px;
  padding: 0px; }
#new-comments .new-comment, #user-last-comments .new-comment {
  padding: 7px 0px;
  border-bottom: 1px dotted #3D3D3D; }
  #new-comments .new-comment:first-child, #user-last-comments .new-comment:first-child {
    padding-top: 0px; }
  #new-comments .new-comment:last-child, #user-last-comments .new-comment:last-child {
    border: none;
    padding-bottom: 0px; }
#new-comments .new-comment-user, #user-last-comments .new-comment-user {
  float: left;
  text-align: center;
  position: relative;
  right: 3px; }
  #new-comments .new-comment-user img, #user-last-comments .new-comment-user img {
    border-radius: 100%;
    box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 50px -1px rgba(100, 100, 100, 0.75);
    background: #3D3D3D;
    height: 45px;
    width: 45px;
    border: 2px solid white; }
  #new-comments .new-comment-user .new-comment-picture, #user-last-comments .new-comment-user .new-comment-picture {
    margin-top: 3px; }
  #new-comments .new-comment-user .new-comment-author, #user-last-comments .new-comment-user .new-comment-author {
    margin-top: 1px;
    font-size: 1.0em;
    overflow-x: hidden;
    text-overflow: ellipsis;
    width: 63px; }
#new-comments .new-comment-text, #user-last-comments .new-comment-text {
  margin-left: 70px; }
  #new-comments .new-comment-text p, #user-last-comments .new-comment-text p {
    margin-top: 3px; }
  #new-comments .new-comment-text .new-comment-publication, #user-last-comments .new-comment-text .new-comment-publication {
    font-family: "Poiret One", cursive;
    font-weight: 700;
    font-size: 1.05em; }
  #new-comments .new-comment-text .new-comment-date, #user-last-comments .new-comment-text .new-comment-date {
    margin-top: 5px;
    text-align: right;
    font-family: "Poiret One", cursive;
    color: #3D3D3D;
    font-weight: 700;
    font-size: 0.7em; }

#user-last-comments .new-comment-text {
  margin-left: 90px; }
#user-last-comments .new-comment-publication-preview {
  float: left;
  width: 80px;
  margin-top: 3px; }
  #user-last-comments .new-comment-publication-preview img {
    border-radius: 5.5px;
    box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 70px -1px rgba(100, 100, 100, 0.65);
    background: #0073CF;
    width: 100%;
    height: 100%; }

#publication-author {
  padding-bottom: 25px; }
  #publication-author .author-preview {
    text-align: center;
    margin-top: 20px; }
    #publication-author .author-preview img {
      background-color: #a3a3a3;
      width: 130px;
      border: 3px solid white;
      border-radius: 100%;
      box-shadow: 0px 0px 20px 1px #575757; }
  #publication-author .author-name {
    text-align: center;
    font-family: "Poiret One", cursive;
    font-size: 1.5em;
    font-weight: 700;
    margin-top: 5px;
    color: #131313;
    padding-bottom: 0px;
    font-variant: normal; }
  #publication-author .author-info {
    margin: 15px 25px 0px 15px;
    text-align: justify;
    padding: 0px;
    border-bottom: 1px solid #8a8a8a; }
    #publication-author .author-info p {
      border-left: 1px solid #8a8a8a;
      font-size: 0.85em;
      font-family: "Poiret One", cursive;
      font-weight: 700;
      color: #575757;
      margin: 0px 0px -10px 10px;
      padding: 5px 10px 20px 10px; }

#new-games, #new-studios {
  padding: 15px; }
  #new-games p, #new-studios p {
    padding: 0px;
    margin: 0px; }
  #new-games .new-game-box, #new-games .new-studio-box, #new-studios .new-game-box, #new-studios .new-studio-box {
    padding: 10px 5px;
    border-bottom: 1px dotted #3D3D3D; }
    #new-games .new-game-box:first-child, #new-games .new-studio-box:first-child, #new-studios .new-game-box:first-child, #new-studios .new-studio-box:first-child {
      padding-top: 0px; }
    #new-games .new-game-box:last-child, #new-games .new-studio-box:last-child, #new-studios .new-game-box:last-child, #new-studios .new-studio-box:last-child {
      border: none;
      padding-bottom: 0px; }
  #new-games .new-game-boxart, #new-games .new-studio-logo, #new-studios .new-game-boxart, #new-studios .new-studio-logo {
    float: left;
    width: 50px; }
  #new-games .new-game-boxart img, #new-studios .new-game-boxart img {
    box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 70px -1px rgba(100, 100, 100, 0.65);
    background: white;
    width: 50px;
    border-radius: 5.5px; }
  #new-games .new-studio-logo img, #new-studios .new-studio-logo img {
    box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 70px -1px rgba(100, 100, 100, 0.65);
    background: white;
    width: 45px;
    transform: rotate(5deg);
    -ms-transform: rotate(5deg);
    -webkit-transform: rotate(5deg);
    -o-transform: rotate(5deg);
    -moz-transform: rotate(5deg);
    transition: all 0.7s ease-out;
    -ms-transition: all 0.7s ease-out;
    -webkit-transition: all 0.7s ease-out;
    -o-transition: all 0.7s ease-out;
    -moz-transition: all 0.7s ease-out; }
  #new-games .new-game-name, #new-games .new-studio-name, #new-studios .new-game-name, #new-studios .new-studio-name {
    margin-left: 65px;
    font-family: "Poiret One", cursive;
    font-weight: 700;
    font-size: 1.15em;
    margin-bottom: 5px; }
  #new-games .new-game-description, #new-games .new-studio-description, #new-studios .new-game-description, #new-studios .new-studio-description {
    margin-left: 65px; }

#best-games {
  padding: 15px; }
  #best-games .best-games-game {
    padding: 10px 0px;
    border-bottom: 1px dotted #3D3D3D;
    width: 100%; }
    #best-games .best-games-game:first-child {
      padding-top: 0px; }
    #best-games .best-games-game:last-child {
      border: none;
      padding-bottom: 0px; }
    #best-games .best-games-game:hover {
      transition: all 0.2s;
      -ms-transition: all 0.2s;
      -webkit-transition: all 0.2s;
      -o-transition: all 0.2s;
      -moz-transition: all 0.2s; }
      #best-games .best-games-game:hover .best-games-rating {
        box-shadow: 0px 0px 20px 1px #575757, inset 0px 30px 90px -1px rgba(30, 30, 30, 0.65); }
  #best-games .best-games-rank {
    float: left;
    text-align: right;
    vertical-align: middle;
    font-family: "Poiret One", cursive;
    width: 25px;
    margin-right: 12px;
    font-weight: 700;
    color: #131313;
    display: table;
    min-height: 65px; }
    #best-games .best-games-rank p {
      display: table-cell;
      vertical-align: middle;
      padding: 0px;
      font-size: 1.5em; }
  #best-games .best-games-name {
    text-align: left;
    vertical-align: middle;
    font-family: "Poiret One", cursive;
    font-weight: 700;
    display: table;
    min-height: 65px; }
    #best-games .best-games-name p {
      display: table-cell;
      vertical-align: middle;
      padding: 0px;
      font-size: 1.25em; }
  #best-games .best-games-rating {
    float: right;
    display: table;
    border-spacing: 3px;
    text-align: center;
    background: #0073CF;
    width: 59px;
    height: 59px;
    border-radius: 100%;
    border: 2px solid white;
    box-shadow: 0px 0px 20px 1px #575757, inset 0px 30px 90px -1px rgba(0, 0, 0, 0.9);
    margin: 0px 15px;
    font-family: "Poiret One", cursive;
    font-weight: 700;
    color: white;
    font-size: 0.70em;
    transition: all 0.2s;
    -ms-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    -moz-transition: all 0.2s; }
    #best-games .best-games-rating .best-games-number {
      display: table-cell;
      text-align: center;
      vertical-align: middle;
      border-radius: 100%;
      border: 1px solid white;
      padding: 10px; }
      #best-games .best-games-rating .best-games-number span {
        display: block;
        padding-bottom: 3px;
        border-bottom: 1px solid white;
        margin-bottom: 3px; }

#last-ratings {
  padding: 15px; }
  #last-ratings .last-ratings-box {
    padding: 7px 10px 0px 8px;
    font-size: 1.15em;
    border-bottom: 1px dotted #3D3D3D; }
    #last-ratings .last-ratings-box:first-child {
      padding-top: 0px; }
  #last-ratings p {
    margin: 0px;
    padding: 0px;
    font-family: "Poiret One", cursive;
    font-weight: 700;
    font-size: 1.1em; }
  #last-ratings .last-ratings-nick {
    margin-right: 125px;
    padding-top: 5px; }
  #last-ratings .last-ratings-stars {
    float: right;
    font-size: 1.3em;
    text-shadow: 0px 0px 7px #131313; }
    #last-ratings .last-ratings-stars .active-star {
      color: #FFCC00; }

#this-day-text {
  font-size: 1.2em;
  font-family: "Poiret One", cursive;
  font-weight: 700;
  color: #515151;
  text-align: center;
  padding: 15px;
  margin-top: 5px; }

#this-day-clock {
  float: left;
  margin: 0px;
  padding: 10px 10px 10px 15px; }

#related-tweets {
  padding: 0px 15px;
  margin-top: 10px;
  max-height: 350px;
  overflow-y: scroll;
  overflow: auto;
  padding-right: 6px; }

#related-tweets-sidebox {
  padding-bottom: 10px; }

#fb-sidebox, #instagram-sidebox, #twitter-sidebox {
  padding: 15px; }

#instagram-sidebox h2 {
  background: none;
  box-shadow: none; }

#fb-sidebox {
  text-align: center; }

/* 
    Created on : 23.6.2017, 16:10:29
    Author     : Martin
*/
footer {
  padding: 0px 18px;
  color: #cccccc;
  background: #131313;
  box-shadow: inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75);
  font-family: "Poiret One", cursive; }
  footer p {
    margin: 0px;
    padding: 0px;
    float: left; }
  footer #footer-rights {
    margin: 10px 0px 6px 0px;
    width: 70%; }
  footer #footer-social-buttons {
    text-align: right;
    width: 30%;
    margin: 7px 0px 4px 0px; }
    footer #footer-social-buttons img {
      width: 22.8px;
      height: 22.8px;
      margin-right: 2px; }

#sticky-footer {
  min-height: 90vh; }

/* 
    Created on : 9.7.2016, 22:47:35
    Author     : Martin
*/
form ::-webkit-input-placeholder {
  font-family: "Poiret One", cursive; }
form ::-moz-placeholder {
  font-family: "Poiret One", cursive; }
form :-ms-input-placeholder {
  font-family: "Poiret One", cursive; }
form input:-moz-placeholder {
  font-family: "Poiret One", cursive; }
form input {
  background: white;
  border-radius: 100px;
  box-shadow: 0px 0px 7px 1px #575757;
  border: none;
  height: 22px;
  padding-left: 9px;
  margin: 4px 0px;
  font-family: "Raleway", sans-serif; }
  form input:hover {
    box-shadow: 0px 0px 7px 1px #242424;
    border: 0px; }
  form input:focus {
    box-shadow: 0px 0px 7px 1px #0073CF;
    border: 0px;
    outline: none; }
form select {
  margin: 4px 0px; }
form input[type="checkbox"] {
  appearance: none;
  -ms-appearance: none;
  -webkit-appearance: none;
  -o-appearance: none;
  -moz-appearance: none;
  box-shadow: 0px 0px 7px 1px #575757;
  height: 23px;
  width: 23px;
  border: none;
  border-radius: 100%;
  display: inline-block;
  position: relative;
  vertical-align: middle;
  bottom: 2px;
  margin-right: 10px;
  transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out; }
  form input[type="checkbox"]:hover {
    box-shadow: 0px 0px 7px 1px #242424; }
  form input[type="checkbox"]:focus {
    box-shadow: 0px 0px 7px 1px #0073CF; }
  form input[type="checkbox"]:checked {
    box-shadow: 0px 0px 7px 1px #0073CF, inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75);
    background: #131313; }
    form input[type="checkbox"]:checked:after {
      content: '\2714';
      font-size: 1.8em;
      position: absolute;
      left: 4px;
      top: -7px;
      color: #0073CF; }
form input[type="number"] {
  width: 30px;
  height: 30px; }
form input[type="submit"] {
  text-align: center;
  vertical-align: middle;
  border-radius: 100%;
  border: none;
  background: #131313;
  box-shadow: inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75);
  font: "Poiret One", cursive;
  font-weight: 700;
  color: #0073CF;
  transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  transition: all 0.7s ease-out;
  -ms-transition: all 0.7s ease-out;
  -webkit-transition: all 0.7s ease-out;
  -o-transition: all 0.7s ease-out;
  -moz-transition: all 0.7s ease-out;
  cursor: pointer; }
  form input[type="submit"]:hover {
    box-shadow: 0px 0px 7px 1px #0073CF, inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75);
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    transition: all 0.7s ease-out;
    -ms-transition: all 0.7s ease-out;
    -webkit-transition: all 0.7s ease-out;
    -o-transition: all 0.7s ease-out;
    -moz-transition: all 0.7s ease-out; }
  form input[type="submit"]:focus {
    box-shadow: 0px 0px 7px 1px #0073CF; }
form select {
  border-radius: 100px;
  box-shadow: 0px 0px 7px 1px #575757;
  border: none;
  height: 25px;
  padding-left: 9px;
  padding-right: 25px;
  font-family: "Raleway", sans-serif;
  appearance: none;
  -ms-appearance: none;
  -webkit-appearance: none;
  -o-appearance: none;
  -moz-appearance: none;
  background: url("../img/arrow.png") white no-repeat right center; }
  form select:hover {
    box-shadow: 0px 0px 7px 1px #242424;
    border: 0px;
    background: url("../img/arrow_hover.png") white no-repeat right center; }
  form select:focus {
    box-shadow: 0px 0px 7px 1px #0073CF;
    border: 0px;
    outline: none;
    background: url("../img/arrow_hover.png") white no-repeat right center; }
form textarea {
  border-radius: 15px;
  box-shadow: 0px 0px 7px 1px #575757;
  border: none;
  height: 60px;
  padding: 5px 9px;
  font-family: "Raleway", sans-serif; }
  form textarea:hover {
    box-shadow: 0px 0px 7px 1px #242424;
    border: 0px; }
  form textarea:focus {
    box-shadow: 0px 0px 7px 1px #0073CF;
    border: 0px;
    outline: none; }

.registration {
  margin: 30px auto 0px auto;
  padding-bottom: 1px;
  max-width: 400px; }
  @media only screen and (min-width: 600px) {
    .registration {
      max-width: 600px; } }
  @media only screen and (max-width: 400px) {
    .registration table input {
      width: 160px; } }
  @media only screen and (min-width: 600px) {
    .registration table {
      float: left; } }
  .registration th {
    width: 140px; }
  .registration input {
    width: 200px; }
  .registration input[type="submit"] {
    width: 120px;
    height: 120px;
    padding: 0px;
    font: 1.3em "Poiret One", cursive;
    font-weight: 700;
    box-shadow: inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75); }
  .registration #registration-submit, .registration #change-submit, .registration #renew-submit {
    margin: 20px auto;
    padding: 0px;
    width: 120px; }
    @media only screen and (min-width: 600px) {
      .registration #registration-submit, .registration #change-submit, .registration #renew-submit {
        float: right;
        margin: 20px 20px 20px 0px;
        padding: 9px 0px; } }
  .registration #change-submit {
    margin: 0px auto; }
    @media only screen and (min-width: 600px) {
      .registration #change-submit {
        margin: 0px 20px 0px 0px; } }
  .registration #renew-submit {
    margin: 0px auto; }
    @media only screen and (min-width: 600px) {
      .registration #renew-submit {
        margin: -20px 20px 0px 0px; } }

#sidebox-login-table {
  margin: 0px auto; }

#stay_logged {
  padding-top: 5px;
  font-size: 1.15em; }

.login_submit {
  width: 75px;
  height: 75px;
  margin-left: 15px;
  text-align: center;
  font: 1em "Poiret One", cursive;
  box-shadow: inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75);
  padding: 0px; }

#frm-createLoginForm {
  margin: 8px;
  margin-left: 15px;
  padding-bottom: 10px; }

@media only screen and (min-width: 768px) {
  #frm-createEditPlatformForm select, #frm-createEditGameForm select {
    width: 409px; } }

.preview_img {
  margin-left: 20px;
  box-shadow: 0px 0px 7px 1px #575757; }

.preview_studio {
  width: 120px;
  height: 120px;
  margin-left: 40px;
  text-align: center;
  box-shadow: 0px 0px 7px 1px #575757;
  border-radius: 100%;
  border: none; }

@media only screen and (min-width: 768px) {
  #frm-createEditReviewForm-conclusionCs, #frm-createEditReviewForm-conclusionEn {
    height: 120px;
    min-width: 600px; } }
@media only screen and (min-width: 1100px) {
  #frm-createEditReviewForm-conclusionCs, #frm-createEditReviewForm-conclusionEn {
    min-width: 750px; } }

#frm-searchForm {
  margin: 0px 15px; }
  #frm-searchForm p {
    margin: 0px;
    padding: 0px; }
  #frm-searchForm input[type="text"] {
    width: 78%;
    margin: 20px 0px;
    padding: 5px 10px;
    border-radius: 5px 0px 0px 5px; }
  #frm-searchForm button[type="submit"] {
    height: 32px;
    width: 35px;
    position: relative;
    bottom: 2px;
    text-align: center;
    vertical-align: middle;
    border: none;
    background: #131313;
    box-shadow: 0px 0px 7px 1px #575757, inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75);
    font-weight: 700;
    color: #0073CF;
    cursor: pointer;
    border-radius: 0px 5px 5px 0px; }
    #frm-searchForm button[type="submit"]:hover {
      box-shadow: 0px 0px 7px 1px #0073CF, inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75); }
    #frm-searchForm button[type="submit"]:focus {
      box-shadow: 0px 0px 7px 1px #0073CF; }

#frm-searchForm {
  margin: 0px 20px; }
  #frm-searchForm #search-default-form {
    margin: 25px 0px; }
    #frm-searchForm #search-default-form button[type="submit"] {
      bottom: 1px; }

/* 
    Created on : 9.7.2016, 21:07:49
    Author     : Martin Toul
*/
.flash {
  min-width: 280px;
  background: #EC0101;
  padding: 10px;
  margin-top: 30px;
  box-shadow: 0px 0px 20px 1px #575757;
  border-radius: 5px;
  font-variant: small-caps;
  font-weight: 700;
  font-size: 1.2em;
  text-align: center; }
  @media only screen and (min-width: 768px) {
    .flash {
      width: 730px; } }
  @media only screen and (min-width: 1100px) {
    .flash {
      width: 1060px; } }

_::-webkit-full-page-media, _:future, :root .flash {
  font-variant: normal; }

/* 
    Created on : 8.10.2016, 0:33:17
    Author     : Martin
*/
#comments {
  min-width: 300px;
  margin: 0px;
  margin-bottom: 40px;
  box-shadow: 0px 0px 20px 1px #575757;
  border-radius: 5px;
  border: none;
  text-align: justify;
  background: url("../img/crossword.png") white repeat fixed;
  padding-bottom: 20px; }
  @media only screen and (min-width: 768px) {
    #comments {
      width: 750px;
      margin: 0px 30px 40px 0px;
      padding-bottom: 0px; } }
  #comments ul, #comments ol {
    margin-left: 40px; }
  #comments h1 {
    border-radius: 0px 0px 100px 100px;
    background: #0073CF;
    color: #131313;
    box-shadow: inset 0px 20px 60px -1px rgba(80, 80, 80, 0.8);
    padding: 10px 0px;
    margin: 0 20px;
    font-size: 1.8em;
    font-variant: normal; }
  #comments p {
    padding: 0px 10px; }
  #comments .comment_content {
    margin-top: 10px; }
    @media only screen and (min-width: 500px) {
      #comments .comment_content {
        margin-left: 100px;
        margin-right: 10px; } }
    #comments .comment_content img {
      max-width: 100%; }
    #comments .comment_content iframe {
      max-width: 100%;
      height: 56.25vw;
      max-height: 315px;
      display: block; }
  #comments input[type="submit"] {
    width: 110px;
    height: 110px;
    margin: 0px auto;
    display: block;
    font-size: 2.0em;
    font-weight: 500;
    font-family: "Poiret One", cursive;
    box-shadow: 0px 0px 7px 1px #575757, inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75); }
    @media only screen and (min-width: 768px) {
      #comments input[type="submit"] {
        margin: 38px 0px;
        display: initial; } }
  #comments textarea {
    display: flex;
    width: 99.6%;
    max-width: 99.6%;
    height: 100%;
    margin: 0px;
    padding: 20px;
    box-shadow: none;
    border: none;
    border-radius: 0px;
    font-size: 0.99em;
    overflow: scroll;
    overflow-x: auto; }
  #comments .article_date {
    margin: 0px;
    margin-top: 5px;
    text-align: center; }
    @media only screen and (min-width: 500px) {
      #comments .article_date {
        margin-left: 90px;
        text-align: left; } }
  #comments .no_comments {
    text-align: center;
    font-weight: 900;
    font-size: 1.3em;
    font-family: "Poiret One", cursive;
    color: #575757; }
    #comments .no_comments:last-of-type {
      padding-bottom: 20px; }
  #comments .my_comment {
    text-align: left;
    color: #131313;
    margin: 20px 30px 0px 30px;
    padding: 0px; }
    #comments .my_comment:last-of-type {
      padding-bottom: 0px;
      margin-bottom: 0px; }
  #comments .comment_box {
    margin: 0px 20px;
    border-bottom: 1px dotted #bdbdbd;
    min-height: 80px;
    padding: 20px 0px; }
    #comments .comment_box .comment_user {
      float: none;
      margin: 0px;
      padding: 0px;
      text-align: center;
      margin-left: 10px; }
      @media only screen and (min-width: 500px) {
        #comments .comment_box .comment_user {
          float: left;
          width: 80px;
          position: relative;
          right: 10px; } }
      #comments .comment_box .comment_user p {
        margin: 0px;
        padding: 0px; }
      #comments .comment_box .comment_user img {
        border-radius: 100%;
        box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 50px -1px rgba(100, 100, 100, 0.75);
        background: #3D3D3D;
        height: 60px;
        width: 60px;
        border: 2px solid white; }
      #comments .comment_box .comment_user a {
        font-size: 1.2em;
        font-family: "Poiret One", cursive;
        font-weight: 600;
        font-variant: normal; }
      @media only screen and (min-width: 500px) {
        #comments .comment_box .comment_user p:last-child {
          overflow-x: hidden;
          text-overflow: ellipsis; } }
  #comments .comment_box:last-of-type {
    border: none; }

@media only screen and (max-width: 400px) {
  .comment-rating {
    display: block; } }

.comment-like {
  color: #018807; }
  .comment-like a {
    color: #018807; }
  .comment-like .grey {
    color: #707070; }

.comment-dislike {
  color: #EC0101; }
  .comment-dislike a {
    color: #EC0101; }
  .comment-dislike .grey {
    color: #707070; }

/* 
    Created on : 9.12.2016, 14:46:39
    Author     : Martin
*/
#conversations .unread_notification {
  font-weight: 900;
  color: #3D3D3D; }
#conversations .message_date {
  font-family: "Poiret One", cursive;
  font-weight: 700; }
  @media only screen and (min-width: 768px) {
    #conversations .message_date {
      float: right; } }
#conversations div {
  min-height: 100px;
  margin: 0px 30px;
  padding: 20px 0px;
  border-bottom: 1px dotted #bdbdbd; }
  #conversations div p:first-child {
    margin: 0px auto;
    margin-bottom: 20px;
    padding: 0px;
    width: 248px;
    text-align: center; }
    @media only screen and (min-width: 440px) {
      #conversations div p:first-child {
        float: left;
        margin: 0px;
        width: auto; } }
    #conversations div p:first-child img {
      border-radius: 100%;
      box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 50px -1px rgba(100, 100, 100, 0.75);
      margin-right: 20px;
      background: #3D3D3D;
      height: 100px;
      width: 100px;
      border: 2px solid white;
      text-align: center; }
    #conversations div p:first-child .notification_publication {
      border-radius: 5.5px;
      box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 70px -1px rgba(100, 100, 100, 0.65);
      margin-right: 0px;
      background: #0073CF;
      height: 101.5px;
      width: 179.9px;
      border: none;
      position: relative;
      left: 28px; }
      @media only screen and (min-width: 440px) {
        #conversations div p:first-child .notification_publication {
          height: 58px;
          width: 102.8px;
          left: 0px; } }
      @media only screen and (min-width: 600px) {
        #conversations div p:first-child .notification_publication {
          height: 101.5px;
          width: 179.9px;
          left: 20px; } }
    #conversations div p:first-child .notification_avatar {
      border-radius: 100%;
      box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 50px -1px rgba(100, 100, 100, 0.75);
      margin-right: 0px;
      background: white;
      height: 60px;
      width: 60px;
      border: 2px solid white;
      position: relative;
      right: 28px;
      top: 10px; }
      @media only screen and (min-width: 440px) {
        #conversations div p:first-child .notification_avatar {
          height: 40px;
          width: 40px;
          right: 40px;
          top: 4px; } }
      @media only screen and (min-width: 600px) {
        #conversations div p:first-child .notification_avatar {
          height: 60px;
          width: 60px;
          right: 40px;
          top: 10px; } }
  #conversations div p {
    padding: 0px;
    margin-top: 10px; }
    #conversations div p::first-letter {
      font-weight: 800;
      font-size: 130%; }
  #conversations div h2 {
    background: none;
    box-shadow: none;
    text-align: left;
    padding-top: 0px;
    padding-bottom: 5px;
    font-size: 1.45em; }
    #conversations div h2 a {
      font-size: 1.45em; }
  #conversations div p.unread {
    font-weight: 900;
    color: #131313; }
#conversations .clear {
  height: 0px;
  min-height: 0px;
  padding: 0px; }

#conversation {
  padding-bottom: 1px; }
  #conversation .owner, #conversation .respondent {
    margin: 20px; }
    #conversation .owner p:first-child, #conversation .respondent p:first-child {
      text-align: center;
      margin: 0px;
      padding: 0px; }
      @media only screen and (min-width: 500px) {
        #conversation .owner p:first-child, #conversation .respondent p:first-child {
          float: left;
          text-align: justify; } }
      #conversation .owner p:first-child img, #conversation .respondent p:first-child img {
        border-radius: 100%;
        box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 50px -1px rgba(100, 100, 100, 0.75);
        background: white;
        height: 40px;
        width: 40px;
        border: 2px solid white; }
        @media only screen and (min-width: 500px) {
          #conversation .owner p:first-child img, #conversation .respondent p:first-child img {
            margin-right: 20px; } }
    #conversation .owner div, #conversation .respondent div {
      min-height: 40px;
      background: #bdbdbd;
      border-radius: 5.5px; }
      #conversation .owner div p, #conversation .respondent div p {
        padding: 12px;
        margin: 0px; }
      @media only screen and (min-width: 500px) {
        #conversation .owner div, #conversation .respondent div {
          margin-left: 65px; }
          #conversation .owner div p, #conversation .respondent div p {
            margin-top: -20px; } }
    @media only screen and (min-width: 500px) {
      #conversation .owner div:before, #conversation .respondent div:before {
        content: "";
        display: block;
        /* reduce the damage in FF3.0 */
        position: relative;
        left: -9px;
        top: 10px;
        width: 0;
        height: 0;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        border-right: 10px solid #bdbdbd; } }
  #conversation .answer_message {
    margin: 20px; }
    #conversation .answer_message p:first-child {
      text-align: center;
      display: none;
      margin: 0px;
      padding: 0px; }
      @media only screen and (min-width: 625px) {
        #conversation .answer_message p:first-child {
          float: left;
          text-align: justify;
          display: block; } }
      #conversation .answer_message p:first-child img {
        border-radius: 100%;
        box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 50px -1px rgba(100, 100, 100, 0.75);
        background: white;
        height: 40px;
        width: 40px;
        border: 2px solid white; }
        @media only screen and (min-width: 625px) {
          #conversation .answer_message p:first-child img {
            margin-right: 20px; } }
    #conversation .answer_message div, #conversation .answer_message textarea {
      min-height: 40px;
      background: #bdbdbd;
      border-radius: 5.5px; }
      #conversation .answer_message div p, #conversation .answer_message textarea p {
        padding: 12px;
        margin: 0px; }
      @media only screen and (min-width: 625px) {
        #conversation .answer_message div, #conversation .answer_message textarea {
          margin-left: 65px; }
          #conversation .answer_message div p, #conversation .answer_message textarea p {
            margin-top: -20px; } }
    @media only screen and (min-width: 625px) {
      #conversation .answer_message div:before {
        content: "";
        display: block;
        /* reduce the damage in FF3.0 */
        position: relative;
        left: -9px;
        top: 10px;
        width: 0;
        height: 0;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        border-right: 10px solid #bdbdbd; } }
    #conversation .answer_message textarea {
      box-shadow: none;
      border: none;
      width: 95%;
      max-width: 500px;
      min-width: 240px;
      min-height: 100px;
      margin-left: 0px; }
      @media only screen and (min-width: 625px) {
        #conversation .answer_message textarea {
          width: 50%; } }
      @media only screen and (min-width: 768px) {
        #conversation .answer_message textarea {
          width: 500px; } }
      #conversation .answer_message textarea::-webkit-input-placeholder {
        /* Chrome/Opera/Safari */
        color: #464646;
        font-size: 1.1em;
        font-weight: 600; }
      #conversation .answer_message textarea::-moz-placeholder {
        /* Firefox 19+ */
        color: #464646;
        font-size: 1.1em;
        font-weight: 600; }
      #conversation .answer_message textarea:-ms-input-placeholder {
        /* IE 10+ */
        color: #464646;
        font-size: 1.1em;
        font-weight: 600; }
      #conversation .answer_message textarea:-moz-placeholder {
        /* Firefox 18- */
        color: #464646;
        font-size: 1.1em;
        font-weight: 600; }
  #conversation .respondent div {
    background: #0073CF; }
  #conversation .respondent div:before {
    border-right: 10px solid #0073CF; }
  #conversation .message_date {
    text-align: right;
    padding-top: 0px;
    color: #3D3D3D;
    font-size: 0.8em;
    margin: 0px;
    padding: 0px;
    margin-top: 5px;
    font-family: "Poiret One", cursive;
    font-weight: 700; }
  #conversation input[type="submit"] {
    width: 100px;
    height: 100px;
    margin: 10px auto 30px auto;
    font-family: "Poiret One", cursive;
    font-weight: 600;
    font-size: 1.3em;
    display: block; }
    @media only screen and (min-width: 625px) {
      #conversation input[type="submit"] {
        display: inline;
        margin-left: 17px;
        margin-top: -100px;
        margin-bottom: 0px; } }

#news_number {
  position: fixed;
  top: 36px;
  right: 56px;
  font-family: "Raleway", sans-serif;
  font-size: 0.75em;
  /*color: black;
  border: 1px solid black;
  background: $red;*/
  color: #EC0101;
  border: 1px solid #EC0101;
  background: white;
  padding: 0px 3px 6px 3px;
  border-radius: 100%;
  width: 15px;
  height: 15px;
  text-align: center;
  cursor: pointer; }

.foggy {
  display: none;
  min-width: 100%;
  min-height: 100%;
  background: rgba(30, 30, 30, 0.85);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 150; }
  .foggy #new_message {
    border: 3px solid white;
    width: 300px;
    height: 520px;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-left: -150px;
    margin-top: -260px; }
    .foggy #new_message h2 {
      box-shadow: inset 0px 15px 50px -1px rgba(80, 80, 80, 0.75); }
    .foggy #new_message form {
      margin: 12px 20px; }
      .foggy #new_message form th {
        padding-right: 10px;
        max-width: 130px; }
      .foggy #new_message form #message_content {
        padding-bottom: 5px; }
      .foggy #new_message form textarea {
        width: 242px;
        max-width: 242px;
        height: 250px;
        max-height: 250px; }
      .foggy #new_message form select {
        width: 260px; }
      .foggy #new_message form input[type="submit"] {
        font-family: "Poiret One", cursive;
        width: 70px;
        height: 70px;
        font-size: 1.05em; }
    @media only screen and (min-width: 540px) {
      .foggy #new_message {
        width: 500px;
        height: 300px;
        margin-left: -250px;
        margin-top: -150px; }
        .foggy #new_message form textarea {
          width: 437px;
          max-width: 437px;
          height: 122px;
          max-height: 122px; }
        .foggy #new_message form select {
          width: 200px; }
        .foggy #new_message form input[type="submit"] {
          position: relative;
          bottom: 7px; } }
    @media only screen and (max-width: 539.9px) {
      .foggy #new_message form td, .foggy #new_message form th {
        display: block; }
      .foggy #new_message form #message_send_button {
        text-align: center;
        position: relative;
        top: 315px; }
      .foggy #new_message form .message_text {
        position: relative;
        bottom: 70px; } }

.new_message_button {
  color: #038fff;
  font-family: "Poiret One", cursive;
  font-size: 2.3em;
  background: #3D3D3D;
  text-align: center;
  border-radius: 0px 0px 70px 70px;
  font-size: 1.3em;
  padding: 15px;
  margin: 0px auto;
  margin-bottom: 20px;
  width: 200px;
  font-weight: 600;
  box-shadow: 0px 0px 20px 1px #575757, inset 0px 20px 50px -1px rgba(40, 40, 40, 0.65);
  display: block;
  cursor: pointer;
  font-variant: normal;
  transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out; }
  @media only screen and (min-width: 440px) {
    .new_message_button {
      width: 270px; } }
  .new_message_button:hover {
    box-shadow: 0px 0px 20px 1px #3D3D3D, inset 0px 20px 50px -1px rgba(20, 20, 20, 0.65);
    transition: all 0.5s ease-out;
    -ms-transition: all 0.5s ease-out;
    -webkit-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out; }

.sidebox_button {
  border-radius: 8px;
  border-bottom: 3px solid #0073CF;
  border-top: 3px solid #0073CF;
  margin-bottom: 30px;
  box-shadow: inset 0px 20px 50px -1px rgba(40, 40, 40, 0.65);
  transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out; }
  .sidebox_button:hover {
    box-shadow: 0px 0px 15px 1px #636363, inset 0px 20px 50px -1px rgba(20, 20, 20, 0.65);
    transition: all 0.5s ease-out;
    -ms-transition: all 0.5s ease-out;
    -webkit-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out; }

@media only screen and (min-width: 625px) {
  #message_textarea {
    content: "";
    display: block;
    /* reduce the damage in FF3.0 */
    /*position: relative;
    left: -9px;
    top: 10px;*/
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-right: 10px solid #bdbdbd;
    float: left;
    margin-left: -46px; } }

/* 
    Created on : 4.2.2017, 22:42:17
    Author     : Martin
*/
/*#avatar-maker-2 {
    //margin-top: 40px;
    //border-top: 1px dotted $black;
    margin: 90px 0px;
    padding: 0px 50px;
    //border-radius: 5px;
    border-radius: 5px;
    min-height: 590px;
    background: url("../img/crossword.png") white repeat fixed;
    box-shadow: 0px 0px 20px 1px lighten($grey,10);
    h1 {
        border-radius: 0px 0px 100px 100px;
        background: $black;
        box-shadow: inset 0px 20px 70px -1px rgba(100,100,100,0.75);
        padding: 10px 0px;
        margin: 0px;
    }
    
    p:first-of-type {
        margin-top: 25px;
        text-align: center;
        font-family: $h_font;
        font-weight: 800;
        font-size: 1.2em;
        margin-bottom: 0px;
    }
    
    $avatar-dimensions: 266px;
    #avatar-preview {
        width: $avatar-dimensions;
        height: $avatar-dimensions;
        border: 3px solid white;
        margin: 40px 18px 18px 0px;
        box-shadow: 0px 0px 10px 1px lighten($grey,10), inset 0px 40px 150px 0px rgba(100,100,100,0.65);
        background: white;
        float: left;
        //box-shadow: inset 0px 20px 70px -1px rgba(100,100,100,0.65);
        img {
            width: $avatar-dimensions;
            height: $avatar-dimensions;
        }
    }
    
    #avatar-shapes {
        //border-radius: 5px;
        box-shadow: 0px 0px 20px 1px lighten($grey,10);
        width: 450px;
        min-height: 267px;
        float: left;
        margin-top: 40px;
        padding: 12px;
        padding-right: 75px;
        background: white;
        #spinner-big {
            img {
                display: block;
                margin: 53px auto;
                width: 150px;
                height: 150px;
            }
        }       
        div div {
            float: left;
            height: 60px;
            width: 60px;
            margin: 12px;
            border-radius: 8px;
            border: 3px solid $black;
            padding: 0px;
            //@include transition();
        }
        div div:hover {
            height: 70px;
            width: 70px;
            margin: 7px;
            //@include transition();
            img {
                height: 70px;
                width: 70px;
            }
        }
        img {
            width: 60px;
            height: 60px;
            margin: 0px;
            padding: 0px;
            &:hover {
                height: 70px;
                width: 70px;
            }
        }
        .active {
            height: 70px;
            width: 70px;
            margin: 7px;
            border: 3px solid $blue;
            img {
                height: 70px;
                width: 70px;
            }
        }
    }
    
    #avatar-elements {
        float: right;
        width: 150px;
        //border-radius: 5px;
        position: relative;
        z-index: 2;
        margin-left: -70px;
        margin-top: 60px;
        box-shadow: 3px 0px 10px 1px $grey;
        background: white;
        //border: 1px dotted $black;
        a {
            color: $black;
            font-variant: normal;
        }
        div {
            @include transition();
            padding: 11px;
            box-shadow: inset 0px 3px 30px -1px rgba(80,80,80,0.75);
            text-align: center;
            font-family: $h_font;
            font-size: 1.2em;
            font-weight: 700;
            border-bottom: 1px dotted $black;
        }
        div:last-child {
            border: none;
        }
        div:hover {
            @include transition();
            background: $blue;
            color: white
        }
        .active {
            background: $grey;
            color: white;
            &:after {
                content: "";
                display: block;
                position: relative;
                right: 21px;
                //top: 10px;
                width: 0;
                height: 0;
                margin-top: -21px;
            
                border-top: 11px solid transparent;
                border-bottom: 11px solid transparent;
                border-right: 11px solid $grey;
            }
            &:hover {
                background: $grey;
            }
        }
    }
    
    #avatar-colors-vertical {
        float: left;
        margin-right: 35px;
        margin-top: 40px;
        width: 30px;
        div {
            width: 27px;
            height: 27px;
            border: 2.0px solid $black;
            //box-shadow: 0px 0px 7px 1px lighten($grey,10);
            margin-bottom: 18px;
        }
        div:hover {
            width: 30px;
            height: 30px;
            margin: -1.5px;
            margin-bottom: 16.5px;
        }
        .active-color {
            width: 30px;
            height: 30px;
            margin: -1.5px;
            margin-bottom: 16.5px;
            border: 2.0px solid $blue;
        }
        #green {
            background: #33cc33;
        }
        #blue {
            background: #003399;
        }
        #light-blue {
            background: #3333ff;
        }
        #purple {
            background: #cc0066;
        }
        #red {
            background: red;
        }
        #pink {
            background: pink;
        }
    }
    
    #avatar-colors-horizontal {
        float: left;
        div {
            float: left;
            margin-right: 18px;
            width: 27px;
            height: 27px;
            border: 2.0px solid $black;
        }
        div:hover {
            width: 30px;
            height: 30px;
            margin: -1.5px;
            margin-right: 16.5px;
        }
        #avatar-male:hover, #avatar-female:hover {
            margin: 40px 18px 0px 0px;
            height: 27px;
        }
        a {
            color: black;
        }
        .active-color {
            width: 30px;
            height: 30px;
            margin: -1.5px;
            margin-right: 16.5px;
            border: 2.0px solid $blue;
        }
        #black {
            background: black;
        }
        #dark-brown {
            background: #4d2800;
        }
        #light-brown {
            background: #ac7339;
        }
        #grey {
            background: grey;
        }
        #white {
            background: white;
        }
        #yellow {
            background: #ffff4d;
        }
        #skin {
            background: #ffcc99;
        }
    }
    
    #avatar-buttons {
        float: left;
        margin: 0px 0px 20px 45px;
        button {
            float: left;
            margin: 20px;
            width: 100px;
            height: 100px;
            text-align: center;
            vertical-align: middle;
            border-radius: 100%;
            border: 1px dotted $grey;
            background: $black;
            box-shadow: 0px 0px 10px 1px lighten($grey,10), inset 0px 20px 70px -1px rgba(80,80,80,0.75);
            font-family: $h_font;
            font-size: 1.4em;
            //font-weight: 700;
            color: $blue;
            @include submit_rotate(0deg);
            cursor: pointer;
            &:hover {
                box-shadow: 0px 0px 7px 1px $blue, inset 0px 20px 70px -1px rgba(80,80,80,0.75);
                @include submit_rotate(360deg);
            }
        }
    }
}

#avatar-male, #avatar-female {
    margin-top: 45px;
    padding: 6px 15px;
    min-width: 118px;
    font-family: $h_font;
    font-size: 1.4em;
    font-weight: 700;
    font-variant: small-caps;
    background: url("../img/male.png") transparent no-repeat right center;
    @include transition();
    &:hover {
        box-shadow: inset 0px 5px 40px -1px rgba(80,80,80,0.75);
        background: url("../img/male-white.png") $blue no-repeat right center;
        color: white;
        @include transition();
    }
}

#avatar-female {
    background: url("../img/female.png") transparent no-repeat right center;
    &:hover {
        background-image: url("../img/female-white.png");
    }
}

#avatar-male.active, #avatar-female.active {
    box-shadow: 0px 0px 10px 1px $grey, inset 0px 5px 40px -1px rgba(80,80,80,0.75);
    margin-top: 40px;
    color: white;
    background: url("../img/male-white.png") darken($grey,12) no-repeat right center;
}

#avatar-female.active {
    background-image: url("../img/female-white.png");
}

#snippet--colors {
    float: left;
*/
#avatar-maker {
  margin: 90px 0px;
  padding: 0px 20px;
  border-radius: 5px;
  min-height: 590px;
  background: url("../img/crossword.png") white repeat fixed;
  box-shadow: 0px 0px 20px 1px #575757; }
  @media only screen and (min-width: 1100px) {
    #avatar-maker {
      padding: 0px 50px; } }
  #avatar-maker h1 {
    border-radius: 0px 0px 100px 100px;
    background: #131313;
    box-shadow: inset 0px 20px 70px -1px rgba(100, 100, 100, 0.75);
    padding: 10px 0px;
    margin: 0px; }
  #avatar-maker p:first-of-type {
    margin-top: 25px;
    text-align: center;
    font-family: "Poiret One", cursive;
    font-weight: 800;
    font-size: 1.2em;
    margin-bottom: 0px; }
  #avatar-maker #preview-colors-shapes-elements {
    margin-top: 40px; }
  #avatar-maker #preview-colors {
    width: 267px;
    margin: 0px auto; }
    @media only screen and (min-width: 420px) {
      #avatar-maker #preview-colors {
        width: 320px; } }
    @media only screen and (min-width: 768px) {
      #avatar-maker #preview-colors {
        float: left;
        margin-right: 35px; } }
  #avatar-maker #avatar-preview {
    width: 219px;
    height: 219px;
    float: left;
    border: 3px solid white;
    margin: 0px 15px 15px 0px;
    box-shadow: 0px 0px 10px 1px #575757, inset 0px 40px 150px 0px rgba(100, 100, 100, 0.65);
    background: white;
    float: left; }
    @media only screen and (min-width: 420px) {
      #avatar-maker #avatar-preview {
        width: 264px;
        height: 264px;
        margin: 0px 18px 18px 0px; } }
    #avatar-maker #avatar-preview #current-avatar {
      width: 219px;
      height: 219px; }
      @media only screen and (min-width: 420px) {
        #avatar-maker #avatar-preview #current-avatar {
          width: 264px;
          height: 264px; } }
    #avatar-maker #avatar-preview #spinner-avatar-preview {
      margin: 0px;
      padding: 34px; }
      @media only screen and (min-width: 420px) {
        #avatar-maker #avatar-preview #spinner-avatar-preview {
          padding: 57px; } }
      #avatar-maker #avatar-preview #spinner-avatar-preview img {
        display: block;
        width: 150px;
        height: 150px; }
  #avatar-maker #avatar-colors-vertical {
    float: left;
    width: 25px; }
    @media only screen and (min-width: 420px) {
      #avatar-maker #avatar-colors-vertical {
        width: 30px; } }
    #avatar-maker #avatar-colors-vertical div {
      width: 21px;
      height: 21px;
      border: 2px solid #131313;
      margin-bottom: 15px; }
      @media only screen and (min-width: 420px) {
        #avatar-maker #avatar-colors-vertical div {
          width: 26px;
          height: 26px;
          margin-bottom: 18px; } }
    #avatar-maker #avatar-colors-vertical div:hover {
      width: 25px;
      height: 25px;
      margin: -2px;
      margin-bottom: 13px; }
      @media only screen and (min-width: 420px) {
        #avatar-maker #avatar-colors-vertical div:hover {
          width: 30px;
          height: 30px;
          margin-bottom: 16px; } }
    #avatar-maker #avatar-colors-vertical .active-color {
      width: 25px;
      height: 25px;
      margin: -2px;
      margin-bottom: 13px;
      border: 2px solid #0073CF; }
      @media only screen and (min-width: 420px) {
        #avatar-maker #avatar-colors-vertical .active-color {
          width: 30px;
          height: 30px;
          margin-bottom: 16px; } }
  #avatar-maker #avatar-colors-horizontal div {
    float: left;
    margin-right: 15px;
    width: 21px;
    height: 21px;
    border: 2px solid #131313; }
    @media only screen and (min-width: 420px) {
      #avatar-maker #avatar-colors-horizontal div {
        width: 26px;
        height: 26px;
        margin-right: 18px; } }
  #avatar-maker #avatar-colors-horizontal div:hover {
    width: 25px;
    height: 25px;
    margin: -2px;
    margin-right: 13px; }
    @media only screen and (min-width: 420px) {
      #avatar-maker #avatar-colors-horizontal div:hover {
        width: 30px;
        height: 30px;
        margin-right: 16px; } }
  #avatar-maker #avatar-colors-horizontal .active-color {
    width: 25px;
    height: 25px;
    margin: -2px;
    margin-right: 13px;
    border: 2px solid #0073CF; }
    @media only screen and (min-width: 420px) {
      #avatar-maker #avatar-colors-horizontal .active-color {
        width: 30px;
        height: 30px;
        margin-right: 16px; } }
  #avatar-maker .smaller-clear {
    clear: both; }
    @media only screen and (min-width: 768px) {
      #avatar-maker .smaller-clear {
        clear: none; } }
  #avatar-maker #shapes-elements {
    margin: 40px auto 0px auto;
    width: 267px; }
    @media only screen and (min-width: 420px) {
      #avatar-maker #shapes-elements {
        width: 320px; } }
    @media only screen and (min-width: 768px) {
      #avatar-maker #shapes-elements {
        margin: 0px;
        width: auto; } }
  #avatar-maker #avatar-shapes {
    float: left;
    box-shadow: 0px 0px 20px 1px #575757;
    width: 150px;
    padding: 10px;
    padding-right: 75px;
    background: white; }
    @media only screen and (min-width: 420px) {
      #avatar-maker #avatar-shapes {
        width: 205px;
        padding-right: 65px; } }
    @media only screen and (min-width: 768px) {
      #avatar-maker #avatar-shapes {
        width: 235px;
        padding: 12px;
        padding-right: 50px; } }
    @media only screen and (min-width: 1100px) {
      #avatar-maker #avatar-shapes {
        width: 450px;
        padding-right: 75px; } }
    #avatar-maker #avatar-shapes #spinner-big img {
      display: block;
      margin: 53px auto;
      width: 150px;
      height: 150px; }
    #avatar-maker #avatar-shapes .avatar-shape {
      float: left;
      height: 49px;
      width: 49px;
      margin: 8px;
      border-radius: 8px;
      border: 3px solid #131313;
      padding: 0px;
      overflow: hidden; }
      @media only screen and (min-width: 420px) {
        #avatar-maker #avatar-shapes .avatar-shape {
          height: 45px;
          width: 45px;
          margin: 8px; } }
      @media only screen and (min-width: 768px) {
        #avatar-maker #avatar-shapes .avatar-shape {
          height: 55px;
          width: 55px;
          margin: 8px; } }
      @media only screen and (min-width: 1100px) {
        #avatar-maker #avatar-shapes .avatar-shape {
          height: 60px;
          width: 60px;
          margin: 12px; } }
    #avatar-maker #avatar-shapes img {
      width: 49px;
      height: 49px;
      margin: 0px;
      padding: 0px; }
      @media only screen and (min-width: 420px) {
        #avatar-maker #avatar-shapes img {
          width: 45px;
          height: 45px; } }
      @media only screen and (min-width: 768px) {
        #avatar-maker #avatar-shapes img {
          height: 55px;
          width: 55px; } }
      @media only screen and (min-width: 1100px) {
        #avatar-maker #avatar-shapes img {
          width: 60px;
          height: 60px; } }
    #avatar-maker #avatar-shapes #eyes-preview {
      -moz-transform: scale(5);
      -webkit-transform: scale(5);
      transform: scale(5);
      position: relative;
      top: 40px;
      left: 31px; }
      @media only screen and (min-width: 420px) {
        #avatar-maker #avatar-shapes #eyes-preview {
          top: 37px;
          left: 29px; } }
      @media only screen and (min-width: 768px) {
        #avatar-maker #avatar-shapes #eyes-preview {
          top: 45px;
          left: 34px; } }
      @media only screen and (min-width: 1100px) {
        #avatar-maker #avatar-shapes #eyes-preview {
          top: 50px;
          left: 37px; } }
    #avatar-maker #avatar-shapes #hair-preview {
      -moz-transform: scale(1.3);
      -webkit-transform: scale(1.3);
      transform: scale(1.3);
      position: relative;
      top: 7px; }
      @media only screen and (min-width: 420px) {
        #avatar-maker #avatar-shapes #hair-preview {
          top: 6px; } }
      @media only screen and (min-width: 768px) {
        #avatar-maker #avatar-shapes #hair-preview {
          top: 8px; } }
      @media only screen and (min-width: 1100px) {
        #avatar-maker #avatar-shapes #hair-preview {
          top: 9px; } }
    #avatar-maker #avatar-shapes #nose-preview {
      -moz-transform: scale(3.5);
      -webkit-transform: scale(3.5);
      transform: scale(3.5);
      position: relative;
      top: 13px; }
      @media only screen and (min-width: 420px) {
        #avatar-maker #avatar-shapes #nose-preview {
          top: 12px; } }
      @media only screen and (min-width: 768px) {
        #avatar-maker #avatar-shapes #nose-preview {
          top: 14px; } }
      @media only screen and (min-width: 1100px) {
        #avatar-maker #avatar-shapes #nose-preview {
          top: 15px; } }
    #avatar-maker #avatar-shapes #mouth-preview {
      -moz-transform: scale(3.5);
      -webkit-transform: scale(3.5);
      transform: scale(3.5);
      position: relative;
      bottom: 18px; }
      @media only screen and (min-width: 420px) {
        #avatar-maker #avatar-shapes #mouth-preview {
          bottom: 16px; } }
      @media only screen and (min-width: 768px) {
        #avatar-maker #avatar-shapes #mouth-preview {
          bottom: 21px; } }
      @media only screen and (min-width: 1100px) {
        #avatar-maker #avatar-shapes #mouth-preview {
          bottom: 23px; } }
    #avatar-maker #avatar-shapes #eyebrows-preview {
      -moz-transform: scale(4);
      -webkit-transform: scale(4);
      transform: scale(4);
      position: relative;
      top: 46px;
      left: 26px; }
      @media only screen and (min-width: 420px) {
        #avatar-maker #avatar-shapes #eyebrows-preview {
          top: 43px;
          left: 24px; } }
      @media only screen and (min-width: 768px) {
        #avatar-maker #avatar-shapes #eyebrows-preview {
          top: 53px;
          left: 28px; } }
      @media only screen and (min-width: 1100px) {
        #avatar-maker #avatar-shapes #eyebrows-preview {
          top: 57px;
          left: 32px; } }
    #avatar-maker #avatar-shapes #clothes-preview {
      -moz-transform: scale(1.3);
      -webkit-transform: scale(1.3);
      transform: scale(1.3);
      position: relative;
      bottom: 7px; }
      @media only screen and (min-width: 420px) {
        #avatar-maker #avatar-shapes #clothes-preview {
          bottom: 6px; } }
      @media only screen and (min-width: 768px) {
        #avatar-maker #avatar-shapes #clothes-preview {
          bottom: 8px; } }
      @media only screen and (min-width: 1100px) {
        #avatar-maker #avatar-shapes #clothes-preview {
          bottom: 9px; } }
    #avatar-maker #avatar-shapes #head-preview {
      -moz-transform: scale(1.4);
      -webkit-transform: scale(1.4);
      transform: scale(1.4); }
    #avatar-maker #avatar-shapes #ears-preview {
      -moz-transform: scale(3.5);
      -webkit-transform: scale(3.5);
      transform: scale(3.5);
      position: relative;
      top: 23px;
      left: 56px; }
      @media only screen and (min-width: 420px) {
        #avatar-maker #avatar-shapes #ears-preview {
          top: 22px;
          left: 52px; } }
      @media only screen and (min-width: 768px) {
        #avatar-maker #avatar-shapes #ears-preview {
          top: 26px;
          left: 63px; } }
      @media only screen and (min-width: 1100px) {
        #avatar-maker #avatar-shapes #ears-preview {
          top: 28px;
          left: 70px; } }
    #avatar-maker #avatar-shapes .avatar-shape:hover {
      height: 57px;
      width: 57px;
      margin: 4px; }
      #avatar-maker #avatar-shapes .avatar-shape:hover img {
        height: 57px;
        width: 57px; }
      #avatar-maker #avatar-shapes .avatar-shape:hover #eyes-preview {
        top: 48px;
        left: 36px; }
        @media only screen and (min-width: 420px) {
          #avatar-maker #avatar-shapes .avatar-shape:hover #eyes-preview {
            top: 45px;
            left: 34px; } }
        @media only screen and (min-width: 768px) {
          #avatar-maker #avatar-shapes .avatar-shape:hover #eyes-preview {
            top: 56px;
            left: 41px; } }
        @media only screen and (min-width: 1100px) {
          #avatar-maker #avatar-shapes .avatar-shape:hover #eyes-preview {
            top: 58px;
            left: 43px; } }
      #avatar-maker #avatar-shapes .avatar-shape:hover #eyebrows-preview {
        top: 54px;
        left: 31px; }
        @media only screen and (min-width: 420px) {
          #avatar-maker #avatar-shapes .avatar-shape:hover #eyebrows-preview {
            top: 50px;
            left: 29px; } }
        @media only screen and (min-width: 768px) {
          #avatar-maker #avatar-shapes .avatar-shape:hover #eyebrows-preview {
            top: 62px;
            left: 34px; } }
        @media only screen and (min-width: 1100px) {
          #avatar-maker #avatar-shapes .avatar-shape:hover #eyebrows-preview {
            top: 65px;
            left: 37px; } }
      #avatar-maker #avatar-shapes .avatar-shape:hover #mouth-preview {
        bottom: 21px; }
        @media only screen and (min-width: 420px) {
          #avatar-maker #avatar-shapes .avatar-shape:hover #mouth-preview {
            bottom: 19px; } }
        @media only screen and (min-width: 768px) {
          #avatar-maker #avatar-shapes .avatar-shape:hover #mouth-preview {
            bottom: 24px; } }
        @media only screen and (min-width: 1100px) {
          #avatar-maker #avatar-shapes .avatar-shape:hover #mouth-preview {
            bottom: 28px; } }
      #avatar-maker #avatar-shapes .avatar-shape:hover #ears-preview {
        top: 27px;
        left: 66px; }
        @media only screen and (min-width: 420px) {
          #avatar-maker #avatar-shapes .avatar-shape:hover #ears-preview {
            top: 26px;
            left: 62px; } }
        @media only screen and (min-width: 768px) {
          #avatar-maker #avatar-shapes .avatar-shape:hover #ears-preview {
            top: 31px;
            left: 74px; } }
        @media only screen and (min-width: 1100px) {
          #avatar-maker #avatar-shapes .avatar-shape:hover #ears-preview {
            top: 33px;
            left: 80px; } }
      @media only screen and (min-width: 420px) {
        #avatar-maker #avatar-shapes .avatar-shape:hover {
          height: 53px;
          width: 53px;
          margin: 4px; }
          #avatar-maker #avatar-shapes .avatar-shape:hover img {
            height: 53px;
            width: 53px; } }
      @media only screen and (min-width: 768px) {
        #avatar-maker #avatar-shapes .avatar-shape:hover {
          height: 65px;
          width: 65px;
          margin: 3px; }
          #avatar-maker #avatar-shapes .avatar-shape:hover img {
            height: 65px;
            width: 65px; } }
      @media only screen and (min-width: 1100px) {
        #avatar-maker #avatar-shapes .avatar-shape:hover {
          height: 70px;
          width: 70px;
          margin: 7px; }
          #avatar-maker #avatar-shapes .avatar-shape:hover img {
            height: 70px;
            width: 70px; } }
    #avatar-maker #avatar-shapes .active {
      height: 57px;
      width: 57px;
      margin: 4px;
      border: 3px solid #0073CF; }
      #avatar-maker #avatar-shapes .active img {
        height: 57px;
        width: 57px; }
      #avatar-maker #avatar-shapes .active #eyes-preview {
        top: 48px;
        left: 36px; }
        @media only screen and (min-width: 420px) {
          #avatar-maker #avatar-shapes .active #eyes-preview {
            top: 45px;
            left: 34px; } }
        @media only screen and (min-width: 768px) {
          #avatar-maker #avatar-shapes .active #eyes-preview {
            top: 56px;
            left: 41px; } }
        @media only screen and (min-width: 1100px) {
          #avatar-maker #avatar-shapes .active #eyes-preview {
            top: 58px;
            left: 43px; } }
      #avatar-maker #avatar-shapes .active #eyebrows-preview {
        top: 54px;
        left: 31px; }
        @media only screen and (min-width: 420px) {
          #avatar-maker #avatar-shapes .active #eyebrows-preview {
            top: 50px;
            left: 29px; } }
        @media only screen and (min-width: 768px) {
          #avatar-maker #avatar-shapes .active #eyebrows-preview {
            top: 62px;
            left: 34px; } }
        @media only screen and (min-width: 1100px) {
          #avatar-maker #avatar-shapes .active #eyebrows-preview {
            top: 65px;
            left: 37px; } }
      #avatar-maker #avatar-shapes .active #mouth-preview {
        bottom: 21px; }
        @media only screen and (min-width: 420px) {
          #avatar-maker #avatar-shapes .active #mouth-preview {
            bottom: 19px; } }
        @media only screen and (min-width: 768px) {
          #avatar-maker #avatar-shapes .active #mouth-preview {
            bottom: 24px; } }
        @media only screen and (min-width: 1100px) {
          #avatar-maker #avatar-shapes .active #mouth-preview {
            bottom: 28px; } }
      #avatar-maker #avatar-shapes .active #ears-preview {
        top: 27px;
        left: 66px; }
        @media only screen and (min-width: 420px) {
          #avatar-maker #avatar-shapes .active #ears-preview {
            top: 26px;
            left: 62px; } }
        @media only screen and (min-width: 768px) {
          #avatar-maker #avatar-shapes .active #ears-preview {
            top: 31px;
            left: 74px; } }
        @media only screen and (min-width: 1100px) {
          #avatar-maker #avatar-shapes .active #ears-preview {
            top: 33px;
            left: 80px; } }
      @media only screen and (min-width: 420px) {
        #avatar-maker #avatar-shapes .active {
          height: 53px;
          width: 53px;
          margin: 4px; }
          #avatar-maker #avatar-shapes .active img {
            height: 53px;
            width: 53px; } }
      @media only screen and (min-width: 768px) {
        #avatar-maker #avatar-shapes .active {
          height: 65px;
          width: 65px;
          margin: 3px; }
          #avatar-maker #avatar-shapes .active img {
            height: 65px;
            width: 65px; } }
      @media only screen and (min-width: 1100px) {
        #avatar-maker #avatar-shapes .active {
          height: 70px;
          width: 70px;
          margin: 7px; }
          #avatar-maker #avatar-shapes .active img {
            height: 70px;
            width: 70px; } }
  #avatar-maker #avatar-elements {
    float: right;
    width: 100px;
    position: relative;
    z-index: 2;
    margin-right: -70px;
    right: 70px;
    margin-top: 20px;
    box-shadow: 3px 0px 10px 1px #3D3D3D;
    background: white; }
    @media only screen and (min-width: 1100px) {
      #avatar-maker #avatar-elements {
        width: 150px; } }
    #avatar-maker #avatar-elements a {
      color: #131313;
      font-variant: normal; }
    #avatar-maker #avatar-elements a div {
      transition: all 0.5s ease-out;
      -ms-transition: all 0.5s ease-out;
      -webkit-transition: all 0.5s ease-out;
      -o-transition: all 0.5s ease-out;
      -moz-transition: all 0.5s ease-out;
      padding: 9px 11px;
      box-shadow: inset 0px 3px 30px -1px rgba(80, 80, 80, 0.75);
      text-align: center;
      font-family: "Poiret One", cursive;
      font-size: 1.1em;
      font-weight: 700; }
      @media only screen and (min-width: 1100px) {
        #avatar-maker #avatar-elements a div {
          font-size: 1.2em;
          padding: 11px; } }
    #avatar-maker #avatar-elements a div:hover {
      transition: all 0.5s ease-out;
      -ms-transition: all 0.5s ease-out;
      -webkit-transition: all 0.5s ease-out;
      -o-transition: all 0.5s ease-out;
      -moz-transition: all 0.5s ease-out;
      background: #0073CF;
      color: white; }
    #avatar-maker #avatar-elements .active {
      background: #3D3D3D;
      color: white; }
      #avatar-maker #avatar-elements .active:after {
        content: "";
        display: block;
        /* reduce the damage in FF3.0 */
        position: relative;
        right: 21px;
        width: 0;
        height: 0;
        margin-top: -21px;
        border-top: 11px solid transparent;
        border-bottom: 11px solid transparent;
        border-right: 11px solid #3D3D3D; }
      #avatar-maker #avatar-elements .active:hover {
        background: #3D3D3D; }
  #avatar-maker #genders-buttons {
    margin-top: 30px;
    padding-bottom: 240px; }
    @media only screen and (min-width: 420px) {
      #avatar-maker #genders-buttons {
        padding-bottom: 130px; } }
    @media only screen and (min-width: 768px) {
      #avatar-maker #genders-buttons {
        margin-top: 40px;
        padding-bottom: 110px; } }
    @media only screen and (min-width: 1100px) {
      #avatar-maker #genders-buttons {
        margin-top: 0px;
        padding-bottom: 50px; } }
  #avatar-maker #avatar-genders {
    font-family: "Poiret One", cursive;
    font-size: 1.4em;
    font-weight: 700;
    font-variant: small-caps;
    width: 267px;
    margin-left: auto;
    margin-right: auto; }
    @media only screen and (min-width: 420px) {
      #avatar-maker #avatar-genders {
        width: 320px; } }
    @media only screen and (min-width: 768px) {
      #avatar-maker #avatar-genders {
        margin-left: 0px;
        margin-right: 0px; } }
  #avatar-maker #avatar-male, #avatar-maker #avatar-female {
    float: left;
    margin-top: 5px;
    padding: 6px 15px;
    width: 93px;
    height: 23px;
    color: #131313;
    border: 2px solid #131313;
    box-shadow: inset 0px 2px 40px -1px rgba(50, 50, 50, 0.35);
    transition: all 0.5s ease-out;
    -ms-transition: all 0.5s ease-out;
    -webkit-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out; }
    @media only screen and (min-width: 420px) {
      #avatar-maker #avatar-male, #avatar-maker #avatar-female {
        width: 118px;
        height: 27px; } }
    #avatar-maker #avatar-male:hover, #avatar-maker #avatar-female:hover {
      margin-top: 0px;
      margin-bottom: 5px;
      box-shadow: inset 0px 5px 40px -1px rgba(80, 80, 80, 0.75);
      color: white;
      transition: all 0.5s ease-out;
      -ms-transition: all 0.5s ease-out;
      -webkit-transition: all 0.5s ease-out;
      -o-transition: all 0.5s ease-out;
      -moz-transition: all 0.5s ease-out; }
  #avatar-maker #avatar-male {
    margin-right: 13px;
    background: url("../img/male.png") white no-repeat right center; }
    @media only screen and (min-width: 420px) {
      #avatar-maker #avatar-male {
        margin-right: 16px; } }
    #avatar-maker #avatar-male:hover {
      background: url("../img/male-white.png") #0073CF no-repeat right center; }
  #avatar-maker #avatar-female {
    background: url("../img/female.png") white no-repeat right center; }
    #avatar-maker #avatar-female:hover {
      background: url("../img/female-white.png") #0073CF no-repeat right center; }
  #avatar-maker #avatar-male.active, #avatar-maker #avatar-female.active {
    box-shadow: 0px 0px 10px 1px #3D3D3D, inset 0px 5px 40px -1px rgba(80, 80, 80, 0.75);
    color: white;
    margin-top: 0px;
    margin-bottom: 5px; }
  #avatar-maker #avatar-male.active {
    background: url("../img/male-white.png") #1e1e1e no-repeat right center; }
  #avatar-maker #avatar-female.active {
    background: url("../img/female-white.png") #1e1e1e no-repeat right center; }
  #avatar-maker #avatar-buttons {
    width: 240px;
    margin: 30px auto; }
    @media only screen and (min-width: 420px) {
      #avatar-maker #avatar-buttons {
        width: 320px; } }
    @media only screen and (min-width: 768px) {
      #avatar-maker #avatar-buttons {
        width: auto;
        margin: -20px -8px 0px 0px;
        float: right; } }
    @media only screen and (min-width: 1100px) {
      #avatar-maker #avatar-buttons {
        float: left;
        margin: -40px 0px 0px 60px; } }
    #avatar-maker #avatar-buttons button {
      float: left;
      margin: 10px;
      margin-top: 0px;
      width: 100px;
      height: 100px;
      text-align: center;
      vertical-align: middle;
      border-radius: 100%;
      border: 1px dotted #3D3D3D;
      background: #131313;
      box-shadow: 0px 0px 10px 1px #575757, inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75);
      font-family: "Poiret One", cursive;
      font-size: 1.4em;
      color: #0073CF;
      transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
      transition: all 0.7s ease-out;
      -ms-transition: all 0.7s ease-out;
      -webkit-transition: all 0.7s ease-out;
      -o-transition: all 0.7s ease-out;
      -moz-transition: all 0.7s ease-out;
      cursor: pointer; }
      #avatar-maker #avatar-buttons button:hover {
        box-shadow: 0px 0px 7px 1px #0073CF, inset 0px 20px 70px -1px rgba(80, 80, 80, 0.75);
        transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        transition: all 0.7s ease-out;
        -ms-transition: all 0.7s ease-out;
        -webkit-transition: all 0.7s ease-out;
        -o-transition: all 0.7s ease-out;
        -moz-transition: all 0.7s ease-out; }
      @media only screen and (min-width: 420px) {
        #avatar-maker #avatar-buttons button {
          margin: 8.5px;
          margin-top: 0px;
          width: 95px;
          height: 95px; } }
      @media only screen and (min-width: 768px) {
        #avatar-maker #avatar-buttons button {
          margin: 10px;
          margin-top: 0px;
          width: 100px;
          height: 100px; } }
      @media only screen and (min-width: 1100px) {
        #avatar-maker #avatar-buttons button {
          margin: 20px;
          margin-top: 0px; } }
    @media only screen and (min-width: 420px) {
      #avatar-maker #avatar-buttons #random-avatar-button {
        margin-left: 0px; } }
    @media only screen and (min-width: 768px) {
      #avatar-maker #avatar-buttons #random-avatar-button {
        margin-left: 10px; } }
    @media only screen and (min-width: 1100px) {
      #avatar-maker #avatar-buttons #random-avatar-button {
        margin-right: 20px; } }
    #avatar-maker #avatar-buttons #save-avatar-button {
      margin-left: 70px; }
      @media only screen and (min-width: 420px) {
        #avatar-maker #avatar-buttons #save-avatar-button {
          margin-left: 8.5px;
          margin-right: 0px; } }
      @media only screen and (min-width: 768px) {
        #avatar-maker #avatar-buttons #save-avatar-button {
          margin-left: 10px;
          margin-right: 10px; } }
      @media only screen and (min-width: 1100px) {
        #avatar-maker #avatar-buttons #save-avatar-button {
          margin-left: 20px;
          margin-right: 20px; } }
  #avatar-maker #snippet--save-avatar {
    float: left; }

_::-webkit-full-page-media, _:future, :root #avatar-maker #avatar-genders {
  font-variant: normal;
  text-transform: uppercase; }

#head_black, #ears_black {
  background: #292728; }

#head_dark-blue, #ears_dark-blue {
  background: #1a4ca1; }

#head_dark-brown, #ears_dark-brown {
  background: #392f23; }

#head_dark-red, #ears_dark-red {
  background: #511b1b; }

#head_green, #ears_green {
  background: #71e48d; }

#head_grey, #ears_grey {
  background: #d1cdcc; }

#head_light-blue, #ears_light-blue {
  background: #a3cdd3; }

#head_light-brown, #ears_light-brown {
  background: #8c6d4b; }

#head_light-red, #ears_light-red {
  background: #f3a0a4; }

#head_pink, #ears_pink {
  background: #e4aec6; }

#head_purple, #ears_purple {
  background: #6c3f7f; }

#head_skin, #ears_skin {
  background: #ecc5b4; }

#head_yellow, #ears_yellow {
  background: #e5d394; }

#hair_black, #eyebrows_black {
  background: #1f1f1f; }

#hair_blue, #eyebrows_blue {
  background: #3b56b0; }

#hair_brown, #eyebrows_brown {
  background: #482e20; }

#hair_dark-brown, #eyebrows_dark-brown {
  background: #3c2d25; }

#hair_dark-red, #eyebrows_dark-red {
  background: #500d0d; }

#hair_green, #eyebrows_green {
  background: #0f4934; }

#hair_grey, #eyebrows_grey {
  background: #9c9c9c; }

#hair_grey-blue, #eyebrows_grey-blue {
  background: #2e465a; }

#hair_light-brown, #eyebrows_light-brown {
  background: #885f49; }

#hair_orange, #eyebrows_orange {
  background: #a2502c; }

#hair_pink, #eyebrows_pink {
  background: #eda6e1; }

#hair_purple, #eyebrows_purple {
  background: #391f57; }

#hair_yellow, #eyebrows_yellow {
  background: #d5ac4a; }

#eyes_dark-blue {
  background: #004591; }

#eyes_dark-brown {
  background: #512909; }

#eyes_dark-green {
  background: #5ca655; }

#eyes_dark-red {
  background: #e81313; }

#eyes_grey {
  background: #8e8e8e; }

#eyes_grey-green {
  background: #4f7d69; }

#eyes_light-blue {
  background: #588fa5; }

#eyes_light-brown {
  background: #815430; }

#eyes_light-green {
  background: #7cd201; }

#eyes_light-red {
  background: #cb5b5b; }

#eyes_pink {
  background: #cb6ac5; }

#eyes_purple {
  background: #7d43bf; }

#eyes_yellow {
  background: #cdba37; }

#clothes_black {
  background: #2f3131; }

#clothes_dark-blue {
  background: #00378b; }

#clothes_dark-brown {
  background: #472a13; }

#clothes_dark-red {
  background: #8b0000; }

#clothes_green {
  background: #008b3e; }

#clothes_grey-blue {
  background: #4c739a; }

#clothes_grey {
  background: #b7b6b6; }

#clothes_light-brown {
  background: #9c7358; }

#clothes_light-red {
  background: #ff8c8c; }

#clothes_orange {
  background: #eeae59; }

#clothes_pink {
  background: #fc8ae6; }

#clothes_purple {
  background: #4c276d; }

#clothes_yellow {
  background: #f1d960; }

/* 
    Created on : 3.7.2016, 22:33:46
    Author     : Martin
*/
.rotator {
  background-color: #131313;
  width: 1074px;
  height: 400px;
  margin: 0px auto;
  margin-top: 90px;
  position: relative;
  color: #fff;
  letter-spacing: -1px;
  border: 3px solid #f0f0f0;
  overflow: hidden;
  -moz-box-shadow: 0px 0px 10px #222;
  -webkit-box-shadow: 0px 0px 10px #222;
  box-shadow: 0px 0px 10px #222;
  font-family: "Raleway", sans-serif; }
  @media only screen and (max-width: 1100px) {
    .rotator {
      display: none; } }

img.bg {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 1080px;
  height: 400px; }

.rotator ul {
  list-style: none;
  position: absolute;
  right: 0px;
  top: 0px;
  margin-top: 6px;
  z-index: 10; }

.rotator ul li {
  display: block;
  float: left;
  clear: both;
  width: 260px; }

.rotator ul li a {
  text-align: left;
  width: 230px;
  float: right;
  clear: both;
  padding-left: 10px;
  padding-top: 20px;
  text-decoration: none;
  display: block;
  height: 40px;
  line-height: 40px;
  background: url("../img/crossword.png") white repeat fixed;
  margin: 1px -20px 1px 0px;
  opacity: 0.9;
  font: 1.2em "Poiret One", cursive;
  color: #131313;
  text-transform: uppercase;
  font-weight: 800;
  border: 2px solid #000;
  border-right: none;
  outline: none;
  -moz-border-radius: 10px 0px 0px 20px;
  -webkit-border-top-left-radius: 10px;
  -webkit-border-bottom-left-radius: 20px;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 20px;
  box-shadow: inset 0px 20px 110px -1px rgba(70, 70, 70, 0.75);
  transition: width 0.8s;
  -ms-transition: width 0.8s;
  -webkit-transition: width 0.8s;
  -o-transition: width 0.8s;
  -moz-transition: width 0.8s; }

.rotator ul li a:hover {
  text-shadow: 0px 0px 2px #0073CF;
  color: #3D3D3D;
  width: 250px; }

.rotator .heading {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 680px; }

.rotator .heading h2 {
  font-size: 2.0em;
  padding: 10px 30px;
  box-shadow: inset 0px 0px 70px 0px rgba(0, 0, 0, 0.55);
  background-color: rgba(0, 115, 207, 0.8);
  border-radius: 0px 0px 100px 0px;
  color: #242424;
  border-right: 2px solid #131313;
  border-bottom: 2px solid #131313; }

.rotator .description {
  width: 720px;
  position: absolute;
  bottom: 0px;
  left: 0px;
  padding: 0px 20px;
  background-color: rgba(0, 0, 0, 0.6);
  -moz-border-radius: 0px 20px 0px 0px;
  -webkit-border-top-right-radius: 20px;
  border-top-right-radius: 20px;
  border-top: 2px solid #000;
  border-right: 2px solid #000; }

.rotator .description p {
  text-shadow: -1px 1px 1px #000;
  text-transform: none;
  letter-spacing: normal;
  line-height: 26px;
  text-align: left; }

a.more {
  color: #0073CF;
  text-decoration: none;
  text-transform: uppercase;
  font-size: 10px; }

/*
== malihu jquery custom scrollbar plugin ==
Plugin URI: http://manos.malihu.gr/jquery-custom-content-scroller
*/
/*
CONTENTS: 
	1. BASIC STYLE - Plugin's basic/essential CSS properties (normally, should not be edited). 
	2. VERTICAL SCROLLBAR - Positioning and dimensions of vertical scrollbar. 
	3. HORIZONTAL SCROLLBAR - Positioning and dimensions of horizontal scrollbar.
	4. VERTICAL AND HORIZONTAL SCROLLBARS - Positioning and dimensions of 2-axis scrollbars. 
	5. TRANSITIONS - CSS3 transitions for hover events, auto-expanded and auto-hidden scrollbars. 
	6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS 
		6.1 THEMES - Scrollbar colors, opacity, dimensions, backgrounds etc. via ready-to-use themes.
*/
/* 
------------------------------------------------------------------------------------------------------------------------
1. BASIC STYLE  
------------------------------------------------------------------------------------------------------------------------
*/
.mCustomScrollbar {
  -ms-touch-action: pinch-zoom;
  touch-action: pinch-zoom;
  /* direct pointer events to js */ }

.mCustomScrollbar.mCS_no_scrollbar, .mCustomScrollbar.mCS_touch_action {
  -ms-touch-action: auto;
  touch-action: auto; }

.mCustomScrollBox {
  /* contains plugin's markup */
  position: relative;
  overflow: hidden;
  height: 100%;
  max-width: 100%;
  outline: none;
  direction: ltr; }

.mCSB_container {
  /* contains the original content */
  overflow: hidden;
  width: auto;
  height: auto; }

/* 
------------------------------------------------------------------------------------------------------------------------
2. VERTICAL SCROLLBAR 
y-axis
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_inside > .mCSB_container {
  margin-right: 20px; }

.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
  margin-right: 0; }

/* non-visible scrollbar */
.mCS-dir-rtl > .mCSB_inside > .mCSB_container {
  /* RTL direction/left-side scrollbar */
  margin-right: 0;
  margin-left: 20px; }

.mCS-dir-rtl > .mCSB_inside > .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
  margin-left: 0; }

/* RTL direction/left-side scrollbar */
.mCSB_scrollTools {
  /* contains scrollbar markup (draggable element, dragger rail, buttons etc.) */
  position: absolute;
  width: 16px;
  height: auto;
  left: auto;
  top: 0;
  right: 0;
  bottom: 0; }

.mCSB_outside + .mCSB_scrollTools {
  right: -26px; }

/* scrollbar position: outside */
.mCS-dir-rtl > .mCSB_inside > .mCSB_scrollTools,
.mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools {
  /* RTL direction/left-side scrollbar */
  right: auto;
  left: 0; }

.mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools {
  left: -26px; }

/* RTL direction/left-side scrollbar (scrollbar position: outside) */
.mCSB_scrollTools .mCSB_draggerContainer {
  /* contains the draggable element and dragger rail markup */
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  height: auto; }

.mCSB_scrollTools a + .mCSB_draggerContainer {
  margin: 20px 0; }

.mCSB_scrollTools .mCSB_draggerRail {
  width: 2px;
  height: 100%;
  margin: 0 auto;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  border-radius: 16px; }

.mCSB_scrollTools .mCSB_dragger {
  /* the draggable element */
  cursor: pointer;
  width: 100%;
  height: 30px;
  /* minimum dragger height */
  z-index: 1; }

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  /* the dragger element */
  position: relative;
  width: 4px;
  height: 100%;
  margin: 0 auto;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  border-radius: 16px;
  text-align: center; }

.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
  width: 12px;
  /* auto-expanded scrollbar */ }

.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
  width: 8px;
  /* auto-expanded scrollbar */ }

.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown {
  display: block;
  position: absolute;
  height: 20px;
  width: 100%;
  overflow: hidden;
  margin: 0 auto;
  cursor: pointer; }

.mCSB_scrollTools .mCSB_buttonDown {
  bottom: 0; }

/* 
------------------------------------------------------------------------------------------------------------------------
3. HORIZONTAL SCROLLBAR 
x-axis
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_horizontal.mCSB_inside > .mCSB_container {
  margin-right: 0;
  margin-bottom: 20px; }

.mCSB_horizontal.mCSB_outside > .mCSB_container {
  min-height: 100%; }

.mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden {
  margin-bottom: 0; }

/* non-visible scrollbar */
.mCSB_scrollTools.mCSB_scrollTools_horizontal {
  width: auto;
  height: 16px;
  top: auto;
  right: 0;
  bottom: 0;
  left: 0; }

.mCustomScrollBox + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal {
  bottom: -26px; }

/* scrollbar position: outside */
.mCSB_scrollTools.mCSB_scrollTools_horizontal a + .mCSB_draggerContainer {
  margin: 0 20px; }

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail {
  width: 100%;
  height: 2px;
  margin: 7px 0; }

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger {
  width: 30px;
  /* minimum dragger width */
  height: 100%;
  left: 0; }

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
  width: 100%;
  height: 4px;
  margin: 6px auto; }

.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
  height: 12px;
  /* auto-expanded scrollbar */
  margin: 2px auto; }

.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
  height: 8px;
  /* auto-expanded scrollbar */
  margin: 4px 0; }

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft,
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight {
  display: block;
  position: absolute;
  width: 20px;
  height: 100%;
  overflow: hidden;
  margin: 0 auto;
  cursor: pointer; }

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft {
  left: 0; }

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight {
  right: 0; }

/* 
------------------------------------------------------------------------------------------------------------------------
4. VERTICAL AND HORIZONTAL SCROLLBARS 
yx-axis 
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_container_wrapper {
  position: absolute;
  height: auto;
  width: auto;
  overflow: hidden;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin-right: 30px;
  margin-bottom: 30px; }

.mCSB_container_wrapper > .mCSB_container {
  padding-right: 30px;
  padding-bottom: 30px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_vertical {
  bottom: 20px; }

.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_horizontal {
  right: 20px; }

/* non-visible horizontal scrollbar */
.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden + .mCSB_scrollTools.mCSB_scrollTools_vertical {
  bottom: 0; }

/* non-visible vertical scrollbar/RTL direction/left-side scrollbar */
.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal {
  right: 0; }

/* RTL direction/left-side scrollbar */
.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal {
  left: 20px; }

/* non-visible scrollbar/RTL direction/left-side scrollbar */
.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal {
  left: 0; }

.mCS-dir-rtl > .mCSB_inside > .mCSB_container_wrapper {
  /* RTL direction/left-side scrollbar */
  margin-right: 0;
  margin-left: 30px; }

.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden > .mCSB_container {
  padding-right: 0; }

.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container {
  padding-bottom: 0; }

.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden {
  margin-right: 0;
  /* non-visible scrollbar */
  margin-left: 0; }

/* non-visible horizontal scrollbar */
.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden {
  margin-bottom: 0; }

/* 
------------------------------------------------------------------------------------------------------------------------
5. TRANSITIONS  
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_scrollTools,
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight {
  -webkit-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
  -moz-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
  -o-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
  transition: opacity .2s ease-in-out, background-color .2s ease-in-out; }

.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail {
  -webkit-transition: width .2s ease-out .2s, height .2s ease-out .2s,  margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,  margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out;
  -moz-transition: width .2s ease-out .2s, height .2s ease-out .2s,  margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,  margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out;
  -o-transition: width .2s ease-out .2s, height .2s ease-out .2s,  margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,  margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out;
  transition: width .2s ease-out .2s, height .2s ease-out .2s,  margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,  margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; }

/* 
------------------------------------------------------------------------------------------------------------------------
6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS  
------------------------------------------------------------------------------------------------------------------------
*/
/* 
----------------------------------------
6.1 THEMES 
----------------------------------------
*/
/* default theme ("light") */
.mCSB_scrollTools {
  opacity: 0.75;
  filter: "alpha(opacity=75)";
  -ms-filter: "alpha(opacity=75)"; }

.mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools,
.mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools {
  opacity: 0;
  filter: "alpha(opacity=0)";
  -ms-filter: "alpha(opacity=0)"; }

.mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag,
.mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag,
.mCustomScrollBox:hover > .mCSB_scrollTools,
.mCustomScrollBox:hover ~ .mCSB_scrollTools,
.mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools,
.mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools {
  opacity: 1;
  filter: "alpha(opacity=100)";
  -ms-filter: "alpha(opacity=100)"; }

.mCSB_scrollTools .mCSB_draggerRail {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.4);
  filter: "alpha(opacity=40)";
  -ms-filter: "alpha(opacity=40)"; }

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background-color: #0073CF;
  background-color: rgba(0, 115, 207, 0.75);
  filter: "alpha(opacity=75)";
  -ms-filter: "alpha(opacity=75)"; }

.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
  background-color: #0073CF;
  background-color: rgba(0, 115, 207, 0.85);
  filter: "alpha(opacity=85)";
  -ms-filter: "alpha(opacity=85)"; }

.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
  background-color: #0073CF;
  background-color: rgba(0, 115, 207, 0.9);
  filter: "alpha(opacity=90)";
  -ms-filter: "alpha(opacity=90)"; }

.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight {
  background-image: url(mCSB_buttons.png);
  /* css sprites */
  background-repeat: no-repeat;
  opacity: 0.4;
  filter: "alpha(opacity=40)";
  -ms-filter: "alpha(opacity=40)"; }

.mCSB_scrollTools .mCSB_buttonUp {
  background-position: 0 0;
  /* 
  sprites locations 
  light: 0 0, -16px 0, -32px 0, -48px 0, 0 -72px, -16px -72px, -32px -72px
  dark: -80px 0, -96px 0, -112px 0, -128px 0, -80px -72px, -96px -72px, -112px -72px
  */ }

.mCSB_scrollTools .mCSB_buttonDown {
  background-position: 0 -20px;
  /* 
  sprites locations
  light: 0 -20px, -16px -20px, -32px -20px, -48px -20px, 0 -92px, -16px -92px, -32px -92px
  dark: -80px -20px, -96px -20px, -112px -20px, -128px -20px, -80px -92px, -96px -92px, -112 -92px
  */ }

.mCSB_scrollTools .mCSB_buttonLeft {
  background-position: 0 -40px;
  /* 
  sprites locations 
  light: 0 -40px, -20px -40px, -40px -40px, -60px -40px, 0 -112px, -20px -112px, -40px -112px
  dark: -80px -40px, -100px -40px, -120px -40px, -140px -40px, -80px -112px, -100px -112px, -120px -112px
  */ }

.mCSB_scrollTools .mCSB_buttonRight {
  background-position: 0 -56px;
  /* 
  sprites locations 
  light: 0 -56px, -20px -56px, -40px -56px, -60px -56px, 0 -128px, -20px -128px, -40px -128px
  dark: -80px -56px, -100px -56px, -120px -56px, -140px -56px, -80px -128px, -100px -128px, -120px -128px
  */ }

.mCSB_scrollTools .mCSB_buttonUp:hover,
.mCSB_scrollTools .mCSB_buttonDown:hover,
.mCSB_scrollTools .mCSB_buttonLeft:hover,
.mCSB_scrollTools .mCSB_buttonRight:hover {
  opacity: 0.75;
  filter: "alpha(opacity=75)";
  -ms-filter: "alpha(opacity=75)"; }

.mCSB_scrollTools .mCSB_buttonUp:active,
.mCSB_scrollTools .mCSB_buttonDown:active,
.mCSB_scrollTools .mCSB_buttonLeft:active,
.mCSB_scrollTools .mCSB_buttonRight:active {
  opacity: 0.9;
  filter: "alpha(opacity=90)";
  -ms-filter: "alpha(opacity=90)"; }

/* theme: "dark" */
.mCS-dark.mCSB_scrollTools .mCSB_draggerRail {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.15); }

.mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.75); }

.mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
  background-color: rgba(0, 0, 0, 0.85); }

.mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
  background-color: rgba(0, 0, 0, 0.9); }

.mCS-dark.mCSB_scrollTools .mCSB_buttonUp {
  background-position: -80px 0; }

.mCS-dark.mCSB_scrollTools .mCSB_buttonDown {
  background-position: -80px -20px; }

.mCS-dark.mCSB_scrollTools .mCSB_buttonLeft {
  background-position: -80px -40px; }

.mCS-dark.mCSB_scrollTools .mCSB_buttonRight {
  background-position: -80px -56px; }

/* ---------------------------------------- */
/* theme: "light-2", "dark-2" */
.mCS-light-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail {
  width: 4px;
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.1);
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  border-radius: 1px; }

.mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  width: 4px;
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.75);
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  border-radius: 1px; }

.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
  width: 100%;
  height: 4px;
  margin: 6px auto; }

.mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.85); }

.mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.9); }

.mCS-light-2.mCSB_scrollTools .mCSB_buttonUp {
  background-position: -32px 0; }

.mCS-light-2.mCSB_scrollTools .mCSB_buttonDown {
  background-position: -32px -20px; }

.mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft {
  background-position: -40px -40px; }

.mCS-light-2.mCSB_scrollTools .mCSB_buttonRight {
  background-position: -40px -56px; }

/* theme: "dark-2" */
.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.1);
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  border-radius: 1px; }

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.75);
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  border-radius: 1px; }

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.85); }

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.9); }

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp {
  background-position: -112px 0; }

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown {
  background-position: -112px -20px; }

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft {
  background-position: -120px -40px; }

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight {
  background-position: -120px -56px; }

/* ---------------------------------------- */
/* theme: "light-thick", "dark-thick" */
.mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail,
.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail {
  width: 4px;
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.1);
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px; }

.mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  width: 6px;
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.75);
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px; }

.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail {
  width: 100%;
  height: 4px;
  margin: 6px 0; }

.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
  width: 100%;
  height: 6px;
  margin: 5px auto; }

.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.85); }

.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.9); }

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp {
  background-position: -16px 0; }

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown {
  background-position: -16px -20px; }

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft {
  background-position: -20px -40px; }

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight {
  background-position: -20px -56px; }

/* theme: "dark-thick" */
.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.1);
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px; }

.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.75);
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px; }

.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.85); }

.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.9); }

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp {
  background-position: -96px 0; }

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown {
  background-position: -96px -20px; }

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft {
  background-position: -100px -40px; }

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight {
  background-position: -100px -56px; }

/* ---------------------------------------- */
/* theme: "light-thin", "dark-thin" */
.mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail {
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.1); }

.mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  width: 2px; }

.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail {
  width: 100%; }

.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
  width: 100%;
  height: 2px;
  margin: 7px auto; }

/* theme "dark-thin" */
.mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.15); }

.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.75); }

.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.85); }

.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.9); }

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp {
  background-position: -80px 0; }

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown {
  background-position: -80px -20px; }

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft {
  background-position: -80px -40px; }

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight {
  background-position: -80px -56px; }

/* ---------------------------------------- */
/* theme "rounded", "rounded-dark", "rounded-dots", "rounded-dots-dark" */
.mCS-rounded.mCSB_scrollTools .mCSB_draggerRail {
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.15); }

.mCS-rounded.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger {
  height: 14px; }

.mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  width: 14px;
  margin: 0 1px; }

.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger {
  width: 14px; }

.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
  height: 14px;
  margin: 1px 0; }

.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
  width: 16px;
  /* auto-expanded scrollbar */
  height: 16px;
  margin: -1px 0; }

.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
  width: 4px;
  /* auto-expanded scrollbar */ }

.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
  height: 16px;
  /* auto-expanded scrollbar */
  width: 16px;
  margin: 0 -1px; }

.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
  height: 4px;
  /* auto-expanded scrollbar */
  margin: 6px 0; }

.mCS-rounded.mCSB_scrollTools .mCSB_buttonUp {
  background-position: 0 -72px; }

.mCS-rounded.mCSB_scrollTools .mCSB_buttonDown {
  background-position: 0 -92px; }

.mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft {
  background-position: 0 -112px; }

.mCS-rounded.mCSB_scrollTools .mCSB_buttonRight {
  background-position: 0 -128px; }

/* theme "rounded-dark", "rounded-dots-dark" */
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.75); }

.mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.15); }

.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.85); }

.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.9); }

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp {
  background-position: -80px -72px; }

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown {
  background-position: -80px -92px; }

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft {
  background-position: -80px -112px; }

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight {
  background-position: -80px -128px; }

/* theme "rounded-dots", "rounded-dots-dark" */
.mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail {
  width: 4px; }

.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
  background-color: transparent;
  background-position: center; }

.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg==");
  background-repeat: repeat-y;
  opacity: 0.3;
  filter: "alpha(opacity=30)";
  -ms-filter: "alpha(opacity=30)"; }

.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
  height: 4px;
  margin: 6px 0;
  background-repeat: repeat-x; }

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp {
  background-position: -16px -72px; }

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown {
  background-position: -16px -92px; }

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft {
  background-position: -20px -112px; }

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight {
  background-position: -20px -128px; }

/* theme "rounded-dots-dark" */
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII="); }

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp {
  background-position: -96px -72px; }

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown {
  background-position: -96px -92px; }

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft {
  background-position: -100px -112px; }

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight {
  background-position: -100px -128px; }

/* ---------------------------------------- */
/* theme "3d", "3d-dark", "3d-thick", "3d-thick-dark" */
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background-repeat: repeat-y;
  background-image: -moz-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
  background-image: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0.5)), color-stop(100%, rgba(255, 255, 255, 0)));
  background-image: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
  background-image: -o-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
  background-image: -ms-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); }

.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
  background-repeat: repeat-x;
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.5)), color-stop(100%, rgba(255, 255, 255, 0)));
  background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
  background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); }

/* theme "3d", "3d-dark" */
.mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger,
.mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger {
  height: 70px; }

.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger {
  width: 70px; }

.mCS-3d.mCSB_scrollTools,
.mCS-3d-dark.mCSB_scrollTools {
  opacity: 1;
  filter: "alpha(opacity=30)";
  -ms-filter: "alpha(opacity=30)"; }

.mCS-3d.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  border-radius: 16px; }

.mCS-3d.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail {
  width: 8px;
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.2);
  box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.5), inset -1px 0 1px rgba(255, 255, 255, 0.2); }

.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
  background-color: #555; }

.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  width: 8px; }

.mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
  width: 100%;
  height: 8px;
  margin: 4px 0;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5), inset 0 -1px 1px rgba(255, 255, 255, 0.2); }

.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
  width: 100%;
  height: 8px;
  margin: 4px auto; }

.mCS-3d.mCSB_scrollTools .mCSB_buttonUp {
  background-position: -32px -72px; }

.mCS-3d.mCSB_scrollTools .mCSB_buttonDown {
  background-position: -32px -92px; }

.mCS-3d.mCSB_scrollTools .mCSB_buttonLeft {
  background-position: -40px -112px; }

.mCS-3d.mCSB_scrollTools .mCSB_buttonRight {
  background-position: -40px -128px; }

/* theme "3d-dark" */
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.1);
  box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1); }

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1); }

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp {
  background-position: -112px -72px; }

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown {
  background-position: -112px -92px; }

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft {
  background-position: -120px -112px; }

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight {
  background-position: -120px -128px; }

/* ---------------------------------------- */
/* theme: "3d-thick", "3d-thick-dark" */
.mCS-3d-thick.mCSB_scrollTools,
.mCS-3d-thick-dark.mCSB_scrollTools {
  opacity: 1;
  filter: "alpha(opacity=30)";
  -ms-filter: "alpha(opacity=30)"; }

.mCS-3d-thick.mCSB_scrollTools,
.mCS-3d-thick-dark.mCSB_scrollTools,
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer {
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  border-radius: 7px; }

.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px; }

.mCSB_inside + .mCS-3d-thick.mCSB_scrollTools_vertical,
.mCSB_inside + .mCS-3d-thick-dark.mCSB_scrollTools_vertical {
  right: 1px; }

.mCS-3d-thick.mCSB_scrollTools_vertical,
.mCS-3d-thick-dark.mCSB_scrollTools_vertical {
  box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5); }

.mCS-3d-thick.mCSB_scrollTools_horizontal,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal {
  bottom: 1px;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5); }

.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4);
  width: 12px;
  margin: 2px;
  position: absolute;
  height: auto;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0; }

.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4); }

.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
  background-color: #555; }

.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
  height: 12px;
  width: auto; }

.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.05);
  box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1); }

.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail {
  background-color: transparent; }

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp {
  background-position: -32px -72px; }

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown {
  background-position: -32px -92px; }

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft {
  background-position: -40px -112px; }

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight {
  background-position: -40px -128px; }

/* theme: "3d-thick-dark" */
.mCS-3d-thick-dark.mCSB_scrollTools {
  box-shadow: inset 0 0 14px rgba(0, 0, 0, 0.2); }

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal {
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.2); }

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4), inset -1px 0 0 rgba(0, 0, 0, 0.2); }

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), inset 0 -1px 0 rgba(0, 0, 0, 0.2); }

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
  background-color: #777; }

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer {
  background-color: #fff;
  background-color: rgba(0, 0, 0, 0.05);
  box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1); }

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail {
  background-color: transparent; }

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp {
  background-position: -112px -72px; }

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown {
  background-position: -112px -92px; }

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft {
  background-position: -120px -112px; }

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight {
  background-position: -120px -128px; }

/* ---------------------------------------- */
/* theme: "minimal", "minimal-dark" */
.mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical,
.mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical {
  right: 0;
  margin: 12px 0; }

.mCustomScrollBox.mCS-minimal + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal {
  bottom: 0;
  margin: 0 12px; }

/* RTL direction/left-side scrollbar */
.mCS-dir-rtl > .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical,
.mCS-dir-rtl > .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical {
  left: 0;
  right: auto; }

.mCS-minimal.mCSB_scrollTools .mCSB_draggerRail,
.mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail {
  background-color: transparent; }

.mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger,
.mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger {
  height: 50px; }

.mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger {
  width: 50px; }

.mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.2);
  filter: "alpha(opacity=20)";
  -ms-filter: "alpha(opacity=20)"; }

.mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.5);
  filter: "alpha(opacity=50)";
  -ms-filter: "alpha(opacity=50)"; }

/* theme: "minimal-dark" */
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.2);
  filter: "alpha(opacity=20)";
  -ms-filter: "alpha(opacity=20)"; }

.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.5);
  filter: "alpha(opacity=50)";
  -ms-filter: "alpha(opacity=50)"; }

/* ---------------------------------------- */
/* theme "light-3", "dark-3" */
.mCS-light-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail {
  width: 6px;
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.2); }

.mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  width: 6px; }

.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail {
  width: 100%;
  height: 6px;
  margin: 5px 0; }

.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
  width: 12px; }

.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
  height: 12px;
  margin: 2px 0; }

.mCS-light-3.mCSB_scrollTools .mCSB_buttonUp {
  background-position: -32px -72px; }

.mCS-light-3.mCSB_scrollTools .mCSB_buttonDown {
  background-position: -32px -92px; }

.mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft {
  background-position: -40px -112px; }

.mCS-light-3.mCSB_scrollTools .mCSB_buttonRight {
  background-position: -40px -128px; }

/* theme "dark-3" */
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.75); }

.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.85); }

.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.9); }

.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.1); }

.mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp {
  background-position: -112px -72px; }

.mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown {
  background-position: -112px -92px; }

.mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft {
  background-position: -120px -112px; }

.mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight {
  background-position: -120px -128px; }

/* ---------------------------------------- */
/* theme "inset", "inset-dark", "inset-2", "inset-2-dark", "inset-3", "inset-3-dark" */
.mCS-inset.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail {
  width: 12px;
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.2); }

.mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  width: 6px;
  margin: 3px 5px;
  position: absolute;
  height: auto;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0; }

.mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
  height: 6px;
  margin: 5px 3px;
  position: absolute;
  width: auto;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0; }

.mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
  width: 100%;
  height: 12px;
  margin: 2px 0; }

.mCS-inset.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp {
  background-position: -32px -72px; }

.mCS-inset.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown {
  background-position: -32px -92px; }

.mCS-inset.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft {
  background-position: -40px -112px; }

.mCS-inset.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight {
  background-position: -40px -128px; }

/* theme "inset-dark", "inset-2-dark", "inset-3-dark" */
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.75); }

.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.85); }

.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.9); }

.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.1); }

.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp {
  background-position: -112px -72px; }

.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown {
  background-position: -112px -92px; }

.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft {
  background-position: -120px -112px; }

.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight {
  background-position: -120px -128px; }

/* theme "inset-2", "inset-2-dark" */
.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail {
  background-color: transparent;
  border-width: 1px;
  border-style: solid;
  border-color: #fff;
  border-color: rgba(255, 255, 255, 0.2);
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail {
  border-color: #000;
  border-color: rgba(0, 0, 0, 0.2); }

/* theme "inset-3", "inset-3-dark" */
.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail {
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.6); }

.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.6); }

.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.75); }

.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.85); }

.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.9); }

.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.75); }

.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.85); }

.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.9); }

/* ---------------------------------------- */
/* wysibb */
@font-face {
  font-family: 'WysiBBiconFont';
  src: url("../fonts/wysibbiconfont-wb.eot"); }
@font-face {
  font-family: 'WysiBBiconFont';
  src: url(data:application/x-font-woff;charset=utf-8;base64,d09GRgABAAAAABJ8ABEAAAAAGmAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAABgAAAABoAAAAcZibEWkdERUYAAAGcAAAAHQAAACAASwAET1MvMgAAAbwAAABGAAAAVmNj7eZjbWFwAAACBAAAAE0AAAFaADXUDGN2dCAAAAJUAAAAAgAAAAIAAAAAZnBnbQAAAlgAAAGxAAACZVO0L6dnYXNwAAAEDAAAAAgAAAAIAAAAEGdseWYAAAQUAAAL7AAAELBUmhy9aGVhZAAAEAAAAAAvAAAANgEcbE1oaGVhAAAQMAAAACAAAAAkDtEAaGhtdHgAABBQAAAATwAAAHjV7x9TbG9jYQAAEKAAAAA+AAAAPj+yO3JtYXhwAAAQ4AAAACAAAAAgATwBHG5hbWUAABEAAAAAvwAAAYodoTk9cG9zdAAAEcAAAACEAAABNtL4DyxwcmVwAAASRAAAAC4AAAAusPIrFHdlYmYAABJ0AAAABgAAAAbgW1DOeNpjYGBgZACCM7aLzoPpLxM2QumbAFW5CKYAAHjaY2BkYGDgA2IJBhBgYmAEQlkgZgHzGAAFiQBQAAAAeNpjYGS/zTiBgZWBhVWfdToDA6MchGa+xpDMJMDAwMTAyswABwIIJkNAmmsKgwMD7wcGtnP/zjEAScaoBqABIDkAv14LkQAAeNpjYGBgZoBgGQZGBhAIAfIYwXwWBgsgzcXAwcAEhAwMvA8kPjD8/w9WxfuAAcL+/02BRUAWqhcKGNkY4AKMTFDzURQwDHsAAJNvCw4AAAAAAAAAeNpdUbtOW0EQ3Q0PA4HE2CA52hSzmZDGe6EFCcTVjWJkO4XlCGk3cpGLcQEfQIFEDdqvGaChpEibBiEXSHxCPiESM2uIojQ7O7NzzpkzS8qRqnfpa89T5ySQwt0GzTb9Tki1swD3pOvrjYy0gwdabGb0ynX7/gsGm9GUO2oA5T1vKQ8ZTTuBWrSn/tH8Cob7/B/zOxi0NNP01DoJ6SEE5ptxS4PvGc26yw/6gtXhYjAwpJim4i4/plL+tzTnasuwtZHRvIMzEfnJNEBTa20Emv7UIdXzcRRLkMumsTaYmLL+JBPBhcl0VVO1zPjawV2ys+hggyrNgQfYw1Z5DB4ODyYU0rckyiwNEfZiq8QIEZMcCjnl3Mn+pED5SBLGvElKO+OGtQbGkdfAoDZPs/88m01tbx3C+FkcwXe/GUs6+MiG2hgRYjtiKYAJREJGVfmGGs+9LAbkUvvPQJSA5fGPf50ItO7YRDyXtXUOMVYIen7b3PLLirtWuc6LQndvqmqo0inN+17OvscDnh4Lw0FjwZvP+/5Kgfo8LK40aA4EQ3o3ev+iteqIq7wXPrIn07+xWgAAAAABAAH//wAPeNq9V39sG9d9f9873lE8/TgeeSR1lkj57iSeFEk+6yiSVik7DBzFLZNFdk2jUZsImzkkCuq0sIE6g6khPxZ5gFPM66BglVEYqQ00GVYP7+hu+SMuJgORBqg4N0VbIW5WF2mwzFvQFuiP2I3E530f5bpeWnTbPxP0eO993yPf9+fn8z0C5K6/MUIA3iU1+aAkkiGSIXTIpVJATY92ubQnR+MB0HtcfxiGyc6x/uy9UCiBVyhCITsMFq5yQ+AlVZBxFQYZ91TQ7SGA6xEpIqmV2YIBGTVjzRmSIhlQgwdUFWd65ZjDfuw8W9XliMGeYbQmKY46Mi0OlT11RFEUSz2+uX5ct1RCBDh2KyS/gfqJ5OPkWdJAtYepGNDdLk0HdJ/b6BrwcrkcDQd02AP6CZfuXad60ND3KsMXy3pHZLixV+fTvWJkmIY8qkd9C4bpRNCYsLh8QkC56zWsCb6yBiPDfgWGfUvXYjQzQfx9aS3W6CnunZiY2DkmmQlTy49zu9Ogc7NlfMb1VEYs5LxiwRGztmPthvGcmbtzIhENy2HZsZyskxW1cZTBMemTH/6DDkXQVbU8K0lKSR8tOdPKyGQNJLUwpijwgK8rpSlVkvR6/XrjyFLZgcKMmrkmXXEUZUQpOxeemrlFZsq6IUnSaHVBODQloVy11LJxg30w9+7sLDils1W85LkqxrmBcX4B/Xgvhp0aLvqIbvdoxKXDOTqJcS67/n0YZz+Chl8kYq7Qn5qgkxrdg2aD3AdoXRHDr6EHkuEkDznax8108twkZ1LIm3lTy3mpDKSSuaLnZF3I2iY6ABqSYivS2JGpCwZ7AyZR4cF0WVFBvaFDV7kEMMneGF0pOQ8qipRGk5NJSdn4jiLZ4svoG6WW1tlfXV7RM9Z0WlWs6bJhHB+7DMcy6sOGis740t8YxgWeK6u3nghvSG2knWwnB0ijl+fK9oD2uDQa0JhLEwFmAFDTpR3rDbkt5nke7Q1ob9SPYkp0BzTt8eQgfk+vFvMlcWLCj0VxJgs8+BEhFYFiBJyIMAn5XN7euRvMtDAMiVwaTFiFF9mJFTgJJ9dYHRbW2Al2QvzO5iacmT27yR4P7WFf4PsLrL62degEnNz4nDGYnp8+ePhCfa4yTVo2kLnwhnwv2mCRhwjtcGlfQDMu1QIad1FHoLZLO7n6ca4+bvZFfQ3V7+EB9fu5+n0dqHQbQfW1DM7aIx9RX7utfx6fdyz4wwb8XvUZhaju2PWKVFZrr942gYTIU0QKr0l/gjUbJh0kQQYITfAYAE26tGudxgLa4fkprmo0cUfBoqmZKRyoYxHIeMFLJnTZeir82M3zS3L219eKMA/VTWiwE0+fP3r0vCQ9en7jZwWxn8Xfbb4nPH/u6aenq8fxfpEcIyvhldDLeLNBXPIYoaJLR3K0LaDbPK5CKqCqS60cL4IsJsROl8I6bQ9oe9TPoCvvCfwxxIBMuxb7x3A02b3NxmIgfrINdYV70K1qCmdkiGsdi8ZyJoKiaWWx7gs5cwdg0qNfExKKUYQ1sAfwSCwq4Eb22OITcKhSzzR/ZRcKttCeqVfY389BQmyyutBuF4pW81cog+rc4uIc+3plXnyeHWbvLM6XBj9wJuuLza9dvXr09pz9uLXF84bUCQl/WXqcpEiaaKQRx9wHzBu/rwXe8UIRleiXvGQqJnZB2DK32zvAEaQCZPudujJoHK4JN4XE8WPds7PG0eM2yzeHK3O1dEUMz8JyjS1Vxb98daE2LUmzx5nJsvUZSaoeAf3cFBQrmyUed5mM3HoF4/5oK+7tRCVx1KZMKMF6y1EIaKdHQ5gHOU4ymkfbEIVyNBLQBMag26Vk3Q+1YU6LgS8rnucbLdVTmqnB7RG/az4C97F/3ho3pMc/PLM1ZrhE2AVT7HWsUpxvfPGjki1dK+zD8JocR6SYJNPkIPkU+Qy5RGjURdaj+116IKCCd7H7wP62VmkdiHIkqbr0EPLj9nWN7gou9h+q4mYxoIeidITLnIA+4tJyjs4E9OGATnn0QZd+HNP+UZea6xeJNvSJ/pSHX6X7Aror6us8yQbQ4o6gIY99DOu5oXe0eGsb0tBjuLvLRPbp7tmN7EN17WKq96E/wlT0O/Zh/kXun8CkPLAfiSqCiVgYRwJOIiiH+QcHaBTkxx2bP73dYIt5LrCt/Din8VTrqMxr39Nt0JO5Vrramm3pCPO2BXf5umJcNxzDGOy+bhgrxhMG/q8Y5bMrCL/fc3TDMKxTK4bB3lIVUFWlcs0wDh82hG2/DctCzU4/7Ri6U8/YtdIYHPYckL89MzemWrphPTtiGLXDwmU9jc0BvFRjVzaGfjdqErl062C4jjELY24ZxMSeZbFV22rA0wdRBZF9MMcbg36PtrvYFPD+hdc2Jlkk6vdgbW8Bpo0zjJYT9TtxJgW8x/F7IujVaAxd3ad9Iyyo3Qr3tWNrsW/IYleqnTNip+bHE9zvsW7kyVBbJ/AzaQzTRYl0RHDBIQGz6q4h6nlTz+uh7f0xjmoIav23n5fghvAm3GRtzZ3sBWgIf4ro9nDzK774L+w9doT9e7pan5mpw+bM/MGD86EePNUGN/k3Nj73m7PsYWEbSBKcXl0R+uar1fmZmdYn55IzZEF+PPR51MEkZMCEvMbRyJITmp5E1v0dwRnQwbYMdtCwbeN1ePHO0rKM1xfgF3H4O8Oyu9mnDIvl/9uStHD3NBkLvyKNY9Vb5GPkS4Rj7a4cD0/Wo9ZvmAyrSWnhcSigHlZ+iVc+7QwanYTnfmc8wj/D2JZ1Rv1uDI+JFN1iOjPqD+G6EDSGCvzokM2PDrlYLJMYv+5OjJ+iIj6bhMejPTvKQzak+c4IhgwZRhtPmV44oaPNKU0vmrxHa6G1luedHQ4JuzvTc7RxFLf6OC+s8SOnM8KTKsTZOxl0ypRuNF/ICH8u9LG/hSdxeDo8qEI3+6GuCk9mIN38C6Mcel8B6YiibiZ1UGsKwDI8d/kye2b5Rk1VxZ+qyhEpspHAHleCOezNrmBvprUYK92KFrZWZi6v7RbNtKilPop/cw14lf9/eOYsvMl2wpunth61FbBXN9Tr19WNVfbDMaiyr8P3ocyW2XBr/gMosRUeK/gWGZM/K33lNlb3E47MCMuI1QjUiMwRrB1sPto4L/IiQfdxUruDCt8KvbzxS/HPmr3CfmHXBx80fw2X2P3iQ0Jf851WH/MS2nRO4r+uoEVUxp8KGm0yD1sbRJCb2l2/o/WzA5iIpmOG46YIL8ElWIRvsmcm2eHSKZAWanjNHy8vw2W4wHMMhB0wKEdCe5DxCH5P2CG+zWKhPZv/iXcKO245ckT+Au5JfDcibm2zOPwEfipMbr4fmhATm+/zHgV9rshXQu/c4ap+ctv2LT+0PMAd0Il+iLq8w+Kqcg/cPeZ+C3F8KCsrMLO6Cp9eW4PZ1dU/eE/rt2/f07rzf3HPxr5Qx2an+DbeE9JWV9m5tTX2tf/hnv+7PeLbmwOhzo1f/D/Y80u0Z+D32AMwx96Tr8jPk1GykwDd0cIIvAWifi9CAEKKGvXjOEsGNBn1wzjLBr67lae5qBQa6DdgfAd0Ace2Ql7LaXoX7OCIt0fICCgU5FB/VoC5RRgEGQDUpatXl1ZWF/96be300deuXXvt6NLP2VvsrZ8vYV987sX6wmnYLzRPLY+OLp9qpupzT8wL+5v02dcGB//pOeE/Tl87WiwevXa6KV5i312amlqC0RYmwo9IRX5E6iUOyZP7yUyrE/YCbgDinh1QO0oFdNUU+m2dDga04NHBKDeEbgtomXcVfYH/AKJbeRCJ3pugruanezkDlTwEuW3poUKLdEAv5rC7Q1aPhrsA2T+VwNez7dj25aMD+f7iOL5+DqEUNHxDE7Cztq0swt54cbzIX9kS2As48KOuyYKDr1xSerCsQ1xIwOjJcpV9FRQ4NXMdvfGvKsDl09VSyTtZny5J0wslR39kqhH6NxXsqerVNfbKfSMZ1TLKmbMVgIPS9Nr5ygiom58BO22kq/ctPjJ9HOYXlpH+BzPO2ExlUiVACLvSRuQrvKYNgLbW8iZ3338BJ32bh3jaY2BkYGAA4hPnzHXi+W2+MshzMIDAmS8TbiHof+c4GNjOAbkcDEwgUQBg/gzIAHjaY2BkYGA7928ZAwPnYgaGHwwcDAxAERQgBwBxfwRFeNrjYIAAxvkMDEwrGRg4FzMwcDAwPgbiIiDeBMTHIJghF4iLOFgYqoG0DhB7AfEeoNwsIN0PpDOA+DQQT+VgYNKDYLAYOr4Psg8An9sPKgAAAAAAAAAAAAAAAAgAWAD8AW4B0AIyAnIC7AMuA4QEXgT2BS4FygYEBjQGYAZuBoQGuAbsByAHVAe4CEoIWAAAAAEAAAAeAFwABgAAAAAAAgABAAIAFgAAAQAAvAAAAAB42n2QvQ4BQRSFv2UJjVKl2FoQFpEoRXQaBTWCSIRkUeg8kKdQ8RKewgM4s3tJNJvJ3Dn355w5M0CBNVk8v4hHBQxnKClLcJYpVcM+Na6Gc5S5Gc5r+m74ofrL8JMmb2ZcOLJloLVlyYE9oziemLBiw5kdc6Jf1Z2R6isCQhpSCehrpyklEy161BVDxVA8h9JZ/w6myqJ42vWdnrs9TWEmxkK/+NVLGGPjD9Vdmq9A9Y5cNukqtuNXmccPQmg2/wB42n3POQ7CQAxG4XnDEvZ9B3GGcSABSpbkLjR03J8BflosWZ+7Jzvv/s82Ls7jqVClRp2EBk1atOnQpUefAUNGjJkwZcacBUtWrNkkz8c9hHB7W8RDmkzlTu5lJnN5kEd5kmd5kVf56xWy/Grqm/qmvqlv6pv6pr6pb59+Gf94Ab4GPNu4Af+FsAGNAEuwCFBYsQEBjlmxRgYrWCGwEFlLsBRSWCGwgFkdsAYrXFhZsBQrAAAAAVDO4FoAAA==) format("woff"), url("../fonts/wysibbiconfont-wb.ttf") format("truetype");
  font-weight: normal;
  font-style: normal; }
html {
  height: 100% !important; }

/* RESPONSIBLE */
.wysibb {
  border: 1px solid #ddd;
  position: relative;
  background: #fff;
  font-size: 12px;
  width: 87%;
  max-width: 550px;
  min-width: 250px;
  float: left;
  margin: 20px 30px;
  margin-top: 10px;
  box-shadow: 0px 0px 7px 1px #575757;
  max-height: 150px; }
  @media only screen and (max-width: 500px) {
    .wysibb {
      max-height: 300px;
      height: 300px; } }

.wysibb button:focus, .wysibb button:active, #wbbmodal button:focus, #wbbmodal button:active {
  outline: 0; }

.wysibb-body {
  overflow-x: auto !important;
  padding: 5px;
  overflow: scroll; }

.wysibb-body ul, .wysibb-body ol {
  padding: 0 0 0 30px; }

.wysibb-texarea, .wysibb-texarea:active {
  border: none !important;
  margin: 0 !important;
  outline: none !important;
  padding: 0 !important;
  overflow: scroll;
  /*min-height: 150px;
  max-height: 150px;*/ }

/* MOBILE DEFAULT STYLES*/
.wysibb .wysibb-toolbar {
  float: left;
  width: 70px;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 0;
  border-right: 1px solid #ccc; }
  @media only screen and (min-width: 500px) {
    .wysibb .wysibb-toolbar {
      height: 150px; } }

.wysibb .wysibb-text {
  margin: 0 0 0 70px; }

.wysibb .wysibb-toolbar .modeSwitch {
  display: block;
  position: relative;
  right: 0;
  top: 0;
  border: 0; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container {
  border: 0; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn, .wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-select {
  width: 60px;
  max-width: 96%; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container select.wbb-selectbox {
  height: 30px;
  max-width: 96%;
  margin: 1px 0;
  display: inline-block;
  background: transparent;
  border: 0; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-select {
  display: none; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn {
  display: inline-block;
  height: 32px;
  vertical-align: middle;
  padding: 0px 1px;
  cursor: pointer;
  margin: 0 0 0 1px;
  font-size: 12px;
  border: 1px solid transparent;
  box-sizing: border-box; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn:hover span.btn-tooltip {
  display: none; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .dis, .wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.dis:hover {
  opacity: 0.3;
  cursor: default;
  overflow: hidden;
  border: 0;
  padding: 1px 2px;
  background: transparent; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.on, .wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.on:hover, .wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn:active {
  background: #ccc;
  padding: 0px 1px;
  box-shadow: inset 0px 0px 3px #aaa;
  border: 1px solid #aaa;
  border-radius: 0px; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn span.btn-inner {
  display: block;
  height: 26px;
  min-width: 26px;
  margin: 2px; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn span.btn-tooltip {
  display: none;
  background: #333;
  border: 1px solid #fff;
  position: absolute;
  line-height: 20px;
  font-size: 11px;
  padding: 3px 10px;
  bottom: 35px;
  left: 0;
  color: #fff;
  border-radius: 0px;
  white-space: nowrap;
  z-index: 10000; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn span.btn-tooltip ins {
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px solid #333;
  position: absolute;
  bottom: -5px;
  left: 3px; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn span.btn-text {
  text-transform: uppercase;
  font-family: sans-serif,Verdana,Tahoma;
  font-weight: bold;
  line-height: 28px;
  text-align: center; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn:hover {
  padding: 0px 1px;
  border: 1px solid transparent;
  border-radius: 0px;
  background: #eee; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn .fonticon {
  color: #333;
  font-family: 'WysiBBiconFont';
  font-size: 18px;
  line-height: 28px;
  text-shadow: 0px 1px 0px #fff;
  text-align: center;
  speak: none; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn:hover .fonticon {
  color: #000; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.on .fonticon {
  text-shadow: none;
  color: #000; }

.wysibb .wysibb-toolbar .modeSwitch .wysibb-toolbar-btn {
  /* width:46px; */ }

.modesw {
  font-weight: bold;
  font-size: 1em;
  line-height: 28px;
  text-align: center;
  display: block;
  text-transform: uppercase; }

.ve-tlb-bold {
  background: url(./img/icons.png) 0 0 no-repeat;
  width: 20px; }

.ve-tlb-italic {
  background: url(./img/icons.png) 0 -40px no-repeat;
  width: 20px; }

.ve-tlb-underline {
  background: url(./img/icons.png) 0 -20px no-repeat;
  width: 20px; }

.ve-tlb-strike {
  background: url(./img/icons.png) 0 -120px no-repeat;
  width: 20px; }

.ve-tlb-link {
  background: url(./img/icons.png) 0 -80px no-repeat;
  width: 20px; }

.ve-tlb-unlink {
  background: url(./img/icons.png) 0 -100px no-repeat;
  width: 20px; }

.ve-tlb-img {
  background: url(./img/icons.png) 0 -60px no-repeat;
  width: 20px; }

.ve-tlb-quote {
  background: url(./img/icons.png) 0 -140px no-repeat;
  width: 20px; }

.ve-tlb-spoiler {
  background: url(./img/icons.png) 0 -160px no-repeat;
  width: 20px; }

.ve-tlb-list {
  background: url(./img/icons.png) 0 -180px no-repeat;
  width: 20px; }

.ve-tlb-bbcode {
  background: url(./img/icons.png) 0 -200px no-repeat;
  width: 40px !important;
  margin: 1px auto !important;
  height: 20px; }

.ve-tlb-numlist {
  background: url(./img/icons.png) 0 -220px no-repeat;
  width: 20px; }

.ve-tlb-textleft {
  background: url(./img/icons.png) 0 -240px no-repeat;
  width: 20px; }

.ve-tlb-textcenter {
  background: url(./img/icons.png) 0 -260px no-repeat;
  width: 20px; }

.ve-tlb-textright {
  background: url(./img/icons.png) 0 -280px no-repeat;
  width: 20px; }

.ve-tlb-offtopic {
  background: url(./img/icons.png) 0 -300px no-repeat;
  width: 20px; }

.ve-tlb-code {
  background: url(./img/icons.png) 0 -320px no-repeat;
  width: 20px; }

.ve-tlb-spoiler {
  background: url(./img/icons.png) 0 -340px no-repeat;
  width: 20px; }

.ve-tlb-sub {
  background: url(./img/icons.png) 0 -360px no-repeat;
  width: 20px; }

.ve-tlb-sup {
  background: url(./img/icons.png) 0 -380px no-repeat;
  width: 20px; }

.ve-tlb-colorpick {
  width: 50px;
  height: 24px;
  line-height: 24px;
  text-align: center; }

.ve-tlb-table {
  background: url(./img/icons.png) 0 -460px;
  width: 20px; }

.ve-tlb-smilebox {
  background: url(./img/icons.png) 0 -480px;
  width: 20px; }

.ve-tlb-video {
  background: url(./img/icons.png) 0 -500px;
  width: 20px; }

.ve-tlb-removeformat {
  background: url(./img/icons.png) 0 -540px;
  width: 20px; }

.tthotkey {
  color: #ddd;
  font-size: 9px; }

/* END TOOLBAR */
/* CONTENT */
/* .wysibb-body{text-align:left;min-width:0 !important;overflow:auto !important;margin:0 !important;padding:0 !important;} */
.wysibb-text-editor {
  outline: none;
  height: 290px;
  max-height: 290px; }
  @media (min-width: 500px) {
    .wysibb-text-editor {
      height: 140px;
      max-height: 140px; } }
  @media (min-width: 768px) {
    .wysibb-text-editor {
      height: 100px;
      max-height: 100px; } }

.bottom-resize-line {
  display: none;
  height: 5px;
  cursor: ns-resize; }

.bottom-resize-line:hover, .bottom-resize-line.drag {
  background: #eee; }

/* END CONTENT */
/* DEFAULT STYLES */
.wbbtab {
  margin-left: 30px; }

/* END DEFAULT STYLES */
/* DROPDOWN */
.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-dropdown, .wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-dropdown:active {
  padding-right: 10px;
  background: transparent;
  border: 1px solid transparent;
  box-shadow: none;
  position: relative; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-dropdown:hover {
  background: #eee;
  border: 1px solid transparent; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-dropdown.on, .wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-dropdown.on:active {
  border: 1px solid #aaa;
  background: #ccc;
  box-shadow: inset 0px 0px 3px #aaa; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-dropdown ins.ar {
  display: block;
  position: absolute;
  right: 10%;
  top: 0px;
  width: 9px;
  height: 24px;
  /*  background: url(./img/icons.png) -8px -400px; */
  cursor: default;
  text-decoration: none;
  font-size: 14px;
  padding: 0 2px;
  line-height: 24px; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-dropdown:hover, .wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-dropdown.on {
  padding-right: 10px;
  /*   background-position: 14px -399px; */ }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-dropdown.dis, .wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-dropdown.dis:hover {
  /*   padding-right:9px; */ }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn .wbb-list {
  display: none;
  position: fixed;
  top: 10px;
  left: 3%;
  border: 1px solid #bbb;
  box-shadow: 0px 0px 3px #aaa;
  width: 90%;
  padding: 5px;
  background: #fff;
  max-height: 90%;
  overflow: auto;
  z-index: 1000; }

/* END DROPDOWN */
/* COLORPICKER */
.ve-tlb-colorpick .cp-line {
  display: block;
  position: absolute;
  width: 60%;
  height: 3px;
  background: black;
  bottom: 3px;
  left: 20%; }

.wbb-list .sc {
  width: 23%;
  height: 30px;
  margin: 0 0 1% 1%;
  display: inline-block;
  *display: inline;
  zoom: 1;
  cursor: pointer;
  border: 1px solid #fff; }

.wbb-list .sc:hover {
  border: 1px solid #333; }

.wbb-list .nc {
  height: 24px;
  line-height: 24px;
  text-align: center;
  color: #666;
  margin: 0 1px 5px 1px; }

.wbb-list .nc:hover {
  background: #eee; }

.wbb-list .pl {
  display: block;
  height: 5px; }

/* END COLORPICKER */
/* TABLE PICKER */
.tbl-sel {
  border: 1px solid #ddd;
  position: absolute;
  cursor: pointer;
  box-sizing: border-box; }

.tbl-sel:hover {
  background: #eee; }

.wbb-table td {
  border: 1px dashed #DDD;
  padding: 3px;
  margin: 5px;
  min-width: 5px;
  min-height: 15px; }

/* TABLE PICKER */
/* SELECT */
.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-select, .wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-select.dis:hover, .wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-select:active {
  width: 100px;
  padding: 1px 1px 1px 5px;
  border: 1px solid transparent;
  background: transparent;
  box-shadow: none; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-select:hover {
  background: #eee; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-select.on, .wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-select.on:active {
  padding: 1px 1px 1px 5px;
  border: 1px solid #aaa;
  background: #ccc;
  box-shadow: inset 0px 0px 3px #aaa; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-select .wbb-list {
  width: 280px;
  padding: 0;
  max-height: 100px; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-select .sar {
  display: block;
  position: absolute;
  right: 3px;
  top: 3px;
  width: 10px;
  height: 22px;
  cursor: default;
  font-size: 14px;
  text-decoration: none; }

.wbb-select .val {
  height: 28px;
  line-height: 30px;
  font-weight: bold;
  font-size: 11px;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-right: 10px; }

.wbb-select .option {
  display: block;
  padding: 6px 10px;
  white-space: nowrap;
  cursor: pointer; }

.wbb-select .option:hover {
  background: #eee; }

.wbb-select .option.selected {
  background: #428bca;
  color: #fff; }

/* END SELECT */
/* SMILEBOX TOOLBAR */
.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-smilebox {
  background: transparent;
  border: 1px solid transparent;
  box-shadow: none; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-smilebox.on, .wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-smilebox.on:active {
  border: 1px solid #aaa;
  background: #ccc;
  box-shadow: inset 0px 0px 3px #aaa; }

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-smilebox .wbb-list {
  width: 156px; }

.smile {
  width: 16px;
  height: 16px;
  line-height: 20px;
  padding: 5px;
  display: inline-block;
  *display: inline;
  zoom: 1;
  cursor: pointer;
  vertical-align: middle; }

.smile img {
  max-width: 16px;
  max-height: 16px; }

/* END SMILEBOX TOOLBAR */
/* MODAL WINDOW */
/* thx http://habrahabr.ru/post/148515/ */
#wbbmodal {
  font: 12px/1.2 Arial,Verdana;
  position: fixed;
  text-align: center;
  bottom: 0;
  left: 0;
  top: 0;
  right: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  background: rgba(0, 0, 0, 0.5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#7Fffffff,endColorstr=#7Fffffff);
  zoom: 1;
  z-index: 1100; }

#wbbmodal .wbbm {
  background: #fff;
  text-align: left;
  max-width: 90%;
  max-height: 90%;
  margin: 30px auto;
  border: 1px solid #bbb;
  box-shadow: 0px 0px 5px #333;
  overflow: auto; }

#wbbmodal .wbbm-title {
  color: #333;
  position: relative;
  padding: 5px 10px;
  border-bottom: 1px solid #ccc; }

#wbbmodal .wbbm-title .wbbm-title-text {
  font-size: 1.6em;
  line-height: 2em;
  margin: 0;
  padding: 0; }

#wbbmodal .wbbm-title .wbbclose {
  display: block;
  text-transform: uppercase;
  position: absolute;
  right: 15px;
  top: 15px;
  font-size: 21px;
  font-weight: bold;
  cursor: pointer;
  color: #888; }

#wbbmodal .wbbm-title .wbbclose:hover {
  color: red; }

#wbbmodal .wbbm .wbbm-tablist {
  padding: 10px 20px; }

#wbbmodal .wbbm .wbbm-tablist ul {
  list-style-type: none;
  padding: 0;
  margin: 0; }

#wbbmodal .wbbm .wbbm-tablist ul li {
  padding: 10px;
  cursor: pointer;
  margin: 5px 0;
  position: relative;
  border-radius: 0px;
  display: inline-block;
  margin: 0 10px 5px 0; }

#wbbmodal .wbbm .wbbm-tablist ul li.on, #wbbmodal .wbbm .wbbm-tablist ul li.on:hover {
  background: #428bca;
  color: #fff;
  cursor: default; }

#wbbmodal .wbbm .wbbm-tablist ul li:hover {
  background: #eee; }

#wbbmodal .wbbm-cont {
  padding: 10px 20px; }

#wbbmodal .wbbm-content {
  min-height: 50px;
  max-height: 100%; }

#wbbmodal .div-modal-text {
  border: 1px solid #aaa;
  padding: 2px 5px;
  line-height: 28px;
  max-height: 100px;
  overflow: auto;
  font-size: 14px; }

#wbbmodal select[name="users-list"] {
  display: block;
  height: 34px;
  padding: 2px 5px;
  line-height: 1.42857143;
  font-size: 14px;
  width: 100%;
  border: 1px solid #aaa;
  outline: none;
  box-sizing: border-box;
  border-radius: 0; }

#wbbmodal .wbbm-bottom {
  border-top: 1px solid #ccc;
  padding: 10px;
  background: #f1f1f1; }

#wbbmodal button {
  display: inline-block;
  *display: inline;
  zoom: 1;
  font-size: 14px;
  padding: 3px 15px; }

#wbbmodal .wbb-button {
  background: #428bca;
  color: #fff;
  line-height: 26px;
  border: 1px solid #357ebd;
  border-radius: 0px;
  cursor: pointer; }

#wbbmodal .wbb-button:hover {
  background: #3276b1;
  border: 1px solid #285e8e; }

#wbbmodal .wbb-cancel-button {
  background: #f5f5f5;
  color: #333;
  line-height: 26px;
  border: 1px solid #ddd;
  border-radius: 0px;
  cursor: pointer;
  margin-left: 15px; }

#wbbmodal .wbb-cancel-button:hover {
  background: #fff;
  border: 1px solid #ccc; }

#wbbmodal .wbb-remove-button {
  background: #d9534f;
  color: #fff;
  line-height: 26px;
  border: 1px solid #d43f3a;
  border-radius: 0px;
  cursor: pointer;
  float: right; }

#wbbmodal .wbb-remove-button:hover {
  background: #d2322d;
  border: 1px solid #ac2925; }

#wbbmodal .wbbm-inp-row {
  margin-bottom: 15px; }

#wbbmodal .wbbm-inp-row label {
  display: block;
  font-weight: bold;
  margin-bottom: 3px; }

#wbbmodal .wbbm-inp-row input {
  display: block;
  height: 34px;
  padding: 2px 5px;
  line-height: 1.42857143;
  font-size: 14px;
  width: 100%;
  border: 1px solid #aaa;
  outline: none;
  box-sizing: border-box;
  border-radius: 0; }

#wbbmodal .wbbm-inperr {
  color: red;
  font-size: 10px;
  display: block; }

#wbbmodal .wbbm-brdred {
  border-color: red !important; }

/* IMAGE UPLOAD */
#wbbmodal #imguploader {
  text-align: center; }

#wbbmodal #imguploader.drag {
  border: 3px dashed #ccc; }

#wbbmodal #imguploader.drag.dragover {
  background: #feffe4; }

#wbbmodal #imguploader.drag.wbb-loading {
  padding: 40px 0; }

#wbbmodal #imguploader.drag .p {
  font-size: 2em;
  color: #aaa;
  margin-top: 15px; }

#wbbmodal #imguploader.drag .p2 {
  color: #AAA; }

#wbbmodal #imguploader.drag .fileupload {
  margin: 15px 0; }

#wbbmodal .fileupload {
  margin: 40px 0;
  position: relative; }

#wbbmodal .dragupload {
  margin: 10px 0 15px 0;
  position: relative; }

#wbbmodal .fileupload input.file {
  opacity: 0;
  filter: alpha(opacity=0);
  width: 230px;
  height: 32px !important;
  position: absolute;
  top: 2px;
  left: 50%;
  margin-left: -115px;
  display: block; }

.loader {
  margin: 30px 0; }

.upl-error {
  color: red;
  display: block; }

.powered {
  display: block;
  position: absolute;
  bottom: -18px;
  right: 5px;
  font-size: 10px; }

/* END IMAGE UPLOAD */
/* MODAL WINDOW */
/* CONTENT STYLES*/
.wysibb .wysibb-body .imgWrap {
  position: relative;
  display: inline-block; }

.wysibb .wysibb-body .imgWrap img {
  opacity: 0.5; }

/* PHPBB3 */
.content-phpbb3 {
  font-size: 13px;
  line-height: normal !important; }

.content-phpbb3 .codebox dt {
  float: none;
  width: 100%; }

.content-phpbb3 .codebox dd {
  margin: 0 !important; }

/* DESKTOP AND TAVBLETS STYLES */
@media (min-width: 768px) {
  /* TOOLBAR */
  .wysibb .wysibb-text {
    padding: 5px;
    margin: 0; }

  .wysibb .wysibb-toolbar {
    float: none;
    width: auto;
    overflow: visible;
    border-right: 0; }

  .wysibb .wysibb-toolbar {
    border-bottom: 1px solid #ddd;
    position: relative;
    padding: 0 60px 0 0;
    height: auto; }

  .wysibb .wysibb-toolbar .wysibb-toolbar-container {
    margin: 0;
    border-right: 1px solid #ddd;
    padding: 0;
    display: inline-block; }

  .wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn {
    display: inline-block;
    height: 32px;
    min-width: 28px;
    position: relative;
    vertical-align: middle;
    padding: 0px 1px;
    cursor: pointer;
    margin: 0 0 0 1px;
    font-size: 12px;
    border: 1px solid transparent;
    width: auto; }

  .wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn:hover span.btn-tooltip {
    display: block; }

  .wysibb .wysibb-toolbar .modeSwitch {
    text-align: center;
    position: absolute;
    right: 0px;
    top: 0px;
    border: 0; }

  .wysibb .wysibb-toolbar .wysibb-toolbar-container select.wbb-selectbox {
    display: none; }

  .wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-select {
    display: inline-block; }

  .wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-select span.val, .wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn.wbb-select ins {
    display: block; }

  .wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn .wbb-list {
    display: none;
    position: absolute;
    top: 32px;
    left: -1px;
    border: 1px solid #bbb;
    box-shadow: 0px 0px 3px #aaa;
    width: 190px;
    background: #fff;
    max-height: 100px;
    overflow: auto;
    z-index: 1000; }

  .wbb-list .sc {
    width: 16px;
    height: 16px;
    margin: 0 0 1px 1px;
    display: inline-block;
    *display: inline;
    zoom: 1;
    cursor: pointer;
    border: 1px solid #fff; }

  .ve-tlb-colorpick {
    width: 24px;
    height: 24px;
    line-height: 24px;
    text-align: right; }

  .wysibb .bottom-resize-line {
    display: block;
    height: 5px;
    cursor: ns-resize; } }
/*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */
.fancybox-wrap,
.fancybox-skin,
.fancybox-outer,
.fancybox-inner,
.fancybox-image,
.fancybox-wrap iframe,
.fancybox-wrap object,
.fancybox-nav,
.fancybox-nav span,
.fancybox-tmp {
  padding: 0;
  margin: 0;
  border: 0;
  outline: none;
  vertical-align: top; }

.fancybox-wrap {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8020; }

.fancybox-skin {
  position: relative;
  background: #f9f9f9;
  color: #444;
  box-shadow: 0px 0px 20px 1px #575757;
  text-shadow: none;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px; }

.fancybox-opened {
  z-index: 8030; }

.fancybox-opened .fancybox-skin {
  -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); }

.fancybox-outer, .fancybox-inner {
  position: relative; }

.fancybox-inner {
  overflow: hidden; }

.fancybox-type-iframe .fancybox-inner {
  -webkit-overflow-scrolling: touch; }

.fancybox-error {
  color: #444;
  font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
  margin: 0;
  padding: 15px;
  white-space: nowrap; }

.fancybox-image, .fancybox-iframe {
  display: block;
  width: 100%;
  height: 100%; }

.fancybox-image {
  max-width: 100%;
  max-height: 100%; }

#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
  background-image: url("../fancybox/fancybox_sprite.png"); }

#fancybox-loading {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -22px;
  margin-left: -22px;
  background-position: 0 -108px;
  opacity: 0.8;
  cursor: pointer;
  z-index: 8060; }

#fancybox-loading div {
  width: 44px;
  height: 44px;
  background: url("../fancybox/fancybox_loading.gif") center center no-repeat; }

.fancybox-close {
  position: absolute;
  top: -18px;
  right: -18px;
  width: 36px;
  height: 36px;
  cursor: pointer;
  z-index: 8040; }

.fancybox-nav {
  position: absolute;
  top: 0;
  width: 40%;
  height: 100%;
  cursor: pointer;
  text-decoration: none;
  background: transparent url("../fancybox/blank.gif");
  /* helps IE */
  -webkit-tap-highlight-color: transparent;
  z-index: 8040; }

.fancybox-prev {
  left: 0; }

.fancybox-next {
  right: 0; }

.fancybox-nav span {
  position: absolute;
  top: 50%;
  width: 36px;
  height: 34px;
  margin-top: -18px;
  cursor: pointer;
  z-index: 8040;
  visibility: hidden; }

.fancybox-prev span {
  left: 10px;
  background-position: 0 -36px; }

.fancybox-next span {
  right: 10px;
  background-position: 0 -72px; }

.fancybox-nav:hover span {
  visibility: visible; }

.fancybox-tmp {
  position: absolute;
  top: -99999px;
  left: -99999px;
  visibility: hidden;
  max-width: 99999px;
  max-height: 99999px;
  overflow: visible !important; }

/* Overlay helper */
.fancybox-lock {
  overflow: hidden !important;
  width: auto; }

.fancybox-lock body {
  overflow: hidden !important; }

.fancybox-lock-test {
  overflow-y: hidden !important; }

.fancybox-overlay {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  display: none;
  z-index: 8010;
  background: url("../fancybox/fancybox_overlay.png"); }

.fancybox-overlay-fixed {
  position: fixed;
  bottom: 0;
  right: 0; }

.fancybox-lock .fancybox-overlay {
  overflow: auto;
  overflow-y: scroll; }

/* Title helper */
.fancybox-title {
  visibility: hidden;
  font: normal 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
  position: relative;
  text-shadow: none;
  z-index: 8050; }

.fancybox-opened .fancybox-title {
  visibility: visible; }

.fancybox-title-float-wrap {
  position: absolute;
  bottom: 0;
  right: 50%;
  margin-bottom: -35px;
  z-index: 8050;
  text-align: center; }

.fancybox-title-float-wrap .child {
  display: inline-block;
  margin-right: -100%;
  padding: 2px 20px;
  background: transparent;
  /* Fallback for web browsers that doesn't support RGBa */
  background: rgba(0, 0, 0, 0.8);
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  text-shadow: 0 1px 2px #222;
  color: #FFF;
  font-weight: bold;
  line-height: 24px;
  white-space: nowrap; }

.fancybox-title-outside-wrap {
  position: relative;
  margin-top: 10px;
  color: #fff; }

.fancybox-title-inside-wrap {
  padding-top: 10px; }

.fancybox-title-over-wrap {
  position: absolute;
  bottom: 0;
  left: 0;
  color: #fff;
  padding: 10px;
  background: #000;
  background: rgba(0, 0, 0, 0.8); }

/*Retina graphics!*/
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {
  #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
    background-image: url("../fancybox/fancybox_sprite@2x.png");
    background-size: 44px 152px;
    /*The size of the normal image, half the size of the hi-res image*/ }

  #fancybox-loading div {
    background-image: url("../fancybox/fancybox_loading@2x.gif");
    background-size: 24px 24px;
    /*The size of the normal image, half the size of the hi-res image*/ } }
.fancybox_gallery img {
  transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  border: 3px solid white;
  box-shadow: 0px 0px 10px 1px #575757;
  margin: 15px; }
  .fancybox_gallery img:hover {
    box-shadow: 0px 0px 12px 1px #131313;
    transition: all 0.5s ease-out;
    -ms-transition: all 0.5s ease-out;
    -webkit-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out; }

/* spoiler */
div.spoiler {
  margin: 10px 30px;
  line-height: 1.6; }

div.spoiler div.spoiler-title {
  font-weight: bold;
  padding: 4px 7px;
  border: 1px solid #3D3D3D;
  font-family: "Poiret One", cursive;
  font-weight: 700;
  /*-moz-border-radius: 5.5px 5.5px 0px 0px;
  -webkit-border-radius: 5.5px 5.5px 0px 0px;
  border-radius: 5.5px 5.5px 0px 0px;*/
  -moz-border-radius: 5.5px;
  -webkit-border-radius: 5.5px;
  border-radius: 5.5px;
  /*-moz-box-shadow: 0 1px 0 rgba(255,255,255,.5), 0 0 2px rgba(255,255,255,.15) inset, 0 1px 0 rgba(255,255,255,.15) inset;
  -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.5), 0 0 2px rgba(255,255,255,.15) inset, 0 1px 0 rgba(255,255,255,.15) inset;
  box-shadow: 0 1px 0 rgba(255,255,255,.5), 0 0 2px rgba(255,255,255,.15) inset, 0 1px 0 rgba(255,255,255,.15) inset;*/
  box-shadow: inset 0px 10px 50px -1px rgba(100, 100, 100, 0.75);
  background: #0073CF;
  /*background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#cfd1cf));
  background-image: -moz-linear-gradient(top, #f5f5f5, #e5e5e5);
  background-image: -webkit-linear-gradient(top, #f5f5f5, #e5e5e5);
  background-image: -o-linear-gradient(top, #f5f5f5, #e5e5e5);
  background-image: -ms-linear-gradient(top, #f5f5f5, #e5e5e5);
  background-image: linear-gradient(top, #f5f5f5, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#f5f5f5', endColorstr='#cfd1cf');*/
  cursor: pointer;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none; }

div.spoiler div.spoiler-active-title {
  -moz-border-radius: 5.5px 5.5px 0px 0px;
  -webkit-border-radius: 5.5px 5.5px 0px 0px;
  border-radius: 5.5px 5.5px 0px 0px; }

div.spoiler div.spoiler-title div.spoiler-toggle {
  display: inline-block;
  width: 9px;
  height: 9px;
  line-height: 14px;
  /*margin-left: 4px;
  margin-right: 6px;*/
  padding: 4px;
  cursor: pointer;
  -webkit-user-modify: read-only;
  position: relative;
  top: 2px;
  border: 1px solid #131313;
  border-radius: 100%;
  background: white;
  cursor: pointer;
  /* Vertical line */
  /* horizontal line */
  /*&:hover {
      cursor: pointer;
      
      &:before{ transform: rotate(90deg); }
      &:after{ transform: rotate(180deg); }
  }*/ }
  div.spoiler div.spoiler-title div.spoiler-toggle:before, div.spoiler div.spoiler-title div.spoiler-toggle:after {
    content: "";
    position: absolute;
    background-color: #131313;
    transition: all 0.5s ease-out;
    -ms-transition: all 0.5s ease-out;
    -webkit-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    cursor: pointer; }
  div.spoiler div.spoiler-title div.spoiler-toggle:before {
    top: 0;
    left: 50%;
    width: 1px;
    height: 9px;
    margin: 4px 0px 4px -0.5px; }
  div.spoiler div.spoiler-title div.spoiler-toggle:after {
    top: 50%;
    left: 0;
    width: 9px;
    height: 1px;
    margin: -0.5px 4px 0px 4px; }

div.spoiler div.spoiler-title div.spoiler-toggle-minus:before {
  transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  transition: all 0.7s ease-out;
  -ms-transition: all 0.7s ease-out;
  -webkit-transition: all 0.7s ease-out;
  -o-transition: all 0.7s ease-out;
  -moz-transition: all 0.7s ease-out; }
div.spoiler div.spoiler-title div.spoiler-toggle-minus:after {
  transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  transition: all 0.7s ease-out;
  -ms-transition: all 0.7s ease-out;
  -webkit-transition: all 0.7s ease-out;
  -o-transition: all 0.7s ease-out;
  -moz-transition: all 0.7s ease-out;
  opacity: 0; }

div.spoiler div.spoiler-content {
  border: 1px dotted #707070;
  border-top: 0px;
  -moz-border-radius: 0px 0px 5.5px 5.5px;
  -webkit-border-radius: 0px 0px 5.5px 5.5px;
  border-radius: 0px 0px 5.5px 5.5px;
  background: none repeat scroll 0 0 #F5F5F5;
  padding: 10px;
  display: none; }
  div.spoiler div.spoiler-content p {
    padding: 0px;
    margin: 0px; }

/* Plugin styles */
.social-feed-element.hidden {
  background-color: red !important; }

.social-feed-element .pull-left {
  float: left;
  margin-right: 10px; }

.social-feed-element .pull-right {
  margin-left: 10px; }

.social-feed-element img {
  width: 100%;
  width: auto\9;
  height: auto;
  border: 0;
  vertical-align: middle;
  -ms-interpolation-mode: bicubic; }

.social-feed-element .attachment {
  vertical-align: middle;
  -ms-interpolation-mode: bicubic; }

/* Link styles */
.social-feed-element a {
  color: #0088cc;
  text-decoration: none; }

.social-feed-element a:focus {
  outline: thin dotted #333;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px; }

.social-feed-element a:hover,
.social-feed-element a:active {
  outline: 0;
  color: #005580;
  text-decoration: underline; }

/* Text styles */
.social-feed-element small {
  font-size: 85%; }

.social-feed-element strong {
  font-weight: bold; }

.social-feed-element em {
  font-style: italic; }

.social-feed-element p {
  margin: 0 0 10px; }

.social-feed-element .media-body > p {
  margin-bottom: 4px;
  min-height: 20px; }

.social-feed-element p.social-feed-text {
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical; }

/* Message styles */
.social-feed-element,
.social-feed-element .media-body {
  overflow: hidden;
  zoom: 1;
  *overflow: visible; }

.social-feed-element .media-body .social-network-icon {
  margin-top: -3px;
  margin-right: 5px;
  width: 16px; }

.social-feed-element .media-body div {
  color: #666;
  line-height: 20px; }

.social-feed-element:first-child {
  margin-top: 0; }

.social-feed-element .media-object {
  display: block;
  width: 48px;
  border-radius: 50%; }

.social-feed-element .media-heading {
  margin: 0 0 5px; }

.social-feed-element .media-list {
  margin-left: 0;
  list-style: none; }

.social-feed-element .muted {
  color: #999; }

.social-feed-element a.muted:hover,
.social-feed-element a.muted:focus {
  color: #808080; }

.social-feed-element {
  box-shadow: 0 0 10px 0 rgba(10, 10, 10, 0.2);
  transition: 0.25s;
  -webkit-backface-visibility: hidden;
  margin: -1px;
  margin-top: 25px;
  background-color: #fff;
  color: #333;
  text-align: left;
  font-size: 14px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  line-height: 16px; }

.social-feed-element:hover {
  box-shadow: 0 0 20px 0 rgba(10, 10, 10, 0.4); }

.social-feed-element .content {
  padding: 15px; }

.social-feed-element .social-network-icon {
  opacity: 0.7; }

.social-feed-element .author-title {
  color: #444;
  line-height: 1.5em;
  font-weight: 500; }

/*# sourceMappingURL=style.css.map */