/*----------------------TE SAME ELEMENTY NA KAŻDEJ STRONIE(HEADER, NAV, FOOTER)---------------------------------*/
body {
    margin: 20px;
    padding: 0px;
    color: #111;}

* {
box-sizing: border-box;}

/*header*/
header {
    width: 90%;
    margin: 40px auto 20px auto;}

.header__logo {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 12px;
    margin-bottom: 2px;}

.header__logo a {
    text-decoration: none;
    list-style-type: none;
    color: #727272;
    opacity: 0.5;}

.header__logo a:hover {
    text-decoration: none;
    color: black;
    opacity: 1;}

.header__description {
    text-transform: uppercase;
    font-weight: 500;
    font-size: 10px;
    color: #727272;}

/*NAV*/
ul>li {
    text-transform: uppercase;
    font-weight: 500;
    font-size: 12px;
    list-style-type: none;
    float: left;}

ul>li>a {
    list-style-type: none;
    color: #727272;
    margin: 10px;}

ul>li>a:hover {
     text-decoration: none;}

.sidebar {
    margin: 20px 0px 0px 0px;
    padding-top: 20px;
    width: 50%;
    position: absolute;
    top: 15px;
    height: 15%;
    left: 175px;
    text-align: center;
    font-size: 10px;}

.socials {
    width: 183px;}

/*FOOTER*/
footer {
   margin-top: 20px;}

.footer__socials {
    margin: 20px auto;
    text-align: center;}

.footer__rights {
    font-size: 12px;
    text-align: center;
    margin-bottom: 20px;}

i:hover{
    opacity: 0.7;}
/*-------------------------------------------KONIEC--------------------------------------------------*/
/*------------------------------------STRONA GŁÓWNA---------------------------------------*/

/*PORTFOLIO*/
.container {
    margin-top: 40px;
    display: block;}

.gallery__item {
    width: 100%;
    height: 100%;
    position: relative;
    margin-bottom: 2px;}

.gallery__item .img {
    width: 100%;
    height: 100%;
    overflow: hidden;}

.gallery__item .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
    cursor: pointer;
    transition: 0.5s ease-in-out;}

.gallery__item:hover .img img{
    opacity: 0.6;}

.w-1 {
    grid-column: span 1;}

.w-2 {
    grid-column: span 2;}

.w-3 {
    grid-column: span 3;}

.w-4 {
    grid-column: span 4;}

.w-5 {
    grid-column: span 5;}

.w-6 {
    grid-column: span 6;}

.w-7 {
    grid-column: span 7;}

.w-8 {
    grid-column: span 8;}

.w-9 {
    grid-column: span 9;}

.w-10 {
    grid-column: span 10;}

.w-11 {
    grid-column: span 11;}

.w-12 {
    grid-column: span 12}


.h-1 {
    grid-row: span 1;}

.h-2 {
    grid-row: span 2;}

.h-3 {
    grid-row: span 3;}

.h-4 {
    grid-row: span 4;}

.h-5 {
    grid-row: span 5;}

.h-6 {
    grid-row: span 6;}

.h-7 {
    grid-row: span 7;}

.h-8 {
    grid-row: span 8;}

.h-9 {
    grid-row: span 9;}

.h-10 {
    grid-row: span 10;}

.h-11 {
    grid-row: span 11;}

.h-12 {
    grid-row: span 12;}

/*----------------------------------------PODSTRONA ABOUT I CONTACT--------------------------------*/
/*ABOUT*/
.about {
    padding:20px;
    margin: 20px auto;
    width: 90%;}

.about h4 {
    text-align: center;
    text-transform: uppercase;}

.about img {
    max-width: 100%;
    height: auto;
    margin: 20px auto;}
.about p {
    margin: auto;
    font-size: 15px;
    text-align: justify;}

/*CONTACT*/
.contact {
    padding:20px;
    margin: 20px auto;
    width: 90%;}

.contact h4 {
    text-align: center;
    text-transform: uppercase;}

form {
    width: 100%;
    margin: 20px auto;}

.form-info {
    margin: 0px auto!important;
    width: 100%;}

.form-info label{
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 1px;
    margin: 6px 0px;}

input[type=text] {
    display: block;
    width: 284px;
    padding: 12px 0px;
    border: 1px solid #ccc;
    border-radius: 4px;}

.text {
    margin-bottom: 5px;}
input[type=text] {
    width: 100%;}
input[type=checkbox] {
    font-size: 10px;}

input[type=textarea] {
  width: 1000px;}

.form-checkbox {
    margin-top: 10px;}

.form-checkbox label {
    display: inline;}

button[type=submit] {
    margin: 10px 0px;
    background-color: #616161;
    width: 100%;}

/*-------------------------------------------------PODSTRONY Z VIDEO--------------------------------------------*/
/*VIDEO*/
.video {
    margin-bottom: 20px;}

.iframe-container {
    width: 100%;
    padding-bottom: 56%;
    height: 0;
    margin-top: 47px;}


.iframe-container iframe {
    width: 100%;
    height: 200px;
}

/*OPIS DO VIDEO*/
.description {
    margin: 0px auto 10px auto;
    width: 90%;
    font-size: 12px;}

/*ZDJĘCIA DO VIDEO*/
.photos img {
    max-width: 100%;
    height: auto;
    margin: 1px 0px;}
.photos img:hover {
    opacity: 0.8;
    cursor: pointer;}

/*REKLAMA MONSHAAT*/

.photos .img__video {
    margin-top: 20px;
    margin-bottom: 20px;}

.photos .img__video:hover {
    opacity: 1;}
/*-----------------------------------------------------RWD------------------------------------------------*/
/*-------------------------------------------------mniej niż 350px-----------------------------------*/
@media screen and (max-width: 350px){

.sidebar {
    width: 55%;
    left: 137px;}
}


/*----------------------------------------------------------------374 - 399px-------------------------------------------*/
@media screen and (min-width: 374px)and (max-width: 399px){
.sidebar {
    width: 47%;
    left: 189px;}

/*------------------PODSTRONA---------------*/
/*CONTACT*/
input[type=text] {
    width: 297px;}
}

/*----------------------------------------------------------------400 - 450px-------------------------------------------*/
@media screen and (min-width: 400px)and (max-width: 450px){
.sidebar {
    width: 44%;
    left: 225px;}

/*------------------PODSTRONA---------------*/



/*-------PODSTRONY Z VIDEO--------*/
/*VIDEO*/
.video {
    margin-bottom: 0px;}
}

/*----------------------------------------------------------------451 - 499px-------------------------------------------*/
@media screen and (min-width: 451px)and (max-width: 499px){
.sidebar {
    width: 37%;
    left: 290px;}

/*------------------PODSTRONA---------------*/

/*CONTACT*/
form {
    width: 100%;
    margin: 20px auto;}

.form-info {
    margin: 0px auto!important;
    width: 100%;}

input[type=text] {
    width: 100%;}

button[type=submit] {
    width: 100%;}

/*-------PODSTRONY Z VIDEO--------*/
/*VIDEO*/
.video {
    margin-bottom: 0px;}
}

/*----------------------------------------------------------------500 - 600px-------------------------------------------*/
@media screen and (min-width: 500px)and (max-width: 600px){
header {
    width: 93%; }

.sidebar {
    width: 33%;
    left: 350px;}

.gallery__item {
    margin-bottom: 2px;}

/*------------PODSTRONA---------------*/
/*ABOUT*/
.about img {
    max-width: 100%;
    height: auto;
    margin: 20px auto;}

/*CONTACT*/

/*CONTACT*/
form {
    width: 90%;
    margin: 20px auto;}

.form-info {
    margin: 0px auto!important;
    width: 100%;}

input[type=text] {
    width: 100%;}

button[type=submit] {
    width: 100%;}

/*---------PODSTRONY Z VIDEO--------*/
.video {
    margin-bottom: 0px;}

.iframe-container iframe {
    width: 100%;
    height: 300px;}
}

/*----------------------------------------------------------------601 - 650px-------------------------------------------*/
@media screen and (min-width: 601px)and (max-width: 650px){
header {
    width: 80%;}

.sidebar {
    left: 404px;
    width: 30%; }

 /*----------STRONA GŁÓWNA---------------*/
.container {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: auto;
    grid-gap: 2px;
    grid-auto-flow: dense;}

.gallery__item {
    margin-bottom: 0px;}

/*------------------PODSTRONA---------------*/
/*CONTACT*/
form {
    width: 80%;
    margin: 20px auto;}

.form-info {
    margin: 0px auto!important;
    width: 100%;}

input[type=text] {
    width: 100%;}

button[type=submit] {
    width: 100%;}

/*-------PODSTRONY Z VIDEO-----------*/
.video {
    margin-bottom: 0px;}

.iframe-container {
    width: 79%;
    padding-bottom: 50%;
    margin: 47px auto 0px auto;}

.iframe-container iframe {
    width: 100%;
    height: 300px;}

/*OPIS DO VIDEO*/
.description {
    width: 79%;}

/*ZDJĘCIA DO VIDEO*/
.photos {
    width: 90%;}

.photos img {
    max-width: 90%;
    height: auto;
    margin: 1px 0px 1px 66px;}
}

/*----------------------------------------------------------------651 - 700px-------------------------------------------*/
@media screen and (min-width: 651px)and (max-width: 700px){
header {
    width: 76%;}

.sidebar {
    width: 34%;
    left: 422px;}

/*---------STRONA GŁÓWNA-----------*/
.container {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: auto;
    grid-gap: 2px;
    grid-auto-flow: dense; }

.gallery__item {
    margin-bottom: 0px;}

/*------------PODSTRONA-------------------*/
/*CONTACT*/
form {
    width: 80%;
    margin: 20px auto;}

.form-info {
    margin: 0px auto!important;
    width: 100%;}

input[type=text] {
    width: 100%;}

button[type=submit] {
    width: 100%;}

/*-------PODSTRONY Z FILMIKAMI-----------*/
.video {
    margin-bottom: 0px;}

.iframe-container {
    width: 77%;
    padding-bottom: 45%;
    margin: 47px auto 0px auto;}

.iframe-container iframe {
    width: 100%;
    height: 300px;}

/*OPIS DO VIDEO*/
.description {
    width: 77%;}

/*ZDJĘCIA DO VIDEO*/
.photos {
    width: 85%;}

.photos img {
    max-width: 90%!important;
    height: auto;
    margin: 1px 0px 1px 77px;}
}

/*----------------------------------------------------------------701 - 750px-------------------------------------------*/
@media screen and (min-width: 701px)and (max-width: 750px){
header {
    width: 70%;}

.sidebar {
    width: 24%;
    left: 453px;}

/*---------STRONA GŁÓWNA-----------*/
.container {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: auto;
    grid-gap: 2px;
    grid-auto-flow: dense; }

.gallery__item {
    margin-bottom: 0px;}

/*---------PODSTRONA-----------*/
/*CONTACT*/
form {
    width: 70%;
    margin: 20px auto;}

.form-info {
    margin: 0px auto!important;
    width: 100%;}

input[type=text] {
    width: 100%;}

button[type=submit] {
    width: 100%;}

/*-------PODSTRONY Z FILMIKAMI-----------*/
.video {
    margin-bottom: 0px;}

.iframe-container {
    width: 77%;
    padding-bottom: 45%;
    margin: 47px auto 0px auto;}

.iframe-container iframe {
    width: 100%;
    height: 300px;}

/*OPIS DO VIDEO*/
.description {
    width: 77%;}

/*ZDJĘCIA DO VIDEO*/
.photos {
    width: 85%;}

.photos img {
    max-width: 90%!important;
    height: auto;
    margin: 1px 0px 1px 77px;}

}

/*----------------------------------------------------------------751 - 900x-------------------------------------------*/
@media screen and (min-width: 751px)and (max-width: 900px){
header {
    width: 56%;
    margin: 100px auto 20px auto;}

.header__logo {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 20px;
    margin-bottom: 2px;}

.header__logo a {
    text-decoration: none;
    list-style-type: none;
    color: #727272;
    opacity: 0.5;}

.header__logo a:hover {
    text-decoration: none;
    color: black;
    opacity: 1;}

.header__description {
    text-transform: uppercase;
    font-weight: 500;
    font-size: 14px;
    color: #727272;}

/*NAV*/
.sidebar {
    margin: 0;
    padding: 0;
    width: 215px;
    position: fixed;
    top: 160px;
    left: -31px;
    height: 100%;
    overflow: auto;
    display: block;}

.sidebar a {
    color: #727272;;
    text-decoration: none;
    list-style-type: none;}

.sidebar a.active {
    opacity: 1;
    color: black;}

.sidebar a:hover:not(.active) {
    color: black;}

ul {
    height: 40px;
    position: absolute;
    left: 73px;}

ul>li {
    text-transform: uppercase;
    font-weight: 500;
    font-size: 14px;
    list-style-type: none;
    clear: both;}

.first__nav {
    margin-left: 22px;}


.socials {
    width: 274px;
    position: absolute;
    top: 50px;
    left: -25px;}

/*---------STRONA GŁÓWNA--------*/
.container {
    margin: -5px;
    width: 60% !important;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: auto;
    grid-gap: 2px;
    grid-auto-flow: dense;}

.gallery__item {
    margin-bottom: 0px;}

/*---------------PODSTRONA-----------------------*/
/*ABOUT*/
.about img {
    width: 65%;
    margin-top: -25px;
    margin-left: 110px;}

.about p {
    width: 50%;}

/*CONTCAT*/

/*CONTACT*/
form {
    width: 50%;
    margin: 20px auto;}

.form-info {
    margin: 0px auto!important;
    width: 100%;}

input[type=text] {
    width: 100%;}

button[type=submit] {
    width: 100%;}

/*-------PODSTRONY Z VIDEO-----------*/
.iframe-container {
    width: 70%;
    padding-bottom: 26%!important;
    margin: -2px 0px 20px 170px;}

.iframe-container iframe {
    width: 80%;
    height: 200px;}

/*OPIS DO VIDEO*/
.description {
    width: 56%;}

/*ZDJĘCIA DO VIDEO*/
.photos {
    width: 63%;}

.photos img {
    max-width: 90%!important;
    margin: 1px 0px 1px 167px;}

}

/*----------------------------------------------------------------901 - 1025px-------------------------------------------*/
@media screen and (min-width: 901px)and (max-width: 1025px){
header {
    width: 56%;
    margin: 100px auto 20px auto;}

.header__logo {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 20px;
    margin-bottom: 2px;}

.header__logo a {
    text-decoration: none;
    list-style-type: none;
    color: #727272;
    opacity: 0.5;}

.header__logo a:hover {
    text-decoration: none;
    color: black;
    opacity: 1;}

.header__description {
    text-transform: uppercase;
    font-weight: 500;
    font-size: 14px;
    color: #727272;}

/*NAV*/
.sidebar {
    margin: 0;
    padding: 0;
    width: 215px;
    position: fixed;
    top: 163px;
    left: 13px;
    height: 100%;
    overflow: auto;
    display: block;}

.sidebar a {
    color: #727272;;
    text-decoration: none;
    list-style-type: none;}

.sidebar a.active {
  opacity: 1;
  color: black;}

.sidebar a:hover:not(.active) {
  color: black;}

ul{
    height: 40px;
    position: absolute;
    left: 73px;}

ul>li {
    text-transform: uppercase;
    font-weight: 500;
    font-size: 14px;
    list-style-type: none;
    clear: both;}

.first__nav {
    margin-left: 22px;}


.socials {
    width: 274px;
    position: absolute;
    top: 50px;
    left: -25px;}

/*---------STRONA GŁÓWNA------------*/
.container {
    margin: 0px;
    width: 60% !important;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: auto;
    grid-gap: 2px;
    grid-auto-flow: dense;}

/*---------------PODSTRONA-----------------------*/

/*ABOUT*/
.about {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: auto;
    width: 66%;
    margin-top: -39px;}

.about img {
    width: 80%;
    margin: 20px auto;}


/*CONTACT*/
form {
    width: 60%;
    margin: 20px auto;}

.form-info {
    margin: 0px auto!important;
    width: 100%;}

input[type=text] {
    width: 100%;}

button[type=submit] {
    width: 100%;}

/*-------PODSTRONY Z FILMIKAMI-----------*/
.iframe-container {
    width: 70%;
    padding-bottom: 30%;
    margin: -2px 0px 20px 222px;}

.iframe-container iframe {
    width: 80%;
    height: 300px;}

/*OPIS DO VIDEO*/
.description {
    width: 56%;}

/*ZDJĘCIA DO VIDEO*/
.photos {
    width: 63%;}

.photos img {
    max-width: 90%!important;
    margin: 1px 0px 1px 222px;}

}

/*----------------------------------------------------------------1026 - 1400px-------------------------------------------*/
@media screen and (min-width: 1026px)and (max-width: 1400px){
/*header*/
header {
    width: 68%;
    margin-top: 100px;}

.header__logo {
    font-size: 20px;
    margin-bottom: 2px;}

.header__description {
    font-size: 14px;
    color: #727272;}

/*NAV*/
.sidebar {
    margin: 0;
    padding: 0;
    width: 215px;
    position: fixed;
    top: 163px;
    left: 0px;
    height: 100%;
    overflow: auto;
    display: block;}

.sidebar a {
    color: #727272;;
    text-decoration: none;
    list-style-type: none;}

.sidebar a.active {
    opacity: 1;
    color: black;}

.sidebar a:hover:not(.active) {
    color: black;}

ul{
    height: 40px;
    position: absolute;
    left: 73px;}

ul>li {
    text-transform: uppercase;
    font-weight: 500;
    font-size: 14px;
    list-style-type: none;
    clear: both;}

.first__nav {
    margin-left: 22px;}

.socials {
    width: 274px;
    position: absolute;
    top: 50px;
    left: -25px;}

/*----------STRONA GŁÓWNA----------*/
/*PORTFOLIO*/
.container {
    width: 70% !important;
    margin-top: 0px;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: auto;
    grid-gap: 2px;
    grid-auto-flow: dense;}

.gallery__item {
    width: 100%;
    height: 100%;
    position: relative;
    margin-bottom: 0px;}

.gallery__item .img {
    width: 100%;
    height: 100%;
    overflow: hidden;}

.gallery__item .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
    cursor: pointer;
    transition: 0.5s ease-in-out;}

.gallery__item:hover .img img{
    opacity: 0.6;}

/*---------------PODSTRONA-----------------*/

/*ABOUT*/
.about {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: auto;
    width: 78%;
    margin-top: -39px;}

.about img {
    width: 80%;
    margin: 20px auto;}

/*CONTACT*/
form {
    width: 40%;
    margin: 20px auto;}

.form-info {
    margin: 0px auto!important;
    width: 100%;}

input[type=text] {
    width: 100%;}

button[type=submit] {
    width: 100%;}


/*-------PODSTRONY Z VIDEO-----------*/
.iframe-container {
    width: 85%;
    padding-bottom: 30%;
    margin: -2px 0px 20px 206px;}

.iframe-container iframe {
    width: 80%;
    height: 400px;}

/*OPIS DO VIDEO*/
.description {
    width: 67%;}

/*ZDJĘCIA DO VIDEO*/
.photos {
    width: 76%;}

.photos img {
    max-width: 90%!important;
    margin: 1px 0px 1px 206px;}
}

/*----------------------------------------------------------------1401 - 1500px-------------------------------------------*/
@media screen and (min-width: 1401px)and (max-width: 1500px){
/*header*/
header {
    width: 73%;
    margin: 100px auto 0px auto;}

.header__logo {
    font-size: 20px;
    margin-bottom: 2px;}

.header__description {
    font-size: 14px;
    color: #727272;}

/*NAV*/
.sidebar {
    margin: 0;
    padding: 0;
    width: 215px;
    position: fixed;
    top: 160px;
    left: 0px;
    height: 100%;
    overflow: auto;
    display: block;}

.sidebar a {
    color: #727272;;
    text-decoration: none;
    list-style-type: none;}

.sidebar a.active {
  opacity: 1;
  color: black;}

.sidebar a:hover:not(.active) {
  color: black;}

ul{
    height: 40px;
    position: absolute;
    left: 73px;}

ul>li {
    text-transform: uppercase;
    font-weight: 500;
    font-size: 14px;
    list-style-type: none;
    clear: both;}

.first__nav{
    margin-left: 22px;}


.socials {
    width: 274px;
    position: absolute;
    top: 50px;
    left: -25px;}

/*-------------STRONA GŁÓWNA--------------*/
/*PORTFOLIO*/
.container {
    width: 100%!important;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: auto;
    grid-gap: 2px !important;
    grid-auto-flow: dense;
    margin-top:0;
    padding: 0px 50px!important;
}

.first__img {
    height: 200px;}

.gallery__item {
    width: 100%;
    height: 100%;
    position: relative;
    margin-bottom: 0px;}

.gallery__item .img {
    width: 100%;
    height: 100%;
    overflow: hidden;}

.gallery__item .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
    cursor: pointer;
    transition: 0.5s ease-in-out;}

.gallery__item:hover .img img {
    opacity: 0.6;}

.first__img {
    height: 200px !important;}

main {
    width: 83% !important;
    margin: 20px auto;}

/*------------PODSTRONA---------*/
/*ABOUT*/
.about {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: auto;
    width: 100%;
    margin-top: -42px;}

.about img {
    width: 80%;
    margin: 20px auto;}



/*-------PODSTRONY Z VIDEO-----------*/
.iframe-container {
    width: 63%;
    padding-bottom: 28%;
    margin: -2px 0px 44px 196px!important;}

.iframe-container iframe {
    width: 80%;
    height: 430px;}

/*OPIS DO VIDEO*/
.description {
    width: 72%;
    margin-top: 10px;}

/*ZDJĘCIA DO VIDEO*/
.photos {
    width: 51%;}

.photos img {
    max-width: 100%!important;
    margin: 0px 0px 1px 196px!important;}
}

/*----------------------------------------------------------------1501 - 1599px-------------------------------------------*/
@media screen and (min-width: 1401px)and (max-width: 1599px){
/*header*/
header {
    width: 73%;
    margin: 100px auto 0px auto;}

.header__logo {
    font-size: 20px;
    margin-bottom: 2px;}

.header__description {
    font-size: 14px;
    color: #727272;}

/*NAV*/
.sidebar {
    margin: 0;
    padding: 0;
    width: 215px;
    position: fixed;
    top: 160px;
    left: 0px;
    height: 100%;
    overflow: auto;
    display: block;}

.sidebar a {
    color: #727272;;
    text-decoration: none;
    list-style-type: none;}

.sidebar a.active {
  opacity: 1;
  color: black;}

.sidebar a:hover:not(.active) {
  color: black;}

ul{
    height: 40px;
    position: absolute;
    left: 73px;}

ul>li {
    text-transform: uppercase;
    font-weight: 500;
    font-size: 14px;
    list-style-type: none;
    clear: both;}

.first__nav{
    margin-left: 22px;}


.socials {
    width: 274px;
    position: absolute;
    top: 50px;
    left: -25px;}

/*-------------STRONA GŁÓWNA--------------*/
/*PORTFOLIO*/
.container {
    width: 100% !important;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: auto;
    grid-gap: 2px !important;
    grid-auto-flow: dense;
    margin-top:0;}

.first__img {
    height: 200px;}

.gallery__item {
    width: 100%;
    height: 100%;
    position: relative;
    margin-bottom: 0px;}

.gallery__item .img {
    width: 100%;
    height: 100%;
    overflow: hidden;}

.gallery__item .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
    cursor: pointer;
    transition: 0.5s ease-in-out;}

.gallery__item:hover .img img {
    opacity: 0.6;}

.first__img {
    height: 200px !important;}

main {
    width: 83% !important;
    margin: 20px auto;}

/*------------PODSTRONA---------*/
/*ABOUT*/
.about {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: auto;
    width: 100%;
    margin-top: -42px;}

.about img {
    width: 80%;
    margin: 20px auto;}


/*CONTACT*/
form {
    width: 40%;}

/*-------PODSTRONY Z VIDEO-----------*/
.iframe-container {
    width: 63%;
    padding-bottom: 28%;
    margin: -2px 0px 20px 209px;}

.iframe-container iframe {
    width: 80%;
    height: 430px;}

/*OPIS DO VIDEO*/
.description {
    width: 72%;}

/*ZDJĘCIA DO VIDEO*/
.photos {
    width: 51%;}

.photos img {
    max-width: 100%!important;
    margin: 1px 0px 1px 210px;}
}

/*----------------------------------------------------------------1600 - 1700px-------------------------------------------*/
@media screen and (min-width: 1600px)and (max-width: 1700px){
/*header*/
header {
    width: 69%;
    margin: 100px auto 0px auto;}

.header__logo {
    font-size: 20px;
    margin-bottom: 2px;}

.header__description {
    font-size: 14px;
    color: #727272;}

/*NAV*/
.sidebar {
    margin: 0;
    padding: 0;
    width: 215px;
    position: fixed;
    top: 160px;
    left: 38px;
    height: 100%;
    overflow: auto;
    display: block;}

.sidebar a {
    color: #727272;;
    text-decoration: none;
    list-style-type: none;}

.sidebar a.active {
    opacity: 1;
    color: black;}

.sidebar a:hover:not(.active) {
    color: black;}

ul {
    height: 40px;
    position: absolute;
    left: 73px;}

ul>li {
    text-transform: uppercase;
    font-weight: 500;
    font-size: 14px;
    list-style-type: none;
    clear: both;}

.first__nav{
    margin-left: 22px;}

.socials {
    width: 274px;
    position: absolute;
    top: 50px;
    left: -25px;}

/*----------------STRONA GŁÓWNA-----------*/
/*PORTFOLIO*/
.container {
    width: 100% !important;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: auto;
    grid-gap: 2px;
    grid-auto-flow: dense;
    margin-top:0;}

/*------------PODSTRONA---------*/
/*ABOUT*/
.about {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: auto;
    width: 79%;
    margin-top: -42px;}

.about img {
    width: 80%;
    margin: 20px auto;}


/*CONTACT*/
form {
    width: 40%;
    margin: 20px auto;}

/*-------PODSTRONY Z VIDEO-----------*/
.iframe-container {
    width: 63%;
    padding-bottom: 26%;
    margin: -2px 0px 20px 256px;}

.iframe-container iframe {
    width: 80%;
    height: 430px;}

/*OPIS DO VIDEO*/
.description {
    width: 69%;}

/*ZDJĘCIA DO VIDEO*/
.photos {
    width: 51%;}

.photos img {
    max-width: 100%!important;
    margin: 1px 0px 1px 255px;}
}

/*----------------------------------------------------------------1700 - 1900px-------------------------------------------*/
@media screen and (min-width: 1701px)and (max-width: 1900px){
/*header*/
header {
    width: 62%;
    margin: 100px auto 0px auto;}

.header__logo {
    font-size: 20px;
    margin-bottom: 2px;}

.header__description {
    font-size: 14px;
    color: #727272;}

/*NAV*/
.sidebar {
    margin: 0;
    padding: 0;
    width: 215px;
    position: fixed;
    top: 163px;
    left: 115px;
    height: 100%;
    overflow: auto;
    display: block;}

.sidebar a {
    color: #727272;;
    text-decoration: none;
    list-style-type: none;}

.sidebar a.active {
    opacity: 1;
    color: black;}

.sidebar a:hover:not(.active) {
    color: black;}

ul {
    height: 40px;
    position: absolute;
    left: 73px;}

ul>li {
    text-transform: uppercase;
    font-weight: 500;
    font-size: 14px;
    list-style-type: none;
    clear: both;}

.first__nav {
    margin-left: 22px;}

.socials {
    width: 274px;
    position: absolute;
    top: 50px;
    left: -25px;}

/*---------STRONA GŁÓWNA----------*/
/*PORTFOLIO*/
.container {
    width: 100% !important;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: auto;
    grid-gap: 2px !important;
    grid-auto-flow: dense;
    margin-top:0;}

.gallery__item {
    margin-bottom: 0px;}

/*------------PODSTRONA---------*/
/*ABOUT*/
.about {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: auto;
    width: 71%;
    margin-top: -36px;}

.about img {
    width: 80%;
    margin: 20px auto;}

.about p {
    width: 90%;}

form {
    width: 40%;}

/*-------PODSTRONY Z VIDEO-----------*/
.iframe-container {
    width: 63%;
    padding-bottom: 24%;
    margin: -2px 0px 20px 339px;}

.iframe-container iframe {
    width: 80%;
    height: 430px;}

/*OPIS DO VIDEO*/
.description {
    width: 62%;}

/*ZDJĘCIA DO VIDEO*/
.photos {
    width: 51%;}

.photos img {
    max-width: 100%!important;
    margin: 1px 0px 1px 341px;}
}

/*---------------------------------------------------------------1901px i więcej-------------------------------------------*/

@media screen and (min-width: 1901px){
/*header*/
header {
    width: 58%;
    margin: 100px auto 0px auto;}

.header__logo {
    font-size: 20px;
    margin-bottom: 2px;}

.header__description {
    font-size: 14px;
    color: #727272;}

/*NAV*/
.sidebar {
    margin: 0;
    padding: 0;
    width: 215px;
    position: fixed;
    top: 163px;
    left: 198px;
    height: 100%;
    overflow: auto;
    display: block;}

.sidebar a {
    color: #727272;;
    text-decoration: none;
    list-style-type: none;}

.sidebar a.active {
    opacity: 1;
    color: black;}

.sidebar a:hover:not(.active) {
    color: black;}

ul {
    height: 40px;
    position: absolute;
    left: 73px;}

ul>li {
    text-transform: uppercase;
    font-weight: 500;
    font-size: 14px;
    list-style-type: none;
    clear: both; }

.first__nav{
    margin-left: 22px;}


.socials {
    width: 274px;
    position: absolute;
    top: 50px;
    left: -25px;}

/*--------------STRONA GŁÓWNA------------*/
/*PORTFOLIO*/
.container {
    width: 100% !important;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: auto;
    grid-gap: 2px !important;
    grid-auto-flow: dense;
    margin-top:0;
    max-width: 1460px!imoportant;}

.gallery__item {
    margin-bottom: 0px;}

/*------------PODSTRONA---------*/
/*ABOUT*/
.about {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: auto;
    width: 66%;
    margin-top: -36px;}

.about img {
    width: 80%;
    margin: 20px auto;}

.about p {
    width: 90%;}


/*CONTACT*/
form {
    width: 40%;}

/*-------PODSTRONY Z FILMIKAMI-----------*/

/*VIDEO*/
.iframe-container {
    width: 63%;
    padding-bottom: 22%;
    margin: -2px 0px 20px 403px;}

.iframe-container iframe {
    width: 80%;
    height: 430px;}

/*OPIS DO VIDEO*/
.description {
    width: 58%;}

/*ZDJĘCIA DO VIDEO*/
.photos {
    width: 51%;}

.photos img {
    max-width: 100%!important;
    margin: 1px 0px 1px 401px;}
}

.success {
  padding: 1em;
  margin-bottom: 0.75rem;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  color: #468847;
  background-color: #dff0d8;
  border: 1px solid #d6e9c6;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}

.error {
  padding: 1em;
  margin-bottom: 0.75rem;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  color: #b94a48;
  background-color: #f2dede;
  border: 1px solid rgba(185, 74, 72, 0.3);
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}