/*-^-<¦:-]  A  [-:¦>-^-*/
  a{
    text-decoration: none;
    color:#010101;
}
a:active{
    color: lightgreen;
}
.blue{
    color: #06c6c6 !important;
}
#Aimage{
    width: 100%;
    position: fixed;
    top: 70px;
    opacity: 0;
    z-index: -7898;
    transition: 1s;
}
.Aimagefade{
    opacity: 1 !important;
    transition: 1s !important;
}
.Agoaway{
    margin-left: 900px !important;
    transition: 1s !important;
}
.Agoaway2{
    top: 350px !important;
    transition: 2s !important;
}
  
  /*-^-<¦:-]  B  [-:¦>-^-*/
  body{
    background: #fefefe;
    position: relative;
    min-height: 100vh;
    overflow-x: hidden;
}
  /*-^-<¦:-]  C  [-:¦>-^-*/
  content{
    padding-bottom: 500px;
    z-index: -20;
    width: 100%;
}
#centerdiv{
    transition: 2s;
    backdrop-filter: blur(10px);
    width: 700px;
    height: 7in;
    color: white;
    padding-top: 25px;
    font-family: Ysabeau SC;
    margin-left: 32%;
    border-radius: 36px 36px 36px 36px;
    z-index: 34;
    margin-top: -200px;
    position: absolute;
    top: -1400px;
    text-align: center;
}
#centerdivbutton{
    transition: 1s;
    border: white 1px solid;
    background-color: transparent;
    border-radius: 2px;
    font-size: 0px;
    text-align: center;
    width: 20px;
    height: 20px;
    outline: none;
    color: transparent;
    font-family: Ysabeau SC;
}
#centerdivbutton:hover{
    transition: 1s;
    cursor: pointer;
    border: none;
    border-top: white 1px solid;
    border-bottom: white 1px solid;
    background-color: transparent;
    border-radius: 2px;
    padding: 5px;
    height: 40px;
    font-size: 20px;
    text-align: center;
    outline: none;
    width: 240px;
    color: white;
    font-family: Ysabeau SC;
}
.ConfinedStyle{
    color:#010101 !important;
}
.ConfinedStyle:active{
    color:lightgreen !important;
}
.CirTxtDiv{
    position:absolute;
    width:500q;
    height: 500q;
    left:-150px;
    top:-150px;
    background:none;
    /*border: 1px solid white;*/
}
div[calc]{
    width: 374px;
    height: 212px;
    position: absolute;
    left:600px;
    text-transform: uppercase;
    font-family: Ysabeau SC;
    text-align: center;
}
#calc{
    top: -145px;
    transition: 1s;
}
div[creds]{
    width: 374px;
    height: auto;
    position: absolute;
    left:600px;
    border:solid 1px #d9d9d9;
    padding-top: 50px;
    padding-bottom: 50px;
    text-transform: uppercase;
    font-family: Ysabeau SC;
    text-align: center;
}
div[creds]:hover{
    box-shadow: inset 0px 5px 10px 0px rgba(0, 0, 0, 0.5);
    text-shadow: 0px 5px 5px rgba(0, 0, 0, 0.5);
}
.credits{
    top: 450px !important;
    transition: 2s !important;
}
#credits{
    top: -945px;
    transition: 2s;
    background:white;
}
h1[cred]{
    letter-spacing: 2.4q;
    color:black;
    font-size: large;
    font-family: Ysabeau SC;
    text-align: center;
}
h1[cred2]{
    letter-spacing: 2.4q;
    color:black;
    font-size: small;
    font-family: Ysabeau SC;
    text-align: center;
}
.caul{
    top: 145px !important;
    transition: 1s !important;
}
.calcinput{
    width: 375px;
    height: 50px;
    color: black;
    background-color: white;
    border: solid 1px #d9d9d9;
    text-transform: uppercase;
    font-family: Ysabeau SC;
    font-size: 20px;
    padding-left: 15px;
}
.calcinput:hover{
    box-shadow: inset 0px 5px 10px 0px rgba(0, 0, 0, 0.5);
    text-shadow: 0px 5px 5px rgba(0, 0, 0, 0.5);
}
div[cover]{
    position:fixed;
    left:10q;
    width:500px;
    height:40px;
    z-index:20;
    background:transparent;
}
div[coverII]{
    position:fixed;
    left:10q;
    top:60q;
    width:500px;
    height:40px;
    z-index:20;
    background:transparent;
}

  /*-^-<¦:-]  D  [-:¦>-^-*/
  div[downloadcard]{
    position: absolute;
    display: none;
    top:150px;
    left:60px;
    width: 400px;
    height: 160px;
    background: white;
    padding: 20px 20px 20px 60px;
    border: 1px solid #d9d9d9;
    transition: 1s;
}
div[downloadcard]:hover{
    box-shadow: 0 0 20px grey;
}
div[Web_Tutorials]{
    top: 150px;
    z-index: 5;
    left: 1410px;
    width: 400px;
    height: 710px;
    transition: 1s;
    font-size: small;
    overflow-y: auto;
    padding-top: 34px;
    overflow-x: hidden;
    position: absolute;
    padding-left: 20px;
    text-align: center;
    padding-right: 20px;
    font-family: Ysabeau SC;
    background-color: white;
    border: 1px solid #d9d9d9;
}
div[Web_Tutorials]:hover{
    transition: 1s;
    box-shadow: inset 0px 5px 10px 0px rgba(0, 0, 0, 0.5);
}
.da-outline{
    color: white;
    mix-blend-mode: difference;
    left:100px;
    position: absolute;
}
.da-outline2{
    color: white;
    font-size: 20px;
    mix-blend-mode: difference;
    position: absolute;
}
#design{
    cursor: pointer;
}
#design:hover{
    color:rgb(1, 48, 1);
}
  /*-^-<¦:-]  E  [-:¦>-^-*/
  #elemtext{
    display:none;
    z-index: 50;
    mix-blend-mode: difference;
    font-family: Ysabeau SC;
}

  /*-^-<¦:-]  F  [-:¦>-^-*/
  footer{
    height: 500px;
    width: 100%;
    bottom: 0;
    color:white;
    background: #010101;
    font-size:14px;
    text-transform: uppercase;
    font-family: Ysabeau SC;
    border-top:solid 1px #d9d9d9;
}
div[footbottomdiv]{
    position: absolute;
    bottom:0;
    width:auto;
    left:80px;
    right:80px;
    letter-spacing: 2.4q;
    transition: 1s;
}
.font5{
    font-size: 5px;
}
.font10{
    font-size: 10px;
}
.font15{
    font-size: 15px;
}
.font20{
    font-size: 20px;
}
.font25{
    font-size: 25px;
}
.font30{
    font-size: 30px;
}
.font35{
    font-size: 35px;
}
.font40{
    font-size: 40px;
}
.font45{
    font-size: 45px;
}
.font50{
    font-size: 50px;
}
div[footI]{
    position: absolute;
    height: auto;
    letter-spacing: 2.4q;
    color:white;
    font-family: Ysabeau SC;
    left:0;
    top:0;
    transition: 1s;
}
div[footII]{
    display: inline;
    height: auto;
    letter-spacing: 2.4q;
    color:white;
    font-family: Ysabeau SC;
    left: 763px;
    right: 848px;
    top:0;
    transition: 1s;
}
div[footIII]{
    position: absolute;
    height: auto;
    letter-spacing: 2.4q;
    color:white;
    font-family: Ysabeau SC;
    right:0;
    top:0;
    transition: 1s;
}
h1[footh1]{
    letter-spacing: 2.4q;
    color:white;
    font-size: medium;
    font-family: Ysabeau SC;
    text-align: center;
}
div[footercontainer]{
    position:absolute;
    height: 380px;
    width:100%;
    top:1389px;
    height: auto;
    bottom:42px;
}
div[foottopdiv]{
    position:absolute;
    width:auto;
    left:40px;
    top:0;
    bottom:103px;
    right:40px;
}

  /*-^-<¦:-]  G  [-:¦>-^-*/
  .gonegone{
    opacity: 0 !important;
    transition: 1s !important;
  }

  /*-^-<¦:-]  H  [-:¦>-^-*/

hr{
    margin-left: 95px;
    margin-top: 10px;
    width: 200px;
    height: 1px;
    background: #010101;
    border: none;
}
#hovertext{
    transition: 1s;
    margin-left: -80px;
    opacity: 1;
    display: inline;
    font-size: 15px;
}

  header{
    background: white;
    position:fixed;
    z-index: 80;
    font-family: Ysabeau SC;
    border-bottom:solid 1px #d9d9d9;
    font-size:14px;
    text-transform: uppercase;
    width:100%;
    height:1in;
}
.h{
    top:300px;
    width: 50px;
    height: 50px;
    margin-bottom: 4px;
    background: white;
    display: inline;
    border: solid 1px #d9d9d9;
    cursor: pointer;
}
.h:hover{
    box-shadow: inset 0px 5px 10px 0px rgba(0, 0, 0, 0.5);
}
#headerI{
    box-shadow: none;
}

  /*-^-<¦:-]  I  [-:¦>-^-*/
  img{
    width: 250px;
    display: block;
    margin-left: auto;
    margin-right: auto;
}
div[I]:after {
    display:block;
    content: '';
    opacity: 0;
    border-bottom: solid 2px black;  
    transform: scaleX(0);  
    transition: opacity 350ms, transform 250ms ease-in-out;
  }
  div[I]:hover:after{opacity:1;transform:scaleX(1)}
  div[I].animate01:after{transform-origin:0%50%}
  div[II]:after {
      display:block;
      content: '';
      opacity: 0;
      border-bottom: solid 2px black;  
      transform: scaleX(0);  
      transition: opacity 350ms, transform 250ms ease-in-out;
    }
    div[II]:hover:after{opacity:1;transform:scaleX(1)}
    div[II].animate01:after{transform-origin:0%50%}
    div[III]:after {
      display:block;
      content: '';
      opacity: 0;
      border-bottom: solid 2px black;  
      transform: scaleX(0);  
      transition: opacity 350ms, transform 250ms ease-in-out;
    }
    div[III]:hover:after{opacity:1;transform:scaleX(1)}
    div[III].animate01:after{transform-origin:0%50%}
    div[I]{
        letter-spacing: 2.4q;
        position:fixed;
        color:black;
        box-shadow: inset 0 -2px black;
        cursor: pointer;
        left:70q;
        line-height:101q
    }
    div[II]{
        letter-spacing: 2.4q;
        position:fixed;
        color:black;
        cursor: pointer;
        left:170q;
        line-height:101q
    }
    div[III]{
        letter-spacing: 2.4q;
        position:fixed;
        color:black;
        cursor: pointer;
        left:310q;
        line-height:101q
    }
    i {
        font-style: normal;
        font-family: Ysabeau SC;
        position: absolute;
        font-size: 14px;
        left:420px;
        top: 80px;
        width: 10px;
        height: 2in;
    }

  /*-^-<¦:-]  J  [-:¦>-^-*/

  /*-^-<¦:-]  K  [-:¦>-^-*/

  /*-^-<¦:-]  L  [-:¦>-^-*/
  div[linkcard]{
    position: absolute;
    display: block;
    top:150px;
    left:60px;
    width: 400px;
    height: 160px;
    background:white;
    padding: 20px;
    border: 1px solid #d9d9d9;
    transition: 1s;
}
a[lis]{
    color: white !important;
    text-transform: uppercase !important;
    font-family: Ysabeau SC !important;
}
div[linkcard]:hover{
    box-shadow: 0 0 20px grey;
}
li[lis]{
    letter-spacing: 2.4q;
    color:black;
    font-size: 15px;
    font-family: Ysabeau SC;
    text-align: left;
    list-style-type: circle;
}
li[lisII]{
    letter-spacing: 2.4q;
    color:black;
    font-size: 15px;
    font-family: Ysabeau SC;
    text-align: left;
    list-style-type: square;
}
h1[lnks]{
    letter-spacing: 2.4q;
    color:black;
    font-size: medium;
    font-family: Ysabeau SC;
    text-align: center;
}
h1[lnkds]{
    letter-spacing: 2.4q;
    color:white;
    font-weight: 100;
    font-size: medium;
    font-family: Ysabeau SC;
    text-align: center;
}
a[lisd]{
    color: white !important;
    text-transform: uppercase !important;
    font-family: Ysabeau SC !important;
    cursor: pointer;
}
a[lisd]:active{
    color: lightgreen !important;
}
#left{
    text-align: left !important;
}
 
  /*-^-<¦:-]  M  [-:¦>-^-*/
  p[myright]{
    color:white;
    transition: 1s;
}
.movehoriz{
    left: 50px !important;
    transition: 1s;
}
@media screen and (max-width: 1200px){
    div[I],div[II],div[III],div[cover],div[coverII]{
        display: none;
    }
    div[pipe]{
        display: block !important;
    }
}
@media screen and (max-width: 1000px){
    div[footI]{
        position: absolute !important;
        margin-top: -60px !important;
        right: initial !important;
        left: 90px !important;
        transition: 1s !important;
    }
    div[footII]{
        position: absolute !important;
        margin-top: 150px !important;
        right: initial !important;
        left: 155px !important;
        transition: 1s !important;
    }
    div[footIII]{
        position: absolute !important;
        margin-top: 300px !important;
        right: initial !important;
        left: 83px !important;
        transition: 1s !important;
    }
    div[footbottomdiv]{
        color: transparent !important;
        transition: 1s !important;
    }
    div[settingcard]{
        left:25px !important;
        top:980px !important;
        transition: 1s !important;
    }
    div[linkcard]{
        left:25px !important;
        top:980px !important;
        transition: 1s !important;
    }
    div[downloadcard]{
        left:25px !important;
        top:980px !important;
        transition: 1s !important;
    }
    #calc{
        left: 50px !important;
    }
    #credits{
        left: 50px !important;
    }
}

  /*-^-<¦:-]  N  [-:¦>-^-*/
  .navip{
    font-size: 16px;
    color: #010101;
    display: inline;
    font-weight: 900;
    letter-spacing: 1px;
  }
  #navi{
    display:block;
    margin-top: -25;
    margin-left: -20;
    opacity: 0;
    height: 25px;
    font-size: 16px;
    width: 450px;
    transition: opacity 1s; 
    background-color: transparent;
  }
  #navi.fade{
    opacity: 1;
  }

  /*-^-<¦:-]  O  [-:¦>-^-*/

  /*-^-<¦:-]  P  [-:¦>-^-*/
  p{
    letter-spacing: 2.4q;
    color:white;
    font-size: small;
    font-family: Ysabeau SC;
    text-align: center;
}
div[pipe]{
    position: absolute;
    height: 35px;
    padding-bottom: 13px;
    left: 40px;
    cursor: pointer;
    top: 25px;
    border: 1px solid #d9d9d9;
    font-size: 30px;
    display: none;
    color:black;
    transform: rotate(-90deg);
}
a[p]{
    color:white;
    font-size: small;
}
a[pa]{
    cursor: pointer;
}
a[paa]{
    cursor: pointer;
    font-size: 15px;
    font-family: Ysabeau SC;
    letter-spacing: 2.4q;
}

  /*-^-<¦:-]  Q  [-:¦>-^-*/

  /*-^-<¦:-]  R  [-:¦>-^-*/

  /*-^-<¦:-]  S  [-:¦>-^-*/
  div[settingcard]{
    position: absolute;
    display: none;
    top:150px;
    left:60px;
    width: 400px;
    height: 160px;
    background-color: white;
    padding: 20px;
    border: 1px solid #d9d9d9;
    transition: 1s;
}
div[settingcard]:hover{
    box-shadow: 0 0 20px grey;
}

  /*-^-<¦:-]  T  [-:¦>-^-*/
  .Tabs{
    background: #010101;
    position: fixed;
    color: white;
    text-align: center;
    z-index: 99;
    top: 140px;
    left: -260px;
    width: 210px;
    height: 300px;
    padding-left: 20px;
    padding-right: 20px;
    transition: 1s;
}
textarea:focus, input:focus{
    outline: none;
}
table{
    width: 600px;
    height: 300px;
    margin-left: 70px;
    margin-top: 50px;
    color: white;
}
tr{
    opacity: 1;
}
td{
    border-left: lightblue 1px solid;
    padding-left: 4px;
}
  hr[tabshr]{
    width: 80%;
    color: white;
    margin-left: auto;
    margin-right: auto;
}

  /*-^-<¦:-]  U  [-:¦>-^-*/

  .underlined{
    text-decoration: underline;
  }

  /*-^-<¦:-]  V  [-:¦>-^-*/

  /*-^-<¦:-]  W  [-:¦>-^-*/
  ::-webkit-scrollbar {
    width: 10px;
}
 ::-webkit-scrollbar-track {
    background: transparent;
    border-left: solid 1px#d9d9d9;
}
  ::-webkit-scrollbar-thumb {
    background: black;
}
#webt{
    transition: 1s;
}

  /*-^-<¦:-]  X  [-:¦>-^-*/

  /*-^-<¦:-]  Y  [-:¦>-^-*/

  /*-^-<¦:-]  Z  [-:¦>-^-*/

  .zenon-g{
    background-image: linear-gradient(rgb(56, 171, 111), black) !important;
  }

  /*-^-<¦:-]  *  [-:¦>-^-*/
 *{
    margin:0;
}
 *::selection{
    text-decoration: underline;
}
::placeholder {
    color: white;
    opacity: 1;
  }