:root {
    --blue: #007bff;
--indigo: #6610f2;
--purple: #6f42c1;
--pink: #e83e8c;
--red: #dc3545;
--orange: #fd7e14;
--yellow:
#ffc107;
--green:
#28a745;
--teal:
#20c997;
--cyan:
#17a2b8;
--white:
#fff;
--gray:
#6c757d;
--gray-dark:
#343a40;
--primary:
#007bff;
--secondary:
#6c757d;
--success:
#28a745;
--info:
#17a2b8;
--warning:
#ffc107;
--danger:
#dc3545;
    --light: #f8f9fa;
    --dark: #343a40;
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --font-family-sans-serif: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    --font-family-monospace: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
}
html {
    font-family: sans-serif;
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
}
body {
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: 
    #212529;
    text-align: left;
    margin: 0;
    padding: 0;
	font-family: Roboto,sans-serif;
	font-weight: 300;
}
.container {
 width:100%;
 padding-right:15px;
 padding-left:15px;
 margin-right:auto;
 margin-left:auto
}
@media (min-width:576px) {
 .container {
  max-width:540px
 }
}
@media (min-width:768px) {
 .container {
  max-width:720px
 }
}
@media (min-width:992px) {
 .container {
  max-width:960px
 }
}
@media (min-width:1200px) {
 .container {
  max-width:1140px
 }
}
.container-fluid {
 width:100%;
 padding-right:15px;
 padding-left:15px;
 margin-right:auto;
 margin-left:auto
}
.row {
 display:-ms-flexbox;
 display:flex;
 -ms-flex-wrap:wrap;
 flex-wrap:wrap;
 margin-right:-15px;
 margin-left:-15px
}
.no-gutters {
 margin-right:0;
 margin-left:0
}
.no-gutters>.col,
.no-gutters>[class*=col-] {
 padding-right:0;
 padding-left:0
}
*, ::after, ::before {
    box-sizing: border-box;
}
.pb-5, .py-5 {
    padding-bottom: 3rem !important;
}
a.ext-link {
  position: relative;
  height: 100%;
  text-decoration: none;
  color: #f8f9fa;
  cursor: default;
}

a.ext-link > div {
  position: relative;
  height: 100%;
  padding: 1rem 0;
}
.main-title, .primary-heading, .secondary-heading, .section-heading, .title {
    margin-bottom: 1rem;
}
.title {
  font-size: 1.25rem;
  text-transform: uppercase;
  line-height: 1;
  opacity: 1;
  position: relative;
}

.subtitle {
  color: #ced4da;
  font-size: .9rem;
  letter-spacing: .035rem;
  line-height: 1.125;
  margin: -.25rem 0 0;
  opacity: 0;
}

.wrapper .row {
  flex-wrap: nowrap;
  justify-content: center;
  overflow: hidden;
}
/*zmieniono height: */
.wrapper .row > div {
  height: 300px;
  overflow: hidden;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.7s;
  -moz-transition-duration: 0.7s;
  transition-duration: 0.7s;
  -webkit-transition-timing-function: ease-in-out;
  -moz-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;
}
.wrapper .row > div:before {
  background: rgba(33, 37, 41, 0);
  content: "";
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.2s;
  -moz-transition-duration: 0.2s;
  transition-duration: 0.2s;
}
.wrapper .row:hover > div {
  flex-basis: calc(100% * 1/6);
  flex-basis: 16.66%;
  max-width: calc(100% * 1/6);
  max-width: 16.66%;
    height: 700px;
}
.wrapper .row .item-wrapper {
  flex-basis: calc(100% * 1/3);
  flex-basis: 33.33%;
  max-width: calc(100% * 1/3);
  max-width: 33.33%;
  background-color: #515272;
  background-position: center center;
  background-size: contain; background-repeat: no-repeat;
}
.wrapper .row .item-wrapper > div {
  height: 100%;
  position: relative;
}
.wrapper .row .item-wrapper > a > div {
  position: relative;
  height: 100%;
  padding: 1rem 0;
}
.wrapper .row .item-wrapper .description p {
  width: calc(100% * 2/3);
  margin-top: 0;
  margin-bottom: 0;
  padding: 1rem 0;
  opacity: 0;
}
.wrapper .row .item-wrapper .category-icon {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  height: auto;
  font-size: 0.79rem;
  color: #0DAFE0;
  display: flex;
  align-items: center;
  padding: .35rem;
  opacity: .7;
  filter: grayscale(50%);
}
.wrapper .row .item-wrapper .category-icon:after {
  content: '';
  display: block;
  margin-left: .5rem;
  background-repeat: no-repeat;
/*  -webkit-mask-image: url(https://mdbootstrap.com/img/Marketing/general/logo/small/mdb.png);
  mask-image: url(https://mdbootstrap.com/img/Marketing/general/logo/small/mdb.png);*/
  background-color: #0DAFE0;
  height: 20px;
  width: 21px;
}
.wrapper .row .item-wrapper:hover {
  flex-basis: calc(100% * 2/3);
  flex-basis: 66.66%;
  max-width: calc(100% * 2/3);
  max-width: 66.66%;
}
.wrapper .row .item-wrapper:hover .title {
  font-size: 1.953rem;
  color: #212529;
  text-shadow: none;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.4s;
  -moz-transition-duration: 0.4s;
  transition-duration: 0.4s;
  -webkit-transition-timing-function: ease;
  -moz-transition-timing-function: ease;
  transition-timing-function: ease;
}
.wrapper .row .item-wrapper:hover .subtitle {
  opacity: 1;
  color: #495057;
  -webkit-transition-property: opacity;
  -moz-transition-property: opacity;
  transition-property: opacity;
  -webkit-transition-duration: 0.2s;
  -moz-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -webkit-transition-timing-function: ease;
  -moz-transition-timing-function: ease;
  transition-timing-function: ease;
  -webkit-transition-delay: 0.5s;
  -moz-transition-delay: 0.5s;
  transition-delay: 0.5s;
}
.wrapper .row .item-wrapper:hover .category-icon {
  opacity: 1;
  filter: grayscale(0%);
}
.wrapper .row .item-wrapper:hover .description p {
  opacity: 1;
  color: #212529;
  color: #fff;
  -webkit-transition-property: opacity;
  -moz-transition-property: opacity;
  transition-property: opacity;
  -webkit-transition-duration: 0.2s;
  -moz-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -webkit-transition-timing-function: ease;
  -moz-transition-timing-function: ease;
  transition-timing-function: ease;
  -webkit-transition-delay: 0.5s;
  -moz-transition-delay: 0.5s;
  transition-delay: 0.5s;
}
/* zmieniono */
.wrapper .row .item-wrapper:hover:before {
  background: rgba(248, 249, 250, 0) !important;
  content: "";
  height: 100%;
  width: 100%;
  position: absolute;
  top: 110;
  left: 0;
}

.container .row h4:first-of-type {
  text-align: center;
  margin: 0 auto;
  padding-bottom: 1rem;
}

.wrapper .row:nth-child(1) > :nth-child(1){
  background-image: url("../../assets/images/s-20200808-01.jpg");
}
.wrapper .row:nth-child(1) > :nth-child(2){
  background-image: url("../../assets/images/s-20200808-02.jpg");
}
.wrapper .row:nth-child(1) > :nth-child(3){
  background-image: url("../../assets/images/s-20200808-03.jpg");
}
.wrapper .row:nth-child(2) > :nth-child(1){
  background-image: url("../../assets/images/s-20200808-04.jpg");
}
.wrapper .row:nth-child(2) > :nth-child(2){
  background-image: url("../../assets/images/s-20200808-05.jpg");
}
.wrapper .row:nth-child(2) > :nth-child(3){
  background-image: url("../../assets/images/s-20200808-06.jpg");
}
.wrapper .row:nth-child(3) > :nth-child(1){
  background-image: url("../../assets/images/s-20200808-07.jpg");
}
.wrapper .row:nth-child(3) > :nth-child(2){
  background-image: url("../../assets/images/s-20200808-08.jpg");
}
.wrapper .row:nth-child(3) > :nth-child(3){
  background-image: url("../../assets/images/s-20200808-09.jpg");
}
.wrapper .row:nth-child(4) > :nth-child(1){
  background-image: url("../../assets/images/s-20200808-10.jpg");
}
.wrapper .row:nth-child(4) > :nth-child(2){
  background-image: url("../../assets/images/s-20200808-11.jpg");
}
.wrapper .row:nth-child(4) > :nth-child(3){
  background-image: url("../../assets/images/s-20200808-12.jpg");
}
.wrapper .row:nth-child(5) > :nth-child(1){
  background-image: url("../../assets/images/s-20200808-13.jpg");
}
.wrapper .row:nth-child(5) > :nth-child(2){
  background-image: url("../../assets/images/s-20200808-14.jpg");
}
.wrapper .row:nth-child(5) > :nth-child(3){
  background-image: url("../../assets/images/s-20200808-15.jpg");
}
.wrapper .row:nth-child(6) > :nth-child(1){
  background-image: url("../../assets/images/s-20200808-16.jpg");
}
.wrapper .row:nth-child(6) > :nth-child(2){
  background-image: url("../../assets/images/s-20200808-17.jpg");
}
.wrapper .row:nth-child(6) > :nth-child(3){
  background-image: url("../../assets/images/s-20200808-18.jpg");
}
.wrapper .row:nth-child(7) > :nth-child(1){
  background-image: url("../../assets/images/s-20200808-19.jpg");
}
.wrapper .row:nth-child(7) > :nth-child(2){
  background-image: url("../../assets/images/s-20200808-20.jpg");
}
.wrapper .row:nth-child(7) > :nth-child(3){
  background-image: url("../../assets/images/s-20200808-21.jpg");
}
.wrapper .row:nth-child(8) > :nth-child(1){
  background-image: url("../../assets/images/s-20200808-22.jpg");
}
.wrapper .row:nth-child(8) > :nth-child(2){
  background-image: url("../../assets/images/s-20200808-23.jpg");
}
.wrapper .row:nth-child(8) > :nth-child(3){
  background-image: url("../../assets/images/s-20200808-24.jpg");
}
.wrapper .row:nth-child(9) > :nth-child(1){
  background-image: url("../../assets/images/s-20200808-25.jpg");
}
.wrapper .row:nth-child(9) > :nth-child(2){
  background-image: url("../../assets/images/s-20200808-26.jpg");
}
.wrapper .row:nth-child(9) > :nth-child(3){
  background-image: url("../../assets/images/s-20200808-27.jpg");
}
.wrapper .row:nth-child(10) > :nth-child(1){
  background-image: url("../../assets/images/s-20200808-28.jpg");
}
.wrapper .row:nth-child(10) > :nth-child(2){
  background-image: url("../../assets/images/s-20200808-29.jpg");
}
.wrapper .row:nth-child(10) > :nth-child(3){
  background-image: url("../../assets/images/s-20200808-30.jpg");
}
.wrapper .row:nth-child(11) > :nth-child(1){
  background-image: url("../../assets/images/rowerzyci13dz.jpg");
}