html { 
    height: 100%;
}
body { 
    max-height: 100%;
   background-image: linear-gradient(to bottom, rgba(37,38,41,1) 6%,rgba(37,38,41,1) 25%, rgba(0,0,0,1) 90%);
    background-attachment: fixed;
}

/* Start https://www.cursors-4u.com */ * {cursor: url(https://cur.cursors-4u.net/cursors/cur-11/cur1054.cur), auto !important;} /* End https://www.cursors-4u.com */
a:link {
color: #FFFFFF;
}
a:visited {
color: #FFFFFF;
}
a:hover {
color: #17CD8A;
}
a:active {
color:  #17CD8A;
}

::-webkit-scrollbar {
width: 16px
}
 
::-webkit-scrollbar:horizontal {
height: 17px
}
 
::-webkit-scrollbar-corner {
background: #eee
}
 
::-webkit-scrollbar-track:vertical {
background: linear-gradient(90deg, #e5e5e5, #f0f0f0 20%)
}
 
::-webkit-scrollbar-track:horizontal {
background: linear-gradient(180deg, #e5e5e5, #f0f0f0 20%)
}
 
::-webkit-scrollbar-thumb {
border: 1.5px solid #888;
border-radius: 3px;
box-shadow: inset 0 -1px 1px #fff, inset 0 1px 1px #fff;
background-color: #eee;
}
 
::-webkit-scrollbar-thumb:vertical {
background: url("images/scrollgrippy2.png") no-repeat 50%, linear-gradient(90deg, #eee 45%, #ddd 0, #bbb)
}
 
::-webkit-scrollbar-thumb:horizontal {
background: url("images/scrollgrippy.png") no-repeat 50%, linear-gradient(180deg, #eee 45%, #ddd 0, #bbb)
}
 
::-webkit-scrollbar-button:horizontal:end:increment,
::-webkit-scrollbar-button:horizontal:start:decrement,
::-webkit-scrollbar-button:vertical:end:increment,
::-webkit-scrollbar-button:vertical:start:decrement {
display: block
}
 
::-webkit-scrollbar-button:vertical {
height: 17px
}
 
::-webkit-scrollbar-button:vertical:start:decrement {
background: white;
background-image: url("images/scrollarrow2.png");
background-repeat: no-repeat;
background-position: center;
-moz-background-size: cover;
-webkit-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
 
::-webkit-scrollbar-button:vertical:start:increment {
display: none;
}
 
::-webkit-scrollbar-button:vertical:end:decrement {
display: none;
}
 
::-webkit-scrollbar-button:vertical:end:increment {
background: white;
background-image: url("images/scrollarrow.png");
background-repeat: no-repeat;
background-position: center;
-moz-background-size: cover;
-webkit-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
#centerwrap{
  margin: auto;
  max-width: 766px;
    margin-top: -25px;
}
.phone{
    margin:auto;
    pointer-events: none;
    position: relative;
    z-index:3;
}
.p900top{
    position: absolute;
     transform: translateX(0px)translateY(27px);
}
.p900sides{
    position: relative;
    transform: translateX(-13px)translateY(189px);
}
.p900sides2{
    position: relative;
        transform: translateX(-13px)translateY(118px);
}
.p900sides3{
    position: relative;
        transform: translateX(-13px)translateY(47px);
}
.p900bottom{
    position: relative;
        transform: translateX(0px)translateY(12px);
}


.content{
    top: 100%;
    position: relative;
    margin:auto;
    width: 780px;
    height: 880px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
      background-image: linear-gradient(to bottom, rgba(37,38,41,1) 6%,rgba(37,38,41,1) 25%, rgba(0,0,0,1) 90%);
    transform: translateX(20px)translateY(-1070px);
}

.contenttop{
    position: relative;
  background-image: url(images/titlebanner.gif);
width: 780px;
height: 80px;   
}

.markwee{
    position: relative;
    width: 770px;
height: 15px;
    font-family:ms gothic;
    font-size: 12px;
    color: white;
    background-color: rgba(20,20,20,1);
  border: inset 2px black;
    transform: translatey(83px);
     transition: 500ms;
}
.markwee:hover{
    text-shadow: 0px 0px 3px white;
}
.contentleft{
    position: relative;
    left: 13%;
  background-image: linear-gradient(to bottom, #000000 60%,#252629 95%,#252629 100%);
width: 154px;
height: 730px;
border: outset 3px #1e1e1e;
    transform: translatey(17px)translatex(-101px);
}

.titlebanner{
    height: 15px;
    background: linear-gradient(to bottom, #d1ebe7 0%,#aee0d7 17%,#68cab5 50%,#41c7ac 51%,#4cd8b3 59%,#27e8a4 70%,#41c7a3 84%,#29998a 100%);
    border: 2px groove #29998a;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}
.titletxt{
    font-weight:bold;
    margin-left: 5px;
    transform: translatey(-8px);
    text-align: left;
    font-family: ms gothic;
    font-size: 11px;
    color: white;
    text-shadow: 1px 0 black, 0 1px black, -1px 0 black, 0 -1px black;
}

.button{
    position: relative;
    width:150px;
    height:34px;
    border: inset 2px black;
background: linear-gradient(to bottom, #45484d 0%,#000000 61%,#212121 100%);
    transition: 100ms;
}
.button:hover{
        filter:invert(100%);
}
.buttontxt{
    pointer-events:none;
    font-family: ms gothic;
    font-size: 13px;
    color: white;
    text-align: center;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}
#statuscafe {
    padding: .5em;
    color: #17CD8A;
    text-align: center;
    border: 2px inset black;
    background: linear-gradient(to bottom, #45484d 0%,#000000 61%,#212121 100%);
}
#statuscafe-username {
    margin-bottom: .5em;
    font-family: ms gothic;
    font-size: 12px;
        text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}
#statuscafe-content {
    font-family: ms gothic;
    font-size: 12px;
        text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}
.gb{
    background:linear-gradient(to bottom, rgba(83,83,83,1) 0%,rgba(7,7,7,1) 46%,rgba(1,1,1,1) 50%,rgba(6,6,6,1) 53%,rgba(44,44,44,1) 76%,rgba(31,31,31,1) 87%,rgba(15,15,15,1) 100%);
    border: 5px groove black;
    height: 25px;
}
.gbdeco{
    filter:hue-rotate(-75deg);
}
.charm{
    margin-left: 60px;
    margin-top: -4px;
    animation: charm 1s infinite;
}
@keyframes charm{
     0%{
       transform: rotate(-2deg); 
   }
     20%{
    transform: rotate(4deg);
   }
    40%{
    transform: rotate(-8deg);
   }
    60%{
    transform: rotate(2deg);
   }
   100%{
  transform:rotate(-2deg);
   }
}
.input{
    background: linear-gradient(to bottom, #d1ebe7 0%,#aee0d7 17%,#68cab5 50%,#41c7ac 51%,#4cd8b3 59%,#27e8a4 70%,#41c7a3 84%,#29998a 100%);
    border: 2px groove black;
    font-family: ms gothic;
    color: white;
     text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
    
}

.glow{
    color:#17CD8A; text-shadow: 0px 0px 3px #17CD8A;
}
/*right*/

.contentright{
    overflow: hidden;
    position: relative;
    width: 620px;
    height: 745px; 
     transform: translatex(0px)translatey(15px);
}

.welcbanner{
    transform: translatex(0px)translatey(10px);
   height: 30px;
    width: 590px;
    margin-left: 5px;
    background: linear-gradient(to bottom, #d1ebe7 0%,#aee0d7 17%,#68cab5 50%,#41c7ac 51%,#4cd8b3 59%,#27e8a4 70%,#41c7a3 84%,#29998a 100%);
    border: 2px groove black;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    background-image: linear-gradient(to bottom, rgba(37,38,41,1) 6%,rgba(37,38,41,1) 25%, rgba(0,0,0,1) 90%);
}
.bannertxt{
    margin-left: 10px;
    margin-top: 10px;
    font-family: ms gothic;
    font-size: 18px;
    color: white;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}
.welcflex{
    display: flex;
    flex-wrap: wrap;
    transform: translatex(5px)translatey(10px);
}
.info{
    height: 200px;
    width: 295px;
    border: 1px inset black;
    background-image: linear-gradient(to bottom, rgba(37,38,41,1) 6%,rgba(37,38,41,1) 25%, rgba(0,0,0,1) 90%);
}
.t11{
    line-height:15px;
   margin-left: 10px;
    margin-right: 10px;
    margin-top: 10px;
    font-family: ms gothic;
    font-size: 12px;
    color: white;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; 
}
/* footer */

.footer{
    background:linear-gradient(rgba(83,83,83,1) 0%,rgba(7,7,7,1) 46%,rgba(1,1,1,1) 50%,rgba(6,6,6,1) 53%,rgba(44,44,44,1) 76%,rgba(31,31,31,1) 87%,rgba(15,15,15,1) 100%);
width: 770px;
height: 35px;
border: groove 3px #1e1e1e;
transform: translateX(-3px)translateY(3px);
}
.gbtxt{
    line-height:15px;
   margin-left: -5px;
    margin-right: 10px;
    margin-top: 10px;
    font-family: ms gothic;
    font-size: 12px;
    color: white;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; 
}
.footertxt{
    line-height: 15px;
    text-align: center;
    color: white;
    text-shadow: 1px 1px 1px rgba(83,83,83,1);
    font-family: ms gothic;
    font-size: 12px; 
    margin-top: 5px;
}
.footerbutton{
     height: 15px;
    width: 20px;
    background: linear-gradient(to bottom, #d1ebe7 0%,#aee0d7 17%,#68cab5 50%,#41c7ac 51%,#4cd8b3 59%,#27e8a4 70%,#41c7a3 84%,#29998a 100%);
    border: 2px groove #29998a;
    border-radius: 10px;
}