/* ==========================================================================
   DASHBOARD FLEX -> UPDATE 14-03-2025
   ========================================================================== */

* {box-sizing: border-box; border:0;}

:after, :before {box-sizing: border-box}

html {
  -webkit-font-smoothing:antialiased;
  -webkit-tap-highlight-color:rgba(0, 0, 0, 0);
  -webkit-text-size-adjust:none;
  text-rendering:optimizeLegibility;
}

body {
  position:absolute;
  z-index:5;
  height:100vh;
  width: 100vw;
  -webkit-tap-highlight-color:transparent;
  -webkit-font-smoothing: antialiased;
  text-rendering:optimizeLegibility;
  margin:0; padding:0; border:0; outline:none; overflow-x:hidden;
  font-family: "Roboto-Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px; font-weight:300; line-height: 1.5; color: #CFD2DA; letter-spacing:0;
  overflow-y:hidden;
  margin-top: 0px;
  user-select: none;
}

body:-webkit-full-screen {
  position: fixed;
  width: 100%;
  top: 0;
  background: none;
  cursor:pointer;
}

::-webkit-scrollbar {width:0 !important}

input:-webkit-autofill {
    -webkit-box-shadow:0 0 0 50px black inset !important;
    -webkit-text-fill-color: white !important;
}

input:-webkit-autofill:focus {
    -webkit-box-shadow: 0,0 0 0 50px black inset !important;
    -webkit-text-fill-color: white !important;
}

.footer {border-top: 0px !important;}
.footer a {color: #FFFFFF !important;}
.rowauch {margin-right: 0px !important; margin-left:  0px !important;}

@media (min-width: 760px) {.cd-main-header {background-color: #020c11;}}
@media (min-width: 760px) {.iframed-true .dashboardbg-la-torre .dbfg {padding-top: 50px !important;}}

/* ==========================================================================
   AANGEPASR 2025
   ========================================================================== */

#navbar {height: 70px !important;}

/* ==========================================================================
   FONTS
   ========================================================================== */

@font-face {font-family: 'Oswald Regular';   src: url('../fonts/Oswald-Regular.woff2')   format('woff2'); font-weight:400; }
@font-face {font-family: 'Oswald Bold';      src: url('../fonts/Oswald-Bold.woff')       format('woff'); font-weight:700; }
@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-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: 'Glyphicons Halflings';
  src: url('../../fonts/glyphicons-halflings-regular.woff2') format('woff2'),
       url('../../glyphicons-halflings-regular.woff') format('woff'),
       url('../../glyphicons-halflings-regular.ttf') format('truetype')
}

.glyphicon {
    position:relative;
    top:0px;
    display:inline-block;
    font-family:'Glyphicons Halflings';
    font-style:normal;
    font-weight:400;
    line-height:1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    vertical-align: middle;
}

.glyphicon-home:before          {content:"\e021";}
.glyphicon-log-in:before        {content:"\e161";}
.glyphicon-user:before          {content:"\e008";}
.glyphicon-th-large:before      {content:"\e010";}
.glyphicon-pencil:before        {content:"\270f";}
.glyphicon-euro:before          {content:"\20ac";}
.glyphicon-wrench:before        {content:"\e136";}
.glyphicon-shopping-cart:before {content:"\e116";}
.glyphicon-open:before          {content:"\e167";}
.glyphicon-picture:before       {content:"\e060";}
.glyphicon-list-alt:before      {content:"\e032";}
.glyphicon-time:before          {content:"\e023";}
.glyphicon-comment:before       {content:"\e111";}
.glyphicon-off:before           {content:"\e017";}
.glyphicon-volume-off:before    {content:"\e036";}
.glyphicon-search:before        {content:"\e003";}
.glyphicon-plus:before          {content:"\002b";}
.glyphicon-edit:before          {content:"\e065";}
.glyphicon-remove:before        {content:"\e014";}
.glyphicon-stats:before         {content:"\e185";}

/* ==========================================================================
   DONT SHOW BRANDLOGO IF NOT AATVENTURE 
   ========================================================================== */

  .brandlogo-plaza-exotica        {display: none !important;}
  .brandlogo-sushisensei          {display: none !important;}
  .brandlogo-warung-iengie        {display: none !important;}
  .brandlogo-slagerij-verstappen  {display: none !important;}
  .brandlogo-la-torre             {display: none !important;}
  .brandlogo-bydeb-fashion        {display: none !important;}

/* ==========================================================================
   BACKGROUND AND FLEXITEMS
   ========================================================================== */

#startbody {
    position:absolute;
    top: 63px;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    max-width: 100vw;
    z-index:1;
    overflow-y: auto;
}

@media screen and (min-width:768px) {#startbody {top: 50px !important;}}
  
.ontop           {position:absolute; z-index:99999; width:100%; height:100%; margin-left:auto; margin-right:auto; margin-top:80px; display:none}
.col-start       {background-color:#2C3E50; text-align: center; float:left; margin-left:9px; margin-right:4px !important;
                  border-radius:12px; color: #FFFFFF; font-family: "Roboto Light";}
.menicon         {font-size:50px; color:#FFFFFF; margin-bottom:8px;  margin-top: -6px}
.nosteps         {font-family:"Rajdhani Regular";}
#toast-container {z-index:999999999; opacity:1.0 !important}
.toast           {z-index:999999999; opacity:1.0 !important}

.steps {text-transform: uppercase; letter-spacing: 6px;}

.flexcontainer {
  margin-top: 0px;
  width: 90vw;
  max-width: 960px;
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
  align-items: stretch;
  align-content: flex-start;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 200px;
}

.flexitem {
  flex: 2 0 0;
  margin: 10px;
  text-align: center;
  height:150px;
  min-width:250px;
  cursor:pointer;
  border: 1px solid #000000;
  border-radius:12px;
  color:#FFFFFF;
  font-family:"Roboto Light";
  font-size:28px;
  line-height:34px;
  padding:0;
  padding-top:40px;
  z-index: 999999;
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
 }

.flexitem:hover  {border-color: #1db0ff;}

@media screen and (min-width:768px) {
.ontop           {margin-top:20px;}
.col-start       {height:150px; float:left; margin:10px; font-size:28px; line-height:34px; padding:40px 0 0;}
.zionicon        {font-size:32px !important;}
.flexitem        {font-size:24px !important;}
}

@media screen and (min-width:1600px) {
  .flexitem      {font-size:26px !important;}
}

@media screen and (max-width:768px) {
.col-start       {width:27% !important; }
}

#dateandtime {display:none; position:fixed; top:20px; right:28px; font-family:"Rajdhani Regular"; font-size:18px; width:400px; text-align:right}
#time        {display:inline-block; width:60px; letter-spacing:1.05px}

@media screen and (max-width:500px) {
  #dateandtime {display:none;}
}

.footer {padding-bottom:20px !important; text-align:center}

/* ==========================================================================
   CINEMATIC 3D
   ========================================================================== */

   @media screen and (min-width:1400px) {
    
    .flexitem             {backface-visibility: hidden;}
    .flexitem:not(:hover) {opacity: 0.9;}
    .flexitem-aatventure  {margin-left: 20px ; margin-right: 20px;}
    .flexitem-luxury      {margin-left: 20px ; margin-right: 20px;}
  
    .perspective {perspective: 3000px;}
  
    .flexitem-aatventure:nth-of-type(5n+1) {transform: rotateY(30deg)  translateZ(60px);}
    .flexitem-aatventure:nth-of-type(5n+2) {transform: rotateY(15deg)  translateZ(-60px); margin-left: 13px;}
    .flexitem-aatventure:nth-of-type(5n+3) {transform: rotateY(0deg)   translateZ(-90px); margin-left: -26px;}
    .flexitem-aatventure:nth-of-type(5n+4) {transform: rotateY(-15deg) translateZ(-60px); margin-left: -26px;}
    .flexitem-aatventure:nth-of-type(5n+5) {transform: rotateY(-30deg) translateZ(60px);}
  
    .flexitem-aatventure:nth-of-type(5n+1):hover {transform: rotateY(30deg)  translateZ(60px)  scale(1.1);}
    .flexitem-aatventure:nth-of-type(5n+2):hover {transform: rotateY(15deg)  translateZ(-60px) scale(1.1); margin-left: 13px;}
    .flexitem-aatventure:nth-of-type(5n+3):hover {transform: rotateY(0deg)   translateZ(-90px) scale(1.1); margin-left: -26px;}
    .flexitem-aatventure:nth-of-type(5n+4):hover {transform: rotateY(-15deg) translateZ(-60px) scale(1.1); margin-left: -26px;}
    .flexitem-aatventure:nth-of-type(5n+5):hover {transform: rotateY(-30deg) translateZ(60px)  scale(1.1);}

    .flexitem-luxury:nth-of-type(5n+1) {transform: rotateY(30deg)  translateZ(60px);}
    .flexitem-luxury:nth-of-type(5n+2) {transform: rotateY(15deg)  translateZ(-60px); margin-left: 13px;}
    .flexitem-luxury:nth-of-type(5n+3) {transform: rotateY(0deg)   translateZ(-90px); margin-left: -26px;}
    .flexitem-luxury:nth-of-type(5n+4) {transform: rotateY(-15deg) translateZ(-60px); margin-left: -26px;}
    .flexitem-luxury:nth-of-type(5n+5) {transform: rotateY(-30deg) translateZ(60px);}
  
    .flexitem-luxury:nth-of-type(5n+1):hover {transform: rotateY(30deg)  translateZ(60px)  scale(1.1);}
    .flexitem-luxury:nth-of-type(5n+2):hover {transform: rotateY(15deg)  translateZ(-60px) scale(1.1); margin-left: 13px;}
    .flexitem-luxury:nth-of-type(5n+3):hover {transform: rotateY(0deg)   translateZ(-90px) scale(1.1); margin-left: -26px;}
    .flexitem-luxury:nth-of-type(5n+4):hover {transform: rotateY(-15deg) translateZ(-60px) scale(1.1); margin-left: -26px;}
    .flexitem-luxury:nth-of-type(5n+5):hover {transform: rotateY(-30deg) translateZ(60px)  scale(1.1);}
  
  }

/* ==========================================================================
   GROW
   ========================================================================== */

.hvr-grow {
    display: inline-block;
    vertical-align: middle;
    backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
    transition-duration: 0.3s;
    transition-property: transform;
}

.hvr-grow:hover,
.hvr-grow:focus,
.hvr-grow:active {
    transform: scale(1.1);
}

.hvr-grow:hover span {
  transition-duration:1s;
}

.hvr-grow span:hover {
  transition-duration:1s;
}

/* ==========================================================================
   SHUTDOWN
   ========================================================================== */

#shutdown {position:fixed; width:100%; height:100%; margin-top:120px; font-size:18px !important; background-color: transparent !important}
#shutdown .table {display:block; padding:3rem 0; height:100%; width:100%; margin:0;}
#shutdown .table .content {vertical-align: middle; position: relative; text-align: center;}
#shutdown .table .content > h1 {display: inline-block; color: #FFFFFF; font-family: 'Oswald Regular'; font-weight: 400;}

@media screen and (min-width:760px) {
  #shutdown .table .content > h1 {box-shadow: 40px 40px 96px -20px rgba(255,255,255,1);}
}

#shutdown .table .content > p {
  display: inline-block;
  color: #DDDDDD;
  font-family: 'Rajdhani Regular';
  font-weight: 400;
  box-shadow: 40px 40px 96px -20px rgba(255,255,255,1);
}

h1 {font-size:36px; font-weight:300; line-height:1.1; margin-top:20px; margin-bottom:10px;}
.nietoveral p  {margin:0 0 10px;}

.box {
  margin: 4em auto;
  width: 10em;
  height: 10em;
  transform-style: preserve-3d;
  transform-origin: 50% 50% -5em;
  position: relative;
  transform: rotateX(-45deg);
}

.box div {
  position: absolute;
  width: 10em;
  height: 10em;
  transform-style: preserve-3d;
  backface-visibility: hidden;
}

.boxCorner2 {
  transform: rotateX(180deg) translateZ(10em);
  background-color: #3D4F66;
}

.boxCorner1::before, .boxCorner1::after, .boxCorner2::before, .boxCorner2::after {
  position: absolute;
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
}

.boxCorner1::before, .boxCorner2::before {
  transform: rotateY(90deg);
  transform-origin: 0 40%;
  background-color: #3D4F66;
}

.boxCorner2::before {
  transform-origin: 100% 40%;
  transform: rotateY(-90deg);
}

.boxCorner1::after, .boxCorner2::after {
  transform: rotateX(-90deg);
  transform-origin: 40% 0;
  background-color: #718dad;
}

.logoutbox1-aatventure           {background-color: #063b9b !important;} /* OK */
.logoutbox2-aatventure::before   {background-color: #2225ae !important;} /* OK */
.logoutbox2-aatventure::after    {background-color: #0b337c !important;} /* OK */
.logoutbox3-aatventure::before   {background-color: #0c0f72 !important;} /* OK */
.logoutbox3-aatventure::after    {background-color: #161994 !important;} /* OK */

/* ==========================================================================
   STATISTICS
   ========================================================================== */

   .statistics td {background-color: #0b0d11 !important; font-size: 15px !important}
   .statkind-statistics td:nth-child(1)  {min-width: 170px !important;}
   .statkind-statistics td:nth-child(5)  {min-width: 50px !important;}
   .statkind-statistics td:nth-child(6)  {min-width: 180px !important;}
   .statkind-statistics td:nth-child(7)  {min-width: 230px !important; padding-left: 50px !important;}
   .statkind-statistics td:nth-child(8)  {min-width: 260px !important; padding-left: 50px !important;}
   .statkind-statistics td:nth-child(9)  {min-width: 100px !important; text-align: center;}
   .statkind-robots     td:nth-child(5)  {min-width: 100px !important; padding-left: 50px !important;}
   
   .statkind-statistics td:nth-child(7) {
     background-size: 26px 26px; background-position: 9px 9px; background-repeat: no-repeat;
   }
   
   .statkind-statistics td:nth-child(8) {
     background-size: 26px 26px; background-position: 9px 9px; background-repeat: no-repeat;
   }
   
   .statkind-robots td:nth-child(2) {
     background-size: 26px 26px; background-position: 9px 9px; background-repeat: no-repeat;
   }
   
   .statistics .logodevice-computer       {-webkit-mask-image: url(../img/svg/brands/device-computer.svg); -webkit-mask-position: 15px 10px;
                                           -webkit-mask-size: 26px 26px; -webkit-mask-repeat: no-repeat; background-color: #c5c5c5 !important;}
   .statistics .logodevice-desktop        {-webkit-mask-image: url(../img/svg/brands/device-computer.svg); -webkit-mask-position: 15px 10px;
                                            -webkit-mask-size: 26px 26px; -webkit-mask-repeat: no-repeat; background-color: #c5c5c5 !important;}                                        
   .statistics .logodevice-phone          {-webkit-mask-image: url(../img/svg/brands/device-phone.svg); -webkit-mask-position: 15px 10px;
                                           -webkit-mask-size: 26px 26px; -webkit-mask-repeat: no-repeat; background-color: #0bbbeb !important;}
   .statistics .logodevice-tablet         {-webkit-mask-image: url(../img/svg/brands/device-tablet.svg); -webkit-mask-position: 15px 10px;
                                           -webkit-mask-size: 26px 26px; -webkit-mask-repeat: no-repeat; background-color: #fba918 !important;}                                      
   
   .statistics .logoplatform-Android      {background-image: url(../img/svg/brands/os-android.svg);}
   .statistics .logoplatform-iOS          {background-image: url(../img/svg/brands/os-ios-white.svg);}
   .statistics .logoplatform-Kindle       {background-image: url(../img/svg/brands/browser-kindle.png);}
   .statistics .logoplatform-Windows      {background-image: url(../img/svg/brands/os-windows.svg);}
   .statistics .logoplatform-Chrome       {background-image: url(../img/svg/brands/browser-chrome.svg);}
   .statistics .logoplatform-Ubuntu       {background-image: url(../img/svg/brands/os-ubuntu.svg);}
   .statistics .logoplatform-SUSE         {background-image: url(../img/svg/brands/os-suse.png);}
   
   .statistics .logopversion-Windows7     {background-image: url(../img/svg/brands/os-windows7.svg);}
   .statistics .logopversion-Windows8     {background-image: url(../img/svg/brands/os-windows7.svg);}
   .statistics .logopversion-WindowsVista {background-image: url(../img/svg/brands/os-windows-vista.svg);}
   .statistics .logopversion-BSD          {background-image: url(../img/svg/brands/os-bsd.png);}
   .statistics .logopversion-Fedora       {background-image: url(../img/svg/brands/os-fedora.svg);}
   .statistics .logopversion-Solaris      {background-image: url(../img/svg/brands/os-solaris.svg);}
   .statistics .logopversion-Other        {background-image: url(../img/svg/brands/browser-globe.svg);}
   
   .statistics .logobrowser-Android       {background-image: url(../img/svg/brands/os-android.svg);}
   .statistics .logobrowser-Arora         {background-image: url(../img/svg/brands/browser-arora.svg);}
   .statistics .logobrowser-CFNetwork     {background-image: url(../img/svg/brands/browser-webkit.svg);}
   .statistics .logobrowser-Chrome        {background-image: url(../img/svg/brands/browser-chrome.svg);}
   .statistics .logobrowser-Crosswalk     {background-image: url(../img/svg/brands/browser-crosswalk.png);}
   .statistics .logobrowser-Safari        {background-image: url(../img/svg/brands/browser-safari.svg);}
   .statistics .logobrowser-MobileSafari  {background-image: url(../img/svg/brands/browser-safari.svg);}
   .statistics .logobrowser-Edge          {background-image: url(../img/svg/brands/browser-edge.svg);}
   .statistics .logobrowser-Firefox       {background-image: url(../img/svg/brands/browser-firefox.svg);}
   .statistics .logobrowser-Instagram     {background-image: url(../img/svg/brands/browser-instagram.svg);}
   .statistics .logobrowser-Iron          {background-image: url(../img/svg/brands/browser-iron.png);}
   .statistics .logobrowser-Kindle        {background-image: url(../img/svg/brands/browser-kindle.png);}
   .statistics .logobrowser-Links         {background-image: url(../img/svg/brands/browser-links.png);}
   .statistics .logobrowser-Maxthon       {background-image: url(../img/svg/brands/browser-maxthon.svg);}
   .statistics .logobrowser-Opera         {background-image: url(../img/svg/brands/browser-opera.svg);}
   .statistics .logobrowser-Samsung       {background-image: url(../img/svg/brands/browser-samsung-internet.svg);}
   .statistics .logobrowser-Palm          {background-image: url(../img/svg/brands/os-palm.svg);}
   .statistics .logobrowser-Waterfox      {background-image: url(../img/svg/brands/browser-waterfox.svg);}
   .statistics .logobrowser-Pale          {background-image: url(../img/svg/brands/browser-palemoon.png);}
   .statistics .logobrowser-Amazon        {background-image: url(../img/svg/brands/browser-silk.png);}
   .statistics .logobrowser-Vivaldi       {background-image: url(../img/svg/brands/browser-vivaldi.svg);}
   .statistics .logobrowser-Other         {background-image: url(../img/svg/brands/browser-globe.svg);}
   .statistics .logobrowser-Facebook      {background-image: url(../img/svg/brands/facebook-round.svg);}
   .statistics .logobrowser-Google        {background-image: url(../img/svg/brands/browser-chrome.svg);}
   .statistics .logobrowser-UC            {background-image: url(../img/svg/brands/browser-uc.svg);}
   .statistics .logobrowser-MiuiBrowser   {background-image: url(../img/svg/brands/browser-miui.svg);}
   .statistics .logobrowser-Yandex        {background-image: url(../img/svg/brands/browser-yandex.svg);}
   .statistics .logobrowser-Whale         {background-image: url(../img/svg/brands/browser-whale.png);}
   .statistics .Mail                      {background-image: url(../img/svg/brands/apps-mail.svg);}
   .statistics .Safari                    {background-image: url(../img/svg/brands/browser-safari.svg);}
   .statistics .Nightly                   {background-image: url(../img/svg/brands/browser-webkit.svg);}
   
   .statistics .logobrowser-IE {
     background-image: url(../img/svg/brands/browser-ie.svg);
     background-repeat: no-repeat;
   }
   
   .statistics .logoplatform-Mac {
     background-image: url(../img/svg/brands/os-apple-white.svg);
     background-repeat: no-repeat;
     background-size: 24px 28px !important;
     background-position: 10px 8px !important;
   }
   
   .statistics .logoplatform-Linux {
     background-image: url(../img/svg/brands/os-linux-tux.svg);
     background-repeat: no-repeat;
     background-size: 34px 36px !important;
     background-position: 7px 4px !important;
   }
   
   .statkind-robots td:nth-child(5) {
     background-image: url(../img/svg/brands/apps-bot.svg);
     background-size: 26px 26px;
     background-position: 9px 9px;
     background-repeat: no-repeat;
   }
   
   .statistics .logorobot-Googlebot {background-image: url(../img/svg/brands/apps-google.svg) !important;}
   .statistics .logorobot-bingbot   {background-image: url(../img/svg/brands/apps-bing.svg) !important;}
   .statistics .logorobot-YandexBot {background-image: url(../img/svg/brands/apps-yandex.svg) !important;}
   
   .statistics .logorobot-Applebot {
     background-image: url(../img/svg/brands/os-apple-white.svg) !important;
     background-repeat: no-repeat;
     background-size: 24px 28px !important;
     background-position: 10px 8px !important;
   }
   
   .statistics .X1085  {background-image: url(../img/svg/brands/osx-mountainlion.png) !important; background-size: 28px 28px !important;}
   .statistics .X1068  {background-image: url(../img/svg/brands/osx-snowleopard.png)  !important; background-size: 28px 28px !important;}
   .statistics .X1095  {background-image: url(../img/svg/brands/osx-mavericks.png)    !important; background-size: 28px 28px !important;}
   .statistics .X10100 {background-image: url(../img/svg/brands/osx-yosemite.png)     !important; background-size: 28px 28px !important;}
   .statistics .X10105 {background-image: url(../img/svg/brands/osx-yosemite.png)     !important; background-size: 28px 28px !important;}
   .statistics .X1011  {background-image: url(../img/svg/brands/osx-elcapitan.png)    !important; background-size: 28px 28px !important;}
   .statistics .X10116 {background-image: url(../img/svg/brands/osx-elcapitan.png)    !important; background-size: 28px 28px !important;}
   .statistics .X1012  {background-image: url(../img/svg/brands/osx-sierra.png)       !important; background-size: 28px 28px !important;}
   .statistics .X10122 {background-image: url(../img/svg/brands/osx-sierra.png)       !important; background-size: 28px 28px !important;}
   .statistics .X10125 {background-image: url(../img/svg/brands/osx-sierra.png)       !important; background-size: 28px 28px !important;}
   .statistics .X10136 {background-image: url(../img/svg/brands/osx-highsierra.png)   !important; background-size: 28px 28px !important;}
   .statistics .X10143 {background-image: url(../img/svg/brands/osx-mojave.png)       !important; background-size: 28px 28px !important;}
   .statistics .X10146 {background-image: url(../img/svg/brands/osx-mojave.png)       !important; background-size: 28px 28px !important;}
   .statistics .X10152 {background-image: url(../img/svg/brands/osx-catalina.png)     !important; background-size: 28px 28px !important;}
   .statistics .X10153 {background-image: url(../img/svg/brands/osx-catalina.png)     !important; background-size: 28px 28px !important;}
   .statistics .X10154 {background-image: url(../img/svg/brands/osx-catalina.png)     !important; background-size: 28px 28px !important;}
   .statistics .X10155 {background-image: url(../img/svg/brands/osx-catalina.png)     !important; background-size: 28px 28px !important;}
   .statistics .X10156 {background-image: url(../img/svg/brands/osx-catalina.png)     !important; background-size: 28px 28px !important;}
   .statistics .X10157 {background-image: url(../img/svg/brands/osx-catalina.png)     !important; background-size: 28px 28px !important;}
   .statistics .X1016  {background-image: url(../img/svg/brands/osx-bigsur.png)       !important; background-size: 28px 28px !important;}
   .statistics .X1100  {background-image: url(../img/svg/brands/osx-bigsur.png)       !important; background-size: 28px 28px !important;}
   .statistics .X1110  {background-image: url(../img/svg/brands/osx-bigsur.png)       !important; background-size: 28px 28px !important;}
   .statistics .X1121  {background-image: url(../img/svg/brands/osx-bigsur.png)       !important; background-size: 28px 28px !important;}
   .statistics .X1130  {background-image: url(../img/svg/brands/osx-bigsur.png)       !important; background-size: 28px 28px !important;}
   
   .statistics .iconcontent-home       {background-color: #4d80f1 !important;}
   .statistics .iconcontent-frontpage  {background-color: #4d80f1 !important;}
   .statistics .iconcontent-statistics {background-color: #f14d4d !important;}
   .statistics .iconcontent-dashboard  {background-color: #f1894d !important;}
   .statistics .iconcontent-blog       {background-color: #5cc37b !important;}
   .statistics .iconcontent-editpost   {background-color: #af38d3 !important;}
   
   .statkind-statistics td:nth-child(2) {background-position: 5px 8px; background-repeat: no-repeat;}

   .statistics .language-ae     {background-image: url(../img/flags/roundflags/united-arab-emirates.png)   !important; background-size: 28px 28px !important;}
   .statistics .language-am     {background-image: url(../img/flags/roundflags/armenia.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-ar     {background-image: url(../img/flags/roundflags/argentina.png)              !important; background-size: 28px 28px !important;}
   .statistics .language-at     {background-image: url(../img/flags/roundflags/austria.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-au     {background-image: url(../img/flags/roundflags/australia.png)              !important; background-size: 28px 28px !important;}
   .statistics .language-az     {background-image: url(../img/flags/roundflags/azerbaijan.png)             !important; background-size: 28px 28px !important;}
   .statistics .language-ba     {background-image: url(../img/flags/roundflags/bosnia-and-herzegovina.png) !important; background-size: 28px 28px !important;}
   .statistics .language-bd     {background-image: url(../img/flags/roundflags/bangladesh.png)             !important; background-size: 28px 28px !important;}
   .statistics .language-be     {background-image: url(../img/flags/roundflags/belgium.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-bg     {background-image: url(../img/flags/roundflags/bulgaria.png)               !important; background-size: 28px 28px !important;}
   .statistics .language-bh     {background-image: url(../img/flags/roundflags/bahrain.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-bo     {background-image: url(../img/flags/roundflags/bolivia.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-br     {background-image: url(../img/flags/roundflags/brazil.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-bt     {background-image: url(../img/flags/roundflags/bhutan.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-bz     {background-image: url(../img/flags/roundflags/belize.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-ca     {background-image: url(../img/flags/roundflags/canada.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-ch     {background-image: url(../img/flags/roundflags/switzerland.png)            !important; background-size: 28px 28px !important;}
   .statistics .language-cl     {background-image: url(../img/flags/roundflags/chile.png)                  !important; background-size: 28px 28px !important;}
   .statistics .language-cn     {background-image: url(../img/flags/roundflags/china.png)                  !important; background-size: 28px 28px !important;}
   .statistics .language-co     {background-image: url(../img/flags/roundflags/colombia.png)               !important; background-size: 28px 28px !important;}
   .statistics .language-cr     {background-image: url(../img/flags/roundflags/costa-rica.png)             !important; background-size: 28px 28px !important;}
   .statistics .language-cz     {background-image: url(../img/flags/roundflags/czech-republic.png)         !important; background-size: 28px 28px !important;}
   .statistics .language-da     {background-image: url(../img/flags/roundflags/denmark.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-de     {background-image: url(../img/flags/roundflags/germany.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-dk     {background-image: url(../img/flags/roundflags/denmark.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-ec     {background-image: url(../img/flags/roundflags/ecuador.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-ee     {background-image: url(../img/flags/roundflags/estonia.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-eg     {background-image: url(../img/flags/roundflags/egypt.png)                  !important; background-size: 28px 28px !important;}
   .statistics .language-es     {background-image: url(../img/flags/roundflags/spain.png)                  !important; background-size: 28px 28px !important;}
   .statistics .language-et     {background-image: url(../img/flags/roundflags/ethiopia.png)               !important; background-size: 28px 28px !important;}
   .statistics .language-fr     {background-image: url(../img/flags/roundflags/france.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-fi     {background-image: url(../img/flags/roundflags/finland.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-ge     {background-image: url(../img/flags/roundflags/georgia.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-gn     {background-image: url(../img/flags/roundflags/guinea.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-gr     {background-image: url(../img/flags/roundflags/greece.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-gb     {background-image: url(../img/flags/roundflags/united-kingdom.png)         !important; background-size: 28px 28px !important;}
   .statistics .language-gh     {background-image: url(../img/flags/roundflags/ghana.png)                  !important; background-size: 28px 28px !important;}
   .statistics .language-gt     {background-image: url(../img/flags/roundflags/guatemala.png)              !important; background-size: 28px 28px !important;}
   .statistics .language-hk     {background-image: url(../img/flags/roundflags/hong-kong.png)              !important; background-size: 28px 28px !important;}
   .statistics .language-hr     {background-image: url(../img/flags/roundflags/croatia.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-hu     {background-image: url(../img/flags/roundflags/hungary.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-ie     {background-image: url(../img/flags/roundflags/ireland.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-id     {background-image: url(../img/flags/roundflags/indonesia.png)              !important; background-size: 28px 28px !important;}
   .statistics .language-il     {background-image: url(../img/flags/roundflags/israel.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-in     {background-image: url(../img/flags/roundflags/india.png)                  !important; background-size: 28px 28px !important;}
   .statistics .language-iq     {background-image: url(../img/flags/roundflags/iraq.png)                   !important; background-size: 28px 28px !important;}
   .statistics .language-ir     {background-image: url(../img/flags/roundflags/iran.png)                   !important; background-size: 28px 28px !important;}
   .statistics .language-it     {background-image: url(../img/flags/roundflags/italy.png)                  !important; background-size: 28px 28px !important;}
   .statistics .language-jm     {background-image: url(../img/flags/roundflags/jamaica.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-ja     {background-image: url(../img/flags/roundflags/japan.png)                  !important; background-size: 28px 28px !important;}
   .statistics .language-jp     {background-image: url(../img/flags/roundflags/japan.png)                  !important; background-size: 28px 28px !important;}
   .statistics .language-ke     {background-image: url(../img/flags/roundflags/kenya.png)                  !important; background-size: 28px 28px !important;}
   .statistics .language-kh     {background-image: url(../img/flags/roundflags/cambodia.png)               !important; background-size: 28px 28px !important;}
   .statistics .language-ko     {background-image: url(../img/flags/roundflags/south-korea.png)            !important; background-size: 28px 28px !important;}
   .statistics .language-kr     {background-image: url(../img/flags/roundflags/south-korea.png)            !important; background-size: 28px 28px !important;}
   .statistics .language-lk     {background-image: url(../img/flags/roundflags/sri-lanka.png)              !important; background-size: 28px 28px !important;}
   .statistics .language-ls     {background-image: url(../img/flags/roundflags/lesotho.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-lt     {background-image: url(../img/flags/roundflags/lithuania.png)              !important; background-size: 28px 28px !important;}
   .statistics .language-lu     {background-image: url(../img/flags/roundflags/luxembourg.png)             !important; background-size: 28px 28px !important;}
   .statistics .language-ly     {background-image: url(../img/flags/roundflags/libya.png)                  !important; background-size: 28px 28px !important;}
   .statistics .language-md     {background-image: url(../img/flags/roundflags/moldova.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-mm     {background-image: url(../img/flags/roundflags/myanmar.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-mn     {background-image: url(../img/flags/roundflags/mongolia.png)               !important; background-size: 28px 28px !important;}
   .statistics .language-mt     {background-image: url(../img/flags/roundflags/malta.png)                  !important; background-size: 28px 28px !important;}
   .statistics .language-mv     {background-image: url(../img/flags/roundflags/maldives.png)               !important; background-size: 28px 28px !important;}
   .statistics .language-mw     {background-image: url(../img/flags/roundflags/malawi.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-mx     {background-image: url(../img/flags/roundflags/mexico.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-my     {background-image: url(../img/flags/roundflags/malaysia.png)               !important; background-size: 28px 28px !important;}
   .statistics .language-na     {background-image: url(../img/flags/roundflags/namibia.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-nb     {background-image: url(../img/flags/roundflags/norway.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-ng     {background-image: url(../img/flags/roundflags/nigeria.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-no     {background-image: url(../img/flags/roundflags/norway.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-nl     {background-image: url(../img/flags/roundflags/netherlands.png)            !important; background-size: 28px 28px !important;}
   .statistics .language-nz     {background-image: url(../img/flags/roundflags/new-zealand.png)            !important; background-size: 28px 28px !important;}
   .statistics .language-pe     {background-image: url(../img/flags/roundflags/peru.png)                   !important; background-size: 28px 28px !important;}
   .statistics .language-pg     {background-image: url(../img/flags/roundflags/papua-new-guinea.png)       !important; background-size: 28px 28px !important;}
   .statistics .language-ph     {background-image: url(../img/flags/roundflags/philippines.png)            !important; background-size: 28px 28px !important;}
   .statistics .language-pk     {background-image: url(../img/flags/roundflags/pakistan.png)               !important; background-size: 28px 28px !important;}
   .statistics .language-pl     {background-image: url(../img/flags/roundflags/poland.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-pr     {background-image: url(../img/flags/roundflags/puerto-rico.png)            !important; background-size: 28px 28px !important;}
   .statistics .language-ps     {background-image: url(../img/flags/roundflags/palestine.png)              !important; background-size: 28px 28px !important;}
   .statistics .language-pt     {background-image: url(../img/flags/roundflags/portugal.png)               !important; background-size: 28px 28px !important;}
   .statistics .language-py     {background-image: url(../img/flags/roundflags/paraguay.png)               !important; background-size: 28px 28px !important;}
   .statistics .language-rs     {background-image: url(../img/flags/roundflags/serbia.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-ro     {background-image: url(../img/flags/roundflags/romania.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-ru     {background-image: url(../img/flags/roundflags/russia.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-sa     {background-image: url(../img/flags/roundflags/saudi-arabia.png)           !important; background-size: 28px 28px !important;}
   .statistics .language-sb     {background-image: url(../img/flags/roundflags/solomon-islands.png)        !important; background-size: 28px 28px !important;}
   .statistics .language-sn     {background-image: url(../img/flags/roundflags/senegal.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-sg     {background-image: url(../img/flags/roundflags/singapore.png)              !important; background-size: 28px 28px !important;}
   .statistics .language-si     {background-image: url(../img/flags/roundflags/slovenia.png)               !important; background-size: 28px 28px !important;}
   .statistics .language-sk     {background-image: url(../img/flags/roundflags/slovakia.png)               !important; background-size: 28px 28px !important;}
   .statistics .language-sr     {background-image: url(../img/flags/roundflags/serbia.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-se     {background-image: url(../img/flags/roundflags/sweden.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-sy     {background-image: url(../img/flags/roundflags/syria.png)                  !important; background-size: 28px 28px !important;}
   .statistics .language-tg     {background-image: url(../img/flags/roundflags/togo.png)                   !important; background-size: 28px 28px !important;}
   .statistics .language-th     {background-image: url(../img/flags/roundflags/thailand.png)               !important; background-size: 28px 28px !important;}
   .statistics .language-tn     {background-image: url(../img/flags/roundflags/tunisia.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-tr     {background-image: url(../img/flags/roundflags/turkey.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-tw     {background-image: url(../img/flags/roundflags/taiwan.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-tz     {background-image: url(../img/flags/roundflags/tanzania.png)               !important; background-size: 28px 28px !important;}
   .statistics .language-ug     {background-image: url(../img/flags/roundflags/uganda.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-us     {background-image: url(../img/flags/roundflags/united-states.png)          !important; background-size: 28px 28px !important;}
   .statistics .language-ua     {background-image: url(../img/flags/roundflags/ukraine.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-uy     {background-image: url(../img/flags/roundflags/uruguay.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-ve     {background-image: url(../img/flags/roundflags/venezuela.png)              !important; background-size: 28px 28px !important;}
   .statistics .language-vn     {background-image: url(../img/flags/roundflags/vietnam.png)                !important; background-size: 28px 28px !important;}
   .statistics .language-xl     {background-image: url(../img/flags/roundflags/mexico.png)                 !important; background-size: 28px 28px !important;}
   .statistics .language-za     {background-image: url(../img/flags/roundflags/south-africa.png)           !important; background-size: 28px 28px !important;}

/* ==========================================================================
   ICONS
   ========================================================================== */

.glyphicon-euro   {font-size:64px; margin-top:-14px; margin-bottom:12px;}
.glyphicon-pencil {font-size:64px; margin-top:-14px; margin-bottom:12px;}
.glyphicon-stats  {font-size:64px; margin-top:-14px; margin-bottom:12px;}
.glyphicon-off    {font-size:64px; margin-top:-14px; margin-bottom:12px;}

.websiteicon {
    width: 101px;
    height: 93px;
    margin-top: -30px;
    margin-bottom: 6px;
    -webkit-mask-image: url(../img/svg/website.svg);
    -webkit-mask-size: cover;
}

.verstappenicon {
    width: 101px;
    height: 101px;
    margin-top: -32px;
    margin-bottom: -3px;
    -webkit-mask-image: url(../img/svg/verstappen.svg);
    -webkit-mask-size: cover;
}

.storeicon {
    width: 87px;
    height: 86px;
    margin-top: -22px;
    margin-bottom: 6px;
    -webkit-mask-image: url(../img/svg/winkelapp.svg);
    -webkit-mask-size: cover;
}

.emailicon {
    width: 80px;
    height: 78px;
    margin-top: -20px;
    margin-bottom: 9px;
    -webkit-mask-image: url(../img/svg/email.svg);
    -webkit-mask-size: cover;
}

.calendaricon {
  width: 80px;
  height: 78px;
  margin-top: -20px;
  margin-bottom: 9px;
  -webkit-mask-image: url(../img/svg/calendar.svg);
  -webkit-mask-size: cover;
}

.managementicon {
  width: 60px;
  height: 75px;
  margin-top: -19px;
  margin-bottom: 9px;
  -webkit-mask-image: url(../img/svg/management.svg);
  -webkit-mask-size: cover;
}

.catsicon {
    width: 100px;
    height: 88px;
    margin-top: -24px;
    margin-bottom: 1px;
    -webkit-mask-image: url(../img/svg/cats.svg);
    -webkit-mask-size: cover;
}

.pawicon {
  width: 76px;
  height: 70px;
  margin-top: -18px;
  margin-bottom: 10px;
  -webkit-mask-image: url(../img/svg/paw.svg);
  -webkit-mask-size: cover;
}

.bonicon {
    width: 108px;
    height: 84px;
    margin-top: -26px;
    margin-bottom: 10px;
    -webkit-mask-image: url(../img/svg/klantenbonnen.svg);
    -webkit-mask-size: cover;
}

.labelicon {
  width: 100px;
  height: 78px;
  margin-top: -20px;
  margin-bottom: 8px;
  -webkit-mask-image: url(../img/svg/labels.svg);
  -webkit-mask-size: cover;
}

.shutdownicon {
    width: 66px;
    height: 66px;
    margin-top: -16px;
    margin-bottom: 10px;
    -webkit-mask-image: url(../img/svg/shutdown.svg);
    -webkit-mask-size: cover;
}

.taxonomyicon {
  width: 72px;
  height: 72px;
  margin-top: -16px;
  margin-bottom: 10px;
  -webkit-mask-image: url(../img/svg/taxonomy.svg);
  -webkit-mask-size: cover;
}

.popupicon {
  width: 84px;
  height: 84px;
  margin-top: -26px;
  margin-bottom: 10px;
  -webkit-mask-image: url(../img/svg/popup.svg);
  -webkit-mask-size: cover;
}

.profileicon {
    width: 72px;
    height: 72px;
    margin-top: -19px;
    margin-bottom: 10px;
    -webkit-mask-image: url(../img/svg/profile1.svg);
    -webkit-mask-size: cover;
}

.printicon {
    width: 112px;
    height: 98px;
    margin-top: -38px;
    margin-bottom: 5px;
    -webkit-mask-image: url(../img/svg/printer.svg);
    -webkit-mask-size: cover;
}

.rapporticon {
    width: 83px;
    height: 83px;
    margin-top: -20px;
    margin-bottom: 6px;
    -webkit-mask-image: url(../img/svg/reports.svg);
    -webkit-mask-size: cover;
}

.contacticon {
    width: 117px;
    height: 94px;
    margin-top: -39px;
    margin-bottom: 10px;
    -webkit-mask-image: url(../img/svg/contacts.svg);
    -webkit-mask-size: cover;
}

.horecaicon {
    width: 85px;
    height: 84px;
    margin-top: -24px;
    margin-bottom: 7px;
    -webkit-mask-image: url(../img/svg/horeca.svg);
    -webkit-mask-size: cover;
}

.productsicon {
    width: 111px;
    height: 100px;
    margin-top: -36px;
    margin-bottom: 4px;
    -webkit-mask-image: url(../img/svg/products.svg);
    -webkit-mask-size: cover;
}

.bestelicon {
    width: 93px;
    height: 90px;
    margin-top: -26px;
    margin-bottom: 4px;
    margin-left: -20px;
    -webkit-mask-image: url(../img/svg/winkelwagen.svg);
    -webkit-mask-size: cover;
}

.staricon {
  width: 84px;
  height: 82px;
  margin-top: -26px;
  margin-bottom: 9px;
  margin-left: -9px;
  -webkit-mask-image: url(../img/svg/favorite-star.svg);
  -webkit-mask-size: cover;
}

.reserveericon {
    width: 76px;
    height: 76px;
    margin-top: -24px;
    margin-bottom: 16px;
    -webkit-mask-image: url(../img/svg/phone.svg);
    -webkit-mask-size: cover;
}

.shippinglabelicon {
    width: 93px;
    height: 90px;
    margin-top: -28px;
    margin-bottom: 4px;
    margin-left: -20px;
    -webkit-mask-image: url(../img/svg/shippinglabel.svg);
    -webkit-mask-size: cover;
}

.thuisbezorgdicon {
    width: 86px;
    height: 86px;
    margin-top: -24px;
    margin-bottom: 4px;
    -webkit-mask-image: url(../img/svg/takeaway.svg);
    -webkit-mask-size: cover;
}

.mollieicon {
    width: 110px;
    height: 98px;
    margin-top: -37px;
    margin-bottom: 02px;
    -webkit-mask-image: url(../img/svg/paymentcard.svg);
    -webkit-mask-size: cover;
}

.commentsicon {
    width: 80px;
    height: 83px;
    margin-top: -24px;
    margin-bottom: 6px;
    -webkit-mask-image: url(../img/svg/comments.svg);
    -webkit-mask-size: cover;
}

.pusherchaticon {
    width: 80px;
    height: 83px;
    margin-top: -24px;
    margin-bottom: 6px;
    -webkit-mask-image: url(../img/svg/pusherchat.svg);
    -webkit-mask-size: cover;
}

.publishicon {
    width: 82px;
    height: 82px;
    margin-top: -20px;
    margin-bottom: 6px;
    -webkit-mask-image: url(../img/svg/pencil3.svg);
    -webkit-mask-size: cover;
}

.securityicon {
  width: 80px;
  height: 85px;
  margin-top: -26px;
  margin-bottom: 6px;
  -webkit-mask-image: url(../img/svg/security.svg);
  -webkit-mask-size: cover;
}

.clearcacheicon {
  width: 82px;
  height: 82px;
  margin-top: -26px;
  margin-bottom: 7px;
  -webkit-mask-image: url(../img/svg/clear-cache.svg);
  -webkit-mask-size: cover;
}

.locationsicon {
  width: 82px;
  height: 82px;
  margin-top: -24px;
  margin-bottom: 7px;
  -webkit-mask-image: url(../img/svg/location.svg);
  -webkit-mask-size: cover;
}

.deliveryicon {
  width: 82px;
  height: 82px;
  margin-top: -24px;
  margin-bottom: 7px;
  -webkit-mask-image: url(../img/svg/deliverer.svg);
  -webkit-mask-size: cover;
}

.postsicon {
  width: 112px;
  height: 84px;
  margin-top: -23px;
  margin-bottom: 3px;
  -webkit-mask-image: url(../img/svg/addpost.svg);
  -webkit-mask-size: cover;
}

.promoteicon {
  width: 99px;
  height: 83px;
  margin-top: -25px;
  margin-bottom: 8px;
  -webkit-mask-image: url(../img/svg/megaphone.svg);
  -webkit-mask-size: cover;
}

.welcomeicon {
  width: 125px;
  height: 81px;
  margin-top: -25px;
  margin-bottom: 9px;
  -webkit-mask-image: url(../img/svg/welcome.svg);
  -webkit-mask-size: cover;
}

.usersicon {
    width: 104px;
    height: 80px;
    margin-top: -24px;
    margin-bottom: 8px;
    -webkit-mask-image: url(../img/svg/users.svg);
    -webkit-mask-size: cover;
}

.teamicon {
    width: 126px;
    height: 126px;
    margin-top: -48px;
    margin-bottom: -16px;
    -webkit-mask-image: url(../img/svg/team.svg);
    -webkit-mask-size: cover;
}

.rolesicon {
  width: 104px;
  height: 80px;
  margin-top: -24px;
  margin-bottom: 8px;
  -webkit-mask-image: url(../img/svg/roles.svg);
  -webkit-mask-size: cover;
}

.mediaicon {
  width: 82px;
  height: 62px;
  margin-top: -15px;
  margin-bottom: 15px;
  -webkit-mask-image: url(../img/svg/camera.svg);
  -webkit-mask-size: cover;
}

.codeicon {
  width: 180px;
  height: 70px;
  margin-top: -30px;
  margin-bottom: 24px;
  -webkit-mask-image: url(../img/svg/code-editor.svg);
  -webkit-mask-size: cover;
}

.batchicon {
    width: 72px;
    height: 68px;
    margin-top: -15px;
    margin-bottom: 12px;
    -webkit-mask-image: url(../img/svg/paw.svg);
    -webkit-mask-size: cover;
}

.googleconsoleicon {
  width: 86px;
  height: 83px;
  margin-top: -25px;
  margin-bottom: 6px;
  -webkit-mask-image: url(../img/svg/google.svg);
  -webkit-mask-size: cover;
}

.seoicon {
    width: 117px;
    height: 90px;
    margin-top: -28px;
    margin-bottom: 3px;
    -webkit-mask-image: url(../img/svg/seo.svg);
    -webkit-mask-size: cover;
}

.newslettericon {
  width: 117px;
  height: 97px;
  margin-top: -41px;
  margin-bottom: 3px;
  -webkit-mask-image: url(../img/svg/newsletter.svg);
  -webkit-mask-size: cover;
}

.webtrafficicon {
  width: 80px;
  height: 80px;
  margin-top: -21px;
  margin-bottom: 7px;
  -webkit-mask-image: url(../img/svg/traffic.svg);
  -webkit-mask-size: cover;
}

.connectionsicon {
  width: 92px;
  height: 84px;
  margin-top: -29px;
  margin-bottom: 7px;
  -webkit-mask-image: url(../img/svg/eye-dark.svg);
  -webkit-mask-size: cover;
}

.robotsicon {
  width: 98px;
  height: 90px;
  margin-top: -30px;
  margin-bottom: 5px;
  -webkit-mask-image: url(../img/svg/bot1.svg);
  -webkit-mask-size: cover;
}

.analyticsicon {
  width: 105px;
  height: 76px;
  margin-top: -18px;
  margin-bottom: 4px;
  -webkit-mask-image: url(../img/svg/analytics.svg);
  -webkit-mask-size: cover;
}

.messengericon {
    width: 78px;
    height: 78px;
    margin-top: -20px;
    margin-bottom: 6px;
    -webkit-mask-image: url(../img/svg/chat.svg);
    -webkit-mask-size: cover;
}

.euroicon {
    width: 54px;
    height: 86px;
    margin-top: -24px;
    margin-bottom: 2px;
    margin-left: -16px;
    -webkit-mask-image: url(../img/svg/eurosign.svg);
    -webkit-mask-size: cover;
}

.filemanagericon {
  width: 95px;
  height: 74px;
  margin-top: -24px;
  margin-bottom: 12px;
  -webkit-mask-image: url(../img/svg/camera.svg);
  -webkit-mask-size: cover;
}

.errorlogicon {
  width: 95px;
  height: 86px;
  margin-top: -30px;
  margin-bottom: 12px;
  -webkit-mask-image: url(../img/svg/errorlog.svg);
  -webkit-mask-size: cover;
}

.offerteicon {
    width: 93px;
    height: 86px;
    margin-top: -25px;
    margin-bottom: 2px;
    margin-left: -16px;
    -webkit-mask-image: url(../img/svg/handshake.svg);
    -webkit-mask-size: cover;
}

.calendaricon25 {
  width: 68px;
  height: 69px;
  margin-top: -20px;
  margin-bottom: 13px;
  margin-left: -6px;
  -webkit-mask-image: url(../img/svg/calendar25.svg);
  -webkit-mask-size: cover;
}

.invoiceicon {
  width: 76px;
  height: 76px;
  margin-top: -20px;
  margin-bottom: 10px;
  -webkit-mask-image: url(../img/svg/invoice-no-euro.svg);
  -webkit-mask-size: cover;
}

.statisticsicon {
  width: 78px;
  height: 78px;
  margin-top: -20px;
  margin-bottom: 6px;
  -webkit-mask-image: url(../img/svg/statistics.svg);
  -webkit-mask-size: cover;
}

.packageicon {
    width: 82px;
    height: 82px;
    margin-top: -28px;
    margin-bottom: 12px;
    -webkit-mask-image: url(../img/svg/packaging.svg);
    -webkit-mask-size: cover;
}

.inputicon {
  width: 100px;
  height: 90px;
  margin-top: -40px;
  margin-bottom: 16px;
  -webkit-mask-image: url(../img/svg/keyboard.svg);
  -webkit-mask-size: cover;
}

.todolisticon {
  width: 88px;
  height: 88px;
  margin-top: -21px;
  margin-bottom: 0px;
  -webkit-mask-image: url(../img/svg/todolist.svg);
  -webkit-mask-size: cover;
}

.rewardsicon {
    width: 78px;
    height: 78px;
    margin-top: -20px;
    margin-bottom: 6px;
    -webkit-mask-image: url(../img/svg/rewards1.svg);
    -webkit-mask-size: cover;
}

.databaseicon {
  width: 75px;
  height: 80px;
  margin-top: -26px;
  margin-bottom: 9px;
  -webkit-mask-image: url(../img/svg/database.svg);
  -webkit-mask-size: cover;
}

.retailicon {
    width: 90px;
    height: 86px;
    margin-top: -26px;
    margin-bottom: 6px;
    -webkit-mask-image: url(../img/svg/retail.svg);
    -webkit-mask-size: cover;
}

.webshopstatusicon {
    width: 80px;
    height: 62px;
    margin-top: -16px;
    margin-bottom: 15px;
    -webkit-mask-image: url(../img/svg/webshopstatus.svg);
    -webkit-mask-size: cover;
}

.webshopsettingsicon {
    width: 80px;
    height: 73px;
    margin-top: -24px;
    margin-bottom: 15px;
    -webkit-mask-image: url(../img/svg/settings.svg);
    -webkit-mask-size: cover;
}

.pulseicon {
  width: 80px;
  height: 73px;
  margin-top: -24px;
  margin-bottom: 15px;
  -webkit-mask-image: url(../img/svg/pulse.svg);
  -webkit-mask-size: cover;
}

.decomposericon {
  width: 76px;
  height: 76px;
  margin-top: -20px;
  margin-bottom: 10px;
  -webkit-mask-image: url(../img/svg/github.svg);
  -webkit-mask-size: cover;
}

.gameicon {
    width: 98px;
    height: 83px;
    margin-top: -30px;
    margin-bottom: 13px;
    -webkit-mask-image: url(../img/svg/games.svg);
    -webkit-mask-size: cover;
}

.productoptionsicon {
  width: 80px;
  height: 76px;
  margin-top: -24px;
  margin-bottom: 15px;
  -webkit-mask-image: url(../img/svg/productoptions.svg);
  -webkit-mask-size: cover;
}


@media screen and (max-width:480px) {
  #startbody {
    overflow-x: hidden; 
    overflow-y:scroll;
    padding-top:50px;
    overscroll-behavior-y: contain; /* disable pull to refresh, keeps glow effects */
    -webkit-overflow-scrolling: touch; /* Lets it scroll lazy */
}
  .col-sm-12, .col-md-12, .col-lg-12 {padding-left: 6px; padding-right: 6px;}
  .flexcontainer {margin-top:-28px; width:88vw; padding-bottom: 150px;}
}

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

@media screen and (min-width:1400px) and (max-width:1800px) {
  .flexcontainer {max-width: 1400px; transform: scale(0.8) !important;}
}

@media screen and (min-width:1800px) {
  .flexcontainer {max-width: 1400px; transform: scale(0.85) !important;}
}

@media screen and (min-width: 1600px) {
  .flexcontainer {max-width: 1600px;}
}

/* ==========================================================================
   ipad landscape
  ========================================================================== */
@media only screen and (min-width:700px) and (max-width:1100px) and (orientation: landscape) {
  .flexcontainer {height: calc(100vh - 80px); margin-bottom: 120px; overflow-y: auto; overflow-x: hidden}
  .flexcontainer::-webkit-scrollbar {width:0 !important}
  .conttenttop   {margin-top:12px;}
  .flexitem      {margin-bottom:6px;}
  #shutdown      {zoom: 100%;}
}

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

@media only screen and (min-width:768px) and (max-width:1024px) and (orientation:portrait) {
  #startbody     {overflow-y: auto;}
  .flexcontainer {height: calc(100vh - 60px); margin-bottom: 120px; overflow-y: auto; overflow-x: hidden}
  .flexcontainer::-webkit-scrollbar {width:0 !important}
  .flexcontainer
  .conttenttop   {margin-top:40px;}
  #shutdown      {zoom: 140%;}
  #shutdown .table .content {margin-top: 95px;}
}

/* ==========================================================================
   macbook/pc landscape
  ========================================================================== */

@media only screen and (min-width:1050px) {
  .conttenttop {margin-top:0px;}
  .iframed-true  .conttenttop {margin-top: -60px !important;}
}

/* ==========================================================================
   samsung galaxy s9 etc
  ========================================================================== */

@media only screen and (max-width:700px) {
  #shutdown   {margin-top:50px !important;}
  .box        {zoom:95%;}
  .logouttext {margin-top:50px}
  .shadowfar  {display:block !important; margin-top:-10px}
}

/* ==========================================================================
   autocomplete
  ========================================================================== */

input:-webkit-autofill {-webkit-box-shadow: 0 0 0 30px #000000 inset;}
input:-webkit-autofill {-webkit-text-fill-color: #FFFFFF !important;}

.footer {position:fixed; width:100%; left:0px; bottom: -100px; padding-bottom: 20px !important; margin-left:auto; margin-right:auto; text-align:center;}

.shadowclose  {-webkit-box-reflect: below -3px
               -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(50%, transparent), to(rgba(255,255,255,0.4)));
}

.shadowfar  {-webkit-box-reflect: below 3px
             -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(50%, transparent), to(rgba(255,255,255,0.4)));
}

@media screen and (max-width:760px) {
.shadowclose {-webkit-box-reflect: below -14px
              -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(70%, transparent), to(rgba(255,255,255,0.4)));}
}