*::-webkit-scrollbar {
    width: 9px;
}

*::-webkit-scrollbar-track {
    background: transparent;
}

*::-webkit-scrollbar-thumb {
    border-radius: 20px;
    border: transparent;
}

*{
    scrollbar-width: thin;
}



body{ 
    width:100%;
    height:100%;
    padding:0px !important;
    margin:0px auto !important;
    max-width: 2048px;
    position: relative;
    overflow-y: auto !important;
    background: #f0f0f0;
}


@font-face {
    font-family: 'code';
    src: url('SVBasicManual.ttf');
    font-weight: normal;
    font-style: normal;
    letter-spacing: 1px;
}

@font-face {
    font-family: 'code';
    src: url('SVBasicManual-Bold.ttf');
    font-weight: bold;
    font-style: normal;
    letter-spacing: 1px;
}

@font-face {
    font-family: 'glyphter';
    src: url('glyphter.eot');
    src: url('glyphter.eot?#iefix') format('embedded-opentype'),
         url('glyphter.woff') format('woff'),
         url('glyphter.ttf') format('truetype'),
         url('glyphter.svg#glyphter') format('svg');
    font-weight: normal;
    font-style: normal;
}
[class*='glyphter-']:before{
   font-family: 'glyphter';
   position: relative;
    top: 0px;
    display: inline-block;
    font-style: normal;
    font-weight: normal;
    vertical-align: text-bottom;
    margin-right: 0.25rem;

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.glyphter-marketplace1:before{content:'\0041';}
.glyphter-dashboard1:before{content:'\0042';}
.glyphter-dashboard2:before{content:'\0043';}
.glyphter-contrast:before{content:'\0044';}
.glyphter-home:before{content:'\0045';}
.glyphter-clock:before{content:'\0046';}
.glyphter-bell:before{content:'\0047';}
.glyphter-warning:before{content:'\0048';}
.glyphter-download:before{content:'\0049';}
.glyphter-upload:before{content:'\004a';}
.glyphter-adjust:before{content:'\004b';}
.glyphter-cake:before{content:'\004c';}
.glyphter-speechbubble:before{content:'\004d';}
.glyphter-tiles:before{content:'\004e';}
.glyphter-document:before{content:'\004f';}
.glyphter-dashboard3:before{content:'\0050';}
.glyphter-tilebox:before{content:'\0051';}
.glyphter-tilewindow:before{content:'\0052';}
.glyphter-marketplace2:before{content:'\0053';}
.glyphter-monitor1:before{content:'\0054';}
.glyphter-monitor2:before{content:'\0055';}
.glyphter-user:before{content:'\0056';}
.glyphter-user2:before{content:'\0057';}
.glyphter-tilebox2:before{content:'\0058';}
.glyphter-window1:before{content:'\0059';}
.glyphter-dashboard-right3:before{content:'\005a';}
.glyphter-dashboard-left3:before{content:'\0061';}
.glyphter-dashboard-left2:before{content:'\0062';}
.glyphter-tilebox-left:before{content:'\0063';}
.glyphter-tilebox-right:before{content:'\0064';}
.glyphter-tilebox-center:before{content:'\0065';}
.glyphter-tilewindow2:before{content:'\0065';}
.glyphter-dashboard-right2:before{content:'\0066';}
.glyphter-marketplace3:before{content:'\0067';}
.glyphter-dashboard-bars:before{content:'\0068';}
.glyphter-adjust2:before{content:'\0069';}


#header{
    z-index: 9999;
    position: fixed;
    width: 100%;
    max-width: 2048px;
    white-space: nowrap;
    min-width: 20rem;
}

#websitelogo{
    width: 15rem;
    height: auto;
    display: inline-block;
    margin: 1rem 1.5rem 0rem 0rem;
    vertical-align: top;
} 



#blendtext{
    position: absolute;
    top:1.5rem;
    font-size:1.25rem;
    left: 17rem;
    font-weight:bold;
    opacity: 0.5;
}

a, a:link, a:active, a.visited{
    color: #595;
}
a:hover, a.focus{
    color: #7B7;
}

.TopDashboardIcon:hover{
    fill: #7B7 !important;
}

.payIcon{
    height: 1.75rem;
    width: auto;
    vertical-align: middle;
    margin-right: 0.25rem;
}

.actionicon, .topictooltip{
    text-align: center;
    display: inline-table;
    overflow: visible;
    position: relative;
    width: 2rem;
    height: 2rem;
    box-sizing: border-box;
}


.actionicon{
    border-radius: 5px;
    padding: 0.25rem;
    font-size:1.5rem;
    margin: -0.25rem 0.25rem -0.25rem 0.25rem;
}

.actionicon p, .topictooltip p{
    position: absolute;
    width: 7rem;
    left:50%;
    margin-left: -3.5rem;
    top: 2.25rem;
    padding:0.15rem;
    border-radius: 5px;
    font-size: 0.8rem;
    display: none;
    box-shadow: 2px 2px 4px -1px #444;
    z-index: 999;
    background: #fff;
}

.swal2-popup.zoomout {
    transform: scale(0);
    opacity: 0;
    transition-delay: 0.02s;
    transition-duration: 0.05s;
  }

  .swal2-popup{
    padding: 0.25rem !important;
    width: auto !important;
    min-width: 25rem;
    max-width: 100rem !important;
    max-height: 40rem;
    overflow-y: auto;
    top: 1rem;
  }

  .swal2-actions{
    margin-bottom: 1rem !important;
  }
  .swal2-title{
    font-size:1.4rem !important;
  }

  #swal2-html-container{
    margin: 0.5rem 0.25rem !important;
  }


  .depositherebutton{
    padding: 0rem 0.25rem !important;
  } 
  
  .socialmediabox{
    padding: 1rem 0.5rem;
    width: 100%;
    max-width: 30rem;
    border-radius: 5px;
    display: block;
    min-width: 10rem;
    margin: 0.15rem 0rem;
    font-weight:bolder;
    opacity: 0.9;
    background: none !important;
    border: 1px solid transparent;
}

.socialmediabox img{
    width: 100%;
    display: inline;
    max-width: 3rem;
    min-width: 2rem;
    margin: 0rem 1rem 0rem 0rem;
}
.socialmediabox:hover{
    opacity: 1;
    cursor: pointer;
    border: 1px solid rgba(100,100,100,0.5);
}


  #MessageSubject{
    width: 100%;
    padding: 0.25rem;
    font-size:1.2rem;
    border-radius: 5px;
    margin: 0.25rem auto;
    display: table;
    border: 1px solid rgba(100,100,100,0.5);
    font-weight: bolder;
  }

  #MessageText{
    width: 100%;
    height: 10rem;
    overflow-y: auto;
    padding: 0.25rem;
    font-size:1rem;
    border-radius: 5px;
    margin: 0.25rem auto;
    display: table;
    border: 1px solid rgba(100,100,100,0.5);
  }

.actionicon:hover p, .topictooltip:hover p{
    display: block;
}

.actionicon:hover, .topictooltip:hover{
    cursor: pointer;
}



#picbox{
    width: 10rem;
    height: 10rem;
    border-radius: 100%;
    overflow: hidden;
    background: #999;
    padding: 0px;
    margin: 1rem auto;
}

#picbox img{
    width: 100%;
    height: 100%;
}

.loadingpng{
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left:-50px;
    margin-top:-50px;
    z-index: 99999;
}

.code{
    font-family: code !important;
}

.topnavi {
    background: rgba(255,255,255,0.95);
    border-bottom: 1px solid #dedede;
    box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    position: fixed;
    width: 100%;
    left: 0px;
    top: 0px;
    min-width: 20rem;
    z-index: 9999;
}

.topnavi:hover{
    background: rgba(255,255,255,1);
}


  .navbar-nav{
    display: block;
    margin: 0.5rem auto 0.5rem;
  }

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

  
.nav-item{
    list-style: none;
}

.nav-link{
    color: #000 !important;
    margin: 2rem 1.25rem 0rem !important;
    font-size: 1.25rem;
    display: inline-block;
    padding: 0.5rem !important;
    line-height: 100% !important;
    text-transform: uppercase;
}

.nav-link:hover{
    color: #80D050 !important;
}

    .navbar-brand{
        padding: 1rem 0rem 0rem;
        margin: auto;
        float: left;
        display: inline-table !important;
    }

  .navbar-brand img {
    height: auto;
    width: 100%;
    max-width: 15rem;
  }

  #toolsDropdown:hover .dropdown-menu{
    display: block !important;
  }
  
  #toolsDropdown .dropdown-menu{
    border: none !important;
  }

  #tools-chevron{
    font-size: 0.8rem !important;
    vertical-align: top;
    opacity: 0.5;
  }
  
  #toolsDropdown:hover  #tools-chevron{
    opacity: 0 !important;
  }
  


  .dropdown-item{
    font-size: 1.1rem;
    white-space: nowrap;
    color: #000 !important;
    border-bottom: 1px solid #dedede;
    padding: 0.75rem 0.5rem;
    line-height: 100%;
    display: block;
    margin: 0px;
    width: 100%;
    font-weight:normal;
  }

  .dropdown-item img{
    width: 2rem;
    margin-right: 0.5rem;
    vertical-align: middle;
    display: inline-block;
    height: auto;
  }

  .dropdown-item:hover{
    color: #80D050 !important;
  }

  .dropdown-item:last-child{
    border-bottom: none !important;
  }


  .dropdown-menu {
    margin-top: 0;
  }

.userline {
    padding: 0.25rem 1.5rem;
    font-weight:bold;
    font-size:1.1rem;
}

.deleteicon{
        background: #d00;
        color: #fff;
        border-radius: 5px;
        padding: 0.25rem;
        float:right;
        cursor: pointer;
        opacity: 1.0 !important;
        margin: 0.25rem 0.25rem 0rem 0rem !important;
}


.blurbg{
    background: #666;
    opacity: 0.5;
    display: block;
    filter: blur(3px);
}


.topmainlink, .topmainlink:link, .topmainlink:active, .topmainlink:visited {
    padding: 0.5rem;
    border: 1px solid #ccc;
    border-radius: 5px;
    box-sizing: border-box;
    display: inline-block;
    height: 2.4rem;
    margin: -0.65rem;
}

.topmainlink:hover, .topmainlink:focus {
    background: #595 !important;
    border: 1px solid #484 !important;
    color: #fff !important;
}

.topmainlink:hover .opac70, .topmainlink:focus .opac70, .topmainlinkmobile:hover .opac70, .topmainlinkmobile:focus .opac70{
    opacity: 1 !important;
}

#DashboardLink, #DashboardLinkMobile{
    position: relative;
}

#dashdot_top{
    position: absolute;
    width: 0.5rem;
    height: 0.5rem;
    border-radius:100%;
    background: #595;
    display: inline-block;
    padding: 0rem;
    right: 3px;
    bottom: 3px;
}

#dashdot_mobile{
    position: absolute;
    width: 1rem;
    height: 1rem;
    border-radius:100%;
    background: #595;
    display: inline-block;
    padding: 0rem;
    left: 8rem;
    top: 50%;
    margin-top: -0.5rem;
}

.swal2-container, .swal2-html-container{
    min-width: 20rem !important;
    overflow: hidden auto !important;
}

.swal2-styled.swal2-confirm{
    background: #7B7 !important;
}

.swal2-styled.swal2-confirm:hover{
    background: #595 !important;
}

.questionmark {
    font-size: 10rem;
    color: #7B7;
    opacity: 0.9;
    display:block;
}


.userpic35{
    border-radius: 100%;
    display: inline-block;
    overflow: hidden;
    border: 2px solid #ccc;
    box-sizing: border-box;
    padding: 0px;
    margin: 0rem 0.5rem 0rem 0.25rem;
    width:35px;
    height:35px;
    vertical-align: middle;
}

.userpic35 img{
    width: 100%;
    height: 100%;
    vertical-align: middle;
}

#usericon, .usericon {
    position: relative;
    display: block;
    height: 100%;
    padding: 1rem;
    border-radius: 5px;
    color: inherit;
    z-index:9996;
}
#usericon{
    margin: -1.5rem;
}

#usermenu {
    position:absolute;
    top:4rem;
    left: 50%;
    margin-left:-7.5rem;
    width:15rem;
    border-radius: 5px;
    z-index: -1;
    overflow: hidden;
    opacity: 0%;
    display: none;
    
}

input[type="checkbox"], input[type="radio"]  { 
    filter: grayscale(100%);
    cursor: pointer;
    opacity: 0.75;
}

#mainbox{
    display: block;
    width: 100%;
    min-width: 25rem;
    min-height:50rem;
    margin: 10rem auto 0px;
    padding: 0rem;
    max-width: 1280px;
}

.redheadlineButton{
    border: 1px solid #595;
    border-radius: 5px;
    padding: 1rem;
    color: #595;
    font-size:1.5rem;
    text-align: center;
    background: none;
    width: 100%;
    max-width: 30rem;
    min-width: 15rem;
    display: table;
    margin: auto;
    opacity: 95%;
}

.redheadlineButtonSelected{
    background: #595 !important;
    background-image: none !important;
    background-image: -webkit-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: -moz-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: -o-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: -ms-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: linear-gradient(#7B7 0%, #595 90%)  !important;
    color: #fff;
    opacity: 90%;
    border: 1px solid #595;
    border-radius: 5px;
    padding: 1rem;
    font-size:1.5rem;
    text-align: center;
    width: 100%;
    max-width: 30rem;
    min-width: 15rem;
    display: table;
    margin: auto;
    opacity: 95%;
}

.redheadlineButton:hover, .redheadlineButtonSelected:hover {
    opacity: 100%;
    color: #fff;
    background: #595 !important;
    background-image: none !important;
    background-image: -webkit-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: -moz-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: -o-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: -ms-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: linear-gradient(#7B7 0%, #595 90%)  !important;
    cursor: pointer;
}

.nav-login{
    float:right;
    margin-right:2rem !important;
}

a.orangelink:link, a.orangelink:visited, a.orangelink:active{
    color: #7B7;
}
a.orangelink:hover, a.orangelink:focus{
    color: #595;
}

.minibutton{
    padding:0.25rem !important;
    font-size:0.75rem !important;
}

.gradientbutton {
    color: #fff;
    background: #595 !important;
    background-image: none !important;
    background-image: -webkit-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: -moz-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: -o-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: -ms-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: linear-gradient(#7B7 0%, #595 90%)  !important;
    text-align: center;
    border-radius: 5px;
    padding:0.25rem;
    border: none;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}
.gradientbutton:hover{
    cursor: pointer;
}

#flyoutmenu {
    position: fixed;
    opacity: 0;
    top:-200%;
    z-index: 9998;
    width:100%;
    display: block;
    left:0px;
    min-width: 20rem;
}

#flyoutbutton {
    display: inline;
    margin: 1rem 0.5rem;
    float: right;
    font-size:2rem;
    cursor: pointer;
    vertical-align: middle;
}

.flyoutmenuitem {
    width: 100%;
}
.flyoutmenuitem a, .flyoutmenuitem a:link, .flyoutmenuitem a:active, .flyoutmenuitem a:visited, #MobileSwitch{
    padding: 1rem;
    width: 100%;
    display: block;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

.flyoutmenuitem a:hover, .flyoutmenuitem a:focus, #MobileSwitch:hover {
    color: #fff !important;
    background: #595;
    cursor: pointer;
}

#theme-switch{
    float: right;
    margin: 1.3rem 0rem;
}

#theme-switch, .button-switch{
    width: 3rem;
    height: 1.5rem;
    display: inline-block;
    border-radius: 1rem;
    border: 2px solid #999;
    background: none;
    position: relative;
    vertical-align: middle;
    cursor: pointer;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

#theme-ball, .button-ball{
    height: 1rem;
    width: 1rem;
    margin: 0.1rem 0.25rem;
    border-radius: 100% !important;
    position: absolute;
    top: 0rem;
}


.button-switch-off{
    background: rgba(200,0,0,0.25);
    border-color: #b00;
}

.button-switch-off .button-ball{
    background: #b00;
    left: 0rem;
}

.button-switch-on{
    background: rgba(0,150,0,0.25);
    border-color: #090;
}

.button-switch-on .button-ball{
    background: #090;
    left: 1.25rem;
}


.info-tooltip{
    position: relative;
    cursor: pointer;
}

.info-tooltip p{
    position: absolute;
    padding: 0.25rem;
    text-align: left;
    display: none;
    left: 50%;
    top:110%;
    margin-left:-7.5rem;
    width: auto;
    max-width: 15rem;
    border: 1px solid rgba(100,100,100,0.5);
    border-radius: 5px;
    font-weight: normal;
    font-size: 0.9rem;
    z-index: 999;
}

.info-tooltip:hover p{
    display: table;
}



.orangered{
    background: #595 !important;
    background-image: none !important;
    background-image: -webkit-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: -moz-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: -o-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: -ms-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: linear-gradient(#7B7 0%, #595 90%)  !important;
    color:  #fff !important;
}

.greygradient {
    background: rgb(60,60,60) !important;
    background-image: none !important;
    background-image: -webkit-linear-gradient(rgb(100,100,100) 0%, rgb(60,60,60) 90%)  !important;
    background-image: -moz-linear-gradient(rgb(100,100,100) 0%, rgb(60,60,60) 90%)  !important;
    background-image: -o-linear-gradient(rgb(100,100,100) 0%, rgb(60,60,60) 90%)  !important;
    background-image: -ms-linear-gradient(rgb(100,100,100) 0%, rgb(60,60,60) 90%)  !important;
    background-image: linear-gradient(rgb(100,100,100) 0%, rgb(60,60,60) 90%)  !important;
    color: #fff !important;
}

.bluegradient {
    background: rgb(40, 80, 160) !important;
    background-image: none !important;
    background-image: -webkit-linear-gradient(rgb(60,90,180) 0%, rgb(40,80,160) 90%)  !important;
    background-image: -moz-linear-gradient(rgb(60,90,180) 0%, rgb(40,80,160) 90%)  !important;
    background-image: -o-linear-gradient(rgb(60,90,180) 0%, rgb(40,80,160) 90%)  !important;
    background-image: -ms-linear-gradient(rgb(60,90,180) 0%, rgb(40,80,160) 90%)  !important;
    background-image: linear-gradient(rgb(60,90,180) 0%, rgb(40,80,160) 90%)  !important;
    color: #fff !important;
}

.tooltipBox{
    position: relative;
    display: inline-block;
}

.SMLink {
    width: 100%;
}

.fading {
    opacity: 0;
}

.btn-success{
    background: #63c53a !important;
    border: 1px solid #63c53a !important;
}

.btn-success:hover{
    background: #70cc49 !important;
    border: 1px solid #70cc49 !important;
    color: #ffffff !important;
}

.tooltipText{  
    position: absolute;
    opacity: 0%;
    display: none;
    top: 110%;
    left: 50%;
    margin-left:0px;
    padding: 0.5rem;
    z-index: 999; 
    width: 100%;
    max-width: 10rem;
    font-size:0.8rem;
    border-radius: 5%;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

.indexbuttons {
    display: table;
    border-radius: 10px;
    font-size:2rem;
    color: #fff !important;
    padding: 0.25rem;
    margin: 2rem 1rem;
    opacity: 90%;
}

.cbutton:hover, .cbutton:focus{
    background: #595;
    color: #fff !important;
    cursor: pointer;
}


.indexbuttons:hover{
    opacity: 100%;
}

.IndexContentCreator{
    background: url("images/index-contentcreator.jpg");
}

.IndexMarketingExpert{
    background: url("images/index-marketingexpert.jpg");
}

.IndexContentCreator, .IndexMarketingExpert{
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top center;
    height: 100%;
    max-height: 20rem;
    min-height: 10rem;
    border-radius: 5px;
}


.cbutton, a.cbutton, a.cbutton:link, a.cbutton:active, a.cbutton:visited {
    padding:0.5rem;
    border: 1px solid #595;
    border-radius: 5px;
    text-decoration: none;
}

#footer{
    border-top: 1px solid #80D050;
    background: rgba(255,255,255,0.95);
}

#footer a{
    color:#000 !important;
}

#footerlogo {
    height: 1.75rem;
    width: auto;
    vertical-align: middle;
}

.orangebutton {
    padding: 0.5rem;
    display: inline-table;
    margin: auto;
    text-align: center;
    box-sizing: border-box;
    border-radius: 5px;
    background:#7B7;
    border: 1px solid transparent;
    vertical-align: middle;
    color: #ffF !important;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}
.orangebutton:hover {
    background:#595;
    cursor: pointer;
}

.orangeline {
    height:1px;
    border-top: 1px solid #7B7;
}

.backbox{
    border-radius: 5px;
    padding: 1rem;
    display: table;
}

.formbox .row{
    padding: 0.5rem;
    margin: 0.5rem 0rem;
}

.orangetext{
    color: #f93 !important;
}

.redtext{
    color: #484 !important;
}
.errortext{
    color: rgb(158, 32, 0) !important;
    background: #f5d9d9 !important;
    border: 1px solid rgb(238, 155, 155);
    border-radius: 5px;
    padding:0.25rem;
    display: table;
    margin: auto;
}
.OKtext{
    color: rgb(2, 124, 8) !important;
    background: #d9f5db !important;
    border: 1px solid rgb(167, 233, 172);
    border-radius: 5px;
    padding:0.25rem;
    display: table;
    margin: auto;
}

.optionbutton, a.optionbutton:link, a.optionbutton:active, a.optionbutton:visited{
    border-radius: 5px;
    display: inline-table;
    border: 1px solid transparent;
    padding: 0.5rem;
    vertical-align: middle;
    text-decoration: none;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

.optionbutton:hover, a.optionbutton:hover, a.optionbutton:focus {
    opacity: 0.9;
    cursor: pointer;
}

#ConflictText{
    width: 96%;
    display: table;
    margin: auto;
    height: 8rem;
    resize: vertical;
    overflow-y: auto;
}


input[type=text], input[type=email],input[type=number],input[type=password],textarea,select,option{
    padding:0.25rem;
    box-sizing: border-box;
}

.SelectField {
    width: 100%;
    display: block;
    border: 1px solid #999;
    padding: 0.5rem;
    border-radius: 5px;
    cursor: pointer;
    background: inherit;
}

.mainchoice{
    padding: 0.5rem;
}

.glyphicon, .glypther{
    display: inline;
}

.SelectField .glyphicon-chevron-down{
    position: absolute;
    right: 1rem;
    top: 1rem;
    opacity: 0.65;
}

.OptionArea{
    display: none;
    width: 98%;
    position: absolute;
    top:3rem;
    left: 1%;
    z-index: 999;
    padding: 0rem;
    margin: 0rem auto;
    box-shadow: 1px 1px 5px -1px #666;
}

.SelectOption{
    display: block;
    width: 100%;
    padding: 0.5rem;
    margin: 0rem auto;
    cursor: pointer;
    border-top: 1px solid rgba(100,100,100,0.5);
}

.SelectOption img, .OptionField img{
    margin-right: 0.5rem !important;
}

#hintbox{
    width: 20rem;
    border-radius: 5px;
    display: table;
    position: fixed;
    left:50%;
    margin-left:-10rem;
    top:40%;
    box-shadow: 2px 2px 5px -1px #000;
    z-index: 99999;
    background: #fff;
    color: #333;
    text-align: center;
    font-size: 1.1rem;
    opacity: 0;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

#hintvalue{
    display: block;
    margin: 0.75rem auto 0rem;
}

#hintclose{
    right:0.5rem;
    top:0.5rem;
    background: #595;
    color: #fff;
    padding:0.1rem;
    text-align: center;
    position: absolute;
}

.closeicon{
    right:0.5rem;
    top:0.5rem;
    background: #595 !important;
    color: #fff !important;
    border-radius: 100%;
    cursor: pointer;
    padding:0.1rem;
    text-align: center;
    position: absolute;
    z-index: 999;
}

#websiteicon {
    display: none;
    width: 3rem;
    height: auto;
    margin: 0.5rem 0rem;
}

#notifier {
    position: fixed;
    bottom: -20rem;
    right: 0.25rem;
    border-radius: 10px 10px 0px 0px;
    box-shadow: -1px -1px 5px -1px #333;
    width: 100%;
    max-width: 30rem;
    height: 9rem;
    z-index: 99998;
    padding: 0.5rem 1rem !important;
    text-align: center;
    overflow: hidden;
}

.notification {
    padding: 0.35rem;
    height: 5rem;
    position: relative;
    margin-bottom: 0.25rem;
    max-height: 5rem;
    border-radius: 5px;
    cursor: pointer;
}

.notificationpic{
    text-align: center;
    padding: 0px;
}

.notificationpic img{
    width: 90%;
    height: auto  !important;
    max-width: 5rem;
    height: auto;
    border-radius: 100%;
    margin: 0.15rem auto;
    overflow: hidden;
}

#notifierbox{
    width: 100%;
    margin: auto;
    display: inline-block;
    overflow-x: hidden;
    overflow-y: auto;
    height:7rem;
    max-height:7rem;
    scrollbar-color: #680404 #ffdede !important;
    text-align: left;
    float:none;
}

.notificationtext{
    font-size:1rem;
    padding:0.25rem;
    overflow: hidden;
    max-height: 4.5rem;
    
    
}
.notificationtext span{
    font-size:0.8rem;
}

.notificationheadline{
    padding: 0rem;
    text-align: left;
}

.notificationheadline .glyphicon-send{
    margin: 0rem 0.5rem 0rem 0rem;
    font-size: 1.5rem;
}

.notifierlink, .notifierlink:link, .notifierlink:active, .notifierlink:visited{
    font-weight: bolder;
    font-size: 1.35rem;
    text-decoration: none;
    margin: -1.85rem 0rem 0rem;
    display: inline-block;
}

.notifierlink:hover, .notifierlink:focus{
    cursor: pointer;
    text-decoration: underline !important;
}

.closenotifier{
    right: 1.25rem;
    position: absolute;
    padding: 0.15rem 0.5rem;
    font-size: 0.8rem;
    color: #fff;
    top: 0.5rem;
}

#MobileSwitchRow{
    display: none;
}

.YouTube-Button::before, .Facebook-Button::before, .Instagram-Button::before, .Twitter-Button::before, .TikTok-Button::before, .Telegram-Button::before, .Communitizer-Button::before {
    content: "\00a0\00a0";
    display: inline-block;
    vertical-align: middle;
    width: 2rem; 
    height: 2rem;
    margin-right: 0.5rem;
    border-radius:100%;
    border: 1px solid rgba(255,255,255,0.5);
    box-shadow: 1px 1px 3px -1px rgba(255,255,255,0.5);
}

.YouTube-Button::before{
    background-image: url('images/YouTube-icon.png');
    background-size: auto 100%;
    background-position: center;
    background-repeat: no-repeat;
}
.Facebook-Button::before{
    background-image: url('images/Facebook-icon.png');
    background-size: auto 100%;
    background-position: center;
    background-repeat: no-repeat;
}
.Instagram-Button::before{
    background-image: url('images/Instagram-icon.png');
    background-size: auto 100%;
    background-position: center;
    background-repeat: no-repeat;
}
.Twitter-Button::before{
    background-image: url('images/Twitter-icon.png');
    background-size: auto 100%;
    background-position: center;
    background-repeat: no-repeat;
}
.TikTok-Button::before{
    background-image: url('images/TikTok-icon.png');
    background-size: auto 100%;
    background-position: center;
    background-repeat: no-repeat;
}
.Telegram-Button::before{
    background-image: url('images/Telegram-icon.png');
    background-size: auto 100%;
    background-position: center;
    background-repeat: no-repeat;
}

.Communitizer-Button::before{
    background-image: url('images/communitizer-icon.png');
    background-size: auto 100%;
    background-position: center;
    background-repeat: no-repeat;
}

.YouTube-Button{
    background: #E73D39;
}
.Facebook-Button{
    background: #2A72B8;
}
.Instagram-Button{
    background: #e4428c;
}
.Twitter-Button{
    background: #1FA6DD;
}
.TikTok-Button{
    background: #1C1C1D;
}
.Telegram-Button{
    background: #1792E6;
}
.Communitizer-Button{
    background: #595 !important;
    background-image: none !important;
    background-image: -webkit-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: -moz-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: -o-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: -ms-linear-gradient(#7B7 0%, #595 90%)  !important;
    background-image: linear-gradient(#7B7 0%, #595 90%)  !important;
}

.YouTube-Button, .Facebook-Button, .Instagram-Button, .Twitter-Button, .TikTok-Button, .Telegram-Button, .Communitizer-Button {
    color: #fff !important;
    font-weight: bold;
    border-radius: 5px;
    vertical-align: middle;
    display: inline-table;
    padding: 0.35rem 0.5rem;
    text-align: center;
    font-size: 1.2rem;
    opacity:0.9;
}

.YouTube-Button:hover, .Facebook-Button:hover, .Instagram-Button:hover, .Twitter-Button:hover, .TikTok-Button:hover, .Telegram-Button:hover, .Communitizer-Button:hover {
    cursor: pointer;
    opacity: 1;
}


.TariffDisplay{
    padding: 0.1rem;
    border-radius: 5px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: -1px;
}

.Menu-Tariff{
    position: absolute;
    top: 2.5rem;
    right: 0.5rem;
}

.Basic, .Starter{
    color: #fb0;
    border-color: #fb0;
}
.Premium{
    color: #f90;
    border-color: #f90;
}
.Ultimate, .Advanced{
    color: #7B7;
    border-color: #7B7;
}
.Agency{
    color: #595;
    border-color: #595;
}
.Managed, .Expert{
    color: #484;
    border-color: #484;
}


.EmoticonArea{
    position: relative;
    display: inherit;
}

.Emoticon-Pos{
    position: absolute;
    left: 100%;
    top: 50%;
    margin-top:-0.75rem;
    margin-left:-0.75rem;
}

.EmoticonTrigger{
    position: relative;
    font-size: 1rem;
    width: 1.25rem;
    height: 1.25rem;
    text-align:center;
    z-index: 9999;
    display: inline-block;
}

.EmoticonBox{
    position: absolute;
    width: 12rem;
    padding: 0.25;
    border-radius: 5px;
    display: none;
    top: 1.25rem;
    right: 0.25rem;
    z-index: 999;
    box-shadow: 1px 1px 5px -1px rgba(100,100,100,0.5);
    height: 8.5rem;
    overflow-y: scroll;
    scrollbar-color: #fc0 rgba(100,100,100,0.5) !important;
    border: 1px solid rgba(255,200,0,0.5);
} 

.EmoticonTrigger:hover{
    transform: scale(1.01); 
    cursor:pointer;
}

.EmoticonTrigger:hover .EmoticonBox{
    display: block;
}

.Emoticon{
    font-size: 1.25rem;
    width: 2rem;
    height: 2rem;
    text-align: center;
    display: inline-block;
    padding: 0rem;
    border: 1px solid transparent;
    border-radius: 5px;
    margin: 0.1rem;
    line-height: 150%;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}
.Emoticon:hover{
    transform: scale(1.1);
    cursor: pointer;
    border: 1px solid rgba(100,100,100,0.25);
}


#GiveRatingStar1, #GiveRatingStar2, #GiveRatingStar3, #GiveRatingStar4, #GiveRatingStar5{
    opacity: 0.5;
    cursor: pointer;
}

#StarsRow{
    padding:0.25rem;
    border-radius: 5px;
}
#RatingFeedback{
    padding:0.25rem;
    border-radius: 5px;
    width: 100%;
    height: 7rem;
    overflow-y: auto;
}

.calendar_container{
    width: 25rem;
    height: 22rem;
}

.calendar_weekday, .calendar_day, .calendar_day_empty{
    width: 14.28%;
    min-width: 3.55rem;
    max-width: 3.55rem;
    text-align: center;
    padding: 0px;
}

.calendar_weekday{
    font-weight: bold;
    font-size:1.1rem;
    height: 3rem;
    margin-top:0.5rem;
}
.calendar_day{
    height: 3.55rem;
    border: 1px solid rgba(100,100,100,0.15);
    border-radius: 5px;
    line-height: 280%;
    font-size:1.2rem;
}

.calendar_day_empty{
    height: 3.55rem;
    line-height: 280%;
    font-size:1.2rem;
}

.calendar_day:hover{
    cursor: pointer;
    border-color: #595;
    color: #595;
}

.calendar_laquoraquo{
    line-height: 70%;
}

.calendar_laquoraquo:hover{
    color: #595;
    cursor: pointer;
}


.FilterStatus1{
    color: #00AA00 !important;
}

.FilterStatus2{
    color: #AABB00 !important;
}

.FilterStatus3{
    color: #999999 !important;
}

.FilterStatus4{
    color: #FF9900 !important;
}

.FilterStatus5{
    color: #FF0000 !important;
}

.FilterStatus1,.FilterStatus2,.FilterStatus3,.FilterStatus4,.FilterStatus5{
    margin:0 auto;
}

@media (min-width: 767px) and (max-width: 1200px) {
    #mainbox{
        margin-top: 14rem !important;
    }

    .nav-link, .dropdown-item{
        font-size: 1rem !important;
    }
    

}


@media (min-width: 767px) and (max-width: 991px) {
    .navbar-brand{
        float: none !important;
        display: table !important;
        margin: 0.5rem auto !important;
    }

    .navbar-nav{
        margin: -1rem auto 1rem;
      }

      .nav-link{
        margin: 1rem 1.25rem 0rem !important;
      }
}


@media (max-width: 991px) {

    .nav-link, .dropdown-item{
        font-size: 1rem !important;
    }

}

@media (max-width: 767px) {

    .navbar-brand img{
        max-width: 11rem !important;
    }

    .navbar{
        margin: 0px !important;
    }

    .navbar-nav {
        padding: 0px !important;
    }

    .nav-link{
        padding: 2rem 1rem !important;
        display: block;
        width: 100%;
        margin: 0rem !important;
    }

    .dropdown-item{
        font-size: 1rem;
    }

    .dropdown-menu{
        position: relative;
        width: 100%;
        box-shadow: none;
        border: none;
        left: 0;
        top: 0;
    }

    #mainbox{
        margin-top: 8rem !important;
    }

}