/* Scoped copy of appgrade_02.css. */
/* CSS Document */

:where(.appgrade){
	text-align: center;
	margin: 0px;
}
:where(.appgrade) a:link{
	-webkit-transition: all 0.2s ease 0s;
	-moz-transition: all 0.2s ease 0s;
	-ms-transition: all 0.2s ease 0s;
	-o-transition: all 0.2s ease 0s;
	transition: all 0.2s ease 0s;
	color: #fff;
	text-decoration: none;
}
:where(.appgrade) a:visited{
	color: #ffffff;
}
:where(.appgrade) a:hover{
	color: #1AAFA8;
}

/* width */
:where(.appgrade) ::-webkit-scrollbar{
	width: 8px;
	height: 15px;
}
/* Track */
:where(.appgrade) ::-webkit-scrollbar-track{
	box-shadow: inset 1px 0px 5px rgb(155, 181, 204);
	border-radius:2px;

}
/* Handle */
:where(.appgrade) ::-webkit-scrollbar-thumb{
	background: rgb(255, 218, 53);
	border-radius:20px;
	width:80px;
	height:12px;
}
/* Handle on hover */
:where(.appgrade) ::-webkit-scrollbar-thumb:hover{
	background: rgb(255, 0, 234);
	cursor: pointer;
	width:10px;
}

:where(.appgrade) .chbgred,.chbgred:where(.appgrade){transition:0.2s}
:where(.appgrade) .chbgred: hover{ background-color:red}


:where(.appgrade) .button_green,.button_green:where(.appgrade){
	transition:0.3s;
	padding:5px;
	width:160px;  
	height:30px; 
	background-color:limegreen; 
	border-radius:20px;
	}

:where(.appgrade) .button_green:hover{
	cursor: pointer;
	transform: scale(1.2);	
}

:where(.appgrade) .circle button{
position:relative;
width:100px;
height:100px; 	
}

:where(.appgrade) .mv,.mv:where(.appgrade){}
:where(.appgrade) .mv:hover{cursor:move;}

:where(.appgrade) .hv,.hv:where(.appgrade){}
:where(.appgrade) .hv:hover{cursor:pointer;}

:where(.appgrade) .hvwg,.hvwg:where(.appgrade){color: white!important;}
:where(.appgrade) .hvwg:hover{color: rgb(90, 206, 23)!important;}

:where(.appgrade) .hvby,.hvby:where(.appgrade){color:rgb(108, 203, 206)!important;}
:where(.appgrade) .hvby:hover{color: rgb(90, 206, 23)!important;}


:where(.appgrade) .bo,.bo:where(.appgrade){background-color: orange;}
:where(.appgrade) .bb,.bb:where(.appgrade){background-color: black;}
:where(.appgrade) .bg,.bg:where(.appgrade){background-color: green;}
:where(.appgrade) .blg,.blg:where(.appgrade){background-color:limegreen;}
:where(.appgrade) .bw,.bw:where(.appgrade){background-color: white;}
:where(.appgrade) .br,.br:where(.appgrade){background-color: red;}

:where(.appgrade) .bgg,.bgg:where(.appgrade){
	background-image: url(http://standsbg.gr/pics/large/0012.jpg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	height:100%;
}
/* 2.MOVE */
:where(.appgrade) .ty1,.ty1:where(.appgrade),:where(.appgrade) .ty2,.ty2:where(.appgrade),:where(.appgrade) .tyr1,.tyr1:where(.appgrade),:where(.appgrade) .tyr2,.tyr2:where(.appgrade){
	cursor: pointer;
	transition: 0.5s;
}
:where(.appgrade) .ty1:hover{
	transform: translateY(-5px);
}
:where(.appgrade) .ty2:hover{
	transform: translateY(-10px);
}
:where(.appgrade) .tyr1:hover{
	transform: translateY(5px);
}
:where(.appgrade) .tyr2:hover{
	transform: translateY(10px);
}
:where(.appgrade) .tx1,.tx1:where(.appgrade),:where(.appgrade) .tx2,.tx2:where(.appgrade){
	cursor: pointer;
	transition: 0.5s;
}
:where(.appgrade) .tx1:hover{
	transform: translateX(5px);
}
:where(.appgrade) .tx2:hover{
	transform: translateX(10px);
}
/* 3.BOXES */
:where(.appgrade) .b0,.b0:where(.appgrade){
	filter:drop-shadow(0 0 5px #999);
	position:relative;
	display:inline-block;
	width:300px;
	height:300px;
	background-color: rgba(230,250,230,0.9);
	line-height:150%;
	margin:auto;

}
:where(.appgrade) .b1,.b1:where(.appgrade){
	filter:drop-shadow(0 0 5px #999);
	position:relative;
	display:inline-block;
	width:300px;
	height:300px;
	background-color: rgba(230,250,230,0.9);
	padding:20px;
	line-height:150%;
	border-radius:10px;
	border-style: solid;
	border-width:2px;
	border-color:#999;
	margin:auto;
}
/* 4.CORNERS */
:where(.appgrade) .r1,.r1:where(.appgrade){
	border-radius:5px;
}
:where(.appgrade) .r2,.r2:where(.appgrade){
	border-radius:10px;
}
:where(.appgrade) .r3,.r3:where(.appgrade){
	border-radius:15px;
}
/* 5.FONTS */
:where(.appgrade) .fu,.fu:where(.appgrade){
	font-family: "Ubuntu", sans-serif;
}
:where(.appgrade) .fr,.fr:where(.appgrade){
	font-family: "Roboto", sans-serif;
}
:where(.appgrade) .fc,.fc:where(.appgrade){
	font-family: "Tinos", serif;
}
:where(.appgrade) .fd,.fd:where(.appgrade){
	font-family: "Didact Gothic", sans-serif;
}
:where(.appgrade) .fm,.fm:where(.appgrade){
	font-family: "Fira Sans Condensed", sans-serif;
}
:where(.appgrade) .fs,.fs:where(.appgrade){
	font-family: "Sofia Sans Extra Condensed", sans-serif;
}
:where(.appgrade) .s1,.s1:where(.appgrade){
	font-size: 1pt;
}
:where(.appgrade) .s2,.s2:where(.appgrade){
	font-size: 2pt;
}
:where(.appgrade) .s4,.s4:where(.appgrade){
	font-size: 4pt;
}
:where(.appgrade) .s3,.s3:where(.appgrade){
	font-size: 3pt;
}
:where(.appgrade) .s5,.s5:where(.appgrade){
	font-size: 6pt;
}
:where(.appgrade) .s6,.s6:where(.appgrade){
	font-size: 6pt;
}
:where(.appgrade) .s7,.s7:where(.appgrade){
	font-size: 7pt;
}
:where(.appgrade) .s8,.s8:where(.appgrade){
	font-size: 8pt;
}
:where(.appgrade) .s9,.s9:where(.appgrade){
	font-size: 9pt;
}
:where(.appgrade) .s10,.s10:where(.appgrade){
	font-size: 10pt;
}
:where(.appgrade) .s11,.s11:where(.appgrade){
	font-size: 11pt;
}
:where(.appgrade) .s12,.s12:where(.appgrade){
	font-size: 12pt;
}
:where(.appgrade) .s13,.s13:where(.appgrade){
	font-size: 13pt;
}
:where(.appgrade) .s14,.s14:where(.appgrade){
	font-size: 14pt;
}
:where(.appgrade) .s15,.s15:where(.appgrade){
	font-size: 15pt;
}
:where(.appgrade) .s16,.s16:where(.appgrade){
	font-size: 16pt;
}
:where(.appgrade) .s17,.s17:where(.appgrade){
	font-size: 17pt;
}
:where(.appgrade) .s18,.s18:where(.appgrade){
	font-size: 18pt;
}
:where(.appgrade) .s19,.s19:where(.appgrade){
	font-size: 19pt;
}
:where(.appgrade) .s20,.s20:where(.appgrade){
	font-size: 20pt;
}
:where(.appgrade) .s21,.s21:where(.appgrade){
	font-size: 21pt;
}
:where(.appgrade) .s22,.s22:where(.appgrade){
	font-size: 22pt;
}
:where(.appgrade) .s23,.s23:where(.appgrade){
	font-size: 23pt;
}
:where(.appgrade) .s24,.s24:where(.appgrade){
	font-size: 24pt;
}
:where(.appgrade) .s25,.s25:where(.appgrade){
	font-size: 25pt;
}
:where(.appgrade) .s26,.s26:where(.appgrade){
	font-size: 26pt;
}
:where(.appgrade) .s27,.s27:where(.appgrade){
	font-size: 27pt;
}
:where(.appgrade) .s28,.s28:where(.appgrade){
	font-size: 28pt;
}
:where(.appgrade) .s29,.s29:where(.appgrade){
	font-size: 29pt;
}
:where(.appgrade) .s35,.s35:where(.appgrade){
	font-size: 35pt;
}
:where(.appgrade) .s30,.s30:where(.appgrade){
	font-size: 30pt;
}
:where(.appgrade) .s40,.s40:where(.appgrade){
	font-size: 40pt;
}
:where(.appgrade) .s50,.s50:where(.appgrade){
	font-size: 50pt;
}
:where(.appgrade) .cw,.cw:where(.appgrade){
	color: #fff;
}
:where(.appgrade) .cb,.cb:where(.appgrade){
	color: #000;
}
:where(.appgrade) .cg,.cg:where(.appgrade){
	color: #888;
}
:where(.appgrade) .cdg,.cdg:where(.appgrade){
	color: #333;
}
:where(.appgrade) .clg,.clg:where(.appgrade){
	color: #bbb;
}
:where(.appgrade) .c1,.c1:where(.appgrade){
	color:red;
}
:where(.appgrade) .c2,.c2:where(.appgrade){
	color: crimson;
}
:where(.appgrade) .c3,.c3:where(.appgrade){
	color:greenyellow;
}
:where(.appgrade) .c4,.c4:where(.appgrade){
	color:darkturquoise;
}

:where(.appgrade) .b,.b:where(.appgrade){
	font-weight:bold;
}

/* 6.SCALES */
:where(.appgrade) .sc-1,.sc-1:where(.appgrade){
	transition: 1s;
}
:where(.appgrade) .sc-1:hover{
	cursor:pointer;
	transform: scale(0.95);
}

:where(.appgrade) .sc-1,.sc-1:where(.appgrade){
	transition: 0.5s;
}
:where(.appgrade) .sc-1:hover{
	cursor:pointer;
	transform: scale(0.95);
}

:where(.appgrade) .sc1,.sc1:where(.appgrade){
	transition: 0.5s;
}
:where(.appgrade) .sc1:hover{
	cursor:pointer;
	transform: scale(1.05);
}
:where(.appgrade) .sc2,.sc2:where(.appgrade){
	transition: 0.5s;
}
:where(.appgrade) .sc2:hover{
	cursor:pointer;
	transform: scale(1.10);
}
:where(.appgrade) .sc3,.sc3:where(.appgrade){
	transition: 0.5s;
}
:where(.appgrade) .sc3:hover{
	cursor:pointer;
	transform: scale(1.15);
}
:where(.appgrade) .sc4,.sc4:where(.appgrade){
	transition: 0.5s;
}
:where(.appgrade) .sc4:hover{
	cursor:pointer;
	transform: scale(1.20);
}
:where(.appgrade) .sc5,.sc5:where(.appgrade){
	transition: 0.5s;
}
:where(.appgrade) .sc5:hover{
	cursor:pointer;
	transform: scale(1.25);
}
:where(.appgrade) .sc6,.sc6:where(.appgrade){
	transition: 0.5s;
}
:where(.appgrade) .sc6:hover{
	cursor:pointer;
	transform: scale(1.25);
}
:where(.appgrade) .sc7,.sc7:where(.appgrade){
	transition: 0.5s;
}
:where(.appgrade) .sc7:hover{
	cursor:pointer;
	transform: scale(1.5);
}
:where(.appgrade) .sc8,.sc8:where(.appgrade){
	transition: 0.5s;
}
:where(.appgrade) .sc8:hover{
	cursor:pointer;
	transform: scale(1.75);
}
:where(.appgrade) .sc9,.sc9:where(.appgrade){
	transition: 0.5s;
}
:where(.appgrade) .sc9:hover{
	cursor:pointer;
	transform: scale(2);
}
:where(.appgrade) .sc10,.sc10:where(.appgrade){
	transition: 0.5s;
}
:where(.appgrade) .sc10:hover{
	cursor:pointer;
	transform: scale(2.5);
}
:where(.appgrade) .sc11,.sc11:where(.appgrade){
	transition: 0.5s;
}
:where(.appgrade) .sc11:hover{
	cursor:pointer;
	transform: scale(3)
}
:where(.appgrade) .sc12,.sc12:where(.appgrade){
	transition: 0.5s;
}
:where(.appgrade) .sc12:hover{
	cursor:pointer;
	transform: scale(4)
}
:where(.appgrade) .sc13,.sc13:where(.appgrade){
	transition: 0.5s;
}
:where(.appgrade) .sc13:hover{
	cursor:pointer;
	transform: scale(5)
}
:where(.appgrade) .sc14,.sc14:where(.appgrade){
	transition: 0.5s;
}
:where(.appgrade) .sc14:hover{
	cursor:pointer;
	transform: scale(6)
}
:where(.appgrade) .sc15,.sc15:where(.appgrade){
	transition: 0.5s;
}
:where(.appgrade) .sc15:hover{
	cursor:pointer;
	transform: scale(7)
}
:where(.appgrade) .sc100,.sc100:where(.appgrade){
	transition: 0.5s;
}
:where(.appgrade) .sc100:hover{
	cursor:pointer;
	transform: scale(10);
	opacity:0;
}
:where(.appgrade) .scc,.scc:where(.appgrade){transition:0.5s;}
:where(.appgrade) .scc:hover{
	position:absolute;
	cursor: pointer;
	transition:0.5s;
	transform: scale(2)translate(-25%, -15%);

}

/* 7.SEPARATORS */
:where(.appgrade) .sh,.sh:where(.appgrade){
	width:100%;
	position: relative;
	height:1px;
	background-color: #aaa;
	margin-top:10px;
	margin-bottom:10px;
}
:where(.appgrade) .sv,.sv:where(.appgrade){
	/*filter:drop-shadow(6px 6px 1px #aaa);*/
	position:relative;
	display:inline-block;
	width:1px;
	top:5px;
	height:25px;
	user-select:none;
	background-color:#aaa;
	transform:scale(1);
	margin-left:20px;
	margin-right:20px;
}
/* 8.BULLETS */
:where(.appgrade) .bl1,.bl1:where(.appgrade),:where(.appgrade) .bl2,.bl2:where(.appgrade),:where(.appgrade) .bl3,.bl3:where(.appgrade),:where(.appgrade) .bl4,.bl4:where(.appgrade){
	position: relative;
	display: inline-block;
	margin-left: 10px;
	margin-right: 10px;
	border-radius: 6px;
	vertical-align:4px;
	background-color:#999;
}
:where(.appgrade) .bl1,.bl1:where(.appgrade){
	width: 4px;
	height: 4px;
}
:where(.appgrade) .bl2,.bl2:where(.appgrade){
	width: 6px;
	height: 6px;
}
:where(.appgrade) .bl3,.bl3:where(.appgrade){
	width: 8px;
	height: 8px;
}
:where(.appgrade) .bl4,.bl4:where(.appgrade){
	width: 10px;
	height: 10px;
}
:where(.appgrade) .inv,.inv:where(.appgrade){
	visibility: hidden;
}
:where(.appgrade) .vis,.vis:where(.appgrade){
	visibility: visible;
}
:where(.appgrade) .abs,.abs:where(.appgrade){
	position:absolute;
}
:where(.appgrade) .rel,.rel:where(.appgrade){
	position:relative;
}
:where(.appgrade) .center,.center:where(.appgrade){
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
:where(.appgrade) .centerx,.centerx:where(.appgrade){
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
:where(.appgrade) .centery,.centery:where(.appgrade){
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

:where(.appgrade) .center_sc,.center_sc:where(.appgrade){
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: 0.5s; 
}

:where(.appgrade) .center_sc:hover{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)scale(1.2);
  cursor:pointer;
}

:where(.appgrade) .hov,.hov:where(.appgrade){
	cursor: pointer;
}
:where(.appgrade) .rt,.rt:where(.appgrade){
	transition: 0.5s;
}
:where(.appgrade) .rt:hover{
	cursor:pointer;
	transform: scale(1.05)rotate(180deg);
}

:where(.appgrade) .rt360,.rt360:where(.appgrade){
	transition: 0.5s;
}
:where(.appgrade) .rt360:hover{
	cursor:pointer;
	transform: scale(2)rotate(360deg);
	margin-top:20px;
	opacity:0.8;
}

@keyframes vibrator {
	0% {
		transform: scale(1);
	}
	25%{
		transform: scale(1.005);
	}
	50% {
		transform: scale(1);
	}
	75% {
	transform: scale(0.995);
	}
	100% {
	transform: scale(1);
	}
}	
:where(.appgrade) .vibrator,.vibrator:where(.appgrade){
	animation-name: vibrator;
	animation-duration: 0.8s;
	animation-iteration-count: infinite;	
	animation-timing-function: linear;
}	


@keyframes slider {
	0% {
		transform: translateX(0px);
	}
	30%{
		transform: translateX(0px);
	}
	75% {
		transform: translateX(-130px);
	}
	100% {
		transform: translateX(0px);
	}
}	
:where(.appgrade) .slider,.slider:where(.appgrade){
	animation-name: slider;
	animation-duration: 5s;
	animation-iteration-count: infinite;		
}	
:where(.appgrade) .scale150,.scale150:where(.appgrade){
	transition:  0.7s;
	}
:where(.appgrade) .scale150:hover{
	transform: rotate(360deg)scale(1.4);
	}
:where(.appgrade) .pad1,.pad1:where(.appgrade){
	/* background-color:#222;
	*/
	text-align: left;
	text-decoration: none;
	text-indent: 0px;
	line-height: 185%;
	padding-top: 10px;
	padding-right: 20%;
	padding-bottom: 50px;
	padding-left: 20%;
	font-weight: normal;
}
:where(.appgrade) .pad1_mob,.pad1_mob:where(.appgrade){
	/* background-color:#222;
	*/
	text-align: left;
	text-decoration: none;
	text-indent: 0px;
	line-height: 170%;
	padding-top: 20px;
	padding-right: 6%;
	padding-bottom: 10px;
	padding-left: 6%;
	font-weight: normal;
}
:where(.appgrade) .pad2,.pad2:where(.appgrade){
	/* background-color:#222;
	*/
	text-decoration: none;
	text-indent: 0px;
	line-height: 165%;
	padding-top: 20px;
	padding-right: 20px;
	padding-bottom: 20px;
	padding-left: 20px;
	font-weight: normal;
}



:where(.appgrade) .loader,.loader:where(.appgrade),:where(.appgrade) .loader:before,:where(.appgrade) .loader:after{
  background: #ffffff;
  -webkit-animation: load1 1s infinite ease-in-out;
  animation: load1 1s infinite ease-in-out;
  width: 1em;
  height: 4em;
}
:where(.appgrade) .loader,.loader:where(.appgrade){
  color: #ffffff;
  text-indent: -9999em;
  margin: 88px auto;
  position: relative;
  font-size: 11px;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}
:where(.appgrade) .loader:before,:where(.appgrade) .loader:after{
  position: absolute;
  top: 0;
  content: "";
}
:where(.appgrade) .loader:before{
  left: -1.5em;
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
:where(.appgrade) .loader:after{
  left: 1.5em;
}
@-webkit-keyframes load1 {
  0%,
  80%,
  100% {
    box-shadow: 0 0;
    height: 4em;
  }
  40% {
    box-shadow: 0 -2em;
    height: 5em;
  }
}
@keyframes load1 {
  0%,
  80%,
  100% {
    box-shadow: 0 0;
    height: 4em;
  }
  40% {
    box-shadow: 0 -2em;
    height: 5em;
  }
}