/* html5doctor.com Reset v1.6.1 - http://cssreset.com */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}nav ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}ins{background-color:#ff9;color:#000;text-decoration:none}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}

body {
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
	background-color: #fff;
	/*overflow-y: none;*/
}

h1 { font-size: 2em; font-weight: 700; margin: 20px 0 20px 0; white-space: nowrap; }
h2 { font-size: 1.5em; font-weight: 700; margin: 20px 0 20px 0; white-space: nowrap; }
h3 { font-size: 1.25em; font-weight: 700; margin: 20px 0 20px 0; white-space: nowrap; }

header { position: relative; width: 100%; height: 70px; background-color: #414141; /*box-shadow: 10px 10px 5px #888888;*/ }
header div:nth-child(1) { position: absolute; top: 0; left:  0; width: 40%; height: 70px; background-color: inherit; color: #ffffff; }
header div:nth-child(2) { position: absolute; top: 0; right:  0; width: 60%; height: 70px; background-color: transparent; color: #ffffff; }

div.container { position: relative; width: calc(100% - 500px); max-width: 500px; margin: 30px auto; padding: 10px; background-color: #f2f2f3; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3); }

div.login { padding: 12px 15px; min-height: 335px; position: relative; border: 1px solid #d3d3d3; border-radius: 5px; text-align: center; background-color: #fff; }
div.login form {  }
div.login form hr { box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3); margin-bottom: 30px; }
div.login input[type=text], div.login input[type=password] { width: 100%; color: #000; outline: 0 none; padding: 5px 0px 5px 5px; box-sizing:border-box; -moz-box-sizing:border-box; }
div.login button {
	color: #fff;
    background-color: #4289b3;
    border-color: #307ca9 #307ca9 #1f506d;
    padding: 5px 15px 5px 15px;
    /*text-shadow: 1px 1px 1px #333;*/
	text-shadow: 0 -1px #006382;
    font-weight: bold;
    box-shadow: 1px 1px 1px #d3d3d3;
    -webkit-box-shadow:1px 1px 1px #d3d3d3;
    -moz-box-shadow:1px 1px 1px #d3d3d3;
}
div.login table { width: 95%; }
div.login table tr td { padding: 10px 5px; color: #555; }
div.login table tr td:nth-child(1) { text-align: right; vertical-align: middle; }
div.login table tr td:nth-child(2) { text-align: left; }

@media (max-width: 959px) {
  div.container { position: relative; width: 85%; margin: 30px auto; }
  header div:nth-child(1) { width: 50%; }
  header div:nth-child(2) { width: 50%; }
  h1 { font-size: 1.4em; }
  /* prevent phone zoom to input */
  input, textarea, select { font-size: 16pt; }
}