@charset "UTF-8";

.Btn1 {	
	font-size:14px;
	text-decoration:none;
	font:normal 18px "Courier New", Courier, monospace;
	font-style:normal;
	
	font-weight:bold;
	color:#fff;
	
	position:relative;	
	margin-top:8;
	height:50px;
	padding:10px 20px;
	padding-right:65px;
	
	background-color:#3bb3e0;	
	        background-image: linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
	     background-image: -o-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
	   background-image: -moz-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
	    background-image: -ms-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
	background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, rgb(44,160,202)),color-stop(1, rgb(62,184,229)));
	
	-webkit-border-radius: 5px;
	   -moz-border-radius: 5px;
		 -o-border-radius: 5px;
			border-radius: 5px;
			
	-webkit-box-shadow	: inset 0px 1px 0px #2ab7ec, 0px 5px 0px 0px #156785, 0px 1px 5px #999;
	   -moz-box-shadow	: inset 0px 1px 0px #2ab7ec, 0px 5px 0px 0px #156785, 0px 1px 5px #999;
	     -o-box-shadow	: inset 0px 1px 0px #2ab7ec, 0px 5px 0px 0px #156785, 0px 1px 5px #999;
			box-shadow	: inset 0px 1px 0px #2ab7ec, 0px 5px 0px 0px #156785, 0px 1px 5px #999;
			
	text-shadow			: 0px 0px 0 #0D0D0D,0px 1px 0 #0D0D0D,1px 1px 0 #0D0D0D,1px 2px 0 #171717,2px 2px 0 #171717,2px 3px 1px black,3px 3px 2px black,3px 3px 3px white;
	border:3px outset #ffffff;
}

.Btn1:active {
	font-weight:bold;
	top:1.5px;
	left:-1px;
	color:grey;
	color:#05f719;
	text-shadow			: 0px 0px 0 black,0px 1px 0 black,1px 1px 0 black,1px 2px 0 white,2px 2px 0 white,2px 3px 1px white,3px 3px 2px black,3px 3px 3px white,4px 4px 3px white;
	text-shadow			: 0px 0px 0 #0D0D0D,0px 1px 0 #0D0D0D,1px 1px 0 #0D0D0D,1px 2px 0 #171717,2px 2px 0 #171717,2px 3px 1px black,3px 3px 2px black,3px 3px 3px white;
	background-image: linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
	background-image: -o-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
	background-image: -moz-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
	background-image: -ms-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
	background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, rgb(62,184,229)),color-stop(1, rgb(44,160,202)));
	
	-webkit-box-shadow	: inset 0px 1px 0px #2ab7ec, 0px 2px 0px 0px #156785, 0px 5px 3px #999;
	-moz-box-shadow		: inset 0px 1px 0px #2ab7ec, 0px 2px 0px 0px #156785, 0px 5px 3px #999;
	-o-box-shadow		: inset 0px 1px 0px #2ab7ec, 0px 2px 0px 0px #156785, 0px 5px 3px #999;
	box-shadow			: inset 0px 1px 0px #2ab7ec, 0px 2px 0px 0px #156785, 0px 5px 3px #999;
}

.Btn1[add]::before {
	background-image:url(images/add.png) ;
}
.Btn1[ok]::before {
	background-image:url(images/btnok2.png) ;
}
.Btn1[del]::before {
	background-image:url(images/delete.png) ;
}
.Btn1[next]::before {
	background-image:url('images/btnnext.png');
}

.Btn1[del]:active {
	color:red;
}
.Btn1::before {
	/*background-color:#2591b4;	*/
	background-color:#197491;
	/*Ukuran Icon*/
	background-size: 25px 25px;
	/*Default Icon*/
	background-image:url(images/default.ico) ;
	
	background-repeat:no-repeat;
	background-position:center center;
	
	/*Container*/
	content:"";
	width:33px;
	height:33px;
	/*End Container*/
	
	position:absolute;
	right:15px;
	top:35%;
	margin-top:-9px;
	
	-webkit-border-radius	: 50%;
	-moz-border-radius		: 50%;
	-o-border-radius		: 50%;
	border-radius			: 50%;
	
	-webkit-box-shadow	: inset 0px 1px 0px #052756, 0px 1px 0px #60c9f0;
	-moz-box-shadow		: inset 0px 1px 0px #052756, 0px 1px 0px #60c9f0;
	-o-box-shadow		: inset 0px 1px 0px #052756, 0px 1px 0px #60c9f0;
	box-shadow			: inset 0px 1px 0px #052756, 0px 1px 0px #60c9f0;
}

.Btn1:active::before {
	top:40%;
	margin-top:-12px;
	-webkit-box-shadow	: inset 0px 1px 0px #60c9f0, 0px 3px 0px #0e3871, 0px 6px 3px #1a80a6;
	-moz-box-shadow		: inset 0px 1px 0px #60c9f0, 0px 3px 0px #0e3871, 0px 6px 3px #1a80a6;
	-o-box-shadow		: inset 0px 1px 0px #60c9f0, 0px 3px 0px #0e3871, 0px 6px 3px #1a80a6;
	box-shadow			: inset 0px 1px 0px #60c9f0, 0px 3px 0px #0e3871, 0px 6px 3px #1a80a6;
}
.SimpleButton {
	padding-left:13;
	padding-right:13;
	height:40px;
	border-radius: 5px; 
	background-color:#36454f;
	border: 2px solid White;
	box-shadow: 7px 5px 10px black; /*kanan,posisi,*/
	font-size:13px;
	text-shadow:0px 0px 0 rgb(225,225,225),
			1px 1px 3px blue,
			1px 1px 5px white;	
}

.i2StyleO{
	font:normal 18px "Courier New", Courier, monospace;
	font-style:normal;
	/*font:normal 15px "Lucida fax";*/
	font-weight:bold;


	color:#ffffff;
	background:#3a5da5;
	border:3px outset #ffffff;
	text-shadow:0px -1px 3px #000000;
	
			box-shadow:2px 2px 5px #000000;
	   -moz-box-shadow:2px 2px 5px #000000;
	-webkit-box-shadow:2px 2px 5px #000000;
	
			border-radius:10px;
	   -moz-border-radius:10px;
	-webkit-border-radius:10px;
	
	
	/*width:150px;*/
	white-space:nowrap;
	height:45;
	padding-right:50;
	padding-left:25;
	
	cursor:pointer;
	
	background-position-x: calc(100% - 15px);
	background-position-y: calc(100% - 8px);
	background-size: 25px;
	background-repeat:no-repeat;
	
	-webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: -moz-none;
    -o-user-select: none;
    user-select: none;	
	

}
.i2StyleO:active{
	cursor:pointer;
	position:relative;
	top:1.5px;
	left:-0.5px;
}

.i2StyleO[add] {
	background-image:url('images/add.png');	
}
.i2StyleO[ok] {
	background-image:url('images/add.png');	
}
.i2StyleO[search] {
	background-image:url('images/search.png');	
}
.i2StyleO[next] {
	background-image:url('images/btnnext.png');
}
.i2StyleO[backs] {
	background-image:url('images/Left.png');
	background-position-x: 15px;
	background-position-y: calc(100% - 5.75px);
	padding-right:25;
	padding-left:50;
}
.i2StyleO[nexts] {
	background-image:url('images/right.png');
	background-position-y: calc(100% - 5.75px);
}

.i2StyleO[close] {
	background-image:url('images/delete.png');
	background-position-y: calc(100% - 5px);
}
.i2StyleO[save] {
	background-size: 30px;
	background-image:url('images/btnok2.png');
	background-position-y: calc(100% - 4px);
}

.Btn1O {	
	font-size:14px;
	text-decoration:none;
	font:normal 18px "Courier New", Courier, monospace;
	font-style:normal;
	
	font-weight:bold;
	color:#fff;
	
	position:relative;	
	margin-top:-2;
	height:50px;
	
	width:60;
	
	background-color:#3bb3e0;	
	        background-image: linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
	     background-image: -o-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
	   background-image: -moz-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
	    background-image: -ms-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
	background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, rgb(44,160,202)),color-stop(1, rgb(62,184,229)));
	
	-webkit-border-radius: 5px;
	   -moz-border-radius: 5px;
		 -o-border-radius: 5px;
			border-radius: 5px;
			
	-webkit-box-shadow	: inset 0px 1px 0px #2ab7ec, 0px 5px 0px 0px #156785, 0px 1px 5px #999;
	   -moz-box-shadow	: inset 0px 1px 0px #2ab7ec, 0px 5px 0px 0px #156785, 0px 1px 5px #999;
	     -o-box-shadow	: inset 0px 1px 0px #2ab7ec, 0px 5px 0px 0px #156785, 0px 1px 5px #999;
			box-shadow	: inset 0px 1px 0px #2ab7ec, 0px 5px 0px 0px #156785, 0px 1px 5px #999;
			
	text-shadow			: 0px 0px 0 #0D0D0D,0px 1px 0 #0D0D0D,1px 1px 0 #0D0D0D,1px 2px 0 #171717,2px 2px 0 #171717,2px 3px 1px black,3px 3px 2px black,3px 3px 3px white;
	border:3px outset #ffffff;
}

.Btn1O:active {
	font-weight:bold;
	top:1.5px;
	left:-1px;
	color:grey;
	color:#05f719;
	text-shadow			: 0px 0px 0 black,0px 1px 0 black,1px 1px 0 black,1px 2px 0 white,2px 2px 0 white,2px 3px 1px white,3px 3px 2px black,3px 3px 3px white,4px 4px 3px white;
	text-shadow			: 0px 0px 0 #0D0D0D,0px 1px 0 #0D0D0D,1px 1px 0 #0D0D0D,1px 2px 0 #171717,2px 2px 0 #171717,2px 3px 1px black,3px 3px 2px black,3px 3px 3px white;
	background-image: linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
	background-image: -o-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
	background-image: -moz-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
	background-image: -ms-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
	background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, rgb(62,184,229)),color-stop(1, rgb(44,160,202)));
	
	-webkit-box-shadow	: inset 0px 1px 0px #2ab7ec, 0px 2px 0px 0px #156785, 0px 5px 3px #999;
	-moz-box-shadow		: inset 0px 1px 0px #2ab7ec, 0px 2px 0px 0px #156785, 0px 5px 3px #999;
	-o-box-shadow		: inset 0px 1px 0px #2ab7ec, 0px 2px 0px 0px #156785, 0px 5px 3px #999;
	box-shadow			: inset 0px 1px 0px #2ab7ec, 0px 2px 0px 0px #156785, 0px 5px 3px #999;
}

.Btn1O[add]::before {
	background-image:url(images/add.png) ;
}
.Btn1O[ok]::before {
	background-image:url(images/btnok2.png) ;
}
.Btn1O[del]::before {
	background-image:url(images/delete.png) ;
}
.Btn1O[edit]::before {
	background-image:url(images/edit.png) ;
	background-size: 28px 28px;
}
.Btn1O[del]:active {
	color:red;
}
.Btn1O::before {
	/*background-color:#2591b4;	*/
	background-color:#197491;
	/*Ukuran Icon*/
	background-size: 25px 25px;
	/*Default Icon*/
	background-image:url(images/default.ico) ;
	
	background-repeat:no-repeat;
	background-position:center center;
	
	/*Container*/
	content:"";
	width:33px;
	height:33px;
	/*End Container*/
	
	position:absolute;
	right:10px;
	top:35%;
	margin-top:-9px;
	
	-webkit-border-radius	: 50%;
	-moz-border-radius		: 50%;
	-o-border-radius		: 50%;
	border-radius			: 50%;
	
	-webkit-box-shadow	: inset 0px 1px 0px #052756, 0px 1px 0px #60c9f0;
	-moz-box-shadow		: inset 0px 1px 0px #052756, 0px 1px 0px #60c9f0;
	-o-box-shadow		: inset 0px 1px 0px #052756, 0px 1px 0px #60c9f0;
	box-shadow			: inset 0px 1px 0px #052756, 0px 1px 0px #60c9f0;
}

.Btn1O:active::before {
	top:40%;
	margin-top:-12px;
	-webkit-box-shadow	: inset 0px 1px 0px #60c9f0, 0px 3px 0px #0e3871, 0px 6px 3px #1a80a6;
	-moz-box-shadow		: inset 0px 1px 0px #60c9f0, 0px 3px 0px #0e3871, 0px 6px 3px #1a80a6;
	-o-box-shadow		: inset 0px 1px 0px #60c9f0, 0px 3px 0px #0e3871, 0px 6px 3px #1a80a6;
	box-shadow			: inset 0px 1px 0px #60c9f0, 0px 3px 0px #0e3871, 0px 6px 3px #1a80a6;
}

.i2Icon{
	background:#3a5da5;
	border:3px outset #ffffff;
	text-shadow:0px -1px 3px #000000;
	
			box-shadow:2px 2px 5px #000000;
	   -moz-box-shadow:2px 2px 5px #000000;
	-webkit-box-shadow:2px 2px 5px #000000;
	
			border-radius:10px;
	   -moz-border-radius:10px;
	-webkit-border-radius:10px;
	
	
	width:48px;
	height:45;
	
	
	cursor:pointer;
	
	background-position-x: calc(100% - 9px);
	background-position-y: calc(100% - 6.5px);
	background-size: 25px;
	background-repeat:no-repeat;
	
	-webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: -moz-none;
    -o-user-select: none;
    user-select: none;	
	

}
.i2Icon:active{
	cursor:pointer;
	position:relative;
	top:1.5px;
	left:-0.5px;
}

.i2Icon[add] {
	background-image:url('images/add.png');	
}
.i2Icon[search] {
	background-image:url('images/search.png');	
}
.i2Icon[next] {
	background-image:url('images/btnnext.png');
}
.i2Icon[close] {
	background-image:url('images/delete.png');	
}
.i2Icon[save] {
	background-image:url('images/btnok2.png');
}
.i2Icon[Edit] {
	background-image:url('images/edit.png');
		background-size: 30px;
	background-position-x: calc(100% - 6.5px);
	background-position-y: calc(100% - 4px);
}
.i2Icon[Edit2] {
	background-image:url('images/edit2.png');
		background-size: 30px;
	background-position-x: calc(100% - 6.5px);
	background-position-y: calc(100% - 4px);
}
.i2Icon[Edit3] {
	background-image:url('images/edit3.png');
		background-size: 30px;
	background-position-x: calc(100% - 6.5px);
	background-position-y: calc(100% - 4px);
}
.i2Icon[menu] {
	background-image:url('images/menu.png');
	background-size: 30px;
	background-position-x: calc(100% - 6.5px);
	background-position-y: calc(100% - 4px);
}
.i2Icon[download] {
	background-image:url('images/download.png');
	background-size: 30px;
	background-position-x: calc(100% - 6.5px);
	background-position-y: calc(100% - 4px);
}
.i2Icon[upload] {
	background-image:url('images/upload.png');
	background-size: 30px;
	background-position-x: calc(100% - 6.5px);
	background-position-y: calc(100% - 4px);