/* ------------------ breadcrumbs ------------------ */

.breadcrumb {
  list-style: none; background: transparent; text-transform: none; font-size: 0.75rem; 
  border-radius: 0; padding: 1rem .25rem; border-bottom: 1px solid #ededed;
}

.breadcrumb li {
  color: var(--gray);
  display: -webkit-inline-box;
  font-weight: 100;
  letter-spacing: -0.2px;
}

.breadcrumb li a {color: var(--link1);}

nav[aria-label="breadcrumb"] {padding: 0;}



/* ------------------ aktywacja i logowanie ------------------ */
.loginForm {
  margin: 20px auto;
  max-width: 650px;
  min-width:370px;
}

.loginForm h2 {
  font-size: 22px;
  font-weight: 300;
  margin: 0 0 30px 0;
}

.loginFormTop {
  background: #f1f1f5 url("gfx/template/ico-home.svg") no-repeat scroll 98% 4%;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  padding: 32px 30px 90px;
	min-width: 280px;  
}

.loginFormTop.success {
  background: var(--lightblue);
  border-radius: 5px;
  color: #666;
  font-size: 24px;
  font-weight: 300;
  padding: 100px 0;
  text-align: center;
}

.loginForm h2 {
  font-size: 32px;
  font-weight: 300;
  margin: 0 0 15px 0;
  font-family: "Bebas";
  color: #1f273d;
}

.loginForm .formHolder {
  position: relative;
}

/*
.loginForm span.response {
  color: var(--error);
  font-size: 12px;
  font-weight: 300;
  position: absolute;
  right: 25px;
  top: 1px;
  transform: translateY(50%);
}
*/

.loginForm .wrongMess {
  color: var(--error);
  font-size: 12px;
  font-weight: 300;
  position: absolute;
  right: 33px;
  bottom: 20px;
  transform: translateY(50%);
  z-index:111;
}

.loginForm label {
  color: var(--label);
  margin: 0px 5px;
  font-size: 12px;
  font-weight: 300;
	line-height: 20px;  
}


.loginForm input {
  background: #fff;
  border-radius: 5px;
  display: block;
  font-size: 14px;
  font-weight: 400;
  margin: 1px;
  padding: 8px 14px;
  width: 100%;
  border: 1px solid transparent;
}

#subForm .cond-agree input.error ~ label {
  color: red;
}


#subForm .cond-agree {
	background-color: #F7F7F9;
  display: flex;
  margin: 2px 0;
  padding: 8px 0;
}
#subForm .cond-agree input {
	margin-top:6px;
  width: 30px;
}
#subForm .cond-agree label {
  color: #202032;
  margin: 0px 5px;
  font-size: 12px;
  font-weight: 500;
	line-height: 20px;  
}

#subForm .pair {
  margin: 8px 0px;
}

.loginForm button {
  background: var(--darkblue);
  border-radius: 5px;
  border: 1px solid var(--darkblue);
  color: #fff;
  padding: 8px 14px;
  color: #FFF;
  cursor: pointer;
  float: right;
  font-size: 14px;
  font-weight: 600;
  margin-top: 25px;
  background-color: #1f273d;
  text-transform: uppercase;
}

.loginForm button:hover {
    background-color: #FFF;
    border: 1px solid var(--greyblue);
    color: var(--link3);
    transition: 150ms;
}


.loginFormBot {
  background-color: var(--lightblue);
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  border-top: 1px solid var(--greyblue);  
  display: flex;
  /*min-width:420px;*/
  justify-content: space-between;
	padding: 10px 30px;	
}

.loginFormBot .button {
	border: 1px solid var(--lightblue);
  border-radius: 3px;  
  background-color:#FFF;
  color: var(--greyblue);
	margin: 8px 0;  
  font-weight: 500;
}

#loginFb {margin-left: 2rem;}

.loginFormBot .button:hover,
.loginFormBot .button:focus {
    background-color: #FFF;
    border: 1px solid var(--greyblue);
    color: var(--link3);
    transition: 150ms;
}

.loginFormBot a {
  display: block;
  font-size: 15px;
  font-weight: 200;
}

.loginForm input.error {
  border: 1px solid var(--error);
}
.loginForm .showError, #nameForm .showError, 
.accountForm .showError {
  background: #ffabab;
  border-radius: 5px;
  border: 1px solid #ff7c7c;
  display: none;
  font-size: 14px;
  font-weight: 300;
  margin: 30px 0 0 0;
  padding: 8px 14px;
  width: 100%;
}

.loginForm .showSuccess,
.accountForm .showSuccess {
    background: #bfdaa3;
    border-radius: 5px;
    border: 1px solid rgb(138, 200, 123);
    display: none;
    font-size: 14px;
    font-weight: 300;
    margin: 30px 0 0 0;
    padding: 8px 14px;
    width: 100%;
}


/* ------------------ rejestracja ------------------ */

.accountForm {
  margin: 20px auto;
  max-width: 650px;
  min-width:370px;
}

.accountForm h2 {
  font-size: 32px;
  font-weight: 300;
  margin: 0 0 15px 0;
  font-family: "Bebas";
  color: #1f273d;
}

.accountForm .formHolder {position: relative;}
.formHolder.regulam {margin-top:15px;}
.formHolder .check-a { width: 20px; display: inline-block; cursor:pointer;}

.accountForm span.response {
  color: var(--error);
  font-size: 12px;
  font-weight: 300;
  position: absolute;
  right: 25px;
  top: 1px;
  transform: translateY(50%);
}

.accountForm label {
  color: #74787c;
  margin: 10px 5px 5px 5px;
  font-size: 12px;
  font-weight: 100;
}

.accountForm input {
  background: #fff;
  /*border-radius: 5px;*/
  display: block;
  font-size: 16px;
  font-weight: 400;
  margin: 1px;
  padding: 8px 14px;
  width: 100%;
  border: 1px solid #ddd;
}

.accountForm input.error {
  border: 1px solid var(--error);
}

.accountForm button {
  background: var(--darkblue);
  border-radius: 5px;
  border: 1px solid var(--darkblue);
  color: #fff;
  padding: 8px 14px;
  color: #FFF;
  cursor: pointer;
  float: right;
  font-size: 14px;
  font-weight: 600;
  margin-top: 25px;
  background-color: #1f273d;
  text-transform: uppercase;
}

.accountForm button:hover {
    background-color: #FFF;
    border: 1px solid var(--greyblue);
    color: var(--link3);
    transition: 150ms;
}


.accountTop {
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  padding: 32px 30px 90px;
  /*min-width: 420px;*/
  background: #f1f1f5 url("gfx/template/ico-home.svg") no-repeat scroll 98% 4%;
}

.accountBot {
  background-color: var(--lightblue);
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  border-top: 1px solid var(--greyblue);  
  display: flex;
  /*min-width:420px;*/
  justify-content: space-between;
	padding: 10px 30px;	
}


.accountBot .button {
	border: 1px solid var(--lightblue);
  border-radius: 3px;  
  background-color:#FFF;
  color: var(--greyblue);
	margin: 8px 0;  
  font-weight: 500;
}

.accountBot .button:focus,
.accountBot .button:hover {
    border: 1px solid var(--greyblue);
    color: var(--link3);
    transition: 150ms;
}

.accountBot a {
  display: block;
  font-size: 15px;
  font-weight: 200;
}


/*  ------------------ rejestracja, logowanie ------------------ */
.button {
  background: none;
  border-radius: 5px;
  border: 1px solid var(--darkblue);
  color: #fff;
  cursor: pointer;
  float: right;
  font-size: 12px;
  font-weight: 400;
  margin: 8px 0 8px 14px;
  padding: 8px 14px;
  transition: 150ms;
}