﻿*, *:after, *:before { -moz-box-sizing: border-box; box-sizing: border-box; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; text-rendering: optimizeLegibility; transition: all 0.2s; }

/* RESET CSS */
article,aside,details,figcaption,figure,footer,header,hgroup,img,menu,nav,section{display:block}a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font:inherit;vertical-align:baseline}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}table{border-collapse:collapse;border-spacing:0}img{margin:0 auto;padding:0} li { list-style: none; } a { color: inherit; } _:lang(x)::-ms-backdrop, .selector { padding-top: 2px; } .cf:before, .cf:after { content:""; display:table; } .cf:after { clear:both; } .cf { zoom:1; } * {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -ms-overflow-style:-ms-autohiding-scrollbar; } img { vertical-align: bottom; } a{ text-decoration: none; color: inherit; transition: 0.2s; } input[type="submit"] { -webkit-appearance: none; border-radius: 5px; }

html { font-size: 62.5%; }
body { font-size: 1.8rem; background: #3d9478; color: #3f3f3f; }
.login-wrap { width: 450px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);  padding: 40px; background: #fff; border-radius: 3px; -webkit-box-shadow: 0 2px 5px rgba(0,0,0,0.2); box-shadow: 0 2px 5px rgba(0,0,0,0.2); }
.login-wrap img { width: 60%; margin: 0 auto 20px; }
input[type=text],input[type=password] { width: 100%; background: #E5EBEB; border: none; border-radius: 3px; padding: 10px; font-size: 2rem; }
label { display: block; margin-bottom: 5px; }
input + label { margin-top: 15px; }
input[type=submit] { display: block; width: 100%; border: none; border-radius: 3px; background: #43A047; color: #fff; font-size: 2rem; padding: 10px; margin-top: 30px; -webkit-box-shadow: 0 3px 5px rgba(0,0,0,0.2); box-shadow: 0 3px 5px rgba(0,0,0,0.2); cursor: pointer;}
input[type=submit]:hover { background: #57bd5c; }

@media screen and (max-width:768px){
	.login-wrap { width: 95%; }
}