@font-face {
    font-family: 'Roboto';
    src: local('load/font/Roboto-Regular.ttf'),url('/load/font/Roboto-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

body{margin:0; padding:0; font-size:16px; color:#333; font-family: 'Roboto'; font-weight: 400;}

body{ background-color:#CCCCCC; background: url(images/sean-oulashin-KMn4VEeEPR8-unsplash.jpg) no-repeat center center fixed; background-size: cover;}

span[class*="fa-"], i[class*="fa-"], .fal, .fal:before, .far, .far:before, .fa, .fa:before {font-family:'Font Awesome 6 Pro'; font-weight:400; font-style:normal; font-variant:normal;}

/*-----------------------------*/

#wrapper {
    border: 0px solid #5f8386;
    text-align: center;
    width: 1150px;
    min-height: 150vh;
    border-style: hidden;
    border-radius: 10px;
    background-color: #F9F9F9;
    box-shadow: inset 0 0px 4px 0 rgb(21 21 21 / 77%), 0 4px 15px;
}


#content,#footer,#leftbar{ border:1px solid #DDDDDD; padding:15px; vertical-align:top}
#header{ border:1px solid #DDDDDD; background-color:#F9F9F9; border-radius: 10px 10px 0 0;}
#footer{ background-color:#38858B}
#leftbar{ background-color:#F9F9F9}
#content{
	/* [disabled]background-color:#FFFFFF; */
	padding-bottom: 100px;
}
/*-----------*/

.fa-fan, .fa-star-of-life {
	animation-name: rotation;
	animation-duration: 5s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}
@keyframes rotation {
	0% {
		transform:rotate(0deg);
	}
	100% {
		transform:rotate(360deg);
	}
}

.farub{ background-color:#c1eb85; border-radius:50%; width:25px; height:25px; line-height:25px; text-align:center; border:1px solid #777777;}
#rub{
	font-size: 12px;
    font-weight: bold;
    background-color: #C1EB85;
    padding: 2px 5px;
    border-radius: 5px;
    border: 1px solid #8e8e8e;
	}

/*-----------*/
.bons {
animation-duration: 5s;
animation-iteration-count: infinite;
animation-name: bons;
animation-timing-function: linear;
}
@keyframes bons {
	0%   { transform: translateX(0); }
	50%  { transform: translateX(-5px); }
	100% { transform: translateX(0); }
}

.bons2 {
animation-duration: 5s;
animation-iteration-count: infinite;
animation-name: bons2;
animation-timing-function: linear;
}
@keyframes bons2 {
	0%   { transform: translateX(0); }
	50%  { transform: translateX(5px); }
	100% { transform: translateX(0); }
}
   #blink {
  -webkit-animation: blink 2s linear infinite;
  animation: blink 1s linear infinite;
}
@-webkit-keyframes blink {
  100% { color: #fdd866; }
}
@keyframes blink {
  50% { color: rgb(254, 34, 34); }
}

#wrap {
    border: 0px solid #575757;
    width: 100%;
    margin: 10px auto;
	border-radius:10px;
}

#wrap .block {
    background-color: #F9F9F9;
    border: 1px solid #c6c6c6;
    text-align: center;
    width: 195px;
    margin-right: 4px;
    padding: 15px;
    display: inline-block;
    vertical-align: top;
	box-shadow: 5px 5px 5px -5px rgb(34 60 80 / 60%);
	border-radius:10px;
}

#wrap .block:hover{background-color:#ffffffe8;}
#wrap i{color:#ba3143;}

#wrap .val {
    background-color: #F1F1F1;
    color: #171717;
    height: 35px;
    line-height: 35px;
    border-radius: 5px;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: bold;
    border: 1px solid #cacaca;
	font-size:22px
}
#wrap .text { margin-top:10px; margin-bottom:3px; font-size:14px; text-transform:uppercase; font-weight:bold; color:#666666}
#wrap .val2{ font-size:12px}




.blocklinks {
	position: relative;
}

.buylink {
	position: absolute; right: -5px; top: -5px;
	text-decoration:none;
	text-align:center;
	width: 22px;height: 22px;	
	font-size:18px;font-weight: bold;
	padding: 1px;
	border-radius: 4px;
	border: rgba(255,255,255,0.1) 1px solid;
	background: #ba3143;
	color: #fff !important;
}
.buylink:hover {
	background: #91cb55;
	color: #fff !important;
}
.linklist {
	padding: 3px 2px;
	width: 20%;
}
.linklist a{
	display:block;
	color:#f1f1f1;
	text-decoration:none;
	line-height:35px;
	font-size:14px;
	font-weight:600;
	text-align:center;border-radius: 3px;
	border: #f1f1f1 1px solid;
	background:#007eff;
}

.linklist a:hover {
	color: #fff;
	border: #fff 1px solid;
}
.bylnklabel{
	display:block;
	width:100px;
	margin:0 auto;
	text-align:center;
	background: #669966;
	color:#ffffff;
	line-height:26px;
  border-radius: 10px;
}
.lnkrools{
	display:block;
	color:#666666;
	padding:10px;
}

   .knokfoot {
       position: relative;vertical-align: bottom;
       bottom: -0px;
       clear: both;
   }
   .knokfoot a{
       display: inline-block !important;
   }