html {
  scroll-behavior: smooth;
}

/* scroll bar */
/* width */
::-webkit-scrollbar {
  background: black;
  width: 14px;
}

/* Track */
::-webkit-scrollbar-track {
  border: 4px solid black;
  border-radius: 20px;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: -webkit-linear-gradient( rgba(248,171,72,1) 0%, rgba(255,219,69,1) 100%);
  border: 4px solid black;
  border-radius: 20px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #b88a40;
}

body{
	background-color: black;
}


.large-header {
  background-image: url('assets/Space.jpg');
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  border: none;
  border-top-left-radius:20px;
  border-top-right-radius:20px;
  border-bottom-left-radius:20px;
  border-bottom-right-radius:20px;
  position: relative;
  width: 100%;
  overflow: hidden;
  z-index: 1;
}


.a1 {
    position: absolute;
    direction: rtl;
	margin: 0;
	padding: 0;
	top: 40%;
	left: 78%;
	-webkit-transform: translate3d(-50%,-50%,0);
	transform: translate3d(-50%,-50%,0);
	color:white;
	font-family: iransansx;
    font-size:30px;
    width:400px;
    font-weight: bold;
    cursor: context-menu;
}

.a1-en {
    font-family: pf;
    background: -webkit-linear-gradient( rgba(248,171,72,1) 0%, rgba(255,219,69,1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.a2 {
    position: absolute;
    direction: rtl;
	margin: 0;
	padding: 0;
	top: 46%;
	left: 78%;
	-webkit-transform: translate3d(-50%,-50%,0);
	transform: translate3d(-50%,-50%,0);
	color: #b6b6b6;
	font-family: iransansx;
    font-size: 18px;
    width:400px;
    height: 28px;
    line-height: 0.7cm;
    cursor: context-menu;
}

.a-img {
    position: absolute;
	margin: 0;
	padding: 00;
	top: 50%;
	left: 20%;
	-webkit-transform: translate3d(-50%,-50%,0);
	transform: translate3d(-50%,-50%,0);
    cursor: context-menu;
    animation-name: img-index;
    animation-duration: 4s;
    animation-iteration-count: 1000000;
}

@keyframes img-index {
  0%   {left:20%; top:50%;}
  25%   {left:20%; top:51%;}
  50%   {left:20%; top:50%;}
  75%   {left:20%; top:52%;}
  100%   {left:20%; top:50%;}
}

/* index button */
.buttonA {
    position: absolute;

	-webkit-transform: translate3d(-50%,-50%,0);
	transform: translate3d(-50%,-50%,0);

    width: 180px;
    height: 40px;
    color: white;
    padding: 5px 5px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 20px;
    transition-duration: 0.6s;
    cursor: pointer;
    font-family: iransansx;
    border: auto;
    border-top-left-radius:35px;
    border-top-right-radius:35px;
    border-bottom-left-radius:35px;
    border-bottom-right-radius:35px;
}

/* index button vpn*/
.button1 {
    top: 57%;
	left: 87%;
    background: transparent;
    border: 2px solid #55fc00;
    color: #55fc00;
}
.button1:hover {
    background: linear-gradient(90deg, rgba(85,252,0,1) 0%, rgba(115,154,0,1) 100%);
    border: none;
    color: white;
}

/* index button dns*/
.button2 {
    top: 57%;
	left: 73%;
    background: transparent;
    border: 2px solid #d22f2f;
    color: #d22f2f;
}
.button2:hover {
    background: linear-gradient(90deg, rgba(154,111,46,1) 0%, rgba(210,47,47,1) 100%);
    border: none;
    color: #efefef;
}

/* index button proxy*/
.button3 {
    top: 65%;
	left: 87%;
    background: transparent;
    border: 2px solid #00b9ff;
    color: #00b9ff;
}
.button3:hover {
    background: linear-gradient(90deg, rgba(0,185,255,1) 0%, rgba(81,108,255,1) 100%);
    border: none;
    color: #efefef;
}

/* index button store*/
.button4 {
    top: 65%;
	left: 73%;
    background: transparent;
    border: 2px solid #d555ff;
    color: #d555ff;
}
.button4:hover {
    background: linear-gradient(90deg, rgba(252,0,255,1) 0%, rgba(152,0,156,1) 100%);
    border: none;
    color: #efefef;
}

/* index button cf ip*/
.button5 {
    top: 73%;
	left: 80%;
	width : 370px;
    background: transparent;
    border: 2px solid #f28a00;
    color: #f28a00;
}
.button5:hover {
    background: linear-gradient(90deg, rgba(154,111,46,1) 0%, rgba(242,138,0,1) 100%);
    border: none;
    color: #efefef;
}