.login-page {
  width: 360px;
  padding: 8% 0 0;
  margin: auto;
}
.user-forms {
  width: 90%;
  padding: 8% 0 0;
  margin: auto;
}

body a{
text-decoration:none;
}

img {
    image-orientation: from-image;
}


.form {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  max-width: 80%;
  margin: 0 auto 40px;
  padding: 45px;
  text-align: center;
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
}
.form input {
  font-family: "Roboto", sans-serif;
  outline: 0;
  background: #f2f2f2;
  width: 100%;
  border: 0;
  margin: 0 0 15px;
  padding: 15px;
  box-sizing: border-box;
  font-size: 14px;
}

.form textarea { width: 100%; margin: 0; padding: 0; border-width: 0;background: #f2f2f2; }

.form button {
  font-family: "Roboto", sans-serif;
  text-transform: uppercase;
  outline: 0;
  background: #daa411;
  width: 100%;
  border: 0;
  padding: 15px;
  color: #FFFFFF;
  font-size: 14px;
  -webkit-transition: all 0.3 ease;
  transition: all 0.3 ease;
  cursor: pointer;
}
.form button:hover,.form button:active,.form button:focus {
  background: #43A047;
}
.form .message {
  margin: 15px 0 0;
  color: #b3b3b3;
  font-size: 12px;
}
.form .message a {
  color: #daa411;
  text-decoration: none;
  font-weight: 600;
}
.form .register-form {
  display: none;
}

/* FOR USER FORM */

.form2 {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  max-width: 360px;
  margin: 0 auto 0px;
  padding: 3vw;
  text-align: center;
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
}
.form2 input {
  font-family: "Roboto", sans-serif;
  outline: 0;
  background: #f2f2f2;
  width: 100%;
  border: 0;
  margin: 0 0 15px;
  padding: 5px;
  box-sizing: border-box;
  font-size: 14px;
}

.form2 textarea { width: 100%; margin: 0; padding: 0; border-width: 0;background: #f2f2f2; }

.form2 button {
  font-family: "Roboto", sans-serif;
  text-transform: uppercase;
  outline: 0;
  background: #daa411;
  width: 100%;
  border: 0;
  padding: 15px;
  color: #FFFFFF;
  font-size: 14px;
  -webkit-transition: all 0.3 ease;
  transition: all 0.3 ease;
  cursor: pointer;
}
.form2 button:hover,.form button:active,.form button:focus {
  background: #43A047;
}
.form2 .message {
  margin: 15px 0 0;
  color: #b3b3b3;
  font-size: 12px;
}
.form2 .message a {
  color: #daa411;
  text-decoration: none;
  font-weight: 600;
}
.form2 .register-form {
  display: none;
}

.form2 input[type=checkbox] { width: auto } 

.form3 {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  max-width: 90%;
 
  margin: 0 auto 0px;
  padding: 3vw;
  text-align: center;
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
}


.form3 input {
  font-family: "Roboto", sans-serif;
  outline: 0;
  background: #f2f2f2;
  width: 100%;
  border: 0;
  margin: 0 0 15px;
  padding: 5px;
  box-sizing: border-box;
  font-size: 14px;
}

.form3 textarea { width: 100%; margin: 0; padding: 0; border-width: 0;background: #f2f2f2; }


.form3 button {
  font-family: "Roboto", sans-serif;
  text-transform: uppercase;
  outline: 0;
  background: #daa411;
  width: 100%;
  border: 0;
  padding: 15px;
  color: #FFFFFF;
  font-size: 14px;
  -webkit-transition: all 0.3 ease;
  transition: all 0.3 ease;
  cursor: pointer;
}
.form3 button:hover,.form button:active,.form button:focus {
  background: #43A047;
}
.form3 .message {
  margin: 15px 0 0;
  color: #b3b3b3;
  font-size: 12px;
}
.form3 .message a {
  color: #daa411;
  text-decoration: none;
  font-weight: 600;
}
.form3 .register-form {
  display: none;
}

.form3 input[type=checkbox] { width: auto } 



.container {
  position: relative;
  z-index: 1;
  max-width: 300px;
  margin: 0 auto;
}
.container:before, .container:after {
  content: "";
  display: block;
  clear: both;
}
.container .info {
  margin: 50px auto;
  text-align: center;
}
.container .info h1 {
  margin: 0 0 15px;
  padding: 0;
  font-size: 36px;
  font-weight: 300;
  color: #1a1a1a;
}
.container .info span {
  color: #4d4d4d;
  font-size: 12px;
}
.container .info span a {
  color: #000000;
  text-decoration: none;
}
.container .info span .fa {
  color: #EF3B3A;
}
body {
  background: #dab411; /* fallback for old browsers */
  background: -webkit-linear-gradient(right, #dab411, #F1BE2E);
  background: -moz-linear-gradient(right, #dab411, #F1BE2E);
  background: -o-linear-gradient(right, #dab411, #F1BE2E);
  background: linear-gradient(to left, #dab411, #F1BE2E);
  font-family: "Roboto", sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;      
}

table, th, td { vertical-align: top; text-align: left; }

input[type=radio]{
	width: 10px;
	padding: 0;
}

.content{
    margin: 0 auto;
    width: 80%;
}

html, body { margin:0; margin-top:0px; padding:0; height:100%; position:relative; background:#daa411; font:1em/1.75 Verdana, Arial, Helvetica, sans-serif }
body { overflow-x:hidden; -webkit-animation:androidbugfix infinite 1s } /* http://timpietrusky.com/advanced-checkbox-hack */
@-webkit-keyframes androidbugfix { from {padding:0} to {padding:0} } /* http://timpietrusky.com/advanced-checkbox-hack */
#header { position:relative; top:0; left:0; right:0; height:10vh; background:#fff}
#header label { padding:0 0.125em; font:4vw/1.4375em Arial }
#menu label { padding:0 0.25em; font:3.125em/1.375em Arial }
#menu .sub-nav .toggle { padding:0 0.3125em; font:2em/2em Arial; top:0; -webkit-transform:scale(-1,1); -ms-transform:scale(-1,1); transform:scale(-1,1) }
#header label:hover, #menu label:hover { color:#ccc }
#main-nav-check, #menu .sub-nav-check { position:absolute; top:-9999px; left:-9999px }
.toggle { position:absolute; right:0.15em; cursor:pointer; color:#f00 }
.container2 { background:#daa411; min-height:100%; padding:0; margin:0 }
#menu, #menu .sub-nav { position:absolute; top:0; bottom:0; width:13.75em; background:#222; z-index:9999; left:-13.75em }
.container2, #menu, #menu .sub-nav {   
	-webkit-transform:translate(0,0); -ms-transform:translate(0,0); transform:translate(0,0);
	-webkit-transition:-webkit-transform .25s ease; transition:transform .25s ease
	}
#menu ul { background:#222; line-height:2.75em; text-decoration:none; padding:0; list-style:none; margin-top:4.0625em; border-top:1px solid #444 }
#menu li { border-bottom:1px solid #444 }
#menu li a { background:#222; display:block; font-size:0.875em; padding-left:1.5em; color:#fff; text-decoration:none }
#menu li a:hover, #menu .toggle-sub:hover { background:#333 }
#menu .sub-nav { margin-top:-1px }
#menu .sub-heading { margin-top:4.0625em; padding-left:1.3125em; color:#999 }
#menu .sub-heading:before { content:""; display:block; height:1px; width:13.75em; margin-left:-1.3125em; background:#444; }
#menu .toggle-sub { font:bold 1em/2.75em Arial; color:#fff; background:#222; float:right; margin-top:-2.75em; width:2.25em; border-left:1px solid #444; cursor:pointer; text-align:center }
.container2, #menu, #menu .sub-nav { -webkit-transform:translate3d(0,0,0) } /* http://davidwalsh.name/translate3d */

/* #### - corrects 'unfixing' bug in Safari - uncomment if you have position:fixed elements inside .container - #### */
/* @media screen and (-webkit-min-device-pixel-ratio:0) { .container { -webkit-transform:none !important } } */

/* #### - define ids of animated container, menu and sub-menus here - #### */
#main-nav-check:checked ~ .container2,
#main-nav-check:checked ~ #menu,
#menu .sub-nav-check:checked ~ [id$="-sub"] /* matches all elements with id ending "-sub" */ { 
	-webkit-transform:translate(13.75em,0); -ms-transform:translate(13.75em,0); transform:translate(13.75em,0) 
	}

.page-content { max-width:100%; left:0; right:0; }
.page-content:after { display:block; content:""; height:1px } /* fixes bottom padding issue in IE10 */
.breadcrumbs { font-size:.75em; border-bottom:7px solid #eee; margin:0 -1.25em 1.5em; padding:1em 1.25em }
.breadcrumbs span { display:none }
@media(min-width:30em) { .breadcrumbs { line-height:3.75; padding:0 1.25em } }
@media(min-width:60em) { .breadcrumbs span { display:inline-block } }
a, a:active, a:visited { color:#c30 }
a:visited { color:#c90 }
a:hover, a:focus { color:#666; text-decoration:none }
code { display:block; background:#ebebeb; font-size:0.875em; padding:1em 2em; overflow-x:scroll; white-space:nowrap }

.img-circle {
        border-radius: 50%;
    }


#menu2 label { padding:0 0.25em; font:3.125em/1.375em Arial }
#menu2 .sub-nav2 .toggle2 { padding:0 0.3125em; font:2em/2em Arial; top:0; -webkit-transform:scale(-1,1); -ms-transform:scale(-1,1); transform:scale(-1,1) }
#header label:hover, #menu2 label:hover { color:#ccc }
#main-nav-check2, #menu2 .sub-nav-check2 { position:absolute; top:-9999px; left:-9999px }
.toggle2 { position:absolute; right:0.15em; cursor:pointer; color:#f00 }
.container2 { background:#daa411; min-height:100%; padding:0; margin:0 }
#menu2, #menu2 .sub-nav2 { position:absolute; top:0; bottom:0; width:13.75em; background:#222; z-index:9999; left:-13.75em }
.container2, #menu2, #menu2 .sub-nav2 {   
	-webkit-transform:translate(0,0); -ms-transform:translate(0,0); transform:translate(0,0);
	-webkit-transition:-webkit-transform .25s ease; transition:transform .25s ease
	}
#menu2 ul { background:#222; line-height:2.75em; text-decoration:none; padding:0; list-style:none; margin-top:4.0625em; border-top:1px solid #444 }
#menu2 li { border-bottom:1px solid #444 }
#menu2 li a { background:#222; display:block; font-size:0.875em; padding-left:1.5em; color:#fff; text-decoration:none }
#menu2 li a:hover, #menu2 .toggle-sub:hover { background:#333 }
#menu2 .sub-nav2 { margin-top:-1px }
#menu2 .sub-heading2 { margin-top:4.0625em; padding-left:1.3125em; color:#999 }
#menu2 .sub-heading2:before { content:""; display:block; height:1px; width:13.75em; margin-left:-1.3125em; background:#444; }
#menu2 .toggle-sub2 { font:bold 1em/2.75em Arial; color:#fff; background:#222; float:right; margin-top:-2.75em; width:2.25em; border-left:1px solid #444; cursor:pointer; text-align:center }
.container2, #menu2, #menu2 .sub-nav2 { -webkit-transform:translate3d(0,0,0) } /* http://davidwalsh.name/translate3d */

/* #### - corrects 'unfixing' bug in Safari - uncomment if you have position:fixed elements inside .container - #### */
/* @media screen and (-webkit-min-device-pixel-ratio:0) { .container { -webkit-transform:none !important } } */

/* #### - define ids of animated container, menu2 and sub-menu2s here - #### */
#main-nav-check2:checked ~ .container2,
#main-nav-check2:checked ~ #menu2,
#menu2 .sub-nav-check2:checked ~ [id$="-sub2"] /* matches all elements with id ending "-sub" */ { 
	-webkit-transform:translate(13.75em,0); -ms-transform:translate(13.75em,0); transform:translate(13.75em,0) 
	}