@media(min-width:1280px) {
 main {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
 }
}


/***************** BUTTONS in main********* */
main a {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-pack: center;
 -ms-flex-pack: center;
 justify-content: center;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 width: 80%;
 -ms-flex-preferred-size: 20%;
 flex-basis: 20%;
 border-radius: 20px;
 font-size: 130%;
 font-family: 'Open Sans', sans-serif;
 font-weight: 800;
 color: #ffffff;
 letter-spacing: 2px;
 text-decoration: none;
 border: none;
}

a.employee {
 background-color: #ff7300;
}

a.employer {
 background-color: #00498e;
}

a div {
 height: 65%;
 -ms-flex-preferred-size: 70%;
 flex-basis: 70%;
 text-align: center;
 margin-left: 20px;
 margin-top: 20px;
}

a div p {
 margin-top: 6%;
 margin-left: 5%;
}

a div p:nth-child(2) {
 word-spacing: 20px;
}

a p.arrow {
 height: 80%;
 -ms-flex-preferred-size: 10%;
 flex-basis: 10%;
 background-image: url(../images/STRZALKA_button.svg);
 background-repeat: no-repeat;
 background-position: center;
 background-size: 70%;
}

a p:nth-child(2) img {
 height: 20%;
}

@media (min-width: 640px) {
 main a {
  width: 50%;
 }
}

@media(min-width:1024px) {
 main {
  background-position: -31px 0px;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
 }

 main a {
  -ms-flex-preferred-size: 30%;
  flex-basis: 30%;
  height: 150px;
  font-size: 127%;
 }

 a div {
  margin-top: -15px;

 }

 a div p {
  margin-top: 3%;
 }

 main a:hover {
  -webkit-box-shadow: 0 3px 4px 4px grey;
  box-shadow: 0 3px 4px 4px grey;
 }
}

@media(min-width:1280px) {
 main {
  background-position: -60px 0px;
 }

 main a {
  -ms-flex-preferred-size: 30%;
  flex-basis: 30%;
  height: 175px;
  font-size: 130%;
 }

 a div {
  margin-top: -0px;
 }

 a div p {
  margin-top: 2%;
 }
}

@media(min-width:1366px) {
 main a {
  -ms-flex-preferred-size: 25%;
  flex-basis: 25%;
  height: 160px;
  font-size: 140%;
 }

 a div {
  margin-top: -15px;
 }
}

@media(min-width:1400px) {
 main a {
  height: 175px;
  font-size: 150%;
 }

 a div p {
  margin-top: 6%;
 }
}

@media(min-width:1600px) {
 main a {
  height: 180px;

 }

 a div p {
  margin-top: 2%;
 }
}

@media(min-width:1680px) {

 main a {
  height: 180px;
  -ms-flex-preferred-size: 25%;
      flex-basis: 25%;

 }

 a div {
  margin-left: 7%;
 }

 a div p {
  margin-top: 4%;
  margin-left: 1%;
 }
}

@media(min-width:1903px) {
 main a {
  height: 200px;
  font-size: 200%;
 }

 a div p {
  margin-top: 1%;
 }
}

/* END OF BUTTONS in main */