/*
 * Style glowne - wersja podstawowa
 */

/*
 * 0. Reset, formy
 */

 input {
  -moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
       box-sizing: border-box;
}

input:focus::-webkit-input-placeholder {
color: transparent;
}

input:focus:-moz-placeholder {
color: transparent;
}

input:focus::-moz-placeholder {
color: transparent;
}

input:focus:-ms-input-placeholder {
color: transparent;
}


input.placeholder {
text-align: center;
}

input::-webkit-input-placeholder,
::-webkit-input-placeholder {
text-align: center;
}

input:-moz-placeholder,
:-moz-placeholder {
text-align: center;
}

input::-moz-placeholder,
::-moz-placeholder {
text-align: center;
}

input:-ms-input-placeholder {
text-align: center;
}

legend {
display: none;
}

ul li {
list-style: none;
list-style-type: none;
}

ul {
margin-top: 0;
padding: 0;
}

h3 {
font-size: 1.3em;
}

h4 {
font-size: 1em;
}


/*
* 1. Main
*/

body {
background-color: #fff;
color: #7c7c7c;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
font-size: 19px;
margin: 0;
text-align: center;
}

fieldset {
border: none;
padding: 0 12px 8px;
}

.bar {
border-top: 1px solid rgba(0,0,0,.1);
}

#container {
margin: 0 auto;
overflow: hidden;
max-width: 640px;
}

#main {
background-color: #fff;
}

.active-mbox form {
background: rgba(255, 255, 255, 0.8);
}

.active-mbox form {
margin-top: -130px;
}

@media all and (min-width: 359px) {
.active-mbox  form {
 margin-top: -160px;
}
}

@media all and (min-width: 400px) {
.active-mbox form {
 margin-top: -175px;
}
}


@media all and (min-width: 480px) {
.active-mbox form {
 margin-top: -205px;
}
}

#content {
position: relative;
max-width: 480px;
margin: 0 auto;
}

header .logo {
height: 44px;
margin: 0;
position: relative;
vertical-align: middle;
z-index: 10;
}

#content .txt {
border: 1px solid #b5b5b5;
border-radius: 3px;
font-size: .8em;
height: 45px;
text-align: center;
width: 100%;
}

#main form .rt {
  float: none;
}

#content .btn {
  -moz-box-sizing: border-box;
  background: #2aadff;
  border: 0;
  border-radius: 3px;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.31) inset, 0 1px 1px rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  line-height: 32px;
  opacity: 0.999;
  padding: 7px 20px 9px;
  text-align: center;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
  vertical-align: middle;
  width: 100%;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

#content .checkbox-new-webmail label {
cursor: pointer;
font-size: 14px;
padding: 10px 0 5px 0;
text-align: left;
}

#content .new-account {
-moz-box-sizing: border-box;
    box-sizing: border-box;
padding: 16px;
width: 100%;
}

#content .new-account a,
#content .login-helper a {
color: #2aadff;
font-size: 14px;
vertical-align: middle;
}

#content .bar a:hover,
#content .login-helper a:hover {
color: #ff7a02;
}

#content .new-account:after {
clear: both;
content: ' ';
display: block;
}

#content .clear {
clear: both;
}

#content .login-helper {
border-top: 1px solid rgba(0,0,0,.1);
padding: 16px;
}

#content .right { float: right; }
#content .left { float: left; }

.rt {
float: right;
}


a, a:hover, a:visited {
color: #7c7c7c;
font-size: .9em;
text-decoration: none;
}

.nw {
display: block;
float: right;
font-size: .75em;
}


.mblock {
display: block;
margin: 2px 0;
padding: 5px;
}

.msblock {
display: block;
margin: 0;
padding: 5px;
}

.mbblock {
display: block;
margin: 25px 0 5px 0;
padding: 5px;
}

.lblock {
display: block;
float: left;
margin: 0;
padding: 5px;
}

.rblock {
display: block;
float: right;
margin: 0;
padding: 5px;
}

#notification_loginFailure {
position:relative;
}


#notification_failure,
#notification_loginFailure,
.alert,
.alert-error {
background-color: #eed3d7;
border: 1px solid #be4a48;
border-width: 1px 0;
color: #be4a48;
font-size: 16px;
margin: 5px 0;
padding: 10px 5px;
text-transform: lowercase;
}

@media all and (min-width: 480px) {
#notification_failure,
#notification_loginFailure,
.alert,
.alert-error {
 border-radius: 6px;
   border-width: 1px;
 }
}

#develwarning {
background-color: #ff0;
border: 2px dashed #000;
border-radius: 3px;
color: #000;
font-size: .7em;
margin: 5px 16px 10px 16px;
padding: 5px;
/* display: none;  TODO */
}

#develwarning a {
display: block;
}

footer {
font-size: 14px;
padding: 15px 0;
}

.rlnk:after {
content: '\0000a0\00bb';
font-size: 1.3em;
font-weight: bold;
}

.llnk:before {
content: '\00ab\0000a0';
font-size: 1.3em;
font-weight: bold;
}

.rlnk,
.llnk {
color: #555 !important;
}

.info {
font-size: .9em;
padding: 30px;
}

@media all and (min-width: 600px) {
fieldset {
 padding-bottom: 16px;
}
}

/* sekcla zalet  */

.pros {
  background-color: #fff;
  position: relative;
  text-align: center;
  z-index: 5;
}

.pros__title {
  color: #212121;
  font-size: 24px;
  margin-left: 5%;
  margin-right: 5%;
  font-weight: 500;
  margin-bottom: 50px;
  text-align: center;
}

.pros__items {
  font-size: 0;
  margin: 0 5%;
}

.pros__item {
  display: inline-block;
  font-size: medium;
  min-height: 75px;
  margin: 0 0 24px;
  padding: 0;
  position: relative;
  text-align: left;
  vertical-align: top;
  width: 100%;
}

.pros__item__name {
  color: rgba(0, 0, 0, 0.87);
  font-size: 20px;
  font-weight: 400;
  margin: 0 0 8px;
}

.pros__item__desc {
  font-size: 14px;
  line-height: 20px;
  overflow: hidden;
}

.pros__item__desc,
.pros__item__desc .link--more-pros {
  background: transparent;
  border: 0;
  color: #818792;
}

.pros__item__desc .link--more-pros {
  text-decoration: underline;
}

.pros__item__desc .link--more-pros:hover {
  text-decoration: none;
}

.pros__item__desc .link--more-pros.active:after {
  content: '\00ab';
}

.pros__circle-wrap {
  width: 100px;
}

.pros__circle,
.pros__circle-wrap {
  float: left;
  height: 78px;
  transform: translateZ(0);
}

.pros__circle {
  border-radius: 50%;
  font-size: 64px;
  line-height: 1;
  margin: -3px 12px 0 0;
  overflow: hidden;
  position: relative;
  text-align: center;
  width: 78px;
}

.secondary-pros {
  max-height: 0;
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s ease-in-out;
}

.secondary-pros.active {
  max-height: 1000px;
  opacity: 1;
  visibility: visible;
}

.secondary-pros .pros__item {
  margin-bottom: 6px;
  padding-left: 30px;
  padding-right: 0;
  width: 80%;
}

.secondary-pros .pros__item:after {
  background-color: #e53920;
  border-radius: 50%;
  content: '';
  height: 14px;
  position: absolute;
  top: 5px;
  left: 0;
  width: 14px;
}

.pros__icon {
  position: absolute;
  top: 50%;
  left: 50%;
}

.pros__icon--1 {
  margin: -15px 0 0 -15px;
}

.pros__icon--2 {
  margin: -13px 0 0 -17px;
}

.pros__icon--3 {
  margin: -17px 0 0 -9px;
}

.pros__icon--4 {
  margin: -15px 0 0 -12px;
}

.pros__circle--1 {
  background-color: #fed123;
}

.pros__circle--2 {
  background-color: #f29417;
}

.pros__circle--3 {
  background-color: #e53920;
}

.pros__circle--4 {
  background-color: #a91500;
}

.gradient {
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 100%;
}

.pros__circle--1 .gradient {
  background-image: -o-radial-gradient(
    100% 0 circle,
    #e97b06 0,
    #e97b06 25%,
    #ed9107 26%,
    #ed9107 50%,
    #f3b60e 51%,
    #f3b60e 75%,
    #f8d42f 76%,
    #f8d42f 100%
  );
  background-image: radial-gradient(
    circle at 100% 0,
    #e97b06 0,
    #e97b06 25%,
    #ed9107 26%,
    #ed9107 50%,
    #f3b60e 51%,
    #f3b60e 75%,
    #f8d42f 76%,
    #f8d42f 100%
  );
}

.pros__circle--2 .gradient {
  background-image: -o-radial-gradient(
    0 0 circle,
    #d1390d 0,
    #d1390d 25%,
    #dc5112 26%,
    #dc5112 50%,
    #e4741a 51%,
    #e4741a 75%,
    #ea9425 76%,
    #ea9425 100%
  );
  background-image: radial-gradient(
    circle at 0 0,
    #d1390d 0,
    #d1390d 25%,
    #dc5112 26%,
    #dc5112 50%,
    #e4741a 51%,
    #e4741a 75%,
    #ea9425 76%,
    #ea9425 100%
  );
}

.pros__circle--3 .gradient {
  background-image: -o-radial-gradient(
    55% 0 circle,
    #860202 0,
    #860202 25%,
    #9a0202 26%,
    #9a0202 50%,
    #bc0504 51%,
    #bc0504 75%,
    #dc2f2a 76%,
    #dc2f2a 100%
  );
  background-image: radial-gradient(
    circle at 55% 0,
    #860202 0,
    #860202 25%,
    #9a0202 26%,
    #9a0202 50%,
    #bc0504 51%,
    #bc0504 75%,
    #dc2f2a 76%,
    #dc2f2a 100%
  );
}

.pros__circle--4 .gradient {
  background-image: -o-radial-gradient(
    75% 0 circle,
    #b70062 0,
    #b70062 25%,
    #ca0074 26%,
    #ca0074 50%,
    #df0089 51%,
    #df0089 75%,
    #f600a2 76%,
    #f600a2 100%
  );
  background-image: radial-gradient(
    circle at 75% 0,
    #b70062 0,
    #b70062 25%,
    #ca0074 26%,
    #ca0074 50%,
    #df0089 51%,
    #df0089 75%,
    #f600a2 76%,
    #f600a2 100%
  );
}

.pros__icon--1,
.pros__icon--2,
.pros__icon--3,
.pros__icon--4 {
  background-position: 0 0;
  background-repeat: no-repeat;
  display: inline-block;
  vertical-align: middle;
}

.pros__icon--1 {
  background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2229.688%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2230.451%22%20viewBox%3D%220%200%2029.688%2030.451%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M8.256%2030.451c-2.039%200-3.947-.846-5.325-2.195-2.67-2.612-3.415-7.173.329-10.835%202.193-2.146%2010.979-10.741%2015.365-15.032%201.557-1.523%203.539-2.111%205.436-1.614%201.863.488%203.39%201.982%203.889%203.804.508%201.858-.093%203.796-1.649%205.319l-14.694%2014.376c-.839.821-1.787%201.307-2.739%201.405-.943.097-1.844-.2-2.474-.816-1.143-1.119-1.306-3.223.594-5.082l10.32-10.097c.424-.415%201.111-.415%201.535%200%20.424.415.424%201.087%200%201.502l-10.32%2010.097c-.892.872-.974%201.706-.594%202.077.166.163.419.237.71.206.447-.046.956-.329%201.433-.795l14.693-14.374c1.008-.987%201.395-2.147%201.088-3.267-.302-1.103-1.226-2.007-2.354-2.303-1.145-.3-2.331.078-3.339%201.064-4.386%204.291-13.172%2012.887-15.365%2015.032-2.862%202.801-2.177%206.023-.329%207.831%201.848%201.808%205.141%202.479%208.005-.322l15.364-15.032c.424-.415%201.111-.415%201.535%200%20.424.414.424%201.087%200%201.502l-15.364%2015.033c-1.811%201.772-3.838%202.516-5.75%202.516z%22%2F%3E%3C%2Fsvg%3E');
}

.pros__icon--2 {
  background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2235%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2225.389%22%20viewBox%3D%220%200%2035%2025.389%22%3E%3Cpath%20fill%3D%22%23fff%22%20fill-rule%3D%22evenodd%22%20d%3D%22M17.475%2013.946l-16.36-13.913.288-.033h32.195c.258%200%20.497.082.705.214l-16.828%2013.732zm-5.473-2.305l-11.818%2012.962c-.114-.221-.184-.472-.184-.743v-22.331c0-.328.097-.63.258-.879l11.744%2010.991zm5.518%205.163l4.155-3.823%2012.548%2012.241c-.189.103-.399.167-.625.167h-32.195c-.212%200-.41-.055-.59-.146l12.241-12.618%204.466%204.179zm17.332-15.947c.092.204.148.43.148.672v22.331c0%20.3-.082.579-.22.815l-12.295-12.439%2012.367-11.379z%22%2F%3E%3C%2Fsvg%3E');
}

.pros__icon--3 {
  background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2218%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2234.712%22%20viewBox%3D%220%200%2018%2034.712%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M16.906%2020.599c-2.174%203.09-11.481%2012.681-11.875%2013.089-.458.561-1.714%201.506-2.912.731-.345-.223-.753-.673-.753-1.557%200-.848.386-1.713.43-1.809l4.536-10.039c-.853-.342-2.315-.933-3.451-1.425l-.3-.129c-1.149-.488-2.581-1.094-2.581-2.672%200-.754.359-1.63%201.094-2.675%202.173-3.091%2011.481-12.683%2011.877-13.089.455-.561%201.712-1.506%202.911-.732.345.224.753.674.753%201.556%200%20.849-.386%201.714-.43%201.81l-4.537%2010.038c.853.342%202.316.934%203.451%201.426l.3.128c1.149.489%202.581%201.096%202.581%202.675%200%20.753-.358%201.628-1.094%202.674z%22%2F%3E%3C%2Fsvg%3E');
}

.pros__icon--4 {
  background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2228.343%22%20viewBox%3D%220%200%2024%2028.343%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M23.895%206.544c-.604-4.306-4.586-7.182-8.893-6.423-4.307.759-8.035%204.073-7.43%208.379.13.928.53%202.379%201.027%203.421l-8.164%2011.169c-.301.412-.49%201.154-.421%201.649l.4%202.849c.069.495.531.828%201.026.741l2.292-.405c.495-.087%201.134-.504%201.42-.926l3.242-4.787.027-.031%202.094-.369%203.785-5.609c1.173.201%202.868.133%203.875-.045%204.307-.758%206.325-5.306%205.72-9.613zm-3.869%202.208c-1.237%201.691-2.396.499-4.037-.686-1.64-1.185-3.139-1.913-1.903-3.604%201.237-1.692%203.568-2.103%205.209-.919%201.64%201.185%201.967%203.517.731%205.209z%22%2F%3E%3C%2Fsvg%3E');
}

.pros__icon--1 {
  height: 30px;
  width: 29px;
}

.pros__icon--2 {
  height: 26px;
  width: 35px;
}

.pros__icon--3 {
  height: 35px;
  width: 18px;
}

.pros__icon--4 {
  height: 29px;
  width: 24px;
}

.btn--2,
a.btn--2 {
  background-color: #2aadff;
  border-radius: 6px;
  color: #fff;
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  height: 44px;
  line-height: 44px;
  padding: 0 20px;
  text-transform: uppercase;
}

.btn--big,
a.btn--big {
  font-size: 22px;
  height: 54px;
  line-height: 54px;
  padding: 2px 50px;
}

.icon--arrow-7 {
  background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%229%22%20height%3D%2215%22%20viewBox%3D%220%200%209%2015%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%20%7B%20fill%3A%20none%3B%20stroke%3A%20%23fff%3B%20stroke-linecap%3A%20round%3B%20stroke-linejoin%3A%20round%3B%20stroke-width%3A%203px%3B%20fill-rule%3A%20evenodd%3B%20%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M1.5%201.5l6%205.607-6%206.393%22%2F%3E%3C%2Fsvg%3E')
    0 0 no-repeat;
  display: inline-block;
  height: 15px;
  margin-left: 8px;
  position: relative;
  top: -1px;
  vertical-align: middle;
  width: 9px;
}

.link--raquo {
  font-size: 14px;
  outline: none;
  padding: 0;
}

.link--raquo:after {
  content: '\00bb';
  display: inline-block;
  margin-left: 3px;
}

#login1l > button {
  max-width: 100%;
}
