* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'tt_russo_sansregular', sans-serif;
}


html,
body {
    max-width: 100%;
    overflow-x: hidden;


}


@font-face {
    font-family: 'tt_russo_sansregular';
    src: url('../fonts/typetype_-_ttrussosans-regular-webfont.woff2') format('woff2'),
         url('../fonts/typetype_-_ttrussosans-regular-webfont.woff') format('woff'),
		 url('../fonts/typetype_-_ttrussosans-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'tt_russo_sansbold';
    src: url('../fonts/typetype_-_ttrussosans-bold-webfont.woff2') format('woff2'),
         url('../fonts/typetype_-_ttrussosans-bold-webfont.woff') format('woff'),
		 url('../fonts/typetype_-_ttrussosans-bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
.tt_russo{font-family: 'tt_russo_sansregular';}
.tt_russob{font-family: 'tt_russo_sansbold';}




body{    background-image: url(../img/bg.png);}


.header{

    width: 100%;
    height: 100px;
    background-color: #404040;
}

.contener {


    max-width: 1170px;
    height: 100px;
    margin: auto;
    padding-top: 16px;
    padding-bottom: 15px;
    padding-left: 18px;
    padding-right: 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}


.button{


    width: 190px;
    height: 50px;
 
    border: 1px solid #ffffff;
    background-color: #404040;
    font-size: 14px;
   color: white;
    letter-spacing: 1.6px;
    text-align: center;
    cursor: pointer;
        border-radius: 3px;

}


.button:hover{


    
    background-color: #ffffff;
   color: #404040;
       cursor: pointer;
}


.menu-top {
  display: flex;
  flex-direction: row;
  align-items: center;
}



.tel-top {   display: flex;
    align-items: center;
}

.tel-top p {font-family: tt_russo_sansbold;
font-size: 19px;
color: #ffffff;
letter-spacing: 0;
line-height: 28.8px;}










.menu-top p
{
  text-align:center;
  color: white;
  margin-right: 25px;
}

.menu-top img{ margin-right: 25px; }


.main {

   width: 100%;
margin: 0px;
   max-width: 1170px;
padding: 15px;
    margin: auto;



}


.boksy{
  display: flex;


   max-width: 1170px;

align-content: flex-start;

  flex-wrap: wrap;
  justify-content: space-between;

   }


.h1{
    
 max-width: 1140px;

    margin: auto;
    padding-left: 15px;
}


.box{

background: #FFFFFF;
border: 1px solid #DADADA;
border-radius: 16px;
max-width: 555px;
min-width: 350px;
width: 48%;
padding: 25px;



}

.box p{

    font-family: tt_russo_sansregular;
font-size: 16px;
color: #000000;
letter-spacing: 0;
line-height: 25px;
  margin-top: 20px;

}

.box .button{


    width: 220px;
    height: 50px;
 
    border: 1px solid #ffffff;
    background-color: #EA7201;
    font-size: 14px;
   color: white;
    letter-spacing: 1.6px;
    text-align: center;
    cursor: pointer;
    margin-top: 30px;

}

.box .button:hover{


 
    border: 1px solid #EA7201;
    background-color: white;

   color: #EA7201;

    cursor: pointer;



}

.promo-contener{

 background-image: url(../img/promo_bg.png);
 margin-bottom: 45px;

 }

.info { max-width: 1140px;

    margin: auto;
    display: flex;
flex-direction: row ;
 padding-top: 60px;
 align-items: center;


padding-left: 15px;
padding-right: 15px;
padding-bottom: 15px;
justify-content: space-around;
}



.text {

   
}

h1 {

font-size: 35px;
color: #EA7201;

}


h3 {

font-size: 25px;
color: #FFFFFF;
letter-spacing: 0;}
h2 {

font-size: 35px;
color: #FFFFFF;
letter-spacing: 0;}

.txt {

font-size: 18px;
color: #FFFFFF;
letter-spacing: 0;
margin-top: 35px;
margin-bottom: 35px;
max-width: 740px;
line-height: 25px;
}

h4 {

font-size: 15px;
color: #FFFFFF;
letter-spacing: 0;}


.box img{

   width: 100%;
  height: auto;
  max-width: 509px;

}

.box-bottom
{ margin-top: 25px;}

.box-left
{ margin-right: 25px;}

.salony{
width: 100%;
display: flex;
flex-direction: row;
max-width: 1920px;
align-content: center;
margin: auto;

}

.salon {

    width: 33%;
   border: 10px solid white;
   
}


.dojazd-contener

{
    background-color: #ECECEC;



}

.dojazd { max-width: 1140px;

    margin: auto;
}

.black {color: #000000}

.tel {   display: flex;
    align-items: center;
}
.tel img {margin-right: 20px}

.tel p {font-family: tt_russo_sansbold;
font-size: 19px;
color: #000000;
letter-spacing: 0;
line-height: 28.8px;}
.thumb{margin-top: 30px; margin-bottom: 0px;}

.nazwa {
font-size: 30px;
color: #EA7201;
letter-spacing: 0;
padding-top: 20px;
}



.dane {max-width: 480px;
}

.footer-contener {
    background-color: #404040; 
   padding-bottom: 15px;
   padding-top: 60px;
}

.footer {max-width: 1140px;

    margin: auto;

      display: flex;
  flex-direction: row;
  align-items: center;
  height: 100%;
  justify-content: center;
margin-bottom: 70px;

}

.footer p {font-family: tt_russo_sansregular;
font-size: 25px;
color: #FFFFFF;
letter-spacing: 0;
margin-right: 30px;


}

.copy {padding-left: 15px;}

.footer img {margin-right: 22px;}


.copy {

  height: 15px;
padding-bottom: : 20px;


      color: white;
       background-color: #404040; 
       max-width: 1140px;

    margin: auto;


}

.mapa img {

   width: 100%;
  height: auto;

}

.sm{
display: flex;
    flex-direction: row;
    align-items: center;
}


.txt a {

text-decoration: none;
color: black;

}

.txt a:hover {

    color: #EA7201;
}


@media screen and (max-width: 600px) {

.box {width: 100%}
.box-left {margin-right: 0px}

.tel-top {  margin-top: 20px;}

.header{
    height: 270px;
}

.contener {
  flex-direction: column;
  padding-top: 26px;

}

.menu-top {
  display: flex;
  flex-direction: column;
  align-items: center;

}


.contener div {margin-bottom: 20px;}



.box-top { margin-top: 25px; }


.info {
 flex-direction: column;  

  }
 .text {margin-top: 25px;}

 .mobile {display: none}






 .footer {flex-direction: column;}

.sm{margin-top: 25px}








