/* ==========================================================================
   aatventurebase 05-11-2019
   ========================================================================== */

html * {
  -webkit-tap-highlight-color: transparent;
  text-rendering: optimizeLegibility;
  margin: 0px;
  padding: 0px;
  border: 0px;
}

html {
  overflow-x: hidden;
  overscroll-behavior-y: contain;    /* disable pull to refresh, keeps glow effects */
  -webkit-overflow-scrolling: touch; /* Lets it scroll lazy */
  touch-action: manipulation;        /* no doubletouch zoom */
}

body {
  width:100vw;
  height:100vh;
  overflow-x:hidden !important;
  overscroll-behavior: none;
  background-color: #090B13;
}

#pdfoverlay {position: fixed; top: 48px; width: 100vw; height: calc(100vh - 70px); display: none; background-color: #100704; z-index: 999;}
#iframex    {width:100%; height:100%}

 /* ipad fixes */
@media screen and (min-width: 768px) and (max-width: 1024px){
   #pdfoverlay    {top: 70px !important; height: calc(100vh - 70px);}
   .minwidth130   {min-width: 130px !important;}
   .minwidth200   {min-width: 200px !important;}
   .padding15px   {padding-left: 15px !important; padding-right: 15px !important;}
   .padding30px   {padding-left: 30px !important; padding-right: 30px !important;}
   .note-fontname {position: absolute;; left: 2px !important;}
   .note-color    {margin-left: -25px !important}
   .note-btn-bold {margin-left: -160px !important}
}

.veryhidden    {display: none !important;}
.noscroll      {overflow: hidden !important;}
.smoothscroll  {overflow-x: auto !important; -webkit-overflow-scrolling: touch;}
.container1400 {width:1400px !important;}
.floatshare    {float: left; margin-top: 50px; margin-left: 24px;}

@media (max-width: 600px) {
  .nopadding {padding: 0 !important;}
}

@media (min-width: 1100px) {
.container1400 .col-md-5      {-ms-flex: 0 0 37.5%; flex: 0 0 37.5%; max-width: 37.5%;}
.container1400 .col-md-editor {-ms-flex: 0 0 84.5%; flex: 0 0 84.5%; max-width: 84.5%;}
}

.zindex190    {display: block; width: 200px !important; height:35px !important; margin-top:-6px !important; margin-left: auto !important; margin-right: auto !important; border-radius: 8px;}

.savehoogaantalbutton {
    margin-top: 20px;
    width: 70px;
    height: 70px;
    margin-left: auto;
    margin-right: auto;
    background-image: url(../../img/interface/confirmaantal.png);
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
}

.lijstnaam           {margin-top:8px; width: 300px; padding: 6px; text-align: center; border-radius: 6px;}
.lijstnaam-sushi     {background-color: #1F242D; border: 1px solid #687484; color: #FFFFFF;}
.lijstnaam-slagerij  {background-color: #842213; border: 1px solid #842213; color: #FFFFFF;}
.listsubmit          {margin-top:-14px !important; width:300px; padding: 6px; text-align: center; border-radius: 6px; cursor: pointer;}
.listsubmit-sushis   {background-color: #FF0000; border: 1px solid #FF0000; color: #FFFFFF;}
.listsubmit-slagerij {background-color: #229A13; border: 1px solid #1F9212; color: #FFFFFF;}

.inlineblock     {display: inline-block !important; z-index:9999;}
.favafbeelding   {height: 160px !important;}
.favfooter       {cursor: pointer;}
.rightalign      {float: right;}
.favpointer      {cursor: pointer;}
.plunr           {float: right; opacity: 0.5; padding-right: 16px;}

@media (max-width: 800px) and (max-height: 1300px) {.favfooter {left: 50px !important}}
@media (min-width: 800px) and (max-height: 1300px) {.favfooter {left: 80px !important}}
/* iPad Pro Landscape  */
@media only screen and (min-width: 1024px) and (max-height: 1366px) and (orientation: landscape) {.favfooter {left: 16px !important};}

.favomschrijving {
    position: absolute !important;
    font-size: 30px;
    line-height: 40px;
    text-align: center;
}

.previousorderomschrijving {
    position: absolute !important;
    margin-bottom: 70px !important;
    font-size: 30px;
    line-height: 40px;
    text-align: center;
}

.paystatus-niet {opacity: 0.3 !important}

.printreceipt {cursor:pointer}

.ingredienten {
    padding: 20px;
    font-size: 16px;
    overflow: auto;
    height: 250px;
}

.voedingswaardenx {
    display: none;
    padding: 20px;
    font-size: 16px;
    overflow: auto;
    height: 250px;
}

.WINKELVERKOOP  {color: #ff593b !important;}
.WEBSHOPVERKOOP {color: #a7ff00 !important;}
.AANGEPAST      {color: #ffbe00 !important;}
.VERVALLEN      {color: #FF0000 !important;}

 /* ==========================================================================
   final ipad adjustments
   ========================================================================== */

@media (min-width: 700px) and (max-width: 1030px) {
  .fullpadwidth {-ms-flex: 0 0 100%; flex: 100% !important; max-width: 100% !important;}
}

/* ==========================================================================
   pickmeup 04-12-2019
   ========================================================================== */

.dpx {
  top: 15px;
  background-color: #6E454A;
}

.pickmeup {
    touch-action: manipulation
}

.pickmeup * {
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.pickmeup.pmu-flat {
    position: relative;
    width: 100%;
}

.pickmeup.pmu-hidden {
    display: none
}

.pickmeup .pmu-instance {
    text-align: center;
}

.pickmeup .pmu-instance .pmu-button {
    color: #eee;
    cursor: pointer;
    outline: none;
    text-decoration: none;
}

.pickmeup .pmu-instance .pmu-today {
    background: #842433 !important;
    color: #FFFFFF !important;
    border-radius: 50% 0%;
    opacity: 1 !important;
}

.pickmeup .pmu-instance .pmu-button:hover {}

.pickmeup .pmu-instance .pmu-not-in-month {color: #7f555a;}

.pickmeup .pmu-instance .pmu-disabled,
.pickmeup .pmu-instance .pmu-disabled:hover {
    color: #80565b;
    cursor: default
}

.pickmeup .pmu-instance .pmu-selected {border-radius: 50% 0%;}

.pickmeup .pmu-instance .pmu-not-in-month.pmu-selected {background: #17384d}

.pickmeup .pmu-instance nav {
    color: #eee;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    line-height: 49px;
    font-size: 24px;
    background-color: #6d4549;
    width: 100%;
}

.pickmeup .pmu-instance nav *:first-child:hover {
    color: #88c5eb
}

.pickmeup .pmu-instance nav .pmu-prev,
.pickmeup .pmu-instance nav .pmu-next {
    display: none;
    height: 2em;
    width: 1em
}

.pickmeup .pmu-instance nav .pmu-month {
    width: 14em
}

.pickmeup .pmu-instance .pmu-years *,
.pickmeup .pmu-instance .pmu-months * {
    display: inline-block;
    line-height: 3.6em;
    width: 3.5em
}

.pickmeup .pmu-instance .pmu-day-of-week {cursor: default}
.pickmeup .pmu-instance .pmu-day-of-week *,
.pickmeup .pmu-instance .pmu-days * {
    display: inline-block;
    line-height: 2.5em;
    width: 14%;
    font-size: 20px;
}


@media (min-width: 600px) {
.pmu-day-of-week * {width: 67px !important;}
.pmu-days * {width: 66px !important;}
}

.pickmeup .pmu-instance .pmu-day-of-week * {line-height: 1.8em; font-size: 18px;}

@media (min-width: 340px) {
  .pickmeup .pmu-instance .pmu-day-of-week * {min-width: 49px;}
}

@media (min-width: 410px) {
  .pickmeup .pmu-instance .pmu-day-of-week *, .pickmeup .pmu-instance .pmu-days * {min-width: 54px;}
}

.pickmeup .pmu-instance:first-child .pmu-prev,
.pickmeup .pmu-instance:last-child .pmu-next {
    display: block;
    margin-left: 10px;
    margin-right: 10px;
}

.pickmeup .pmu-instance:first-child .pmu-month,
.pickmeup .pmu-instance:last-child .pmu-month {
    width: 13em
}

.pickmeup .pmu-instance:first-child:last-child .pmu-month {
    width: 100%;
    font-size: 18px;
    height: 50px;
}

.pickmeup:not(.pmu-view-days) .pmu-days,
.pickmeup:not(.pmu-view-days) .pmu-day-of-week,
.pickmeup:not(.pmu-view-months) .pmu-months,
.pickmeup:not(.pmu-view-years) .pmu-years {
    display: none
}

.pickmeup .pmu-instance .pmu-not-in-month.pmu-selected {
    background: #462a30;
}

 /* ==========================================================================
   productoverlay
   ========================================================================== */

.backdrop {
    position: absolute;
    background: rgba(255,255,255,0.6);
    top: 36px;
    left: 0px;
    height: calc(100% - 36px);
    width: 100%;
    border: none;
    border-top:1px solid #000000;
    border-bottom:1px solid #000000;
    z-index: 99;
    display: none;
}

.overlaymenu {display:none;}

.backdropmenu {
    position: absolute;
    top: 42px;
    right: 0px;
    width: 240px;
    padding: 5px 0;
    margin-left: auto;
    overflow-x: hidden;
    overflow-y: auto;
    z-index: 9999999;
}

.backdropmenu li {
    display: block;
    color: #FFFFFF;
    font-family: "Roboto Light";
    font-size: 15px;
    font-weight: 400;
    text-transform: uppercase;
    text-align: right;
    background-color: rgba(0,0,0,0.6);
    border: 1px solid rgba(200,200,200,0.3);
    border-radius: 6px 0px 0px 6px;
    padding: 7px 20px 7px 6px;
    box-shadow: 2px 2px 4px rgba(0,0,0, 0.4);
    margin-top: 8px;
    margin-right: -2px;
    cursor: pointer;
    -webkit-font-smoothing:antialiased;
}

.backdropmenu li:hover {background-color: rgba(0,0,0,0.9);}

.innertext {
    display: block;
    width: 100%;
    text-align: center;
    padding-bottom: 12px;
}

.innertext2 {
    display: block;
    width: 100%;
    text-align: center;
    padding-bottom: 4px;
}

.overlayinfo {
    display: none;
    background-color: rgba(0,0,0,0.8);
    height: 100%;
    position: absolute; z-index: 99; top:36px; height: calc(100% - 36px); width: 100%;
}

.productinfo  {display: none; position: absolute; top:0px; height: 100%; width: 100%; padding: 15px; overflow-y: auto;}
.allergieinfo {display: none; position: absolute; top:0px; height: 100%; width: 100%; padding: 15px; overflow-y: auto;}
.hoogaantal   {display: none; position: absolute; top:0px; height: 100%; width: 100%; padding: 15px; overflow-y: auto;}
.remarksinfo  {display: none; position: absolute; top:0px; height: 100%; width: 100%; padding: 15px; overflow-y: auto;}
.shareinfo    {display: none; position: absolute; top:0px; height: 100%; width: 100%; padding: 15px; overflow-y: auto;}
.shareicons   {margin-top:-10px;}

.productinfo::-webkit-scrollbar-thumb {background-color: #ff0000;}
.productinfo::-webkit-scrollbar-track-piece {background-color: #1f1f1f;}

.allergenen {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    flex-direction: row;
    max-height: 100vh;
}
.allergenen img {
    max-width: 92px;
}

.shareicon {
    display: inline-block;
    background-color: #1e232b;
    border-radius: 50% !important;
    min-width: 65px;
    min-height: 65px;
    border: 1px solid #212327;
    margin-left: 10px;
    margin-top: 6px;
    vertical-align: middle;
}

.sharetxt {padding-left:20px}

.opmerkingentextarea {
    position: absolute;
    top: 50px;
    bottom: 40px;
    width: 94%;
    background-color: #131313;
    color: #FFFFFF;
    border-radius: 10px;
    padding: 10px;
    margin-left: -3px;
    border: 1px solid #000000;
}

.sharecon {cursor: pointer;}

.whatsappcenter {width: 100%; text-align: center; margin-left: auto !important; margin-right: auto !important;}

 /* ==========================================================================
   de rest
   ========================================================================== */

@media (max-width: 700px) {
  .producttitlex {font-size: 24px !important; line-height: 28px !important;}
}

.sharelink          {color: rgba(255,255,255,0.7); cursor: pointer;}
.sharelink i        {display: block; font-size:20px !important;}

.note-popover .popover-content>.btn-group, .card-header.note-toolbar>.btn-group {
    flex: 1 1 auto;
}

@media (min-width: 1100px) {
.note-fontname {position: absolute; left: 2px;}
.note-fontname .note-btn-group:nth-child(1) .btn {width: 230px !important}
.note-fontname .note-btn-group:nth-child(2) .btn {width: 100px !important}
.note-fontname .note-btn-group:nth-child(3) .btn {width: 100px !important}
.note-fontname .note-btn-group:nth-child(4) .btn {width: 1px   !important; margin-left: -15px !important;}
.note-style    .note-btn:nth-child(1)            {width: 130px !important}
.note-style    .note-btn:nth-child(2)            {width: 130px !important}
.note-para .btn                                  {width: 130px !important}
.note-view     .note-btn:nth-child(1)            {width: 130px !important}
.note-view     .note-btn:nth-child(2)            {width: 130px !important}
}

.input-group-addon {
    padding: .375rem .75rem;
    margin-bottom: 0;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #FFFFFF;
    text-align: center;
    background-color: #353f4e;
    border: 0px;
    border-radius: 0.25rem 0rem 0rem 0.25rem;
}

.modal {z-index: 9999999 !important;}
.modal-open .modal {background-color: rgba(0,0,0,0.6);}
#form-aatventure {display: block !important}
.typeahead__button button, .typeahead__filter button {display: none !important}
.col-2 {display: none !important}
.d-md-inline-block {color: #FFFFFF;}
.cameracontainer {display: none;}
.nopadright {padding-right: 0px !important}

 @media screen and (max-width: 760px) {
   .col10morewidth {margin-left: 0px !important; margin-right: 0px !important}
 }

@media only screen and (min-width : 1100px) {
  .col10morewidth {max-width: 100%; flex: 0 0 100%;}
}
.typeahead__query {
    border: 1px solid #4d5566 !important;
    border-left: 0px solid;
}

#interactive {
  position: absolute;
  z-index: 999999;
  margin-left: auto;
  margin-right: auto;
  left: -42px;
  top: -13px;
  width: 100vw;
  height: auto;
}

#result_strip {display: none;}

.scanner-overlay {
  position: absolute;
  z-index: 9999999;
  margin-left: auto;
  margin-right: auto;
  left: -42px;
  top: -13px;
  width: 100vw;
  height: auto;
}

.stop {
    position: absolute;
    z-index: 999999;
    left: -44px;
    top: -70px;
    width: 100vw;
    height: 56px;
    text align: center;
}

.split .col-sm-2, .split .col-sm-7, .split .col-sm-8, .split .col-sm-9 {width: auto !important;}
.batchdivider {width: 100%; height: 2px; background-color: #38130d; margin-top:20px; margin-bottom:14px;}

.profileleft  {}
.profileright {max-height: 224px !important; width: auto !important; overflow-y: auto;}

@media only screen and (min-width : 1200px) {
  .form-slagerij .form-controlx {min-width: 290px;}
}

@media only screen and (min-width : 1300px) {
  .typeahead__container .typeahead__field input, .typeahead__container .typeahead__field textarea {width: 500px;}
}

#navbar {
    position: fixed !important;
    display: block !important;
    height: 69px !important;
}

@media only screen and (min-width : 768px)  {
    #navbar {z-index: 999 !important;}
}

@media only screen and (max-width : 768px)  {
    #navbar {z-index: 9999 !important;}
}

@media only screen and (min-width : 768px) and (max-width : 1024px) and (orientation : landscape) {
  .maincontainer-ipadedit {position: absolute !important; margin-top: 50px !important; padding-top: 0px !important;}
  .modal-dialog {max-width: 640px;}
  .col-ipadedit {-ms-flex: 0 0 33.3% !important; flex: 0 0 33.3% !important; max-width: 33.3% !important;}
  .col-md-4 {-ms-flex: 0 0 100% !important; flex: 0 0 100% !important; max-width: 100% !important;}
  .col-md-8 {-ms-flex: 0 0 100% !important; flex: 0 0 100% !important; max-width: 100% !important;}
  .col-md-10 {-ms-flex: 0 0 100% !important; flex: 0 0 100% !important; max-width: 100% !important;}
  .mt-5 .col-md-4 {position: relative !important;}
  .form-inline .form-control {min-width: 480px !important;}
}

@media only screen and (min-width : 768px) and (max-width : 1024px) and (orientation : portrait) {
  .maincontainer-ipadedit {position: absolute !important; margin-top: 50px !important; padding-top: 0px !important;}
  .col-md-4 {-ms-flex: 0 0 100% !important; flex: 0 0 100% !important; max-width: 100% !important;}
  .col-md-8 {-ms-flex: 0 0 100% !important; flex: 0 0 100% !important; max-width: 100% !important;}
  .fullscreendialog {margin-left: 46px !important;}
  .modalbody-aatventure {margin-top: 0px !important;}
  .form-inline {display: block !important; width: 583px !important;}
  ::-webkit-scrollbar {width:0px !important}
}

/* ----------- iPad Pro ----------- */
@media only screen and (min-height: 1300px) {
  .mt-5 .col-md-4 {position: relative !important; height: auto !important; min-height: 6000px !important; overflow-y: none !important;}
}

.typeahead__container {
    position: relative;
    font-family: "Roboto Light" !important;
    line-height: 1.4 !important;
}

.listkind-contacts typeahead__item {
  min-height:110px !important;
}

.listkind-contacts .typeahead__list .typeahead__item>a {
  min-height: 110px !important;
}

.listkind-blog .typeahead__item {
  min-height:110px !important;
}

.listkind-blog .typeahead__list .typeahead__item>a {
  min-height: 110px !important;
}

.custom-select {
    color: #FFFFFF;
    background-color: #2374ca;
    border: 1px solid #2374ca;
}

@media screen and (max-width:780px) {
  .custom-select {width: 100vw !important;}
}

.lowercase  {text-transform:lowercase  !important;}
.uppercase  {text-transform:uppercase  !important;}
.capitalize {text-transform:capitalize !important;}

@media screen and (min-width:700px) {
  .modalbody-aatventure {margin-top: 40px; padding: 0px !important;}
}

#form-aatventurex {
  max-width: 100vw !important;
  overflow-x: hidden !important;
  border-radius: 0 !important;
}

.aatshr {
    padding: 0;
    border: none;
    text-align: center;
    max-width: 250px;
    margin: 25px auto 30px;
    height: 3px;
    width: 100%;
    background-color: rgba(255,255,255,0.3);
}

.search {
  position: relative;
  overflow: hidden;
  width: 70px;
  height: 70px;
  margin: -6px auto 0;
  margin-right: -20px;
  background-color: transparent;
  transition: all 0.5s ease;
}

.search:before {
  content: '';
  display: block;
  width: 3px;
  height: 100%;
  position: relative;
  transition: all 0.5s ease;
}

.search.open {
  width: 420px;
}

.search.open:before {
  height: 60px;
  margin: 20px 0 20px 30px;
  position: absolute;
}

.search-box {
  width: 100%;
  height: 100%;
  box-shadow: none;
  border: none;
  background: transparent;
  color: #FFFFFF;
  padding: 20px 100px 20px 45px;
  font-size: 40px;
}

.search-box:focus {
  outline: none;
}

.search-button {
  width: 70px;
  height: 70px;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  padding: 20px;
  padding-top: 18px;
  cursor: pointer;
}

.search-icon {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 3px solid #ffffff;
    display: block;
    position: relative;
    margin-left: 5px;
    transition: all 0.5s ease;
    z-index: 999999;
}

.search-icon:before {
  content: '';
  width: 3px;
  height: 10px;
  position: absolute;
  right: -2px;
  top: 20px;
  display: block;
  background-color: #FFFFFF;
  transform: rotate(-45deg);
  transition: all 0.5s ease;
}

.search-icon:after {
  content: '';
  width: 3px;
  height: 10px;
  position: absolute;
  right: -9px;
  top: 27px;
  display: block;
  background-color: #FFFFFF;
  transform: rotate(-45deg);
  transition: all 0.5s ease;
}

.open .search-icon {
  margin: 0px 0px 0px -16px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
}

.open .search-icon:before {
  transform: rotate(52deg);
  right: 12px;
  top: 11px;
  height: 12px;
}

.open .search-icon:after {
  transform: rotate(-230deg);
  right: 12px;
  top: 5px;
  height: 12px;
}

.companysearch {
    overflow: visible;
    display: inline-block !important;
    width: 74px;
    height: 43px;
    background-image: url(../../img/navicons/search.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 10px -2px;
    margin-left: -30px;
    margin-right: -4px !important;
    z-index: 9999999;
}

#verstappenswitch {
    width: 500px;
    height: 100%;
    background-color: transparent;
    text-align: center;
    padding-top: 10px;
    z-index: 9999999999;
}

.max54 {max-width: 54% !important;}
.min30 {-ms-flex: 0 0 30% !important; flex: 50 0 30% !important;}

.mainbody {overflow-y: scroll !important; -webkit-overflow-scrolling: touch;}
.centered {text-align:center !important;}
.afhalen  {text-align:center !important; color:#7FFFD4 !important}
.link     {text-decoration: underline !important; cursor: pointer !important}

.centervertical {display: inline-block; width: 100%; vertical-align: middle;}

.view-business {height: 120px;}
.view-business .assgroepcard-description {display:none;}
.view-business .assgroepcard-title {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center !important;
    vertical-align: middle;
    margin-top: -36px;
    line-height: 32px;
}
.view-business .bg-over {height: 120px;}

.view-business {display: block;}

#overlayframe {position:fixed; right:-500px; top:80px; height:760px; z-index:99999; width:412px}
@media screen and (max-width:700px){#overlayframe {top:0px; height:100%;}}

::-webkit-scrollbar-track-piece {background-color:#2b3038;}
::-webkit-scrollbar-thumb       {background-color:#1e2c3a;}

@media screen and (min-width:760px)                             {::-webkit-scrollbar {width:12px}}
@media screen and (max-width:760px) and (orientation:landscape) {::-webkit-scrollbar {width:0px}}

 /* == ultra darkmode == */
.bg-instant               {background-color: #090a0e !important;}
.grid                     {background-color: #090b14 !important;}
.cats .card               {border-bottom: 20px solid transparent !important;}
.related_movie            {border-bottom: 90px solid #111316 !important;}
.related_wiki             {border-bottom: 20px solid #000000 !important;}
.relatedoverlay_wiki      {opacity:0 !important}
.contentimg_movie         {background-color: #000000; border-bottom: 30px solid #000000 !important;}
.contentimg_wiki          {background-color: #000000; border-bottom: 30px solid #000000 !important;}

.fade.show {background-color: rgba(0,0,0,0.8);}

@media screen and (min-width:900px) {
  .nobackground {background: #000000 !important; width: 707px; max-width: 707px !important;}
}

.formopmerkingencontent {
    background-color: #000000;
    color: #FFFFFF;
    text-align: center;
    padding: 10px;
    margin-top: -16px;
    margin-bottom: 10px;
    border: 1px solid #FF0000;
    border-radius: 6px;
}

.formerror {
    background-color: #FF0000;
    color: #FFFFFF;
    text-align: center;
    padding: 10px;
    margin-top: -16px;
    margin-bottom: 10px;
    border: 1px solid #FF0000;
    border-radius: 6px;
    text-transform: uppercase;
    font-size: 19px;
    font-weight: 700;
}

.aatspreorder {
  display: block;
  white-space: pre;
  margin: 1em 0;
}

.center {text-align: center}

.moveonup {margin-top:-70px}

.navbar {
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Helvetica Neue","Arial","sans-serif";
}

.clickformore {text-decoration: underline; cursor:pointer}

.note-form-label {text-align: left}

.movietitle   {display: none}
.moviecontent {margin-top: -84px !important}

textarea, select, input, button {outline: none !important;}

input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
  border: 1px solid #2d3a44;
  -webkit-text-fill-color: #85b8ff;
  -webkit-box-shadow: 0 0 0px 1000px #1d222b inset !important;
  transition: background-color 5000s ease-in-out 0s;
  caret-color: #85b8ff;
}

input:-webkit-autofill:hover,
input:-webkit-autofill:focus
textarea:-webkit-autofill:hover
textarea:-webkit-autofill:focus,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  border: 1px solid #3d6fad;
  -webkit-text-fill-color: #85b8ff;
  -webkit-box-shadow: 0 0 0px 1000px #1d222b inset !important;
  transition: background-color 5000s ease-in-out 0s;
  caret-color: #85b8ff;
}

input, select, select option{
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
}

select:focus {
  background-image:
    linear-gradient(45deg, white 50%, transparent 50%),
    linear-gradient(135deg, transparent 50%, white 50%),
    linear-gradient(to right, #0169D8, #0169D8);
  background-position:
    calc(100% - 15px) 1em,
    calc(100% - 20px) 1em,
    100% 0;
  background-size:
    5px 5px,
    5px 5px,
    2.5em 2.5em;
  background-repeat: no-repeat;
  border-color: #0169D8;
  outline: 0;
}

.c_wiki {}
.o_wiki .bottom-txt {opacity:0 !important}
.o_wiki .card-date  {opacity:1 !important}

.c_news {}
.o_news .bottom-txt {opacity:0 !important}
.o_news .card-date  {opacity:0 !important}

.c_movie {}
.o_movie .bottom-txt {opacity:0 !important}
.o_movie .card-date  {}

.c_app {}
.o_app  .bottom-txt {}
.o_appe .card-date  {}

.nothingtoseehere    {position: absolute; top:60px; left: 0px; width: 100vw; height: calc(100vh - 60px); background-color: #2B2F39;}
.nothingtoseetext    {display: block; font-family: "Historycal"; font-size: 60px; color: #FFFFFF; text-align: center; margin-top: 8%}
.nothingtoseesubtext {display: block; font-family: "Historycal"; font-size: 40px; color: #FFFFFF; text-align: center; margin-top: -25px;}
.nothingtoseehere a  {text-decoration: none; color: #FFFFFF !important}

.procent75 {float: left; width:70%;}
.procent25 {float: right; width:25%;}
.justright {position: absolute; right: 20px}
@media (max-width: 576px) {.justright {position: absolute; top:30px; right: 18px}}

@media (max-width: 576px) {.lessmobilemargin {margin-top: 10px !important}}
@media (max-width: 576px) {.editormargin     {margin-left: -4px !important; margin-right: -4px !important}}
@media (max-width: 576px) {.formgroupmargin  {margin-bottom: 6px !important;}}

.inlogtext {font-family: "Roboto Light"; font-size: 18px; padding-left: 26px; cursor: pointer;}

.icon-eye {background-image: url(/img/svg/eye.svg);}

.circle-on  {width:50px; height: 50px; color: transparent !important; cursor: pointer;}
.circle-off {background-color: #FF0000 !important; width:50px; height: 50px; color: transparent !important; cursor: pointer;}

.keepposition {
    position: absolute;
    top: 0px;
    width: 100vw;
    z-index: 998;
    overflow: hidden;
    padding: 60px 1rem 1rem 1rem;
}

.keeppositiontop    {margin-top: -38px}
.keeppositionbottom {margin-top: 150px}

@media (min-width: 576px) {.keepposition  {top: 40px;}}
@media (min-width: 576px) {.custom-select {min-width: 382px;}}
@media (max-width: 576px) {
  .customerinfo  {display: none;}
  .productviewer {margin-top: 10px;}
  .keepposition  {padding: 54px 1rem 1rem 1rem !important;}
}

.minibut {width:60px !important; float: right !important}

.form-group {margin-bottom: 10px !important;}

@media (min-width: 1200px) {
.profileleft {
    background-color: rgba(30, 31, 39, 0.6);
    border-radius: 8px;
    padding: 40px;
    border: 1px solid #000000 !important;
}
}

@media (max-width: 600px) {
.note-btn-group .dropdown-menu {position: fixed !important; transform: translate3d(0px, 0px, 0px) !important; top:66px !important; left:0px; width: 100vw; height: 100vh;}
.note-fontname .note-btn-group:nth-child(1) .btn {min-width: 180px !important}
.note-fontname .note-btn-group:nth-child(2) .btn {max-width: 50px  !important}
.note-fontname .note-btn-group:nth-child(3) .btn {max-width: 50px  !important}
.note-fontname .note-btn-group:nth-child(4) .btn {max-width: 50px  !important}
}

#showwebmenugroups {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 200px;
    height: 69px;
    background-color: transparent;
    z-index: 999999;
}

#realcontent {
  position: fixed;
  top: 0px;
  left: 0;
  right: 60px;
  height: 100vh;
  overflow-x: hidden;
  overflow-y: hidden;
  width: auto;
}

#fakecontent1 {
  height: 3000px;
  background-color: #151b24;
}

#fakecontent2 {
  height: 3000px;
  background-color: #151b24;
}

@media (max-width: 768px) {
  #realcontent  {right: 60px !important;}
  #fakecontent1 {height: 3100px;}
  #fakecontent2 {height: 3100px;}
}

.neutralrichtext      {font-family: "Raleway Regular" !important; font-size: 16px !important; text-align: left !important;}
.neutralrichtext p    {font-family: "Raleway Regular" !important; font-size: 16px !important; text-align: left !important;}
.neutralrichtext font {font-family: "Raleway Regular" !important; font-size: 16px !important; text-align: left !important;}
.neutralrichtext span {font-family: "Raleway Regular" !important; font-size: 16px !important; text-align: left !important;}

.mobileheaderavatar {margin-left: 10px;}

@media (max-width: 767px) {
.mobilemargin {
    padding-right: 0px !important;
    padding-left: 0px !important;
    margin-left: 0px;
    margin-right: 0px;
    width: 100vw;
}
}

.blog-footer {position: absolute; bottom: 10px; display: none}

.filterbutton {width:100px}

.shopdesc {padding:20px; white-space: pre-line; overflow: hidden;}

.timebut {
    padding: 10px;
    margin-top: -35px;
    margin-bottom: 4px;
    width: 100%;
    text-align: center;
    position: relative;
    background: #161F2E;
    color: #85b8ff;
    cursor: pointer;
    height: 40px;
    line-height: 1;
    border-radius: 4px;
}

.novis {visibility: hidden;}

.visiblenav {
    color: #FFFFFF;
    background-color: rgba(0,0,0,0.1);
    border-radius: 0;
    border: 1px solid #313d4c;
}

.test {font-size:12px; color: #27516d;}

.leftalign {text-align:left !important}

.mb-3 .col {margin-bottom: 10px;}

.servicenotfound {
    width: 100%;
    background-color: #000000;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 20px;
    border: 1px solid #0077ff;
    border-radius: 6px;
}

#opslaanoverlay {
    position: fixed;
    right: 40px;
    bottom: 40px;
    width: 30%;
    height: 110px;
    background-color: rgba(0,0,0,0.2);
    padding-top: 10px;
    border-radius: 8px;
    z-index: 999;
}

.medtext {font-size: 14px;}
.bigtext {font-size: 16px;}

textarea            {min-height: 90px;}
.smalltextarea      {min-height: 10px !important;}
.midtextarea        {min-height: 90px;  resize: none;}
.largetextarea      {min-height: 210px;}
.colcontrol         {background-color: #3b4859 !important; width:94px !important; text-align:center; padding-left:14px}

.form-controlxxx {
  box-shadow: inset 0 0 1px #000;
}

.col-9-edit   {flex: 0 0 60% !important; max-width: 60%;}
.rightbuttons {flex: 0 0 40% !important; max-width: 40% !important; text-align: right;}

.btn-eve       {color: #FFFFFF; background-color: #ec8760; border-color: #ec8760;}
.btn-eve:hover {color: #FFFFFF; background-color: #ec8760; border-color: #ec8760;}
.eveicon {filter: sepia(10%) saturate(1500%) hue-rotate(320deg)}

.nav-icon:before {
    content: "\e005";
}

@media (min-width: 1025px) {
  .col-md-4 {-ms-flex: 0 0 31% !important; flex: 0 0 31% !important; max-width: 31% !important;}
  .col-md-8 {-ms-flex: 0 0 69% !important; flex: 0 0 69% !important; max-width: 69% !important;}
  .col-md-8 .card                                {overflow-y: scroll; box-shadow: 10px 10px 20px 0px rgba(0,0,0,0.42);}
  .col-md-8 .card::-webkit-scrollbar             {width:12px}
  .col-md-8 .card::-webkit-scrollbar-track-piece {background-color:#2b3038}
  .col-md-8 .card::-webkit-scrollbar-thumb       {background-color:#232930}
  .embed-responsive {overflow: visible !important;}
}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Chrome and Opera */
}

#navbar        {user-select: none;}
#maincontainer {user-select: none;}
.card          {user-select: none;}

.mt-5 {position: relative !important; top: 34px !important;}

.innershadow {
  -webkit-box-shadow: inset -10px 10px 30px -8px #2b3138;
  -moz-box-shadow:    inset -10px 10px 30px -8px #2b3138;
  box-shadow:         inset -10px 10px 30px -8px #2b3138;
}

.avatar {
  box-shadow: inset 17px 14px 10px -18px #2b3138;
}

.navbar-dark .navbar-nav .nav-link {
    opacity:1 !important;
    color: #9198a5 !important;
}

.minibutton {
    -ms-flex: 0 0 25%;
    flex: 50 0 25%;
    max-width: 100%;
    text-align: right;
}

.col-9x {
  margin-left: 14px;
}

.col-md-12x {
    position: relative;
    width: 100%;
    min-height: 1px;
    padding-right: 5px;
    padding-left: 5px;
}

.comlogo {font-size:17px; color: #c0f941 !important; padding-left:16px; padding-top:8px; margin-bottom:8px;}

.unapproved a {font-size:17px; color: #c0f941 !important; padding-top:8px; margin-bottom:8px;}

.comavatar {
  box-shadow: inset 17px 14px 10px -18px #2b3138;
  border-radius:50%;
  width:  70px !important;
  height: 70px !important;
}

.comth1 {width:54px;}
.comth2 {width:250px; min-width:250px;}
.comth3 {width:200px; max-width:200px;}
.comth4 {width:400px;}
.comth5 {width:200px; max-width:200px;}

@media (max-width: 700px) {
  #example_wrapper {overflow-x:scroll;}
  #example_length  {display: none;}
  #example_filter  {display: none;}
  .comavatar {width: 50px !important; height: 50px !important;}
}

.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
    border-color: #3D4858;
}

.col-md-3 .btn {display:none}

.mb-3 {margin-bottom: 0px !important;}

.leftpadding {padding-left:8px !important}

.smallrow          {margin-left:4px; margin-right:4px; margin-bottom: 4px;}
.smallrow input    {margin-top: -5px;}
.smallrow textarea {margin-top: -3px; margin-bottom: 3px;}
.smallrow select   {margin-top: -2px; margin-bottom: 3px;}
.seledit select    {margin-left: -6px !important;}

.btn-success {width: 100%;}

@media (min-device-width: 760px) {
  .form-group      {text-align: right;}
}

@media (min-device-width: 1100px) {
  .voedingswaarden {margin-left: -34px; margin-right: 34px;}
}

#aatsloginform .form-group {
  text-align: left !important
}

.row .col-sm-10 {
  text-align: left !important
}

.col-md-7 {
  text-align: left;
}

.minilink {padding: 8px 11.5px 10px 8px;}

.aanvraag {color: #ffac8c;}

.verticaltop {vertical-align: top !important; padding: 20px !important;}

.whitebg {background: #FFFFFF !important}

.alignleft {
    display: inline-block;
    color: #FFFFFF;
    background-color: #323e4e;
    border-top-left-radius: .25rem !important;
    border-top-right-radius: .25rem !important;
    cursor: pointer;
    flex: 1 1 auto;
    user-select: none;
}

.alignleft .nav-link {
  text-align: left;
}

.aligncenter {
    display: inline-block;
    color: #FFFFFF;
    background-color: #323e4e;
    border-top-left-radius: .25rem !important;
    border-top-right-radius: .25rem !important;
    cursor: pointer;
    flex: 1 1 auto;
    user-select: none;
    text-align: center !important;
}

.aligncenter .nav-link {
  text-align: center;
}

.alignright {
    display: inline-block;
    color: #FFFFFF;
    background-color: #323e4e;
    border-top-left-radius: .25rem !important;
    border-top-right-radius: .25rem !important;
    cursor: pointer;
    flex: 1 1 auto;
    user-select: none;
}

.alignright .nav-link {
  text-align: right;
}

.filterbut {
    display: inline-block;
    color: #FFFFFF;
    background-color: #323e4e;
    border-top-left-radius: .25rem !important;
    border-top-right-radius: .25rem !important;
    cursor: pointer;
    user-select: none;
    min-width:250px;
}

.filterbut .nav-link {
  text-align: center;
}

.searchbox {
    display: inline-block;
    color: #FFFFFF;
    background-color: #181c22;
    border: 0px solid #000000 !important;
    border-top-right-radius: .25rem !important;
    cursor: pointer;
    flex: 1 1 auto;
    user-select: none;
}

.searchbox .nav-link {
  text-align: right;
}

#filterinput {background-color: transparent; color: #FFFFFF; width: 100%; height:42px; border: 4px solid #000000; text-align: left; padding-left: 10px; padding-right:20px}

.transparent {background-color: #3D4858 !important; color: #FFFFFF !important; cursor: default !important;}

.colorbg {background-color: #3b4859 !important; color: #FFFFFF !important; opacity:0.5;}


.smallrow input {
    min-width: 280px;
}

/* ==========================================================================
   custom select
   ========================================================================== */

.outerborder {
    width: 100%;
    background: #313f52;
    border: 1px solid #161b23;
    height: 160px;
    padding-top:13px !important;
    margin-bottom: 20px;
    border-radius: 6px;
}

.outerborderbig {
    width: 100%;
    background: #313f52;
    border: 1px solid #161b23;
    height: auto;
    padding-top: 20px !important;
    padding-bottom: 20px;
    margin-bottom: 10px;
    border-radius: 6px;
}

@media (max-device-width: 760px) {
  .outerborder {height: 335px; margin-top: -10px;}
  .outerborderbig {margin-top: -10px; height: 740px;}
  .offbutton {margin-top:-50px;}
  .jumbotronadminxxx {height: 80px !important;}
}

.col-form-label {
    padding-top: 4px !important;
}

.form-controlx {
       display: inline-block;
       width: 32.85% !important;
       height: 40px;
       padding: .375rem .75rem;
       font-size: 1rem;
       line-height: 1.5;
       background-image: none;
       background-clip: padding-box;
       border-radius: .25rem;
       transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
       border: 1px solid #2d3a44;
       background-color: #1d222b;
       color: #85b8ff;
       text-align: right !important;
       border: 1px solid #161d28;
       background-color: #17202f;
}

.form-controly {
       display: inline-block;
       width: 32.85% !important;
       height: 40px;
       padding: .375rem .75rem;
       font-size: 1rem;
       line-height: 1.5;
       background-image: none;
       background-clip: padding-box;
       border-radius: .25rem;
       transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
       border: 1px solid #2d3a44;
       background-color: #1d222b;
       color: #85b8ff;
       text-align: right !important;
       border: 1px solid #161d28;
       background-color: #17202f;
}

@media (max-device-width: 850px) {
  .form-controlx {width: 32.5% !important;}
}

@media (min-device-width: 1300px) {
  .form-controlx {width: 32.95% !important;}
}



.form-controlxx {
       display: inline-block;
       xwidth: 35% !important;
       width: 43% !important;
       height: 40px;
       padding: .375rem .75rem;
       font-size: 1rem;
       line-height: 1.5;
       background-image: none;
       background-clip: padding-box;
       border-radius: .25rem;
       transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
       border: 1px solid #2d3a44;
       background-color: #1d222b;
       color: #85b8ff;
       text-align: right !important;
       border: 1px solid #161d28;
       background-color: #17202f;
}

@media (min-width: 850px) and (max-width: 1025px) {
  .form-controlxx {width: 46% !important;}
}

/* ==========================================================================
   mobile -> full width video on rotation
   ========================================================================== */

@media (max-width: 846px) and (orientation: landscape) {
body {padding-top: 0px;}
#navbar   {display: none !important;}
.col-md-4 {display: none;}
.col-md-8 {flex: 0 0 100% !important; width: 100% !important; max-width: 100% !important; height:100vh !important}
.col-md-8 .card {height: 100vh !important;}
.container {
    padding-right: 0px !important;
    padding-left: 0px !important;
    overflow-x: hidden;
    max-width: 100vw;
}
.card-img-top {border-bottom: 10px solid #000000 !important};
.mt-5, .my-5 {margin: 0px !important; width:100%}
.embed-responsive {position:fixed; top:4px; left:0px; height: 100% !important}
.card-body {display: none;}
}

/* ==========================================================================
   pageloader
   ========================================================================== */

.no-js #loader { display: none;  }
.js #loader { display: block; position: absolute; }
.se-pre-con {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 200;
    background-color: #242830;
    background-color: #2c2f39;
}

.hidden {display:none;}

.collapsing {
    -webkit-transition: none;
    transition: none;
    display: none;
}

.navbar-collapse {display: none;}

.ucard_7 {
    background-color: #F7F2DE;
    background-color: #fbedcc !important;
    border-bottom: 40px solid #000000 !important;
}

 .ucard_7 p {
    color: #000000 !important;
 }

.c_cinderella-1950 {
    background-color: #FFFFFF !important;
    border-bottom: 40px solid black !important;
}

.c_metropolis-1927 {
    background-color: #f3e8c6 !important;
    box-shadow: inset 0 0 500px #aba58f;
    border-bottom: 40px solid black !important;
}

.c_metropolis-1927 p {
    color: #000000 !important;
}

.c_cinderella-1950 p {
    color: #000000 !important;
}

/* ==========================================================================
   fonts
   ========================================================================== */

@font-face {font-family: 'Abel';                   src: url('../fonts/Abel-Regular.woff')           format('woff')}
@font-face {font-family: 'Autograph';              src: url('../fonts/AcrosstheRoad.woff')          format('woff')}
@font-face {font-family: 'AnonymousPro';           src: url('../fonts/AnonymousPro.woff')           format('woff')}
@font-face {font-family: 'Aatventure';             src: url('../fonts/Aatventure.woff')             format('woff'); font-display: auto;}
@font-face {font-family: 'Arsmaquette Bold';       src: url('../fonts/Arsmaquette-Bold.woff')       format('woff'); letter-spacing: -0.033em;}
@font-face {font-family: 'Benjamin Sans';          src: url('../fonts/BenjaminSans-Regular.woff')   format('woff')}
@font-face {font-family: 'Caps';                   src: url('../fonts/ErikGCapsSkInvers.woff')      format('woff')}
@font-face {font-family: 'CarbonType';             src: url('../fonts/CarbonType.woff')             format('woff')}
@font-face {font-family: 'DaVinci';                src: url('../fonts/DaVinci.woff')                format('woff')}
@font-face {font-family: 'Fear';                   src: url('../fonts/FaceYourFears.woff')          format('woff')}
@font-face {font-family: 'Hack';                   src: url('../fonts/Hack-Regular.woff')           format('woff')}
@font-face {font-family: 'Historycal';             src: url('../fonts/Historycal.woff')             format('woff')}
@font-face {font-family: 'HouseSlant';             src: url('../fonts/HouseSlant.woff')             format("woff")}
@font-face {font-family: 'James Bond';             src: url('../fonts/SkyFallDone.woff')            format('woff')}
@font-face {font-family: 'Kids';                   src: url('../fonts/KidsScrawl.woff')             format('woff')}
@font-face {font-family: 'League Gothic';          src: url('../fonts/League-Gothic.woff')          format("woff")}
@font-face {font-family: 'Liquid Embrace';         src: url('../fonts/LiquidEmbrace.woff')          format("woff")}
@font-face {font-family: 'Magic Medieval';         src: url('../fonts/MagicMedieval.woff')          format('woff')}
@font-face {font-family: 'Muli Light';             src: url('../fonts/Muli-Light.woff')             format('woff')}
@font-face {font-family: 'Nexa Bold';              src: url('../fonts/Nexa-Bold.woff')              format("woff"); font-weight: 400;}
@font-face {font-family: 'Open Sans';              src: url('../fonts/OpenSans-Regular.woff')       format('woff')}
@font-face {font-family: 'Pasajero';               src: url('../fonts/Pasajero.woff')               format("woff"); font-display: auto;}
@font-face {font-family: 'Raleway Regular';        src: url('../fonts/Raleway-Regular.woff')        format("woff")}
@font-face {font-family: 'Rajdhani Regular';       src: url('../fonts/Rajdhani-Regular.woff')       format("woff")}
@font-face {font-family: 'Roboto Light';           src: url('../fonts/Roboto-Light.woff')           format('woff'); font-weight: 300;}
@font-face {font-family: 'Roboto Regular';         src: url('../fonts/Roboto-Regular.woff')         format('woff'); font-weight: 400; font-display: auto;}
@font-face {font-family: 'Roboto Medium';          src: url('../fonts/Roboto-Medium.woff')          format('woff'); font-weight: 500;}
@font-face {font-family: 'Roboto Bold';            src: url('../fonts/Roboto-Bold.woff')            format('woff'); font-weight: 700;}
@font-face {font-family: 'Roboto Black';           src: url('../fonts/Roboto-Black.woff')           format('woff'); font-weight: 700;}
@font-face {font-family: 'Sketch';                 src: url('../fonts/Sketch-Fine-Serif.woff')      format('woff')}
@font-face {font-family: 'Trajan';                 src: url('../fonts/TrajanProRegular.woff')       format('woff')}
@font-face {font-family: 'Universal';              src: url('../fonts/UniversalAccreditation.woff') format('woff')}
@font-face {font-family: 'Walt Disney';            src: url('../fonts/WaltDisneyScriptv41.woff')    format('woff')}

@font-face {
  font-family: 'FontAwesome';
  font-style: normal;
  font-weight: normal;
  src: url("../fonts/fontawesome-webfont.eot");
  src: url("../fonts/fontawesome-webfont.eot?#iefix") format("embedded-opentype"),
  url("../fonts/fontawesome-webfont.woff2") format("woff2"),
  url("../fonts/fontawesome-webfont.woff") format("woff")
}

@font-face {
  font-family: 'FontAwesomeBrands';
  font-style: normal;
  font-weight: normal;
  src: url("../fonts/!fontawesome5/fa-brands-400.eot");
  src: url("../fonts/!fontawesome5/fa-brands-400.eot?#iefix") format("embedded-opentype"),
  url("../fonts/!fontawesome5/fa-brands-400.woff2") format("woff2"),
  url("../fonts/!fontawesome5/fa-brands-400.woff") format("woff")
}

@font-face {
  font-family: 'FontAwesomeRegular';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/!fontawesome5/fa-regular-400.eot");
  src: url("../fonts/!fontawesome5/fa-regular-400.eot?#iefix") format("embedded-opentype"),
  url("../fonts/!fontawesome5/fa-regular-400.woff2") format("woff2"),
  url("../fonts/!fontawesome5/fa-regular-400.woff") format("woff")
}

@font-face {
  font-family: 'FontAwesomeSolid';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/!fontawesome5/fa-solid-900.eot");
  src: url("../fonts/!fontawesome5/fa-solid-900.eot?#iefix") format("embedded-opentype"),
  url("../fonts/!fontawesome5/fa-solid-900.woff2") format("woff2"),
  url("../fonts/!fontawesome5/fa-solid-900.woff") format("woff")
}

@font-face {
  font-family: 'simple-line-icons';
  src: url('../fonts/Simple-Line-Icons.eot?v=2.4.0');
  src: url('../fonts/Simple-Line-Icons.eot?v=2.4.0#iefix') format('embedded-opentype'),
       url('../fonts/Simple-Line-Icons.woff2?v=2.4.0') format('woff2'),
       url('../fonts/Simple-Line-Icons.ttf?v=2.4.0') format('truetype'),
       url('../fonts/Simple-Line-Icons.woff?v=2.4.0') format('woff'),
       url('../fonts/Simple-Line-Icons.svg?v=2.4.0#simple-line-icons') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: auto;
}

@font-face {
  font-family: 'Glyphicons Halflings';
  src: url('../fonts/glyphicons-halflings-regular.eot');
  src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'),
       url('../fonts/glyphicons-halflings-regular.woff') format('woff'),
       url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'),
       url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}

.glyphicon {
   font-family:'Glyphicons Halflings' !important;
}

#navbar .nav-item {
  font-family: 'simple-line-icons';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  min-width: 55px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icons {
  font-family: 'simple-line-icons';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  min-width: 55px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

i {
  font-style: normal !important;
}

.icon-grid:before             {content: "\e06a";}
.icon-frame:before            {content: "\e038";}
.icon-picture:before          {content: "\e032";}
.icon-social-youtube:before   {content: "\e008";}
.icon-social-pinterest:before {content: "\e60b";}
.icon-arrow-left:before       {content: "\e605";}
.icon-arrow-right:before      {content: "\e606";}
.icon-shuffle:before          {content: "\e059";}

/* ==========================================================================
   Change Autocomplete styles in Chrome
   ========================================================================== */

@media (max-width: 600px) {
  .mobilebutton {max-width: 44px !important; max-height: 40px !important; float: right; border-radius: 50% !important; margin-left: 10px}
}

@media (max-width: 700px) {
  #mainForm .row {margin-right: 0px; margin-left: 0px;}
}

.ordiv {
    background-image: url(../images/or.png);
    background-repeat: no-repeat;
    background-position: center center;
    height: 60px;
    width: 100%;
    margin-top: -14px;
    margin-bottom: -14px;
}

@media (max-height: 650px) {
  .ordiv {opacity: 0; margin-top: -110px; pointer-events: none;}
}

@media (max-width: 769px) {
  .avatar-view {margin-left: auto; margin-right: auto;}
}

@media (max-width: 900px) {
.container {padding-right: 5px; padding-left: 5px; overflow-x: hidden;}
}

@media (max-width: 769px) {
  .notonmobile {display: none !important;}
  .onlymobile  {display: block !important;}
}

@media (max-width: 1030px) {
  .notonipad {display: none !important;}
}

@media (min-width: 769px) {
  .onlymobile  {display: none !important;}
}

@media screen and (min-width: 370px) and (max-width: 760px) {
.profile-card-name {right: -8px; width: 230px;}
}

@media (min-width: 576px) {
  .display-4 {margin-left: 6px; padding-top:8px; padding-bottom:0px}
}

@media (max-width: 576px) {
  .display-4 {margin-top:16px; margin-left: 0px; padding-top:2px; padding-bottom:12px}
  .totheright {margin-left: 20px;}
  .mr-3, .mx-3 {margin-right: 0px !important;}
}

@media (max-width: 900px) {
  .tablecontainer {overflow-x: auto; overflow-y: hidden !important;}
}

@media screen and (max-width: 760px) {
  table {display: table; overflow-x: auto; white-space: nowrap;}
  .tablecontainer .box-white  {padding: 0px !important; border: 1px solid rgb(43, 52, 66);}
}

.mobileedit .profile-card-username {display:none;}

/* ==========================================================================
   Salvatore Grid
   ========================================================================== */

.grid {
  display: flex;
  flex-basis: 0;
  width: 100%;
  min-width: 100%;
}

.grid[data-columns]::before {
  content: '3 .column.size-1of3';
}

@media screen and (max-width: 544px){
  .grid[data-columns]::before {content: '1 .column.size-1of1';}
  .display-4 {font-size: 2rem;}
}

@media screen and (min-width: 544px) and (max-width: 768px) {
  .grid[data-columns]::before {content: '2 .column.size-1of2';}
  .display-4 {font-size: 2rem;}
}
@media screen and (min-width: 992px) and (max-width: 1400px) {
  .grid[data-columns]::before {content: '3 .column.size-1of3';}
}

@media screen and (min-width: 1400px) {
  .grid[data-columns]::before {content: '4 .column.size-1of4';}
}

.column {
  float: left;
}

.size-1of1 {
  width: 100%;
  padding-right: 5px;
  padding-left: 5px;
}

.size-1of2 {
  width: 50%;
  padding-right: 5px;
  padding-left: 5px;
}

.size-1of3 {
  width: 33.333%;
  padding-right: 5px;
  padding-left: 5px;
}

.size-1of4 {
  width: 25%;
  padding-right: 5px;
  padding-left: 5px;
}

/*Internet explorer fix*/
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .card {
    display: block;
  }
}

@media (min-width: 760px) {
  .form-inline .form-control {min-width: 583px;} /* was 400 */
  .modal-content {margin-left: 0px; margin-right: 0px; max-width: 520px;}
}

/* ==========================================================================
   simple keyboard
   ========================================================================== */

.simple-keyboard {
    position: fixed;
    width: 100vw;
    height: 180px;
    bottom: 0px;
    background: #0b0d10;
    overflow: hidden;
    z-index: 9999;
    opacity: 0;
}

.form-control:disabled, .form-control[readonly] {
    background-color: #161b23 !important; opacity: 1;
}

.simple-keyboard input {
    width: 100%;
    height: 100px;
    padding: 20px;
    font-size: 20px;
    border: none;
    box-sizing: border-box;
    background-color: #11191e;
    color: #FFFFFF;
}

.simple-keyboard.hg-theme-default .hg-button {
    box-shadow: 0 0 3px -1px rgba(0,0,0,.3);
    height: 54px;
    min-width: 20px;
    border-radius: 5px;
    box-sizing: border-box;
    padding: 5px;
    color: #FFFFFF;
    background: #13191e;
    border-bottom: 1px solid #164077;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size:20px
}

.hg-layout-smileys .hg-button {
    padding: 0px !important;;
    background: transparent !important;
    border-bottom: 0px solid #b5b5b5 !important;
    font-size: 29px !important;
}

.hg-layout-emotions .hg-button {
    padding: 0px !important;;
    background: transparent !important;
    border-bottom: 0px solid #b5b5b5 !important;
    font-size: 29px !important;
}

.hg-layout-animals .hg-button {
    padding: 0px !important;;
    background: transparent !important;
    border-bottom: 0px solid #b5b5b5 !important;
    font-size: 29px !important;
}

.hg-layout-nature .hg-button {
    padding: 0px !important;;
    background: transparent !important;
    border-bottom: 0px solid #b5b5b5 !important;
    font-size: 29px !important;
}

.hg-layout-food .hg-button {
    padding: 0px !important;;
    background: transparent !important;
    border-bottom: 0px solid #b5b5b5 !important;
    font-size: 29px !important;
}

.hg-layout-weather .hg-button {
    padding: 0px !important;;
    background: transparent !important;
    border-bottom: 0px solid #b5b5b5 !important;
    font-size: 29px !important;
}

.hg-layout-activity .hg-button {
    padding: 0px !important;;
    background: transparent !important;
    border-bottom: 0px solid #b5b5b5 !important;
    font-size: 29px !important;
}

.hg-layout-traffic .hg-button {
    padding: 0px !important;;
    background: transparent !important;
    border-bottom: 0px solid #b5b5b5 !important;
    font-size: 29px !important;
}

.hg-layout-places .hg-button {
    padding: 0px !important;;
    background: transparent !important;
    border-bottom: 0px solid #b5b5b5 !important;
    font-size: 29px !important;
}

.hg-layout-objects .hg-button {
    padding: 0px !important;;
    background: transparent !important;
    border-bottom: 0px solid #b5b5b5 !important;
    font-size: 29px !important;
}

.hg-layout-symbols .hg-button {
    padding: 0px !important;;
    background: transparent !important;
    border-bottom: 0px solid #b5b5b5 !important;
    font-size: 29px !important;
}

.hg-layout-flags .hg-button {
    padding: 0px !important;;
    background: transparent !important;
    border-bottom: 0px solid #b5b5b5 !important;
    font-size: 29px !important;
}

.simple-keyboard {
  max-width: 1000px;
  margin: 0 auto;
}

.simple-keyboard .hg-button.hg-functionBtn.hg-button-space {
  min-width: 150px;
  min-width: 26px !important;
  max-width: none;
}

.simple-keyboard.hg-theme-default .hg-button[data-skbtnuid^="numbers-"] {
  width: 33%;
  max-width: none;
}

.simple-keyboard .hg-button-numbers {
  max-width: 80px;
}

.simple-keyboard .hg-button.hg-functionBtn.hg-button-ent {
  max-width: 80px;
}

.simple-keyboard.myTheme1 {
  background-color: rgba(0, 0, 0, 0.8);
  border-radius: 0;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
}

.simple-keyboard.myTheme1 .hg-button {
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.5);
  color: white;
}

.simple-keyboard.myTheme1 .hg-button:active {
  background: #1c4995;
  color: white;
}

#root .simple-keyboard.myTheme1 + .simple-keyboard-preview {
  background: #1c4995;
}

.simple-keyboard.hg-theme-default .hg-button:active {
    background: #1b98ff;
}

#btn-input {
    font-size: 18px !important;
    width: 100vw;
    padding: 10px;
    position: fixed;
    top: 60px;
}

@media screen and (max-width: 600px) {
.modal {height: 100vh}
.typeahead__result {
    position: fixed;
    top: 124px;
    width: 100vw;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    height: calc(100vh - 308px);
    z-index: 500;
}
}

/* ==========================================================================
   chatgroups
   ========================================================================== */

.conversation strong {
  font-family: "Rajdhani Regular";
  font-size: 19px;
}

.newgrpbtn {width: 100%; line-height: 30px; font-size: 17px; text-transform: uppercase; border-radius:4px}

a {color: #9198a5;}

.text-danger strong {
    position: absolute;
    right: 28px;
    margin-top: -26px;
    pointer: cursor;
    color: #505a61;
}

.text-success strong {
    position: absolute;
    right: 28px;
    margin-top: -26px;
    pointer: cursor;
    color: #99ff00;
}

.conversation li {
    background-color: #1a1d21;
    padding: 10px;
    margin-top: 8px;
    border-bottom: 1px solid #3f464a;
}

/* ==========================================================================
   jumbotron
   ========================================================================== */

.jumbotron {
    padding: 10px 10px 10px 10px;
    margin-bottom: 14px;
    border-radius: 0rem;
    color: #2c2f39!important;
    border-bottom: 1px solid rgba(0,0,0,.0975);
    background-color: #171B22 !important;
    color: #d9dbe2!important;
    background-image: url(../../img/navicons/aatsgradient.jpg);
    margin-top: 40px;
}

@media (max-width: 576px) {
  .jumbotronx  {padding: 8px 10px 6px 20px !important;}
}

@media screen and (max-width: 760px) {
  .jumbotron {background-size: 100% 100%;}
}

@media (max-width: 576px) {
  .minitron {padding: 6px 0px 14px 0px !important;}
}

@media (min-width: 600px) {
  .jumbotronadmin {padding: 80px 1rem 1rem 1rem; margin-bottom: 20px; border-radius: 0px;}
}

@media (max-width: 576px) {
.jumbotronadmin {padding: 1rem 1rem 1rem 1rem; margin-top: 54px; padding-bottom: 0px; margin-bottom: 2px;}
}

.jblight  {margin-top: 66px;}
.jblight2 {margin-top: 66px;}

@media (max-width: 576px) {
  .jblight2 {margin-top: 70px;}
  .minitron .display-4 {margin-top: 38px; padding-bottom: 0px !important; }
}

@media (min-width: 576px) {
  .minitron .display-4 {margin-top: 30px;}
}

.typeahead__dropdown a {color:#FFFFFF !important}


@media (min-width: 992px) {
  .profile-edit-top  {margin-top:60px;}
  .profile-edit-top .col-lg-3 {border-radius: 5px; padding: 30px; height: 300px; margin-left: 100px; margin-right: -100px;}
}

@media (min-width: 769px) {
  .profiletop {margin-top: 70px !important;}
}

@media (max-width: 769px) {
  .profile-links-list {margin-bottom: -12px !important; padding-bottom: 20px !important;}
  .profiletop {margin-top: 68px !important;}
}

/* ==========================================================================
   Form and Input Controls
   ========================================================================== */

.form-control {
   border: 1px solid #2d3a44;
   background-color: #1d222b;
   color: #85b8ff;
}

.form-control {
   border: 1px solid #132030;
   background-color: #17202f;
   color: #abc8f1;
   color: #85b8ff;
}

.form-control:focus {
   border: 1px solid #3d6fad;
   background-color: #1d222b;
   color: #85b8ff;
   box-shadow: none !important
}

/* ==========================================================================
   navigation
   ========================================================================== */

.loginblock-on {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 200px;
    padding-right: 63px;
    padding-top: 2px;
}

.loginblock-off {
    display: none;
}

.bg-faded {
  background-color: #fff;
  font-weight: 500;
  border-bottom: 1px solid rgba(0,0,0,.0975);
}

.bg-nav {
  background-color: #252830;
  background-image: url(../../img/navicons/navback.png);
  background-repeat: repeat;
  background-size:66% 110%;
  max-width: 100vw;
}

.nav-icon {
  font-size: 1.3rem;
  vertical-align: middle;
}

.navbar-brand {position: absolute; padding-left: 16px;}

#navbar-maintext {
    position: absolute;
    top: 5px;
    left: 55px;
    font-family: Aatventure;
    font-size: 26px;
}

.mt-EVE   {font-family: "Muli Light" !important; left: 74px !important; color: #FBAF91 !important;}

.headerlogo {width:46px; height:46px; border-radius: 50%;}

.nav-EVE {
    color: #ffffff !important;
    background-color: #e49473 !important;
    border-color: #6b4333 !important;
}

@media screen and (min-width:760px) {
.navbar-brand    {position: absolute;}
#navbar-maintext {top: 8px;}
}

.d-inline-block {
    width: 230px !important;
}

.headerusername {
    font-size: 18px !important;
    font-weight: 300 !important;
    line-height: 24px !important;
    padding-left: 4px;
    opacity: 0;
}

@media screen and (min-width:760px) {
  .headerusername {padding-left:20px}
}

.smallmenu {width:260px !important;}

@media screen and (max-width:760px) {
  .bg-nav {background-size: 8300px 600px;}
  .minadmin {min-width:80px !important;}
}

.navbar-expand-md {
  min-height: 70px !important;
  padding-right: 0px !important;
  padding-left: 0px !important;
}

.icon-home:before      {opacity: 0;}
.icon-rocket:before    {opacity: 0;}
.icon-grid:before      {opacity: 0;}
.icon-clock:before     {opacity: 0;}
.icon-layers:before    {opacity: 0;}
.icon-magnifier:before {opacity: 0;}
.icon-userx:before     {opacity: 0;}

.iconhome {
    overflow: visible;
    width: 66px;
    background-image: url(../../img/navicons/home.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: 0px 18px;
}

.iconpopular {
    overflow: visible;
    width: 60px;
    background-image: url(../../img/navicons/popular.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: -2px 16px;
}

.iconwebshop {
    overflow: visible;
    width: 72px;
    background-image: url(../../img/navicons/shopshop.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: -10px 15px;
}

.iconfolder {
    overflow: visible;
    width: 40px;
    background-image: url(../../img/navicons/folder.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: 0px 19px;
}

.iconnews {
    overflow: visible;
    width: 66px;
    background-image: url(../../img/navicons/news.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: 2px 16px;
}

.iconpwa  {
  overflow: visible;
  width: 64px;
  background-image: url(../../img/navicons/pwa.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 0px 14px;
}

.iconarchive  {
  overflow: visible;
  width: 64px;
  background-image: url(../../img/navicons/archive.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 0px 16px;
}

.iconsearch  {
  overflow: visible;
  width: 64px;
  background-image: url(../../img/navicons/search.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 0px 15px;
}

.iconsearch-slagerij {
    display: inline-block !important;
    background-position: -6px 1px;
    background-size: 30px 25px;
}

.loginicon {
    overflow: visible;
    width: 70px;
    background-image: url(../../img/navicons/login.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: -20px 16px;
}

.iconlogin {
  overflow: visible;
  background-image: url(../../img/navicons/icon-login.png);
  background-repeat: no-repeat;
  background-size:150px 36px;
  background-position: -49px 18px;
}

.iconemail  {
  overflow: visible;
  background-image: url(../../img/navicons/icon-email.png);
  background-repeat: no-repeat;
  background-size:150px 36px;
  background-position: -49px 17px;
}

@media screen and (min-width: 860px) {
  .bg-nav {box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);}
}

/* ==========================================================================
   Mobile Menu Icons
   ========================================================================== */

@media screen and (max-width: 760px)  {
    .iconhome    {width: 95vw; background-position: -5px 9px; margin-left: 20px;}
    .iconpopular {width: 95vw; background-position: -5px 6px; margin-left: 20px;}
    .iconwebshop {width: 95vw; background-position: -5px 8px; margin-left: 20px;}
    .iconfolder  {width: 95vw; background-position:  0px 10px; background-size: 65px; margin-left: 20px;}
    .iconnews    {width: 95vw; background-position: -4px 6px; margin-left: 20px;}
    .iconpwa     {width: 95vw; background-position: -5px 2px; margin-left: 20px;}
    .iconarchive {width: 95vw; background-position: -1px 8px; background-size: 70px; margin-left: 20px;}
    .iconsearch  {width: 95vw; background-position: 0px 7px; background-size: 66px; margin-left: 20px;}
}

.social i {font-size: 24px !important; line-height: 24px !important; vertical-align: middle !important;}
.icon-social-facebook:before  {content: "\f39e" !important; font-family: FontAwesomeBrands !important;}
.icon-social-twitter:before   {content: "\f099" !important; font-family: FontAwesomeBrands !important;}
.icon-social-instagram:before {content: "\f16d" !important; font-family: FontAwesomeBrands !important;}
.icon-social-linkedin:before  {content: "\f08c" !important; font-family: FontAwesomeBrands !important;}
.icon-social-whatsapp:before  {content: "\f232" !important; font-family: FontAwesomeBrands !important;}
.icon-social-google:before    {content: "\f1a0" !important; font-family: FontAwesomeBrands !important;}

.fa-plus:before      {content: "\f0fe" !important; font-family: FontAwesomeSolid !important;}
.fa-recycle:before   {content: "\f1b8" !important; font-family: FontAwesomeSolid !important;}
.fa-bars:before      {content: "\f0c9" !important; font-family: FontAwesomeSolid !important;}
.fa-th:before        {content: "\f00a" !important; font-family: FontAwesomeSolid !important;}
.fa-back:before      {content: "\f191" !important; font-family: FontAwesomeSolid !important;}
.fa-tie:before       {content: "\f508" !important; font-family: FontAwesomeSolid !important;}
.fa-phone:before     {content: "\f095" !important; font-family: FontAwesomeSolid !important;}
.fa-mobile:before    {content: "\f3cd" !important; font-family: FontAwesomeSolid !important;}
.fa-email:before     {content: "\f0e0" !important; font-family: FontAwesomeSolid !important;}
.fa-toggle-on:before {content: "\f205" !important; font-family: FontAwesomeSolid !important;}
.fa-whatsapp:before  {content: "\f232" !important; font-family: FontAwesomeBrands !important;}

.wa {
    color: #04F474 !important;
    font-size: 32px !important;
    line-height: 26px;
    vertical-align: middle;
    text-align: center;
    opacity: 0.7;
    cursor: pointer;
}

.btn-home {
    color: #fff;
    background-color: #1cca2b;
    border-color: #1bca2b;
}

/* ==========================================================================
   pagination
   ========================================================================== */

.pagination {
  position: relative !important;
  margin-left: 0px;
  margin-bottom: 40px;
}

.page-link {
    color: #9598a2;
    background-color: #1d2027;
    border: 1px solid #303740;
    width: 50px;
    height: 50px;
    line-height: 2;
    text-align: center;
}

.page-item.disabled .page-link {
  color: #7b7e88;
  background-color: #1d2027;
  border: 1px solid #303740;
  pointer-events: none;
}

.dark-link {
  color: #fff5d9;
  background-color: #252830;
  border: 1px solid #5e6369;
}

@media screen and (max-width: 760px)  {
  .pagination {
    margin-bottom: 0px;
    width: 100vw;
    border: 0px !important;
    overflow: scroll;}
}

/* ==========================================================================
   no overlay on News API's and Apps
   ========================================================================== */

/* overlay */
.o_news                   {opacity:0 !important;}
/* card */
.c_news                   {border:0px !important;}
/* image */
.i_news                   {min-height:100px !important;}

/* aatventure frontpage */
.appid1                   {display:none !important;}

/* apps */
.o_app                    {opacity:0 !important;}
.c_app                    {border:0px !important;}


/* clicktrough for site with links */
.x_CBS                    {pointer-events: none !important}
.x_google                 {pointer-events: none !important}
.x_Geenstijl              {pointer-events: none !important}
.x_9to5Google             {pointer-events: none !important}
.x_9to5Mac                {pointer-events: none !important}
.x_Engadget               {pointer-events: none !important}
.x_chrome-developers      {pointer-events: none !important}

.intimage                 {width:100% !important; height:auto !important;}
.gsimage                  {width:100% !important; height:auto !important; margin-top:10px; margin-bottom:10px;}

.nos          {color: #667e9a !important; font-size: 16px !important;}
.adnl         {color: #667e9a !important; font-size: 16px !important;}
.nunl         {color: #667e9a !important; font-size: 16px !important;}
.telegraaf    {color: #667e9a !important; font-size: 16px !important;}
.volkskrant   {color: #667e9a !important; font-size: 16px !important;}
.trouw        {color: #667e9a !important; font-size: 16px !important;}
.rtl          {color: #667e9a !important; font-size: 16px !important;}
.nrc          {color: #667e9a !important; font-size: 16px !important;}
.parool       {color: #667e9a !important; font-size: 16px !important;}
.stentor      {color: #667e9a !important; font-size: 16px !important;}
.tweakers     {color: #667e9a !important; font-size: 16px !important;}
.linda        {color: #667e9a !important; font-size: 16px !important;}
.fok          {color: #667e9a !important; font-size: 16px !important;}
.geenstijl    {color: #667e9a !important; font-size: 16px !important;}
.gelderlander {color: #667e9a !important; font-size: 16px !important;}
.dagblad      {color: #667e9a !important; font-size: 16px !important;}
.wnltv        {color: #667e9a !important; font-size: 16px !important;}
.marokko      {color: #667e9a !important; font-size: 16px !important;}

.source_googlex {height: 470px !important}

.googlenews   {color: #c0f941 !important; font-size: 16px !important;}

/* ==========================================================================
   seasons
   ========================================================================== */

.January, .February, .March, .April, .May, .June, .July, .August, .September, .October, .November, .December, .January  {
  width: 100% !important; height:200px; font-size: 1.2rem; text-transform:uppercase; text-align:left; padding-left: 20px; filter:sepia(100%); transition:0.5s;
  border: 1px solid #2a2f3a !important; border-radius:6px !important; background-repeat: no-repeat; background-position: center center; background-size: cover}

.January:hover, .February:hover, .March:hover, .April:hover, .May:hover, .June:hover, .July:hover, .August:hover, .September:hover, .October:hover, .November:hover,
.December:hover  {filter:sepia(0%); }

.January   {background-image: url(../../img/months/januari.jpg);}
.February  {background-image: url(../../img/months/februari.jpg);}
.March     {background-image: url(../../img/months/maart.jpg);}
.April     {background-image: url(../../img/months/april.jpg);}
.May       {background-image: url(../../img/months/mei.jpg);}
.June      {background-image: url(../../img/months/juni.jpg);}
.July      {background-image: url(../../img/months/juli.jpg);}
.August    {background-image: url(../../img/months/augustus.jpg)}
.September {background-image: url(../../img/months/september.jpg)}
.October   {background-image: url(../../img/months/oktober.jpg);}
.November  {background-image: url(../../img/months/november.jpg);}
.December  {background-image: url(../../img/months/december.jpg);}

@media (min-width: 1600px) and (max-width: 5000px) {
	.col-md-2 {-ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
}

@media (max-width: 1600px) and (min-width: 1200px) {
  .col-md-2 {-ms-flex: 0 0 33.3%; flex: 0 0 33.3%; max-width: 250px;}
}

@media (min-width: 1200px) and (max-width: 1600px) {
	.col-md-2 {-ms-flex: 0 0 33.3%; flex: 0 0 33.3%; max-width: 33.3%;}
}

@media (min-width: 1000px) and (max-width: 1200px) {
	.col-md-2 {-ms-flex: 0 0 35%; flex: 0 0 35%; max-width: 35%;}
}

@media (min-width: 800px) and (max-width: 1000px) {
	.col-md-2 {-ms-flex: 0 0 35%; flex: 0 0 35%; max-width: 35%;}
}

@media (min-width: 600px) and (max-width: 800px) {
	.col-md-2 {-ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%;}
}

@media (max-width: 800px) {
	.col-md-2 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
}

.h5, h5 {margin-bottom: 12px !important;}

.navbar-toggler {
  background-color: #252b35;
}

.navbar-toggler:focus {
    outline-width: 1px;
    outline-style: solid;
    outline-color: #262931;
}

.card-img-top {border-bottom: 10px solid #13191d; object-fit: scale-down;}

/* ==========================================================================
   containers
   ========================================================================== */

div#aatventurecontainer {
    display: none;
    position: fixed;
    top: 69px;
    left: 0px;
    bottom: 0px;
    right:0px;
    background: black;
    z-index: 10;
}

#iframeoverlay {
    display: none;
    position: fixed;
    top: 69px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    z-index: 10;
    width: 100vw;
    height: calc(100vh - 69px);
}

#popupcontainer {
    display: none;
    position: fixed;
    top: 58px;
    left: 0px;
    bottom: 0px;
    width:100vw;
    height:100vh;
    background: rgba(44, 47, 57, 0.8);
    z-index: 9999;
}

#popupiframe {
    position: fixed;
    top: 70px;
    left: 0px;
    bottom: 0px;
    right:0px;
    background: #2c2f39;
    color: #FFFFFF;
    width:100%;
    height:80vh;
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
    box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
}

@media (min-width: 1200px) {
  .container {max-width: 98vw;}
}

@media (max-width: 1030px) {
  .container {max-width: 1024px !important; padding-left: 0px !important; padding-right: 0px !important;}
}


@media (max-width: 600px) {
  .container {padding-left: 0px !important; padding-right: 0px !important;}
}

@media screen and (max-width:760px) {
  .ataraheader       {margin-left:0px !important;}
  .nav-item          {padding-top: 4px; padding-bottom: 0px;}
  .navbar-nav .nav-item  {padding-bottom: 4px;}
}

code {
    display: block;
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 90%;
    background-color:transparent !important;
    color: #7bb4ec;
    white-space: pre-wrap;
    word-wrap: break-word;
    padding:10px;
}

.ataracode   {
  margin-top:10px;
  margin-bottom:10px;
  background-color: #272b2f;
  border: 1px solid #000000;
  padding:30px;
  border-radius: 15px;
  border-bottom: 1px solid #535f6b;
  box-shadow: 0 1px 5px rgba(0,0,0,0.4) inset, 0 0 20px rgba(0,0,0,0.2) inset;
  cursor: text
}

.ataracode:hover {background-color: #263e56;}

.ataracode p {font-family: "Hack" !important; font-size:15px; line-height:20px;}

@media screen and (max-width:760px) {
.ataracode {
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 12px;
    margin-left: 0px;
    margin-right: 0px;
    font-size :14px;
}
.ataracode p {font-size:14px !important; line-height:18px !important;}
figcaption   {margin-left:10px}
}

@media (min-width: 768px) {
  #navbarDropdownMenuLink {min-width: 260px;}
  .dropdown-menu {right: 0;}
}

@media (min-width: 768px) {
  .dropdown-toggle {min-width:100px ! important; float: right;}
}

@media (max-width: 768px) {
  .dropdown-toggle {width: 127px ! important; float: right;}
}

.modal-open {padding-right:0px !important}

#easyComment_Content {display:block; margin-left:20px; margin-right:20px; margin-bottom:30px;}

#easyComment {min-height:400px !important;}

.add-comment form .add-comment-form > div textarea {
    background-color: #181c23 !important;
}

@media screen and (min-width:1025px) {
	.modal-content             {margin-left: -100px; margin-right: -200px;}
	.form-inline .form-control {min-width: 400px;}
}

.card-body h1 {
    font-family: "Roboto Black";
    text-transform: uppercase;
    line-height: 1;
    color: #FFFFFF;
}

@media (max-width: 576px) {
  .card-body h1 {padding: 30px 20px 6px 0px !important;}
}

@media (max-width: 900px) {
  .card-body h1 {padding: 20px; margin-top: 16px !important;}
}

.card-body h1 {margin-bottom: 40px;}

@media (min-width: 1200px) {
  .card-body h1 {margin-top: 40px;}
}

.ataradescription {
    font-weight: 600;
    margin-bottom: 10px;
}

p {
    font-family: "Roboto Light";
    font-size: 18px;
    line-height: 1.6;
    color: #d8d5d5;
    margin: 0px;
}

.card-body p b {
    color: #FFFFFF;
}

.card-body .img-fluid {
    min-width: 100%;
}

.aatsname {
    position: absolute;
    margin-top: 2px;
    font-size: 20px;
}

.aatsusername {
    position: absolute;
    margin-top: 28px;
}

.time {
    white-space: nowrap;
    float: right;
}

.aatstimeago {
    position: absolute;
    margin-top: 8px;
    right: 0px;
}

.aatschannel {
    position: absolute;
    margin-top: 26px;
    right: 0px;
}

.card-body {
    box-shadow: inset 0 90px 10px #191c23;
}

.card-body a {
    color: #70adff;
}

.avatar {
    min-width: 10px !important;
}

.form-check-inline {
    display: inline-block;
    margin-right: .75rem;
    color: #FFFFFF;
}

.aatsloginform {
    margin-left: auto;
    margin-right: auto;
    max-width: 400px;
    background-color: #252b35;
    padding: 20px;
    border: 1px solid #2e3542;
    border-radius: 4px;
    padding-bottom: 20px;
    overflow: visible;
}

.loginbackground {
    background-color: #4c5e76;
    background-image: url(../../img/navicons/navback.png);
    background-repeat: no-repeat;
    background-size: cover;
    color: #FFFFFF;
    margin: 0;
    min-height:100vh;
    height: 100% !important;
    overflow: visible;
}

.main-inner {
  background-color: #000000;
}

.admin-simple-sm {
    background: #14191f;
    border-radius: 1px;
    text-align: center;
}

.youtube {
    max-height: 312px;
}

.btn-light.disabled, .btn-light:disabled {
    background-color: #2a2f3a;
    border-color: #212327;
    color: #777777;
}

.note-editor.note-frame .note-editing-area .note-editable {
    color: #FFFFFF !important
}

.ataradescription {font-weight:600; margin-bottom: 10px;}

.alert-warning a {color: #856404 !important;}

/* ==========================================================================
   min/max widths
   ========================================================================== */

.vmiddle td {vertical-align:middle !important}

.minwidth80  {min-width: 80px  !important; max-width: 100px;}
.minwidth100 {min-width: 100px !important;}
.minwidth110 {min-width: 110px !important;}
.minwidth120 {min-width: 120px !important;}
.minwidth140 {width:140px !important; min-width: 140px !important; max-width: 140px !important;}
.minwidth150 {min-width: 150px !important; max-width: 150px !important;}
.minwidth160 {min-width: 160px !important; max-width: 160px;}
.minwidth180 {min-width: 180px !important; max-width: 200px;}
.minwidth200 {min-width: 200px; max-width: 400px;}
.minwidth300 {min-width: 300px; max-width: 500px;}

.maxwidth13  {max-width: 13px !important; text-align: center;}
.maxwidth15  {text-align: center;}
.maxwidth20  {max-width: 20px  !important; text-align: center;}
.maxwidth25  {text-align: center;}
.maxwidth38  {max-width: 38px !important;  text-align: center;}
.maxwidth44  {max-width: 44px  !important; text-align: center;}
.maxwidth50  {width: 50px; min-width: 50px  !important; max-width: 50px;}
.maxwidth60  {width: 60px; min-width: 60px  !important; max-width: 60px;}
.maxwidth66  {width: 66px; min-width: 66px  !important; max-width: 66px;}
.maxwidth70  {max-width: 70px !important;}
.maxwidth74  {width: 74px; max-width: 74px;}
.maxwidth80  {width: 80px; min-width: 80px  !important; max-width: 80px;}
.maxwidth100 {width:100px; min-width: 100px !important; max-width: 140px;}
.maxwidth120 {width:120px; min-width: 120px !important; max-width: 120px;}
.maxwidth140 {width:140px; min-width: 140px !important; max-width: 140px;}
.maxwidth160 {width:160px; min-width: 160px !important; max-width: 160px;}
.maxwidth180 {width:180px; min-width: 180px !important; max-width: 180px;}

.width12     {min-width: 12px  !important; width:12px;  max-width: 12px;}
.width30     {min-width: 30px  !important; width:30px;  max-width: 30px;}
.width72     {min-width: 72px  !important; width:72px;  max-width: 72px;}
.width100    {min-width: 100px !important; width:100px; max-width: 100px;}
.width200    {min-width: 200px !important; width:200px; max-width: 200px;}
.width250    {min-width: 250px !important; width:250px; max-width: 250px;}
.width300    {min-width: 300px !important; width:300px; max-width: 300px;}
.width500    {min-width: 500px !important; width:500px; max-width: 500px;}

@media (min-width: 576px) {
  .maxwidth70  {width: 70px !important;}
}

@media (max-width: 576px) {
  .maxwidth25  {max-width: 25px !important;}
}

/* ==========================================================================
   increase/decrease
   ========================================================================== */

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

.value-button {
    display: inline-block;
    border: 1.3px solid #28353f;
    width: 40px;
    padding: 11px 0;
    background: #fd9a74;
    user-select: none;
}

.value-button:hover {
  cursor: pointer;
}

.incdec #decrease {
  margin-right: -4px;
  border-radius: 8px 0 0 8px;
}

.incdec #increase {
  margin-left: -4px;
  border-radius: 0 8px 8px 0;
}

.incdec #input-wrap {
  margin: 0px;
  padding: 0px;
}

input.number {
    text-align: center;
    margin: 0px;
    width: 70px;
    height: 47px;
    background-color: antiquewhite;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* ==========================================================================
   navigation bottom links
   ========================================================================== */

.avatar-xs {max-width: 40px; margin-left: 10px; margin-right: 10px; height: 40px; width: 40px;}

@media screen and (max-width: 760px) {
  table       {display: table; overflow-x: auto; white-space: nowrap;}
  .nav        {width: 100%;}
  .nav-itemx  {width: 33%;}
  .maxwidth13 {max-width: 40px !important;}
  .tablecontainer .box-white  {padding: 0px !important; border: 0px solid rgb(43, 52, 66);}
}

.fc-content-skeleton tr {min-height:50px}
.fc-center {margin-top:10px; margin-bottom:10px}


/* ==========================================================================
   news
   ========================================================================== */

   .btn-light:not([disabled]):not(.disabled).active, .btn-light:not([disabled]):not(.disabled):active, .show>.btn-light.dropdown-toggle {
     color: #111;
     background-color: transparent !important;
     border-color: transparent !important;
     box-shadow: none !important;
   }

   .btn-light.focus, .btn-light:focus {
    box-shadow: none !important;
    }

   .newstitle {
       font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,
                    "Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
       margin-left: 1.25rem;
       margin-right: 1.25rem;
       z-index: 0;
       text-shadow: 1px 1px 10px #000;
       margin-top: -100px;
   }

   .newstitle p {
       font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,
                    "Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
       font-size: 1.5rem;
       font-weight: 500;
       line-height: 1.2;
       color: #FFFFFF !important;
   }

   .newscontent {
       margin-left: 1.25rem;
       margin-right: 1.25rem;
       z-index: 0;
       margin-bottom: 30px;
       margin-top: 30px;
   }

   .newscontent p {
       font-size: 20px;
       color: #bec8d2;
       line-height: 1.5 !important;
   }

   .newscontent p {
      margin-bottom: 16px;
    }

   .cbsimg {
     display: block;
     margin-left: auto;
     margin-right: auto;
     max-width: 100%;
     border-radius: 4px;
   }

   .newscontent em {
       margin-top: 20px;
       font-size: 20px;
       color: #bec8d2;
       line-height: 1.5 !important;
   }

   .newscontent a {
       color: #c0f941;
       font-size: 20px;
   }

   .extlinkgoogle {
       color: #e9f4ff !important;
       font-size: 20px;
   }

   .richcard {background-color: #000000; background-image:none !important;}

   .moviecard {background-color: #000000; background-image:none !important;}

   .richitem, .movieitem {
       border-bottom: 116px solid transparent;
   }

   .richtitle {
       font-family: "Rajdhani Regular";
       margin-left: 1.25rem;
       margin-right: 1.25rem;
       z-index: 0;
       margin-top: -100px;
       font-size: 16px;
       font-weight: 700;
       line-height: 24px;
       color: #FFFFFF;
   }

   .richcontent {
       padding-left: 1.25rem;
       padding-right: 1.25rem;
       z-index: 0;
       margin-bottom: 30px;
       margin-top: 10px;
   }

   .richcontent p {}

   .bg-instantlight {background-color: #3D4858;}

   .newsitem     {border-bottom: 116px solid #1d2127;}
   .bottom-txt p {font-size: 1.5rem; font-family: inherit; font-weight: 500; line-height: 1.2;}
   .linebreak    {margin-top:20px; margin-bottom:0px !important;}

   .btn-grey {
       color: #fff;
       background-color: #2e3542;
       border-color: #242b36;
   }

   .okbutton {min-width: 200px; cursor:pointer;}

   .catimg {width:105px !important;}

   #navbarsExampleDefault {min-height:69px !important;}
   .navbar-expand-md      {min-height:69px !important;}

   .min80 {min-width: 80px !important; max-width: 80px !important; }

   table.dataTable td, table.dataTable th {
       text-align: left !important;
   }

   .moviebottom {border-bottom:40px solid #1a1e25 !important;}
   .bottomline  {position:absolute; bottom:-30px; font-size: 20px;}
   @media (min-width: 760px) {.bottomline  {bottom:-33px;}}

   @media (max-width: 700px) {
     .col-9 {max-width: 62%;}
   }

   @media (max-width: 700px) {
     #mainForm .row {margin-right: 0px; margin-left: 0px;}
   }

   @media (min-width: 700px) {
     .allright {text-align:right}
   }

/* ==========================================================================
   typahead search
   ========================================================================== */

.typeahead__dropdown, .typeahead__list {height: calc(100vh - 200px); overflow-y: auto;}

@media (min-width: 576px) {
  .modal-dialog {margin-top: 50px !important;}
}

.modal {padding-left: 0px !important}

.typeahead__container * {
    box-sizing: border-box;
    outline: 0;
    border: 0 !important;
}

.typeahead__field {
    color: #FFFFFF !important;
}

.typeahead__field input, .typeahead__field textarea {
    border-radius: 0px !important;
}

.nobackground {background: transparent !important;}

.fixed-topx {z-index: 9999;}

.typeahead__container.hint .typeahead__query>:last-child, .typeahead__hint {
    background: #131418 !important;
}

.typeahead__field .typeahead__hint, .typeahead__field [contenteditable],
.typeahead__field input, .typeahead__field textarea {
    background: #131418;
    border: 0px solid #2b2f39 !important;
}

.typeahead__field .typeahead__hint:active, .typeahead__field .typeahead__hint:focus,
.typeahead__field [contenteditable]:active, .typeahead__field [contenteditable]:focus,
.typeahead__field input:active, .typeahead__field input:focus, .typeahead__field textarea:active,
.typeahead__field textarea:focus {
    border-color: #66afe9 !important;
    box-shadow: none !important;
}

.typeahead__dropdown, .typeahead__list {
    background-color: #2b2f39 !important;
    border: 1px solid #2a2f39 !important;
}

.typeahead__list>.typeahead__group.active>a, .typeahead__list>.typeahead__group>a,
.typeahead__list>.typeahead__group>a:focus, .typeahead__list>.typeahead__group>a:hover {
    background: #1d2027 !important;
    color: #3484c3 !important;
}

.typeahead__list .typeahead__dropdown .typeahead__dropdown-item>a, .typeahead__list .typeahead__item>a {
    padding: 16px 0px !important;
    min-height: 50px
}

.typeahead__list>li {
    border-top: 1px solid #4d5567 !important;
}

.typeahead__dropdown li:last-child {
    border-top: 1px solid #4d5568 !important;
}

.typeahead__filter button {
    width: 210px;
}

.typeahead__result .name {
    margin: 0 10px 0px 104px;
    display: inline-block;
}

.typeahead__result .division {
    position: absolute;
    right: 10px;
    font-size: 12px;
    color: #777777;
    font-variant: small-caps;
}

.typeahead__container .typeahead__field .typeahead__hint, .typeahead__container .typeahead__field .typeahead__label-container, .typeahead__container .typeahead__field [contenteditable], .typeahead__container .typeahead__field input, .typeahead__container .typeahead__field textarea {
    color: #FFFFFF;
}

.typeahead__dropdown, .typeahead__list {
    min-width: 210px;
}

.typeahead__field .typeahead__hint, .typeahead__field [contenteditable], .typeahead__field input, .typeahead__field textarea {
    min-height: 50px !important;
}

.typeahead__container button {
    border: 0px solid #CCCCCC !important;
    height: 50px !important;
}

.typeahead__dropdown .typeahead__dropdown-item>a, .typeahead__list .typeahead__item>a {
    background-color: #2A2F39;
    border-bottom: 1px solid #111111;
    overflow: hidden;
}

.typeahead__dropdown .typeahead__dropdown-item>a {
    background-color: #191E28 !important;
    border-bottom: 1px solid #3A4251 !important;
}

.typeahead__filter+.typeahead__button button {display: none;}

.typeahead__field .typeahead__hint, .typeahead__field [contenteditable], .typeahead__field input, .typeahead__field textarea {
    background: #131417 !important;
}

.typeahead__item>a {
    color: #fbfbfb !important;
}

.miniitem {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 80px;
    background-color: #000000;
    padding: 2px 4px 0 10px;
    overflow: hidden;
}

.miniitem img {
    position: absolute;
    top: 0px;
    left: 0px;
    height: auto;
    min-height: 60px;
    width: 100%;
}

.useritemclass {
  width: 110px !important;
}

.userimgclass {
  height: 110px !important;
  width: auto !important;
}

.useromsclass {
  margin: 0 10px 0px 120px !important;
  width: 100%;
  font-weight: 700;
  font-size: 18px;
}

.usersubtitleclass {
  margin: 0 25px 0px 120px !important;
}

.blogomsclass {
  margin: 0 10px 0px 100px !important;
  font-weight: 700;
  font-size: 18px;
}

.blogsubtitleclass {
  margin: 0 18px 0px 100px !important;
}

.productsubtitleclass {display: none !important}

.searchfor-users .typeahead__list>li {}
.searchfor-users .typeahead__group   {height: 36px !important;}
.searchfor-users .typeahead__list .typeahead__item>a {min-height: 110px !important;}

.searchfor-contacts .typeahead__list>li {}
.searchfor-contacts .typeahead__group   {height: 36px !important;}
.searchfor-contacts .typeahead__list .typeahead__item>a {min-height: 110px !important;}

@media screen and (max-width: 760px) {
.typeahead__field .typeahead__hint, .typeahead__field input, .typeahead__field textarea {
    border: 0px solid #2b2f39 !important;
}
}

@media screen and (max-width:760px) {
  .modal          {top: 69px !important;}
  .modal-backdrop {top: 69px !important;}
  .modal-dialog   {margin: 0px !important;}
  .p-5            {padding: 0px !important;}
  .col-10         {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
  .col-2          {display: none;}
  .modal-open .modal {height: 100vh; background-color: #000000;}
  .typeahead__field .typeahead__hint, .typeahead__field input, .typeahead__field textarea {border: 0px solid #2b2f39 !important;}
  .typeahead__field .typeahead__hint, .typeahead__field [contenteditable], .typeahead__field input, .typeahead__field textarea {
    background: #131418 !important;}
}

/* ==========================================================================
   card
   ========================================================================== */

.card {
  border: 0px;
  border-bottom: 40px solid transparent;
  background-image: url(../boot/subtle.png);
  background-size: 100% 700px;
  margin-bottom: 10px;
  color: #FFFFFF;
}

.card-header {
  background-color: rgb(36, 41, 48) !important;
  color: #FFFFFF;
}

.card-imgxxx{
  min-height: 200px;
}

.card-img-top {
  width:100%;
}

.card a, .card a:focus, .card a:hover {
  text-decoration: none;
  outline: none;
}

.card-txt-body {
  -ms-flex: 1 1 auto;
      flex: 1 1 auto;
  padding: 3rem 1.25rem;
}

.arrows a, .arrows a:focus, .arrows a:hover {
  text-decoration: none;
  outline: none;
}

.card-footer {
  padding: .75rem 1rem !important;
  background-color: #fff;
  border-top: 1px solid rgba(0,0,0,0.07);
}

.card-border {
  border-top: 1px solid rgba(0,0,0,0.07);
  box-shadow: none !important;
}

/* ==========================================================================
   mobile
   ========================================================================== */

@media screen and (max-width: 500px) and (orientation: portrait) {
   .bg-nav {box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);}
}

.nav-link {display: block; text-align: right; padding: 9px 13px;}

.headerusername {color: #FFFFFF;}

@media (max-width: 900px) {
  .navbar-toggler {position: absolute; top: 14px; right: 22px;}
}

@media (max-width: 760px) {
  .nav-link   {font-family: "Rajdhani Regular"; font-size: 16px}
  .navbar-nav {border-bottom: 500px solid #21242d !important;}
  .navbar-nav .nav-link {padding-right: 15px;}
}

@media (max-width: 760px) {
.nav-tabs  .nav-link   {font-size: 16px; padding: 5px 10px;}
}

@media (max-width: 900px) {
  .size-1of1 {padding-right: 0px !important; padding-left: 0px !important;}
  .nav-item {border-bottom: 1px solid #4c4d50;}
}

@media (max-width: 1030px) {
  .scrollnavcontainer {position: absolute; display: inline-block; width: 100% !important; margin-top: -10px; overflow-y: hidden; -webkit-overflow-scrolling: touch;}
  .scrollnavcontainer::-webkit-scrollbar {display: none;}
  .scrollnavcontent     {width: 3200px !important}
  .searchbox            {display: none !important;}
  .containerx           {margin-top: 28px;}
}

@media (max-width: 600px) {
  .scrollnavcontainer {z-index:999 !important}
}


/* ==========================================================================
   ipad landscape edits
  ========================================================================== */

@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  .doemaarlager   {margin-top: 54px !important;}
}

/* ==========================================================================
   ipad portrait
  ========================================================================== */

@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
    .doemaarlager {margin-top: 5px !important;}
}

/* ==========================================================================
   starfield
   ========================================================================== */

#drwho {
    position: fixed;
    perspective: 342px;
    bottom: 0px;
    height: 366px;
    width: 100vw;
    overflow: hidden;
    z-index: 1;
    pointer-events: none;
    background-image: url('../img/backgrounds/menubottom.jpg');
    background-size: contain;
    display: none;
}

@media (max-height: 816px) {
  #drwho {display: none !important;}
}

#slogan {
    position: relative;
    right: -200px;
    width: 150px;
    height: 70px;
    bottom: -60px;
    z-index: 99999999;
}

.autograph {
  width: 150px;
  font-family: "Autograph";
  font-size: 44px;
  color: rgba(255,255,255,0.8);
}

.autograph::after {
  content: "Aat Venture";
  display:flex;
  transform:rotateX(180deg);
  background-image:linear-gradient(180deg,rgba(255,255,255,0) 10%,rgba(255,255,255,0.2));
  -webkit-background-clip: text;
  color: transparent;
  margin-top: -28px;
}

.blueline {
    position: absolute;
    width: 135px;
    height: 1px;
    margin-top: -54px;
    border-top: 1px solid rgba(255,255,255,0.1);
    opacity: 0.2;
    margin-left: 6px;
}

@media (max-height: 670px) {
  #slogan {display: none;}
}

@keyframes fly   {from {transform: translateZ(0px);} to {transform: translateZ(300px);}}
@keyframes fade1 {from {opacity: .5;} to {opacity: 1;}}
@keyframes fade2 {from {opacity: 0;} to {opacity: .5;}}

.stars {
  position: absolute;
  animation: fly 3s linear infinite;
  transform-style: preserve-3d;
  left: 50%;
  margin-top: 20px;
  width: 2px;
  height: 2px;
  box-shadow: 148px 350px #f0f0f0, 941px 172px white, -99px 276px #fafafa, 995px -264px #e0e0e0, 1066px -21px white, 1375px 117px #e0e0e0, 199px 456px #dedede, 970px 43px #c2c2c2, -32px 332px #e3e3e3, 1485px 19px #f7f7f7, -527px -274px #ebebeb, 236px -47px #f2f2f2, -1028px 306px #d1d1d1, 592px -205px #c4c4c4, 1344px 385px #c4c4c4, 1082px 352px #d9d9d9, 937px -392px #e8e8e8, 1273px 480px #ededed, -866px 361px #f0f0f0, 1106px -158px #ebebeb, 678px 327px #fafafa, 1362px -342px #ededed, -714px 216px #fcfcfc, 42px -316px #f0f0f0, 1343px 16px #ededed, 715px 29px #e6e6e6, 1276px -82px #fafafa, -1442px 409px #d9d9d9, -1261px -420px white, 659px 26px #ededed, 187px 210px #d4d4d4, -777px 396px #c2c2c2, -1143px 73px #e8e8e8, 1211px 167px #f7f7f7, -72px -437px #d1d1d1, -361px -143px #c2c2c2, -1274px -194px #cccccc, 942px -195px #e3e3e3, -1391px -136px #e6e6e6, -933px 429px #f0f0f0, -284px 440px #dedede, -1304px 228px #fafafa, 1281px -434px #fafafa, 419px 135px #d4d4d4, 563px -352px #e8e8e8, 477px 312px #fafafa, -1150px -369px #fafafa, -292px -448px #d6d6d6, -740px 422px #d4d4d4, -762px 302px #e8e8e8, -1461px 460px #f0f0f0, -1058px -450px #e3e3e3, 385px -416px #f7f7f7, 232px -426px whitesmoke, 33px 109px #dedede, -68px -212px #d9d9d9, -800px 437px #fafafa, 1182px -328px whitesmoke, 1448px -67px #ededed, -759px 60px #f0f0f0, -632px 439px #e6e6e6, 534px -156px #e3e3e3, -566px 53px #cfcfcf, 510px -460px #f2f2f2, 1417px -403px #dbdbdb, 337px -75px #fcfcfc, -1261px -78px #f2f2f2, -964px 53px #f7f7f7, -1235px 111px #c9c9c9, -1117px 58px #c2c2c2, -1415px -160px #cccccc, -989px 65px #cfcfcf, -1270px 376px #dedede, 1436px 294px #e0e0e0, 701px -101px #e0e0e0, 1014px -459px #f2f2f2, -1453px -373px #f7f7f7, -946px -50px #cccccc, 743px 439px #dbdbdb, -328px -99px whitesmoke, 2px -33px whitesmoke, -290px -255px #c4c4c4, 688px -77px #e8e8e8, 384px -277px #d9d9d9, -856px -474px #f2f2f2, -674px 405px white, -1316px -110px #ebebeb, -102px -477px #cfcfcf, -1266px 206px #e3e3e3, 575px -350px white, 454px 162px #d6d6d6, -254px -61px #c9c9c9, 1327px 184px #fcfcfc, 1076px 92px whitesmoke, -1345px -22px #fafafa, 1453px 41px #fcfcfc, 1032px 377px #cfcfcf, -1138px -351px #c2c2c2, 1353px 346px #d4d4d4, -716px -445px #c4c4c4, 495px 282px #c4c4c4, 1083px 106px #f7f7f7, -279px -46px #ededed, -86px -227px #c2c2c2, 929px 326px #c9c9c9, -320px 430px #c4c4c4, 1359px -245px #d4d4d4, 1213px 192px white, -869px -369px #cccccc, -1489px -256px #e8e8e8, -668px -2px #fafafa, 1372px -192px white, -443px 459px #f2f2f2, 1492px -288px #d6d6d6, -299px -404px whitesmoke, -287px -23px #f7f7f7, 649px 253px #dedede, -1166px 236px #cfcfcf, -1414px -403px white, 861px 5px #e3e3e3, 862px -179px white, -1420px -72px white, 895px 30px #d6d6d6, -1157px -376px #cccccc, -653px 416px #fcfcfc, 882px 435px #f7f7f7, -694px -355px #d4d4d4, 835px 449px #c7c7c7, 1086px 119px #c4c4c4, -1254px 402px #c9c9c9, -1465px 142px #fcfcfc, 1084px 104px white, 1410px 427px #c7c7c7, 450px -318px #c4c4c4, 693px -336px #dedede, -305px -211px #dedede, 1465px 232px #c9c9c9, 879px -204px #fafafa, -1267px 12px whitesmoke, 276px 334px #e6e6e6, -1373px 243px #d1d1d1, -1438px 166px #fcfcfc, 358px -424px #c4c4c4, -530px 323px #f7f7f7, 380px 217px #c9c9c9, -299px -55px #f2f2f2, 1020px 294px #fcfcfc, -598px -276px #d6d6d6, 1446px -207px #ebebeb, 1213px -299px #c4c4c4, -413px 173px #c4c4c4, 755px 58px #ededed, -1091px 275px #f7f7f7, 266px -270px #e3e3e3, -94px -57px #d4d4d4, 769px 370px whitesmoke, 132px -121px #c2c2c2, 931px 84px #d6d6d6, 867px -398px #d9d9d9, -216px -229px #c7c7c7, -1155px 4px whitesmoke, 1191px -421px whitesmoke, -1214px -185px #c2c2c2, 760px -155px #dedede, -757px 475px #dbdbdb, -1224px 320px #e0e0e0, 340px 67px #d9d9d9, 1411px -420px #d6d6d6, -825px 395px #f7f7f7, -1040px -458px #d1d1d1, 373px -148px #ededed, 115px -167px #e8e8e8, -984px -413px #d4d4d4, -258px 4px #f0f0f0, 619px -384px #f2f2f2, -794px 31px #cccccc, 395px -144px #fcfcfc, 254px 215px #cfcfcf, 416px 28px #d9d9d9, -368px -319px #ededed, 1253px 375px #d1d1d1, 1216px -399px #fcfcfc, 1046px -140px whitesmoke, 255px -64px #d9d9d9, -760px -123px #ededed, 185px 410px #e8e8e8, -1318px -440px #d9d9d9, 1063px -456px whitesmoke, -870px -125px #d9d9d9, 648px 313px #d4d4d4, -485px -256px #d1d1d1, 1408px 20px #cccccc, -13px -185px #f2f2f2, -1151px -62px white, 769px 476px #c2c2c2, 102px -167px #f2f2f2, 975px -355px #e3e3e3, -419px -262px white, -634px -98px #cccccc, 1013px -39px #dedede, -987px -441px #e0e0e0, -1325px -428px #e6e6e6, -206px 81px #f0f0f0, -519px 134px #f2f2f2, 386px -156px #cfcfcf, 1498px -365px #f0f0f0, 53px -188px #fafafa, 415px 186px #e8e8e8, -424px 269px #cfcfcf, -78px -315px #f0f0f0, 455px 327px #cfcfcf, 1159px -85px #c4c4c4, 1154px 230px #ededed, -1130px -25px #e8e8e8, -1454px -122px #c9c9c9, -564px -396px #e3e3e3, -688px -174px #dedede, -27px -422px #e6e6e6, -184px 431px #c2c2c2, -1097px 477px #cccccc, 958px 23px whitesmoke, -1107px -263px #f7f7f7, -1486px 134px #c2c2c2, -211px 34px #d9d9d9, -853px -475px whitesmoke, 319px -274px #e6e6e6, 267px -34px #d4d4d4, 206px -113px #dbdbdb, 102px -396px #cfcfcf, -1287px 472px #fafafa, 246px -77px #cccccc, 740px 366px #c4c4c4, 1116px 377px #e0e0e0, -1202px -17px #f2f2f2, 14px 24px #cfcfcf, -316px 112px #d4d4d4, -811px -31px #ebebeb, 391px -296px #fafafa, -1399px -268px #cccccc, 1440px -167px #e3e3e3, 851px 439px #f7f7f7, 1145px -147px #cccccc, 390px 258px #c7c7c7, -343px 340px #e3e3e3, -92px -446px #d6d6d6, -1011px 124px #f0f0f0, -1450px 176px #d6d6d6, 1194px 468px #d6d6d6, -1015px -395px #f2f2f2, 814px -262px whitesmoke, -1388px 407px #c9c9c9, 155px 126px #c7c7c7, -125px -42px #dedede, -821px -405px #fcfcfc, 1036px 389px #fafafa, 514px 305px #d1d1d1, -835px -460px #d6d6d6, 1053px -222px #e0e0e0, -971px -157px #f0f0f0, 502px -374px #c9c9c9, 111px 342px #d1d1d1, 1355px 34px #c2c2c2, 456px 464px #dbdbdb, 1466px -446px #c4c4c4, -9px 118px #d9d9d9, -557px 371px #f7f7f7, 707px 345px white, 1403px -336px white, 68px 169px #cccccc, 1161px -427px #c7c7c7, -1142px -6px #ebebeb, 938px -216px #ebebeb, -488px 367px #e3e3e3, -743px -255px #dedede, -119px 216px #f2f2f2, 982px 316px #c9c9c9, -545px -443px #cccccc, -1064px -237px #d9d9d9, 946px -429px #d4d4d4, -247px 333px white, -443px 51px #ededed, -478px -209px #c2c2c2, 681px 315px #c7c7c7, 1070px -396px #c2c2c2, 130px -363px white, 565px 223px #cccccc, -696px -398px #d1d1d1, -804px 1px #cccccc, -876px 461px whitesmoke, 1174px -424px #fcfcfc, -210px -230px #c9c9c9, -543px -306px #e0e0e0, -1244px 125px #cfcfcf, -1410px -453px #f0f0f0, -1175px -204px #f2f2f2, 699px -201px #c7c7c7, 675px 260px #c2c2c2, -1392px -466px #d4d4d4, 472px 472px #c7c7c7, -1054px -172px #d1d1d1, -110px -430px #fafafa, 1461px 310px #d1d1d1, 356px 373px #cccccc, -381px 165px #c2c2c2, 1077px 474px #e8e8e8, 661px -190px white, -1380px 242px #c7c7c7, -1039px 371px #f0f0f0, -570px -350px #e8e8e8, 358px 281px #fcfcfc, 80px -190px #e3e3e3, 468px 299px #cfcfcf, -452px 329px #e0e0e0, 636px -294px #c7c7c7, -901px 307px #c9c9c9, 187px -39px #cfcfcf, 1097px -266px #cccccc, -408px -328px #fafafa, -80px -442px #e0e0e0, -441px 418px #ededed, -575px 21px #cccccc, 25px -276px #dedede, -114px 19px #cccccc, -1352px -343px #e0e0e0, 136px 14px #e8e8e8, 737px 195px whitesmoke, 285px 249px #c7c7c7, -789px -58px #e6e6e6, -689px 438px #fafafa, 619px 308px #c4c4c4, -1387px 61px #c7c7c7, 1245px 334px white, -708px -382px #c4c4c4, -1420px 102px #cccccc, -748px -319px #f2f2f2, -545px -455px whitesmoke, 1273px 346px #e8e8e8, -574px -295px #d1d1d1, -733px 193px #dedede, 790px -118px #c9c9c9, -1393px -299px #cccccc, -253px 149px #e8e8e8, -1419px 242px #c9c9c9, 995px 254px #d6d6d6, 359px 440px #c4c4c4, -815px -227px #c9c9c9, 881px 138px #d4d4d4, 316px 12px #c4c4c4, -94px -388px #cfcfcf, 1119px -205px #e0e0e0, 998px -158px #d9d9d9;
}

.stars:before, .stars:after {
  content: "";
  position: absolute;
  width: inherit;
  height: inherit;
  box-shadow: inherit;
}

.stars:before {
  transform: translateZ(-300px);
  animation: fade1 3s linear infinite;
}

.stars:after {
  transform: translateZ(-600px);
  animation: fade2 3s linear infinite;
}

/* ==========================================================================
   3D CSS
   ========================================================================== */

.toplayer {
  z-index: 99999;
}

.view {
    position: relative;
    margin-top: 130px;
    z-index: 1;
    pointer-events: none;
}

.plane {
  width: 200px;
  height: 200px;
  transform-style: preserve-3d;
  background-image: url('../boot/aatventuremegahuge.png');
  background-size: contain;
}

.plane.main {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  transform: rotateX(60deg) rotateZ(-30deg);
  animation: rotate 30s infinite linear;
}

.plane.main .circle {
    width: 250px;
    height: 250px;
    position: absolute;
    margin-top: -20px;
    margin-left: -20px;
    transform-style: preserve-3d;
    border-radius: 100%;
    box-shadow: 0 0 10px #005aff24;
}

.plane.main .circle::before, .plane.main .circle::after {
  content: "";
  display: block;
  position: absolute;
  text-align: center;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 1%;
  height: 1%;
  border-radius: 100%;
  background: #FFFFFF;
  box-sizing: border-box;
}

.plane.main .circle::before      {transform: translateZ(-90px);}
.plane.main .circle::after       {transform: translateZ(90px);}
.plane.main .circle:nth-child(1) {transform: rotateZ(72deg) rotateX(63.435deg);}
.plane.main .circle:nth-child(2) {transform: rotateZ(144deg) rotateX(63.435deg);}
.plane.main .circle:nth-child(3) {transform: rotateZ(216deg) rotateX(63.435deg);}
.plane.main .circle:nth-child(4) {transform: rotateZ(288deg) rotateX(63.435deg);}
.plane.main .circle:nth-child(5) {transform: rotateZ(360deg) rotateX(63.435deg);}

@keyframes rotate {
  0%   {transform: rotateX(0) rotateY(0) rotateZ(0);}
  100% {transform: rotateX(360deg) rotateY(360deg) rotateZ(360deg);}
}

.dropdown-item {
    display: block;
    width: 100%;
    padding: .25rem 1.5rem;
    clear: both;
    font-weight: 400;
    color: #FFFFFF;
    text-align: inherit;
    white-space: nowrap;
    background: 0 0;
    border: 0;
    text-align: right;
    font-size: 18px;
}

.dropdown-fontname, .dropdown-fontsize {
    height: 580px;
    overflow: scroll;
    margin-top: 70px;
}

.dropdown-fontname .dropdown-item {
    display: block;
    width: 100%;
    padding: 0px;
    padding-top:3px;
    text-align: left;
    font-size: 17px;
}

.dropdown-fontsize .dropdown-item {
    display: block;
    width: 100%;
    padding: 0px;
    padding-top:3px;
    text-align: left;
    font-size: 17px;
}

.dropdown-line-height .dropdown-item {
    display: block;
    width: 100%;
    padding: 0px;
    padding-top:3px;
    text-align: left;
    font-size: 17px;
}

.dropdown-item:focus, .dropdown-item:hover {
    color: #FFFFFF;
}

/* ==========================================================================
   table
   ========================================================================== */

table      {font-family: "Raleway Regular";}
.nav-tabs  {font-family: "Raleway Regular";}
table td   {font-family: "Raleway Regular";}

.ataratable {border-radius:6px; font-size:15px !important; overflow-y: auto;}

.table td, thead {
    background-color: #000000;
    font-family: "Raleway Regular";
}

.table td, .table th {
    border: 1px solid #2b353e !important;
    background-color: #16191f;
    color: #FFFFFF;
    vertical-align: middle;
}

.table th      {height: 100%;}
.table td      {height: 63px;}
.tdsmallheight {height: 46px !important}

.preline {
    white-space: pre-line;
    vertical-align: top !important;
    font-size: 14px;
    line-height: 1.6;
    height: 100%;
    padding-top: 14px !important;
}

.preline::first-line {
    line-height:1;
}

.table thead th {
    color: #666A77;
    border-bottom: 0px !important;
    background-color: #000000;
}

.table td a, .table th a {
    color: #FFFFFF;
}

@media (max-width: 700px) {
  .ataratable td {font-size:12px !important}
}

/* ==========================================================================
   profile
   ========================================================================== */

.box-profile {
  -webkit-border-radius: 4px;
  border-radius: 4px;
  background: #fff;
  border: solid 1px #d8e2e7;
  margin: 0 0 20px;
}

.profile-card {
  display: inline-block;
  padding-right: 15px;
  float: left;
}

.profile-card-photo {
  width: 110px !important;
  border: 5px solid #fff;
  border: 5px solid #171c24;
  border-radius: 100%;
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);
}

.profile-card-username {
    color: #6c7a86;
    margin-top: 2px;
}

.profile-card-about {
    color: #677288;
    font-size: 11px;
    opacity: 1;
}

.profile-card-name {
    font-weight: 600;
    margin-top: 30px;
    font-size: 30px;
    color: #d9dbe2 !important;
    text-transform: uppercase;
}

.profile-statistic {
  text-align: center;
  font-size: .9375rem;
}

.level {
  vertical-align: middle;
  border-top: solid 1px #d8e2e7;
  border-bottom: solid 1px #d8e2e7;
  padding: 10px;
}

.points {
  vertical-align: middle;
  border-bottom: solid 1px #d8e2e7;
  padding: 10px;
}

.profile-links-list {
  padding: 10px 0;
}

.profile-links-list {
    position: relative;
    width: 610px !important;
    font-size: .9375rem;
    display: flex;
    margin-bottom: 0;
    margin-left: -5px !important;
    margin-right: -15px !important;
    overflow-x: hidden !important;
    margin-top: -8px;
    margin-bottom: 4px;
}

.profile-links-list li {
  padding: 4px 0;
  margin: 0 5px;
}

.profile-links-list li.nowrap {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.btn-light {
    color: #DDDDDD;
    background-color: #2a2f3a;
    background-color: #213854;
    min-width: 30px;
    text-align: center;
    border: 1px solid #212327;
}

.btn-light:hover {
    color: #FFFFFF;
    background-color: #2a2f3a;
    border-color: #212327;
}

@media screen and (min-width: 760px) {
.profile-card-about {position: fixed; top: 84px; right: 34px; width: 600px; text-align: right; display: none;}
.grid {background-color: #2C2F39; z-index: 1;}
}

@media screen and (max-width: 760px) {
.profile-card          {width: 125px;}
.profile-card-name     {position: relative; line-height: 0.9; top: -22px; font-size: 28px; text-align: right;}
.profile-card-about    {font-family: "Rajdhani Regular"; font-size: 16px; margin-top: -15px; text-align: right; width: 240px; line-height: 1.3;}
.profile-card-username {margin-top: 6px !important; width: 240px; color: #80c6ff; text-align: right;}
}

@media screen and (max-width: 400px) {
.profile-card-name     {position: relative; line-height: 0.9; top: -22px; font-size: 28px; text-align: right; width: 180px;}
.profile-card-about    {font-family: "Rajdhani Regular"; font-size: 15px; margin-top: -15px; text-align: right; width: 180px; line-height: 1.3;}
.profile-card-username {margin-top: 6px !important; width: 180px; color: #80c6ff; text-align: right;}
}

/* ==========================================================================
   admin
   ========================================================================== */

.adminbody {
    position:absolute;
    width: 100vw;
    height: 100vh;
    background:url('../../img/backgrounds/canvas2018.jpg') no-repeat;
    background-size:cover;
    overflow: hidden;
    z-index:1;
}

.box-white {
  border-radius: .25rem;
  color: #FFFFFF;
  border: 0px solid rgba(0,0,0,.125);
  margin-bottom: 20px;
  padding: 0px;
}

.nav-tabs .nav-link {
    color: #FFFFFF;
}

.nav-tabs {
  border-bottom: none;
}

.admin-item {
  border-bottom: 1px solid #f7f7f9;
  overflow: hidden;
  padding: 10px 0;
  position: relative;
}

.admin-item-img {
  display: none;
  float: left;
  margin-right: 15px;
  width: 50px;
}

.admin-image {
  width: 50px;
}

.admin-item-user {
  display: none;
}

.admin-item-text {
  color: #818a91;
  display: block;
  font-size: 12px;
  margin: 0;
}

.member-item-user {
  color: #212529;
  display: block;
  margin: 0;
}

.member-item-text {
  display: block;
  font-size: 12px;
  margin: 0;
}

.admin-simple-sm {
  border-radius: 1px;
  text-align: center;
}

.admin {
  margin: 0 0 30px;
}

.admin-simple-sm .admin-simple-sm-icon {
  height: 80px;
  overflow: hidden;
  line-height: 80px;
  font-size: 2.75rem;
  display:none;
}

.home-icon {
  position: relative;
  top: 5px;
}

.color-blue {
  color: #00a8ff!important;
}

.color-red {
  color: #e52d27!important;
}

.color-delete {
  color: #f4645f !important;
}

.admin-simple-sm-bottom {
  background: #f6f8fa;
  font-weight: 600;
  padding: 15px 10px;
  font-size: .9375rem;
  line-height: normal;
  border-radius: 0 0 3px 3px;
  display: none;
}

.bottom-white {
  background: #fff!important;
}

.display-4 {
  font-family: "Roboto Black";
  text-transform: uppercase;
  color: #FFFFFF;
  font-size: 30px !important;
  font-weight: 300 !important;
  line-height: 1 !important;
}

.dagindeling       {padding-left:10px;}

.admin-item-img    {float: right !important;}
.member-item-user  {display:inline-block !important; float: right !important; padding-right:20px !important; color:#FFFFFF !important;}
.member-item-text  {display:none !important}
.admin-item-text   {display:none !important}
.col-3             {text-align: right;}

.admin a {color:#FFFFFF;}

.jblight        {background-color: #3c404c;}
.col-form-label {color: #FFFFFF;}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #FFFFFF !important;
    background-color: #0879f9;
    border-color: #0879f9;
}

#pills-tab .nav-item .nav-link {
    background-color: #000000;
    color: #AAAAAA;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #FFFFFF !important;
    background-color: #272a32 !important;
    border: 0px solid #ced4da !important;
}

.card-header.note-toolbar .dropdown-menu {
  min-width: 220px !important;
}

@media screen and (min-width:760px) {
  .dropdown-menu {background-color: #252b35 !important;}
}

@media screen and (max-width:760px) {
  .dropdown-menu  {background-color: transparent; background-color: #252b35 !important;}
}

.dropdown-item:focus, .dropdown-item:hover {background-color: #0d77ff;}

.nav-pills .nav-link {border-radius: 0px !important}

#pills-tab .nav-item .nav-link {background-color: #000000;}

.btn-info {
    color: #FFFFFF;
    background-color: #2374CA;
    border-color: #2C75C3;
    cursor: pointer;
}

.btn-info:hover {
    color: #FFFFFF;
    background-color: #4596EC;
    border-color: #4E97E5;
}

.ml-3 {margin-left: 0px !important; margin-right: 0px !important}

.note-editor.note-frame {border: 1px solid #21232a;}
.note-editor.note-frame .note-statusbar .note-resizebar {background-color: #111111;}
.note-editor.note-frame .note-editing-area .note-editable {min-height: 500px; background-color: #262931;}

.note-editor.note-frame .note-editing-area .note-editable {min-height: 500px; background-color: #161f2e;}
.note-toolbar {background-color: rgb(15, 22, 33) !important;}

.note-frame {border-bottom: 0px !important;}

.modal-contentx   {background-color: #6c7488;}
.modal-content    {background-color: transparent;}
.list-group-item {background-color: #363c4c !important; color:#FFFFFF !important;}

.aatsloginform  .btn-primary {
    width: 100%;
}

@media screen and (min-width: 760px) {
  .btn-primary, .btn-danger {min-width:100px;}
}

.btn-face a {
    color: #FFFFFF;
}

/* ==========================================================================
   static right column on big screens
   ========================================================================== */

@media (min-width: 868px) {
  .mt-5 .col-md-4::-webkit-scrollbar {display: none;}
	.mt-5 .col-md-4 {
    position: fixed; right: 15px; overflow-y:scroll; height:90vh;
  }
}

/* ==========================================================================
   social icons edit
   ========================================================================== */

@media (min-width: 768px) {
  .col-md-3 {text-align: right;}
  .col-md-5 {-ms-flex: 0 0 36%; flex: 0 0 36%; max-width: 36%;}
  .aanpassen .col-md-6 {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
}

/* ==========================================================================
   social buttons
   ========================================================================== */

.profile-links-list  {position:relative; width:610px !important; overflow-x:hidden !important;}
.horizontalscroller  {overflow-x:scroll !important;}

@media (min-width: 768px) {
  .xcol-md-4          {max-width: 100% !important;}
  .horizontalscroller {position: absolute; overflow-x: hidden !important; width: 630px !important;
                       flex: 0 0 50% !important; max-width: 50% !important; right: 20px;}
}

.profile-links-list .btn-light {
    background-color: #1e232b;
    border-radius: 50% !important;
    min-width: 65px;
    min-height: 65px;
    margin: 0px;
    padding: 10px 0px 0px 0px;
}

.profile-links-list {
    margin-left:  -5px  !important;
    margin-right: -15px !important;
}

.webcolor       {background-image: url(../images/www.png);       background-size: cover !important;}
.facebookcolor  {background-image: url(../images/facebook.png);  background-size: cover !important;}
.twittercolor   {background-image: url(../images/twitter.png);   background-size: cover !important;}
.linkedincolor  {background-image: url(../images/linkedin.png);  background-size: cover !important;}
.instagramcolor {background-image: url(../images/instagram.png); background-size: cover !important;}
.youtubecolor   {background-image: url(../images/youtube3.png);  background-size: cover !important;}
.whatsappcolor  {background-image: url(../images/whatsapp2.png); background-size: cover !important;}
.snapchatcolor  {background-image: url(../images/snapchat.png);  background-size: cover !important;}
.emailcolor     {background-image: url(../images/email2.png);    background-size: cover !important;}

.webcolor:active       {background-image: url(../images/www.png);}
.facebookcolor:active  {background-image: url(../images/facebook.png);}
.twittercolor:active   {background-image: url(../images/twitter.png);}
.linkedincolor:active  {background-image: url(../images/linkedin.png);}
.instagramcolor:active {background-image: url(../images/instagram.png);}
.instagramcolor:active {background-image: url(../images/youtube3.png);}
.whatsappcolor:active  {background-image: url(../images/whatsapp2.png);}
.snapchatcolor:active  {background-image: url(../images/snapchat.png);}
.emailcolor:active     {background-image: url(../images/email2.png);}

.webcolor i       {opacity:0 !important;}
.facebookcolor i  {opacity:0 !important;}
.twittercolor i   {opacity:0 !important;}
.linkedincolor i  {opacity:0 !important;}
.instagramcolor i {opacity:0 !important;}
.youtubecolor i   {opacity:0 !important;}
.whatsappcolor i  {opacity:0 !important;}
.snapchatcolor i  {opacity:0 !important;}
.emailcolor i     {opacity:0 !important;}

/* ==========================================================================
   adsense
   ========================================================================== */

.pagesideads{
  max-height: 300px !important;
  background-color: #2c2f39;
}

.betads{
  max-width: 500px !important;
}

/* ==========================================================================
   various
   ========================================================================== */

.blog-footer {
  padding-top: 3rem;
  padding-bottom: 3rem;
  color: #fff;
  text-align: center;
}

.tweettext {
  font-size: 1rem;
  line-height: 1.5;
  font-family: Arial,sans-serif;
  color: #292f33;
  word-wrap: break-word;
}

.list-item {
  display: block;
  position: relative;
  min-height: 58px;
}

.list-left {
  float: left;
  padding-right: 7px;
}

.list-body {
  margin-left: 52px;
}

.text-muted {
  color: #a4b5ca;
  color: #FFFFFF !important;
  opacity: 0.6;
}

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

.user-info{
  display: block;
  width: 90%;
  position: absolute;
  bottom: 1.25rem;
}

.author {
  display: inline-block;
  position: absolute;
  color: inherit;
  left: 1.25rem;
  bottom: 1rem;
  z-index: 3;
  margin-bottom: -48px;
}

.author span {
    display: inline-block;
    margin-bottom: -13px;
    color: #7f8188 !important;
    text-transform: lowercase;
    font-size: 13px;
}

.card .author:hover {
  color: inherit;
}

.card .nocolor {
  color: inherit;
}
.card .nocolor:hover {
  color: inherit;
}

.card-date{
  display: inline-block;
  position: absolute;
  right: 1.25rem;
  bottom: 1.40rem;
  margin-bottom: -52px;
  opacity: 0.3;
}

.card-like{
  display: inline-block;
  position: absolute;
  padding: .25rem;
  left: 0;
  top: 0;
  z-index: 3;
}

.card-count {
  font-size: 16px;
  color: #999999;
  margin-top: 9px;
  margin-left: 40px;
}

.stats {
  display: inline-block;
  float: right;
  margin-top: .3rem;
}

.bottom-txt {
    position: absolute;
    left: 1.25rem;
    right: 1.25rem;
    bottom: 4rem;
    margin-bottom: -42px;
    z-index: 0;
    text-shadow: 1px 1px 10px #000;
    opacity:0;
}

.playericon {
  position: absolute;
  font-size: 1.6rem;
  top: .6rem;
  right: 1.25rem;
  z-index: 3;
}

.category {
  font-size: 12px;
  text-transform: uppercase;
  padding: .25rem;
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 3;
}

.category-middle {
  font-size: 12px;
  text-transform: uppercase;
  padding: 3px;
  position: absolute;
  top: 1rem;
  right: 50px;
  z-index: 3;
}

.avatar {
  height: 45px;
  margin-right: 5px;
}

.avatar-sm {
  position: relative;
  z-index:99999999999;
  height: 40px;
  min-width: 40px;
  margin-left: -5px;
  margin-right: 5px;
  max-width: 40px;
}

.imgthumb {
  width: 38px;
  height: 38px;
  border-radius: 5px;
  margin-right: 10px
}

.imgthumbbig {
  width: 220px;
  height: auto;
  border-radius: 5px;
  margin-right: 10px
}

.time {
  white-space: nowrap;
  float: right;
}

.text-ellipsis {
  display: block;
}

.marginlt{
  margin-top: 1.50rem;
}

.btn-face {
  color: #fff!important;
  background-color: #3b5998;
  border-color: #3b5998;
  display: block;
}
.btn-face:hover, .btn-face:focus {
  background-color: #30487b;
  outline: none;
}

.btn-twit {
  color: #fff!important;
  background-color: #2ba9e1;
  border-color: #2ba9e1;
  display: block;
}
.btn-twit:hover, .btn-twit:focus {
  background-color: #1c92c7;
  outline: none;
}

.btn-google {
  color: #fff!important;
  background-color: #db4437;
  border-color: #db4437;
  display: block;
}
.btn-google:hover, .btn-google:focus {
  background-color: #c9302c;
  outline: none;
}

.btn-linkedin {
  color: #fff!important;
  background-color: #0077B5;
  border-color: #0077B5;
  display: block;
}
.btn-linkedin:hover, .btn-linkedin:focus {
  background-color: #1188C6;
  outline: none;
}

.btn-face {background-color: #3b5998; border: 0 !important; fill: rgb(255, 255, 255);}
.btn-twit {background-color: #1DA1F2; border: 0 !important; fill: rgb(255, 255, 255);}
.btn-aat  {display: block; background-color: #2FD64B; border: 0 !important; fill: rgb(255, 255, 255); cursor: pointer;}

.btn-face svg {height: 18px; width: 18px; vertical-align: middle;}
.btn-twit svg {height: 18px; width: 18px; vertical-align: middle;}
.btn-aat  svg {height: 18px; width: 18px; vertical-align: middle; margin-right: 14px;}


.social i {
  margin-right: 15px;
  font-size: 21px;
  line-height: 21px;
  vertical-align: top;
}


.btn-white-color  {
  color: #fff!important;
}

.bg-post {
  border-left: 1px solid rgba(0,0,0,.0975);
  border-right: 1px solid rgba(0,0,0,.0975);
  background-color: #fff!important;
  word-wrap: break-word;
  padding-right: 0px;
  padding-left: 0px;
}

.sociallogin{
  margin-bottom: 10px;
}

.colleft {
  width: 25%;
  float:left;
  display:block;
}

.colright {
  float:left;
  width: 25%;
  display: inline-block;
  padding-top: 12px;
}

.youtube {
  width: 100%;
  overflow: hidden;
  margin:0;
  border-radius: calc(.25rem - 1px);
  border-bottom: 88px solid rgb(19, 21, 25);
  max-height: 312px;
}

.change-ratio{
  width: 100%;
  margin:-10% 0;
}

.btn-circle {
  width: 50px;
  height: 50px;
  padding: 10px 13px;
  position: absolute;
  top: 40%;
  left: 45%;
  right: 0;
  cursor: pointer;
  font-size: 24px;
  line-height: 1.25em;
  border-radius: 35px;
  border: 2px solid #fff;
}

/*Emojis*/
.emoji {
  height: 1.25em;
  width: 1.25em;
  padding: 0 .05em 0 .1em;
  vertical-align: -0.2em;
}


/* ==========================================================================
   likecount and heart
   ========================================================================== */

.heart {
  background: url(../images/heart.png);
  background-position: left;
  background-repeat: no-repeat;
  height: 50px;
  width: 50px;
  cursor: pointer;
  position: absolute;
  left:0px;
  background-size:1450px;
  left: 5px !important;
  top: 0px !important;
}

.heartguest {
  background: url(../images/heart.png);
  background-position: left;
  background-repeat: no-repeat;
  height: 50px;
  width: 50px;
  cursor: pointer;
  position: absolute;
  left:0px;
  background-size:1450px;
  left: 5px !important;
  top: 0px !important;
}

.heart:hover {
  background-position: right;
}

.heartliked {
  background-position: right;
}

.likeCount {
  margin-top: 13px;
  margin-left: 28px;
  font-size: 16px;
  color: #999999
}

.like {
  margin-top: -13px;
}

div.lesspadding {
    padding-right: 0px;
    padding-left: 0px;
    text-align: center;
}

.like             {margin-top: 0px !important; height: 29px; background-color: #ef883c; cursor: pointer;}
.ml-3 .heart      {margin-top: -10px !important; margin-left: 30%;}
.ml-3 .heartguest {margin-top: -10px !important; margin-left: 30%;}
.ml-3 .likeCount  {margin-top: 3px !important; margin-left: 18px !important;}

.heart         {left: 5px !important; top: 0px !important;}
.heartguest    {left: 5px !important; top: 0px !important;}
.card-count    {margin-top: 9px; margin-left: 40px;}

.likeCount     {margin-top: 11px; margin-left: 56px !important; color: #ffffff !important;}

.like .heartguest {
    left: 15px !important;
    top: -1px !important;
}

@media screen and (max-width:760px) {
  .ml-3 .heart      {margin-left: 15%  !important;}
  .ml-3 .heartguest {margin-left: 15%  !important;}
  .ml-3 .likeCount  {margin-left: 16px !important;}
}

.btn-group-sm>.btn, .btn-sm {
    border-radius: 0px !important;
}

.btnadd {
  border-radius: .25rem;
  font-weight: bolder;
  cursor: pointer;
}

#texteditor {
  border-radius: .25rem;
  font-weight: bolder;
  cursor: pointer;
}

.btnhome {
  background: #fff;
  border: 1px solid #ced4da;
  border-radius: .25rem;
  cursor: pointer;
}

.btn-arrow {
    color: #fff;
    background-color: #111316;
    border-color: #1d2c3a;
    box-shadow: rgb(29, 44, 58) 0px 0px 70px inset;
    opacity: 0.6;
}

.btn-arrow:hover {
  color: #fff;
  background-color: #1e2023;
  border-color: #585F72;
  opacity: 1
}

.btn-arrow:focus, .btn-arrow.focus {
  box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5);
}

.btnpoint {
  cursor: pointer;
}

.bg-instant{
  background-color: #2c2f39;
}

.mb-3 .bg-instant{
  box-shadow: 10px 10px 20px 0px rgba(0,0,0,0.42);
}

.bg-over{
  background: rgba(0,0,0,0.1);
  border-radius: .25rem;
  width: 100%;
}

.bg-over:hover {
  background: rgba(0,0,0,0);
  border-radius: .25rem;
  width: 100%;
}

.link-over{
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index:1;
}

.embedbox{
  max-width: 400px;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: #111;
  background-color: #f8f9fa;
  font-weight: 500;
  border: 1px solid #ced4da;
}

.color-box{
  border-radius: .25rem;
  padding: 0 1rem;
}

.tag-img {height: 200px;}

/* ==========================================================================
   overig
   ========================================================================== */

.list-inline-item:not(:last-child) {
    margin-right: 1rem;
}

@-webkit-keyframes heartBlast {
  0% {background-position: left;}
  100% {background-position: right;}
}

@keyframes heartBlast {
  0% {background-position: left;}
  100% {background-position: right;}
}

.heartAnimation {
  -webkit-animation-name: heartBlast;
  animation-name: heartBlast;
  -webkit-animation-duration: .8s;
  animation-duration: .8s;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
  -webkit-animation-timing-function: steps(28);
  animation-timing-function: steps(28);
  background-position: right;
}

div.lesspadding {
  padding-right: 0px;
  padding-left: 0px;
}

.noise {position: relative; z-index: 1;}

.noise:before, .body-noise:before {
	content: "";
	position: absolute;
	z-index: -1;
	top:0;
	bottom:0;
	left:0;
	right:0;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAMAAAAp4XiDAAAAUVBMVEWFhYWDg4N3d3dtbW17e3t1dXWBgYGHh4d5eXlzc3OLi4ubm5uVlZWPj4+NjY19fX2JiYl/f39ra2uRkZGZmZlpaWmXl5dvb29xcXGTk5NnZ2c8TV1mAAAAG3RSTlNAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEAvEOwtAAAFVklEQVR4XpWWB67c2BUFb3g557T/hRo9/WUMZHlgr4Bg8Z4qQgQJlHI4A8SzFVrapvmTF9O7dmYRFZ60YiBhJRCgh1FYhiLAmdvX0CzTOpNE77ME0Zty/nWWzchDtiqrmQDeuv3powQ5ta2eN0FY0InkqDD73lT9c9lEzwUNqgFHs9VQce3TVClFCQrSTfOiYkVJQBmpbq2L6iZavPnAPcoU0dSw0SUTqz/GtrGuXfbyyBniKykOWQWGqwwMA7QiYAxi+IlPdqo+hYHnUt5ZPfnsHJyNiDtnpJyayNBkF6cWoYGAMY92U2hXHF/C1M8uP/ZtYdiuj26UdAdQQSXQErwSOMzt/XWRWAz5GuSBIkwG1H3FabJ2OsUOUhGC6tK4EMtJO0ttC6IBD3kM0ve0tJwMdSfjZo+EEISaeTr9P3wYrGjXqyC1krcKdhMpxEnt5JetoulscpyzhXN5FRpuPHvbeQaKxFAEB6EN+cYN6xD7RYGpXpNndMmZgM5Dcs3YSNFDHUo2LGfZuukSWyUYirJAdYbF3MfqEKmjM+I2EfhA94iG3L7uKrR+GdWD73ydlIB+6hgref1QTlmgmbM3/LeX5GI1Ux1RWpgxpLuZ2+I+IjzZ8wqE4nilvQdkUdfhzI5QDWy+kw5Wgg2pGpeEVeCCA7b85BO3F9DzxB3cdqvBzWcmzbyMiqhzuYqtHRVG2y4x+KOlnyqla8AoWWpuBoYRxzXrfKuILl6SfiWCbjxoZJUaCBj1CjH7GIaDbc9kqBY3W/Rgjda1iqQcOJu2WW+76pZC9QG7M00dffe9hNnseupFL53r8F7YHSwJWUKP2q+k7RdsxyOB11n0xtOvnW4irMMFNV4H0uqwS5ExsmP9AxbDTc9JwgneAT5vTiUSm1E7BSflSt3bfa1tv8Di3R8n3Af7MNWzs49hmauE2wP+ttrq+AsWpFG2awvsuOqbipWHgtuvuaAE+A1Z/7gC9hesnr+7wqCwG8c5yAg3AL1fm8T9AZtp/bbJGwl1pNrE7RuOX7PeMRUERVaPpEs+yqeoSmuOlokqw49pgomjLeh7icHNlG19yjs6XXOMedYm5xH2YxpV2tc0Ro2jJfxC50ApuxGob7lMsxfTbeUv07TyYxpeLucEH1gNd4IKH2LAg5TdVhlCafZvpskfncCfx8pOhJzd76bJWeYFnFciwcYfubRc12Ip/ppIhA1/mSZ/RxjFDrJC5xifFjJpY2Xl5zXdguFqYyTR1zSp1Y9p+tktDYYSNflcxI0iyO4TPBdlRcpeqjK/piF5bklq77VSEaA+z8qmJTFzIWiitbnzR794USKBUaT0NTEsVjZqLaFVqJoPN9ODG70IPbfBHKK+/q/AWR0tJzYHRULOa4MP+W/HfGadZUbfw177G7j/OGbIs8TahLyynl4X4RinF793Oz+BU0saXtUHrVBFT/DnA3ctNPoGbs4hRIjTok8i+algT1lTHi4SxFvONKNrgQFAq2/gFnWMXgwffgYMJpiKYkmW3tTg3ZQ9Jq+f8XN+A5eeUKHWvJWJ2sgJ1Sop+wwhqFVijqWaJhwtD8MNlSBeWNNWTa5Z5kPZw5+LbVT99wqTdx29lMUH4OIG/D86ruKEauBjvH5xy6um/Sfj7ei6UUVk4AIl3MyD4MSSTOFgSwsH/QJWaQ5as7ZcmgBZkzjjU1UrQ74ci1gWBCSGHtuV1H2mhSnO3Wp/3fEV5a+4wz//6qy8JxjZsmxxy5+4w9CDNJY09T072iKG0EnOS0arEYgXqYnXcYHwjTtUNAcMelOd4xpkoqiTYICWFq0JSiPfPDQdnt+4/wuqcXY47QILbgAAAABJRU5ErkJggg==);}