html 
{
    scroll-behavior: smooth;
}

body
{
    margin: 0;
    
}

h1
{
    font-family: 'Bebas Neue', sans-serif;
}

p 
{
    font-family: 'Kumbh Sans', sans-serif;
}

a
{
    text-decoration: none;
    color: white;
    font-family: 'Kumbh Sans', sans-serif;
}


/*---------SECTION HEADER-------------------------------------------------------------------*/


#header_scissors
{
    position: relative;
}

#scissors
{
    background-image: url("grafiki/Mask\ Group\ 4.png");
    background-size: 20vw;
    position: absolute;
    background-repeat: no-repeat;
    width: 16vw;
    height: 20vw;
    left: 25vw;
    bottom: -3.2vw;
}

#logo_white
{
    background-image: url("grafiki/LogoTop.png");
    background-size: 20vw;
    position: absolute;
    background-repeat: no-repeat;
    width: 21vw;
    height: 15vw;
    right: 11vw;
    top: -3vw;
}

#sec_background
{
    /*background-color: rgb(65, 16, 16);*/
    background-image: url("grafiki/Mask\ Group\ 5.png");
    background-size: 100vw;
    max-height: 50vw;
    background-repeat: no-repeat;
    height: 720px;
    
    margin: 0;
    position:relative;
    overflow:hidden;
    z-index: 0;
}

#sec_background:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 0;
    border-bottom: 5vw solid white;
    border-left: 50vw solid transparent;
    border-right: 50vw solid transparent;
}

#topnav
{
    background: rgb(0,0,0);
    background: linear-gradient(100deg, rgba(0,0,0,1) 45%, rgba(255,255,255,0) 57%, rgba(9,9,121,0) 100%);
    height: 60px;
    top: 35px;
    position: relative;
    display: block;
    
}

.menu
{
    padding-left: 25px;
    margin: 0;
}

.menu li
{
    display: inline-block;
    list-style-type: none;
    margin-top: 20.5px;
    margin-right: 3vw ;
    font-size: 19px;

}

.menu li:first-child
{
    margin-left: 2vw;
}

.menu li a:hover
{
    color: gray
}


.socials
{
    
    float:left;
    font-size: 30px;
    margin-top: 13px;
}

.socials a
{
    text-decoration: none;
    color: black;
    display: block;
    
}

.socials a:hover
{
    color: white;
}

.insta
{
    background-color: white;
    border-radius: 15px;
    padding-top: 2px; 
    color: black;
}

.insta:hover
{
    background-color: black;
    color:white;
    cursor: pointer;
}

.fb
{
    background-color: white;
    margin-left: 20px;
    border-radius: 15px;
    padding-top: 2px; 
}
.fb:hover
{
    background-color: black;
    color:white;
    cursor: pointer;
}

.divmenu
{
    float:left;
}

.divheader
{
    margin-left: 10%;
    margin-top: 10%;
    color: white;
}

.divheader h1
{
    font-size: 7vw;
    margin-bottom: 0;
}

.divheader p 
{
     font-size: 1.05vw;
     padding-left: 7px;
     margin-top: -2px;
     
}

.header_button
{
    background-color: rgba(71, 69, 69, 0.9);
    letter-spacing: 1px;
    width: 15.1vw;
    text-align: center;
    border: 1px solid orangered;
    padding: 0.5vw;
    margin-left: 7px;
    font-weight: 700;
}

.header_button:hover
{
    background-color: rgba(53, 51, 51, 0.9);
}

.header_button p
{
    margin: 0;
    padding: 0;
    font-size: 1.1vw;
}



/*----------SCETION ONE-----------------------------------------------------------------------------------------*/

#logo
{
    text-align: center;
}

#logo img
{
    margin-right: 1vw;
}

#hours
{
    position: relative;
}
.table_hours
{
    margin-left: auto;
    margin-right: auto;
}

.table_hours p
{
    margin: 0;
    font-size: 1.3vw;
}

#hours_open_header
{
    text-align: center;
    
}

#hours_open_header h1
{
    margin: 0;
    margin-top: 40px;
    font-size: 7vw;
}

#razor_img img
{
    background-repeat: no-repeat;
    width: 10vw;
    height: 19vw;
    position: absolute;
    top: -4vw;
    left: 17vw;
}

/*--------SECTION TWO CONTACTS--------------------------------------------------------------------------------------------------------------------*/
#section_two_background
{
    background-image: url("grafiki/contactBackground.png");
    background-size: 100vw;
    background-repeat: no-repeat;
    height: 647px;
    max-height: 34vw;
}

#all_contacts
{
   padding-top: 12vw;
}

#contact_header
{
    color: white;
    margin-left: 29.2vw;
    float: left; 
}

#contact_header h1
{
    font-size: 7vw;
    margin: 0;
}

#contacts_info
{
    
    font-size: 1.5vw;
    float: left;
    margin-top: 1.2vw;
}


#icon_location 
{
    float: left;
    margin-left: 0.4vw;
}

#icon_location img
{
    background-repeat: no-repeat;
    height: 1.5vw;
    width: 1.2vw;
    margin-left: 0.3vw;
}


#adres
{
    float: left;
    color: white;
    margin-left: 0.7vw;
}

#adres p
{
    margin: 0;
    margin-top: 0.1vw;
    margin-bottom: 3px;
}

#icon_mail
{
    float: left;
    margin-left: 0.5vw;
}

#icon_mail img
{
    background-repeat: no-repeat;
    height: 1.3vw;
    width: 1.5vw;
    margin-left: 0.2vw;
}

#mail
{
    color:white;
    float: left;
    margin-left: 0.5vw;
}

#mail p
{

    margin: 0;
    margin-top: 0;
    margin-bottom: 3px;
}

#icon_mobile
{
    float: left;
    margin-left: 0.7vw;
    
}

#icon_mobile img
{
    background-repeat: no-repeat;
    height: 1.5vw;
    width: 1.3vw;
}

#mobile
{
    color: white;
    float: left;
    margin-left: 0.2vw;
}

#mobile p 
{
    margin: 0;
    margin-top: 0.3vw;
    margin-left: 0.5vw;
}

#contact_button_main
{
    width: 1.5vw;
    margin-left: 39.2vw;
}

.contact_button
{
    background-color: rgba(66, 66, 66, 0.5);
    width: 18vw;
    text-align: center;
    border: 1px solid orangered;
    padding: 0.3vw;
    margin-left: auto;
    margin-right: auto; 
    font-weight: 700;
}

.contact_button:hover
{
    background-color: rgba(34, 33, 33, 0.9);
}

.contact_button p
{
    font-size: 1.3vw;
    margin-top: 5px;
    margin-bottom: 5px;   
}
/*-----------SECTION THREE PRICES-------------------------------------------------------------------------------------------------------------------*/
#prices_header
{
    margin-left: 29.2vw;

}
#prices_header h1
{
    font-size: 7vw;
    margin: 0;
}

#prices_div
{
    margin-bottom: 1.3vw;
}
.table_prices 
{
    margin-left: 29.2vw;
}

.table_prices p
{
    font-size: 4vw;
}

.table_prices td
{
    max-height: 19px;
}

.table_prices p
{
    margin: 2px;
    font-size: 1.3vw;
}

/*-------SECTION FOUR--------------------------------------------------------------------------------------------------------------------*/

#location_background
{
    background-image: url("grafiki/LocationBackground.png");
    background-size: 100vw;

    background-repeat: no-repeat;
    height: 70.17vw;
    position: relative;  
}

#bigdiv_location_img
{
    float: left;
    margin-left: 19vw;
    margin-top: 10vw;
}

#bigdiv_location_img img
{
    background-repeat: no-repeat;
    height: 12.2vw;
    width: 9.5vw;  
}

#localization_header
{
    color: white;
    float: left;
    margin-top: 3vw;
    margin-left: 1vw;

}

#localization_adres
{
    margin-left: 0.2vw;
}

#localization_header h1
{
    font-size: 7vw;
    margin-bottom: 0;
}

#localization_header p
{
    margin: 0;
    font-size: 1.1vw;
}

.how_to_get_button
{
    background-color: #ffffff;
    width: 18.4vw;
    text-align: center;
    padding: 0.3vw;
    padding-top: 0.7vw;
    padding-bottom: 0.7vw;
    color: black;
    margin-top: 1.2vw;
    margin-bottom: 1.7vw;
    margin-left: 0.23vw;
    font-weight: 700;
}

.how_to_get_button:hover
{
    background-color: rgb(191, 41, 42);
}

/*----MAP RESPONSIVE-------------------------------------*/
#map 
{
    width: 130%;
    height: 0;
    padding-bottom: 43%;
    position: relative;
    margin-left: 0.23vw;
}

#map iframe 
{
    width: 100%;
    height: 130%;
    position: absolute;
    border-radius: 1vw;
    top: 0;
    left: 0;
}
  /*---------------------------------------------------------*/

#bottom_nav
{
    background-color: rgba(0, 0, 0, 0.3);
    width: 100%;
    height: 3.2vw;
    position:absolute;
    bottom: 0.35vw;
}



.menu_bottom
{
    float: left;
    margin: 0; 

}

.menu_bottom li
{
    display: inline-block;
    list-style-type: none;
    margin-top: 0.8vw;
    margin-bottom: 0;
    margin-right: 10.25vw;
    font-size: 1.2vw;
    font-weight: 200;
}

.menu_bottom a
{
    margin: 0;
    padding: 0;
}

.menu_bottom li:first-child
{
    margin-left: 7.4vw;
}
.menu_bottom li:last-child
{
    margin-right: 0;
}

.menu_bottom li a:hover
{
    color: gray
}

.socials_bottom
{
    float: left;
    color: black;
    font-size: 1.5vw;
    margin-left: 10vw;
    margin-top: 0.7vw;
}

.socials_bottom a
{
    text-decoration: none;
    color: black;
    display: block;
}

.socials_bottom a:hover
{
    color: white;
}

#bottom_line
{
    background-image: url("grafiki/bottom_line.png");
    height: 7px;
    width:99.1vw;
    position: absolute;
    margin-top: 69.7vw;
}



/*----------MOBILE-----------------------------------------------------------------------------------------------*/

@media only screen and (max-width: 768px) {
    
    #razor_img
    {
        display: none;
    }

    #hours_open_header h1
    {
        text-align: center;
        font-size: 14.2vw;
    }

    #prices_header
    {
        margin-left: 6.5vw;
    }
    #prices_header h1
    {
        font-size: 14.2vw;
    }

    #prices_div
    {
        margin-left: 6.5vw;
    }

    .table_hours p
    {
        margin: 0;
        font-size: 2.6vw;
    }
    

    .table_prices
    {
        margin-left: -0.5vw;
        
    }
    .table_prices p 
    {
        font-size: 2.6vw;
    }

    .topnav
    {
        display: block !important;
        
    }

    #topnav
    {
        display: none;
    }

    .contact_button
    {
        font-size: 1.3vw;
        width: 35vw;
    }

    #contact_button_main
    {
        margin-left: 30.5vw;
    }

    #section_two_background
    {
        background-image: url("grafiki/contactbg2.png");
        background-size: 100vw;
        background-repeat: no-repeat;
        max-height: 45vw;
        
    }

    #all_contacts p
    {
        font-size: 2.4vw;
    }

    #contact_header {
        color: white;
        margin-left: 6.5vw;
        float: left;
    }

    #contact_header h1
    {
        font-size: 14.2vw;
    }

    #contacts_info {
        font-size: 1.5vw;
        float: left;
        margin-top: 3vw;
    }

    #icon_location img {
        background-repeat: no-repeat;
        height: 2.9vw;
        width: 2.6vw;
        margin-left: 0.3vw;
    }

    #icon_mail img {
        background-repeat: no-repeat;
        height: 2.6vw;
        width: 2.8vw;
        margin-left: 0.2vw;
    }

    #icon_mobile img {
        background-repeat: no-repeat;
        height: 2.8vw;
        width: 2.6vw;
    }
    
    .table_prices h1
    {
        font-size: 2vw;
    }

    
    #bigdiv_location_img
    {
        display: none;
    }

    #localization_header
    {
        margin-left: 6.5vw;
        margin-top: -2vw;
    }
    #localization_header h1
    {
        font-size: 14.2vw;
    }

    #localization_adres p
    {
        font-size: 2.2vw;
    }
    #localization_adres2
    {
        margin-top: 15vw !important;
    }

    #localization_adres2 p
    {
        font-size: 2.2vw;
    }

    #map
    {
        position: absolute;
        height: 10vw;
        padding-bottom: 0;
    }
    #map iframe
    {
       width: 40%;
       height: 10vw;
    }


}

@media only screen and (max-width: 560px) {
    .menu_bottom li:first-child
    {
        margin-left: 0;
    }

    .menu_bottom li
    {
        margin-right: 8vw;
    }
    .menu_bottom
    {
        margin: -0.5vw;
    }
    
    #bottom_nav
    {
        display: none;
    }
}

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

    .menu_bottom
    {
        margin: -1vw;
    }



}

@media only screen and (max-width: 970px) {
    .menu_bottom li:first-child
    {
        margin-left: 0.5vw;
    }
}



/*----MOBILE MENU CODE-------------------------------------------------*/


.topnav {
  overflow: hidden;
  background-color: black;
  position: relative;
  display: none;
}

.topnav #myLinks {
  display: none;
}

.topnav a {
  color: white;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
  display: block;
}

.topnav a:hover
{
    background-color: #696969;
}

.topnav a.icon {
  background: black;
  display: block;
  position: absolute;
  right: 25;
  top: 0;
}

.topnav a.icon:hover {
  background-color: rgb(34, 32, 32);
  
}

#socials_mobile_menu
{
    position: absolute;
    top: 0.15vw;
    left:49px;
}

#socials_mobile_menu a
{
    color: white;
}


.insta_mobile a:hover
{
    background-color: rgb(34, 32, 32);
    color: white;
}

.fb_mobile a:hover
{
    background-color: rgb(34, 32, 32);
    color: white;
}