*{
	margin:auto;
}

@font-face{
	font-family:font1;
	src:url(../font/Questrial-Regular.ttf);
}
@font-face{
	font-family:font2;
	src:url(../font/JosefinSans-Regular.ttf);
}

body{
	font-family:font1;
	font-size:13px;
	color:#474747;
	background:#094d8c;
	background: linear-gradient(150deg, rgba(9,77,140,1) 10%,rgba(41,184,149,1) 90%);
	background-size:cover;
}

#result{
	position:absolute;
	bottom:60px;
	display:block;
	z-index:99;
	text-align: center;
	color:#474747;
}
.resultFailed{
	width: 100%;
	padding: 8px 15px 10px;
	font-size: 13px;
	line-height: 20px;
	background: #cddc39;
	border-radius: 2px;
}

/* LOGO */
.iconlogo{
	margin:20px 0 120px;
	width:250px;
	height:auto;
}


/* PAGE */
#page{
	margin:auto;
	width:850px;
}

#content{
	width:100%;
	height:100vh;
}


/* LEFT */
#left{
	position:relative;
	float:left;
	z-index:999;
	margin-top: 60px;
	width:500px;
}
#leftfill{
	position:relative;
	left:0;
	z-index:999;
	height:400px;
	padding:50px 0 50px;
	text-align:center;
	color:#474747;
	background:url(../images/background.png) no-repeat #fff;
	background-size: 100% auto;
	border-radius:2px 0 0 2px;
}
#leftfill h3{
	font-size: 14px;
	font-family:font2;
	letter-spacing: 1px;
	text-transform: uppercase;
}
#leftfill h1{
	margin-bottom:40px;
	line-height:50px;
	font-family:font2;
	font-size:24px;
	color:#999;
}
#leftfill i{
	font-size:14px;
	font-weight: bold;
}


/* RIGHT */
#right{
	position:relative;
	float:right;
	z-index:99;
	margin-top: 60px;
	width:300px;
	height: 500px;
	padding-right: 50px;
	background: #fff;
	border-radius:0 2px 2px 0;
}

#loginbox{
	margin:auto;
	padding-top:10px;
	width:280px;
}
.title{
	margin:50px 0 10px;
	font-family:font2;
	font-size:24px;
	font-weight:bold;
	text-align:center;
	color:#474747;
}
#boxform{
	margin:auto;
	padding:5px 0;
}
.boxicon{
	float:left;
	width:20px;
	height:20px;
	padding:7px 10px 10px 7px;
	background:#094d8c;
	border-radius:2px 0 0 2px;
}
.bottomlogin{
	margin-top:20px;
	width:250px;
}

.imglog{
	width:24px;
	height:24px;
}


div.loginSelect{
	width:240px;
	padding:0 0 1px;
	background:#e0e0e0;
	border:1px solid #e0e0e0;
	border-radius:0 2px 2px 0;
}
div.loginSelect:focus{
	border:1px solid #c0c0c0;
}


/*FORM LOGIN*/
.formLogin input{
	width:224px;
	padding:10px 8px 8px;
	font-family:font1;
	font-size:14px;
	color:#747474;
	background:#e0e0e0;
	border:1px solid #e0e0e0;
	border-radius:0 2px 2px 0;
    transition:all 0.3s Ease;
	-webkit-transition:all 0.3s Ease;
}
.formLogin input::placeholder{
	color:#474747;
}
.formLogin input:focus{
	background:#fff;
	border:1px solid #c0c0c0;
}

select{
	display:inline-block;
	margin:0;
	width:242px;
	padding:10px 4px 9px;
	font-family:font1;
	color:#747474;
	background:#e0e0e0;
	border:1px solid #e0e0e0;
	border-radius:0 2px 2px 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-appearance: none;
	-moz-appearance: none;
}

select.minimal {
  background-image:
    linear-gradient(45deg, transparent 50%, gray 50%),
    linear-gradient(135deg, gray 50%, transparent 50%);
  background-position:
    calc(100% - 15px) calc(1em + 2px),
    calc(100% - 10px) calc(1em + 2px),
    calc(100% - 2.5em) 0.5em;
  background-size:
    5px 5px,
    5px 5px,
    1px 1.5em;
  background-repeat: no-repeat;
}

select.minimal:focus {
  background-image:
    linear-gradient(45deg, gray 50%, transparent 50%),
    linear-gradient(135deg, transparent 50%, gray 50%);
  background-position:
    calc(100% - 10px) calc(1em + 2px),
    calc(100% - 15px) calc(1em + 2px),
    calc(100% - 2.5em) 0.5em;
  background-size:
    5px 5px,
    5px 5px,
    1px 1.5em;
  background-repeat: no-repeat;
	background-color:#fff;
	border:1px solid #c0c0c0;
  outline: 0;
}
option{
	padding:4px 6px 8px;
	font-family:"Verdana";
	border-bottom:1px solid #aaa;
}

#tombol{
	display			: inline-block;
	margin-top 		: 10px;
	width			: 279px;
	padding 		: 12px 0;
	font-family     : font2;
	font-size		: 13px;
	font-weight     : bold;
	letter-spacing 	: 1px;
	text-align		: center;
	text-decoration	: none;
	color			: #fff;
	background		: #094d8c;
	border			: none;
	border-radius   : 2px;
	cursor			: pointer;
}