@font-face {
  font-family: delicate;
  src: url(/fonts/delicate.woff);
}

@font-face {
  font-family: highvoltage;
  src: url(/fonts/highvoltage.woff);
}

html{
  box-sizing: border-box;
  scroll-behavior: smooth;
    font-family: Arial, Helvetica, sans-serif;
    font-family:'highvoltage';
    -webkit-text-size-adjust:100%;
    -ms-text-size-adjust:100%
}

*, *:before, *:after {
  box-sizing: inherit;
}

body{
    margin:0;
    font-family: Arial, Helvetica, sans-serif;
    font-family:'highvoltage';
    color: rgb(255,255,255);
    font-size: 22px;
    font-weight:500;
    overflow-x:hidden;

    position:relative;
}

img{
    max-width:100%;
}

a{
    text-decoration: none;
}

h1{
    color:rgb(255,0,0);
}

.greenPaper{
    background-color:rgb(22,96,40);
    background-image:url(/images/greenPaper.jpg);
    background-size:cover;
    background-repeat: no-repeat;
    background-position: center center;
}

.paper{
    background-color:rgb(255,255,255);
    background-image:url(/images/paper.jpg);
    background-size:cover;
    background-repeat: no-repeat;
    background-position: center center;
}

.footer{
    background-color:rgb(22,96,40);
    background-image:url(/images/greenPaper.jpg);
    background-size:cover;
    background-repeat: no-repeat;
    background-position: center center;
}

.relative{
    z-index:500;
    position:relative;
}

.contentWidth{
    width:100%;
    margin:0 auto;
    padding:0px 10px;
    max-width: 950px;
    position:relative;
    z-index:500;
}


#menu{
    position:fixed;
    top:0;
    left:0;
    right:0;
    text-align:center;
    font-size:0;
    z-index:2000;
    padding:10px 0;
    background-color:rgba(22,96,40,0);
    border-bottom:2px solid rgb(255,255,255,0);
    -webkit-transition: all ease 0.5s;
    -moz-transition: all ease 0.5s;
    -ms-transition: all ease 0.5s;
    -o-transition: all ease 0.5s;
    transition: all ease 0.5s;
}

.menuScrolled{
    background-color:rgba(22,96,40,1) !important;
    border-bottom:2px solid rgb(255,255,255,1) !important;
}

#menu .logo{
    display:inline-block;
    vertical-align: middle;
    width:100px;
    -webkit-transition: all ease 0.5s;
    -moz-transition: all ease 0.5s;
    -ms-transition: all ease 0.5s;
    -o-transition: all ease 0.5s;
    transition: all ease 0.5s;
}

.menuScrolled .logo{
    width:75px !important;
}

#menu .menuItems{
    width:calc(100% - 100px);
    font-size:12px;
    text-align:right;
    display:inline-block;
    vertical-align: middle;
    -webkit-transition: all ease 0.5s;
    -moz-transition: all ease 0.5s;
    -ms-transition: all ease 0.5s;
    -o-transition: all ease 0.5s;
    transition: all ease 0.5s;
}

.menuScrolled .menuItems{
    width:calc(100% - 75px) !important;
}


#menu .menuItems .menuItem{
    width:150px;
    text-align:center;
    display:inline-block;
    vertical-align: middle;
    -webkit-transition: all ease 0.5s;
    -moz-transition: all ease 0.5s;
    -ms-transition: all ease 0.5s;
    -o-transition: all ease 0.5s;
    transition: all ease 0.5s;
}

.menuScrolled .menuItems .menuItem{
    width:100px !important;
}

#menu .menuItems .menuItem .wrapper{
    -webkit-transition: all ease 0.5s;
    -moz-transition: all ease 0.5s;
    -ms-transition: all ease 0.5s;
    -o-transition: all ease 0.5s;
    transition: all ease 0.5s;
    width:100px;
    -webkit-transform: scale(1.0);
    -moz-transform: scale(1.0);
    -ms-transform: scale(1.0);
    -o-transform: scale(1.0);
    transform: scale(1.0);
}

.menuScrolled .menuItems .menuItem .wrapper{
    width:75px !important;
}

#menu .menuItems .menuItem .wrapper:hover{
   -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
}

#menu .menuItems .menuItem .wrapper .icon{
    width:50px;
}

.menuScrolled .menuItems .menuItem .wrapper .icon{
    width:35px !important;
}

#menu .menuItems .menuItem .wrapper .note a{
    text-decoration: none;
    color:rgb(255,255,255);
    font-family:'delicate';
}

#fixed-home{
    -webkit-transition: all ease 0.5s;
    -moz-transition: all ease 0.5s;
    -ms-transition: all ease 0.5s;
    -o-transition: all ease 0.5s;
    transition: all ease 0.5s;
    height:80vh;
    top:0;
    left:0;
    right:0;
    background-image:url(header.jpg);
    background-size:cover;
    background-position: center center;
    background-repeat: no-repeat;
    position:fixed;
    z-index:200;
}

#space-home{
    -webkit-transition: all ease 0.5s;
    -moz-transition: all ease 0.5s;
    -ms-transition: all ease 0.5s;
    -o-transition: all ease 0.5s;
    transition: all ease 0.5s;
    height:80vh;
    z-index:300;
    position:relative;
    background-color:rgba(0,0,0,0.4);
}

#space-home .absolute{
    width:100%;
    padding:10px;
    position:absolute;
    text-align:center;
    width:100%;
    text-align:center;
    font-family: 'highvoltage';
    background-color:rgb(22,96,40);
    font-size:0;
    bottom:10vh;
}

#space-home .star{
    width:30px;
    display:inline-block;
    vertical-align: middle;
}

#space-home .writting{
    font-size:48px;
    display:inline-block;
    vertical-align: middle;
    color:rgb(255,255,255);
    width:auto;
    padding:0px 30px;
}

.proslave1, .proslave2, .proslave4{
    padding:50px 0;
}

.proslave1, .proslave2, .proslave3, .proslave4{
    overflow-x: hidden;
}

.proslave1 .contentWidth{
    padding-left:100px;
    
}

.proslave1 .rotated{
    position:absolute;
    color:rgb(22,96,40);
    font-family: 'highvoltage';
    font-size:70px;
    -webkit-transform:rotate(90deg);
    -moz-transform:rotate(90deg);
    -ms-transform:rotate(90deg);
    -o-transform:rotate(90deg);
    transform:rotate(90deg);
    -webkit-transform-origin:left top;
    -moz-transform-origin:left top;
    -ms-transform-origin:left top;
    -o-transform-origin:left top;
    transform-origin:left top;
}

.proslave1 .inlineImages{
    font-size:0;
}

.proslave1 .inlineImages .inline{
    display:inline-block;
    vertical-align: top;
    width:29%;
    margin:0 1%;
}

.proslave1 .inlineImages .inline:first-child{
    margin-left:0;
}

.proslave1 .description{
    color:rgb(22,96,40);
    margin:30px auto;
    font-family: Arial,Helvetica,sans-serif;
}

.proslave1 .address{
    display:inline-block;
    padding:10px;
    color:rgb(228,169,70);
    background-color:rgb(22,96,40);
    border-radius:10px;
    cursor: pointer;
}

.proslave1 .address .icon{
    display:inline-block;
    vertical-align:middle;
    width:70px;
}

.proslave1 .address .text{
    display:inline-block;
    vertical-align:middle;
    font-size:40px;
    color:rgb(228,169,70);
}

.proslave2 .inlines{
    font-size:0;
}

.proslave2 .inlines .logo, .proslave2 .inlines .title{
    display:inline-block;
    vertical-align: middle;
}

.proslave2 .inlines .logo{
    width:250px;
}

.proslave2 .inlines .title{
    font-size:100px;
    padding-left:50px;
    width:calc(100% - 250px);
}

.proslave2 .description{
    font-family:Arial,Helvetica,sans-serif;
    margin:30px auto;
}

.proslave2 .beers{
    text-align:center;
    font-size:0;
}

.proslave2 .beers .beer{
    display:inline-block;
    vertical-align:middle;
    width:16.66%;
}

.proslave2 .beers .beer img{
    disp;ay:block;
    width:80%;
    margin:0 auto;
}

.proslave3{
    color:rgb(22,96,40);
}

.proslave3 .inlines{
    font-size:0;
}

.proslave3 .inlines .inline{
    font-size:16px;
    width:50%;
    vertical-align: top;
    position:relative;
    display:inline-block;
}
.proslave3 .inlines .inline:first-child{
    padding:50px 0;
}

.proslave3 .inlines .inline .rotated{
    position:absolute;
    color:rgb(22,96,40);
    font-family: 'highvoltage';
    font-size:100px;
    -webkit-transform:rotate(90deg) translateY(-100%);
    -moz-transform:rotate(90deg) translateY(-100%);
    -ms-transform:rotate(90deg) translateY(-100%);
    -o-transform:rotate(90deg) translateY(-100%);
    transform:rotate(90deg) translateY(-100%);
    -webkit-transform-origin:left top;
    -moz-transform-origin:left top;
    -ms-transform-origin:left top;
    -o-transform-origin:left top;
    transform-origin:left top;
}

.proslave3 .inlines .inline .info{
    padding-left:150px;
}

.proslave3 .inlines .inline .info .title{
    font-size:40px;
    margin-bottom:5px;
    width:200px;
}

.proslave3 .inlines .inline .info table{
    font-family:Arial,Helvetica,sans-serif;
}

.proslave3 .inlines .inline .info table tr td:first-child{
    font-weight:bold;
}

.proslave3 .inlines .inline .info .separator{
    width:100px;
    height:4px;
    margin:20px 0;
    border-radius:2px;
    background-color:rgb(22,96,40);
}

.proslave3 .inlines .inline .info .contactInfo{
    font-size:32px;
    margin-bottom:10px;
}

.proslave3 .inlines .inline .info .contactInfo a{
    color:rgb(22,96,40);
}

.proslave3 .address{
    display:inline-block;
    padding:10px;
    color:rgb(228,169,70);
    background-color:rgb(22,96,40);
    border-radius:10px;
    cursor:pointer;
    width:195px;
    font-size:0;
}

.proslave3 .address .icon{
    display:inline-block;
    vertical-align:middle;
    width:40px;
}

.proslave3 .address .text{
    display:inline-block;
    vertical-align:middle;
    font-size:26px;
    color:rgb(228,169,70);
    width:calc(100% - 40px);
}

.proslave3 .inlines .photo{
    background-image:url(cekamovas.jpg);
    background-size:cover;
    background-position: center center;
    background-repeat: no-repeat;
    height:500px;
}

.proslave3 .inlines .photo .rotated{
    position:absolute;
    color:rgb(255,255,255);
    font-family: 'highvoltage';
    font-size:60px;
    -webkit-transform:rotate(90deg) translateY(-100%);
    -moz-transform:rotate(90deg) translateY(-100%);
    -ms-transform:rotate(90deg) translateY(-100%);
    -o-transform:rotate(90deg) translateY(-100%);
    transform:rotate(90deg) translateY(-100%);
    -webkit-transform-origin:left top;
    -moz-transform-origin:left top;
    -ms-transform-origin:left top;
    -o-transform-origin:left top;
    transform-origin:left top;
    top:50px;
    left:30px;
}

.proslave3 .inlines .photo .logo{
    position:absolute;
    right:50px;
    bottom:50px;
    width:100px;
}

.proslave4 .inlines{
    font-size:0;
}

.proslave4 .inlines .logo, .proslave4 .inlines .title{
    display:inline-block;
    vertical-align: middle;
}

.proslave4 .inlines .logo{
    width:250px;
}

.proslave4 .inlines .title{
    font-size:70px;
    padding-left:50px;
    width:calc(100% - 250px);
}

.proslave4 .description{
    font-family:Arial,Helvetica,sans-serif;
    margin:30px auto;
}

.orange{
    color:rgb(228,169,70);
}

.delicate{
    font-family:'delicate';
}

.footer{
    padding:15px 0;
    text-align:center;
}

.footer .allStar{
    font-family:'delicate';
    font-size:30px;
    position:relative;
    color:rgb(255,255,255);
    opacity:0.2;
    bottom:auto;
    left:auto;
    top:auto;
    right:auto;
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    -o-transform: translateX(0%);
    transform: translateX(0%);
    z-index:200;
    width:100%;
    text-align:center;
}

.footer .info{
    color:rgb(255,255,255);
    font-size:12px;
    font-family: Arial, Helvetica, sans-serif;
}



.scrollUp{
    position:absolute;
    top:13px;
    right:13px;
    width:50px;
    z-index:2000;
    cursor:pointer;
}

@media screen and (max-width: 900px) {
    .proslave2 .inlines .logo{
        width:150px;
        display:block;
        margin:20px auto;
    }

    .proslave2 .inlines .title{
        width:90%;
        display:block;
        margin:10px auto;
        text-align:center;
        font-size:70px;
        padding-left:0px;
    }

    .proslave3 .inlines .inline{
        width:100%;
        display:block;
    }
}

@media screen and (max-width: 750px) {
    
    #menu .logo{
        width:75px;
    }

    .menuScrolled .logo{
        width:50px !important;
    }

    #menu .menuItems{
        width:calc(100% - 75px);
    }

    .menuScrolled .menuItems{
        width:calc(100% - 50px) !important;
    }


    #menu .menuItems .menuItem{
        width:75px;
    }

    .menuScrolled .menuItems .menuItem{
        width:75px !important;
    }

    #menu .menuItems .menuItem .wrapper{
        width:75px;
    }

    .menuScrolled .menuItems .menuItem .wrapper{
        width:75px !important;
    }

    #menu .menuItems .menuItem .wrapper .icon{
        width:25px;
    }

    .menuScrolled .menuItems .menuItem .wrapper .icon{
        width:25px !important;
    }
}

@media screen and (max-width: 600px) {
    #space-home .writting{
        font-size:16px;
    }

    .nonMobile600{
        display:none !important;
    }

    .proslave1 .inlineImages .inline{
        width:45%;
    }

    .proslave1 .rotated{
        width:300px;
    }

    .proslave1 .address .icon{
        width:30px;
    }

    .proslave1 .address .text{
        font-size:20px;
    }
    .proslave1 .description{
        font-size:14px;
    }
    .proslave2 .description{
        font-size:14px;
    }

    .proslave4 .inlines .logo{
        width:150px;
        display:block;
        margin:10px auto;
    }

    .proslave4 .inlines .title{
        width:100%;
        display:block;
        margin:10px auto;
        text-align:center;
        padding-left:0;
        font-size:40px;
    }
}


@media screen and (max-width: 500px) {
    .proslave2 .inlines .title{
        font-size:50px;
    }

    .proslave3 .inlines .inline .rotated{
        font-size:70px;
    }

    .proslave3 .inlines .inline .info{
        padding-left:120px;
    }
}