@font-face {
font-family: 'sourcesanspro;
font-style: normal;
font-weight: normal;
src: local('sourcesanspro'), url('/wp-content/web_fonts/sourcesanspro/SourceSansPro-Regular.ttf') format('ttf');
}


/* perfect centered all over bg image */

html {  }


/* center div h and v */
.center-screen {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  min-height: 100vh; }


#login {
padding: 0px !important;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
	width: 100%;
  min-height: 100vh; }

/*
    background: #ff6600;
	background: rgba(255,102,0,.85);
    border-radius: 50%;
border-width: 3px;
border-style: dotted; 
border-color: #ff6600; 

    box-shadow: 0 0px 0px rgba(0,0,0,.13);

/wp-content/uploads/2021/08/spiffy-nas-ty-logo-1-3.png



*/

 
body.login { 
	 background: #eb01a5;
  background-image: url(https://spiffynasty.com/blahblahblah/wp-content/uploads/2021/09/login-screen-bg-nas-2.jpg); 
  background-image: url(https://spiffynasty.com/blahblahblah/wp-content/uploads/2021/09/login-screen-bg-nas-2.jpg), linear-gradient(#ff6600, #6600ff); /* W3C */
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;	
	background-repeat: no-repeat;
	background-position: center center;

}

body.login div#login h1 { width: 1px; height: 1px; }


body.login div#login h1 a {
  background-image: url(https://spiffynasty.com/blahblahblah/wp-content/uploads/2021/01/cropped-spiffy-NAS-ty_icon-1-600x200.png);
    background-size: 300px 100px;
    background-position: center top;
    background-repeat: no-repeat;
    color: #444;
    height:100px;
    font-size: 0px;
    font-weight: 400;
    line-height: 1;
    padding: 0 0 10px 0;
    text-decoration: none;
    margin: 0 auto;
    outline: 0;
    overflow: hidden;
    display: block;

display: none; 
}

body.login div#login form#loginform {
    margin: 50px 0 0 0;
    padding: 20px;
    font-weight: 500;
    overflow: hidden;
    width: 500px;
    height: 500px;
    background-position: 0px 0px;
    background: #ff6600;
    background: rgba(239,239,239,.5);
    border-radius: 50%;
    border-width: 5px;
    border-style: dashed;
    border-color: #66ff00;
    box-shadow: 0 0px 0px rgb(0 0 0 / 13%); }

 



form#loginform p {
    width: 200px;
    margin: 0 auto;
    display: block;
    padding: 0 0 10px 0px; }

form#loginform p:first-child {
    width: 200px;
    margin: 0px auto;
    display: block;
    padding-top: 50px;}

form#loginform p:first-child label {
    background: #ff5500;
    background: rgba(255,102,0,.5);
    padding: 2px 24px 2px 24px;
    margin: 0px;
    margin-top: 33px;
    line-height: 16px;
    font-size: 12px;
    font-weight: 800;
    margin-bottom: -4px;
    color: #6600ff;
    color: rgba(102,0,255,.65);
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 8px;
    -webkit-border-bottom-left-radius: 11px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 8px;
    -moz-border-radius-bottomleft: 11px;
    border-top-left-radius: 16px;
    border-top-right-radius: 8px;
    border-bottom-left-radius: 0px; }





    form#loginform p:first-child label {
            margin-top: 33px;
    color: #efefef;
    color: rgba(239,239,239,.90);
    background: #ff5500;
    background: rgb(0 255 102 / 65%);
    padding: 2px 24px 2px 24px;
    margin: 0px;
    line-height: 16px;
    font-size: 12px;
    font-weight: 800;
    margin-bottom: -4px;
    color: #6600ff;
    color: rgba(102,0,255,.65);
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 8px;
    -webkit-border-bottom-left-radius: 11px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 8px;
    -moz-border-radius-bottomleft: 11px;
    border-top-left-radius: 16px;
    border-top-right-radius: 8px;
    border-bottom-left-radius: 0px; }

.login label {
    font-size: 12px;
    line-height: 1.15;
    padding: 2px 70px 2px 70px;
    background: #ff6600;
    background: rgb(255 0 102 / 65%);
    display: inline-block;
    margin-bottom: -3px;
    color: #6600ff;
    color: rgba(239,239,239.90);
   -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 8px;
    -webkit-border-bottom-left-radius: 11px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 8px;
    -moz-border-radius-bottomleft: 11px;
    border-top-left-radius: 16px;
    border-top-right-radius: 8px;
    border-bottom-left-radius: 0px; }


.login .forgetmenot label, .login .pw-weak label {
    line-height: 2;
    background: rgba(0,0,0,0);
    vertical-align: baseline;
    white-space: nowrap !important;
    color:#6600ff; }


.forgetmenot #rememberme { } 

.login .forgetmenot label, .login .pw-weak label {
    line-height: .5;
    background: rgba(0,0,0,0);
    vertical-align: baseline;
}


p.forgetmenot input[type=checkbox] {
    margin: 30px 0 0 -20px !important;
}

.forgetmenot label {
    margin: -50px 0 0 0px !important;
    white-space: nowrap; }


p.forgetmenot input[type=checkbox] {
    margin: 0 20px -40px 5px !important;
}


form#loginform p {
    width: 200px;
    margin: 0 auto;
    display: block;
	position: relative;
    padding: 0 0 0 0px; }

div.wp-pwd  { width: 200px;  margin: 0 auto; }

p.forgetmenot { margin: 0 auto; padding: 0 0 0 10px; display: block; text-align: right; }

/* move around when centering checkbox */


 #rememberme { } 

.user-pass-wrap {  margin: 0px; }

.login #backtoblog a, .login #nav a {
    text-decoration: none;
    color: #6600ff; }

.login #backtoblog a:visited, .login #nav a:visited {
    text-decoration: none;
    color: #6600ff; }

.login #backtoblog a:hover, .login #nav a:hover {
    text-decoration: none;
    color: #efefef; }

#login #login_error, #login .error, #login #login_error *, #login .error * {
    color: #333333 !important;
    background: #ff6600 !important;
background: rgba(102,255,0,.45); 
border-radius: 2px 2px 2px 2px;
-moz-border-radius: 2px 2px 2px 2px;
-webkit-border-radius: 2px 2px 2px 2px;
border: 0px solid #000000;
    padding: 5px;  }

.login #nav a {
margin-top: 20px; margin-bottom: -20px; display: block; 
}


a.privacy-policy-link:link { color: #9400ff; }
a.privacy-policy-link:visited { color: #9400ff; }
a.privacy-policy-link:hover { color: #b54dff; }



.login .privacy-policy-page-link {
    text-align: center;
    width: 100%;
    margin: 80px 0 -80px 0;
    background: rgba(255,102,0,0);
    padding: 5px; }

#login #nav, #login #backtoblog {
    padding: 0;
text-transform: uppercase;
font-weight: 600; 
    margin: 0px 0px 0px 0px;
    text-align: center;
    background: rgba(102,255,0,0);}

#nav a{ padding: 20px 5px 5px 5px;}

#login #backtoblog {
    margin: 0 0 -40px 0;
    visibility: hidden; }

.login #nav {
    margin: 40px 0 -40px 0 !important;
    margin: 24px 0 0 0; }



.login form .input, .login form input[type=checkbox], .login input[type=text] { background: #efefef;   background:rgba(239,239,239,.5); }

.login form .input, .login input[type=text] {
    font-size: 16px;
    width: 100%;
    padding: 5px;
    margin: 2px 6px 16px 0; }

.login form input[type=checkbox] { position: absolute; right: 0; }


.login form .forgetmenot {
    font-weight: 400;
    float: left;
    margin-bottom: 0;
    padding: 0 0 10px 0;
}


/* login button */


.wp-core-ui .button-group.button-large .button, .wp-core-ui .button.button-large {
    min-height: 32px;
    line-height: 2.30769231;
    padding: 0 30px;
    margin: 20px 0 0 0;
}

.wp-core-ui .button-group.button-large .button:hover, .wp-core-ui .button.button-large:hover {
    background: #ff6600 !important;
    border-color: #efefef;
    color: #efefef;
   margin: 20px 0 0 0 !important;
    border: double 4px #00ff66;
}

.wp-core-ui .button, .wp-core-ui .button-secondary {
	color: #ff0066; }


.login form {
    margin-top: 20px;
    margin-left: 0;
    padding: 26px 24px 46px;
    font-weight: 400;
    overflow: hidden;
    background: #fff;
  background: rgba(255,255,255,0);
    border: 0px solid #ccd0d4;
    box-shadow: 0 1px 3px rgb(0 0 0 / 4%);
}

input[type=checkbox], input[type=color], input[type=date], input[type=datetime-local], input[type=datetime], input[type=email], input[type=month], input[type=number], input[type=password], input[type=radio], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week], select, textarea {
    border: 1px solid #0066ff;
    box-shadow: inset 0 1px 2px rgba(0,0,0,.7);
    background-color: #fff;
    color: #32373c;
    outline: 0;
    transition: 50ms border-color ease-in-out; }








body.login div#login form#loginform input#user_login { 
-webkit-border-top-left-radius: 4px;
-webkit-border-top-right-radius: 8px;
-webkit-border-bottom-left-radius: 11px;
-moz-border-radius-topleft: 4px;
-moz-border-radius-topright: 8px;
-moz-border-radius-bottomleft: 11px;
border-top-left-radius: 4px;
border-top-right-radius: 8px;
	border-bottom-left-radius: 11px; }


body.login div#login form#loginform input#user_pass	  {
-webkit-border-top-left-radius: 8px;
-webkit-border-top-right-radius: 4px;
-webkit-border-bottom-right-radius: 11px;
-moz-border-radius-topleft: 8px;
-moz-border-radius-topright: 4px;
-moz-border-radius-bottomright: 11px;
border-top-left-radius: 8px;
border-top-right-radius: 4px;
	border-color: #ff0066 !important;
border-bottom-right-radius: 11px; }

input[type=checkbox]:focus, input[type=color]:focus, input[type=date]:focus, input[type=datetime-local]:focus, input[type=datetime]:focus, input[type=email]:focus, input[type=month]:focus, input[type=number]:focus, input[type=password]:focus, input[type=radio]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=text]:focus, input[type=time]:focus, input[type=url]:focus, input[type=week]:focus, select:focus, textarea:focus {
      border: #00ff66;
    box-shadow: 0 0 0 1px #00ff66;
    outline: 2px solid transparent;
}


.wp-core-ui .button-primary a:visited {
    color: #20c8be;
    border: solid 1px #20c8be; }

.wp-core-ui .button-primary {
	text-transform: uppercase; 
	color:#ff6600;
    display: inline-block;
    margin: .25em;
    font-size: 1em;
    font-family: 'sourcesanspro', helvetica, arial, sans-serif;
    text-decoration: overline; 
    background-color: #fefafa;
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #ede9e9));
    background-image: -webkit-linear-gradient(#ffffff, #ede9e9);
    background-image: -moz-linear-gradient(#ffffff, #ede9e9);
    background-image: -o-linear-gradient(#ffffff, #ede9e9);
    background-image: linear-gradient(#ffffff, #ede9e9);
    padding: 0.5em;
    -webkit-border-radius: 0.5em;
    -moz-border-radius: 0.5em;
    -ms-border-radius: 0.5em;
    -o-border-radius: 0.5em;
    border-radius: 0.5em;
    -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
    border: solid 1px #00ff66; }

.wp-core-ui .button-primary.focus, .wp-core-ui .button-primary.hover, .wp-core-ui .button-primary:focus, .wp-core-ui .button-primary:hover {
    background: #0066ff;
    border-color: #efefef;
    color: #efefef;
	  margin: 0em;
	   border: double 4px #00ff66;
}

/*///// Login Error Box //////*/
 
.login #login_error { border-left-color: #6600ff; }

.login #login_error, .login .message, .login .success {
    border-left: 4px solid #00a0d2;
    padding: 12px;
    margin-left: 0;
	color:#6600ff;
	font-weight: 600; 
    margin-bottom: 20px;
    background-color: #ff6600;
    box-shadow: 0 1px 1px 0 rgba(0,0,0,.1); }







/*


Selector	Modifies
body.login	                                                    The page background
body.login div#login h1 a	                                   The WordPress logo
body.login div#login form#loginform	                           The white box that contains the form
body.login div#login form#loginform p label	                    The username and password field labels
body.login div#login form#loginform input	                     Both input fields (username and password)
body.login div#login form#loginform input#user_login	         Just the username input field
body.login div#login form#loginform input#user_pass	            Just the password input field
body.login div#login form#loginform p.forgetmenot	             The Remember Me field
body.login div#login form#loginform p.submit input#wp-submit	The Submit button
body.login div#login p#nav a	                                   The Lost Your Password link
body.login div#login p#backtoblog a	The Back to link


*/