@font-face {
	font-family: 'HalvarBreit-Rg';
	src: url('fonts/halvarbreit-rg.eot'); /* IE 9 Compatibility Mode */
	src: url('fonts/halvarbreit-rg.eot?#iefix') format('embedded-opentype'), /* IE < 9 */
		url('fonts/halvarbreit-rg.woff2') format('woff2'), /* Super Modern Browsers */
		url('fonts/halvarbreit-rg.woff') format('woff'), /* Firefox >= 3.6, any other modern browser */
		url('fonts/halvarbreit-rg.ttf') format('truetype'), /* Safari, Android, iOS */
		url('fonts/halvarbreit-rg.svg#halvarbreit-rg') format('svg'); /* Chrome < 4, Legacy iOS */
}
@font-face {
    font-family: 'HalvarBreit-Blk';
	src: url('fonts/halvarbreit-blk.eot'); /* IE 9 Compatibility Mode */
	src: url('fonts/halvarbreit-blk.eot?#iefix') format('embedded-opentype'), /* IE < 9 */
		url('fonts/halvarbreit-blk.woff2') format('woff2'), /* Super Modern Browsers */
		url('fonts/halvarbreit-blk.woff') format('woff'), /* Firefox >= 3.6, any other modern browser */
		url('fonts/halvarbreit-blk.ttf') format('truetype'), /* Safari, Android, iOS */
		url('fonts/halvarbreit-blk.svg#halvarbreit-blk') format('svg'); /* Chrome < 4, Legacy iOS */
}
@font-face {
	font-family: 'Roboto Regular';
	src: url('fonts/roboto_regular.eot'); /* IE 9 Compatibility Mode */
	src: url('fonts/roboto_regular.eot?#iefix') format('embedded-opentype'), /* IE < 9 */
		url('fonts/roboto_regular.woff2') format('woff2'), /* Super Modern Browsers */
		url('fonts/roboto_regular.woff') format('woff'), /* Firefox >= 3.6, any other modern browser */
		url('fonts/roboto_regular.ttf') format('truetype'), /* Safari, Android, iOS */
		url('fonts/roboto_regular.svg#roboto_regular') format('svg'); /* Chrome < 4, Legacy iOS */
}
@font-face {
	font-family: 'Roboto Condensed';
	src: url('fonts/roboto_condensed.eot'); /* IE 9 Compatibility Mode */
	src: url('fonts/roboto_condensed.eot?#iefix') format('embedded-opentype'), /* IE < 9 */
		url('fonts/roboto_condensed.woff2') format('woff2'), /* Super Modern Browsers */
		url('fonts/roboto_condensed.woff') format('woff'), /* Firefox >= 3.6, any other modern browser */
		url('fonts/roboto_condensed.ttf') format('truetype'), /* Safari, Android, iOS */
		url('fonts/roboto_condensed.svg#roboto_condensed') format('svg'); /* Chrome < 4, Legacy iOS */
}
* {
    padding: 0;
    margin: 0;
    border: 0
}
*,
*::after,
*::before {
    box-sizing: border-box
}
*::after,
*::before {
    display: inline-block
}
html, body, div, span, h1, h2, p {
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    font-family: 'HalvarBreit-Rg';
}
.wrapper{
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-width: 100%;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    gap: 70px;
    position: relative;
    padding: 40px 25px;
}
.wrapper::after{
    content: "";
    position: absolute;
    bottom: 0px;
    left: 0px;
    height: 6px;
    background: linear-gradient(-45deg,
        transparent 50%, 
        #FFC402 50%, #FFC402 70%, 
        transparent 70%
    );
    background-size: 36px 36px;
    background-color: #000;
    width: 100%;
    height: 6px;
}
html, body{
    position: relative;
    min-height: 100%;
    height: auto;
}
.logo-block{
    display: flex;
    gap: 35px;
    justify-content: center;
    align-items: center;
}
.logo-block img{
    width: 393px;
    transition: .3s width ease;
}
.slogan{
    font-size: 56px;;
    font-family: 'HalvarBreit-Blk';
    text-transform: uppercase;
    transition: .3s font-size ease;
    text-align: center;
}
.contacts{
    display: flex;
    justify-content: center;
    align-self: center;
}
.contacts-item{
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 60px 130px;
    gap: 40px;
    transition: .3s padding ease;
}
.contacts-item:last-child{
    padding-right: 0px;
}
.contacts-item:first-child{
    padding-left: 0px;
}
.contacts-item:not(:last-child)::before{
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    width: 1px;
    height: 100%;
    background-color: #C3C3C3;
}
.contacts-label{
    font-family: 'Roboto Regular';
    font-size: 18px;
    text-align: center;
    transition: .3s font-size ease;
}
.contacts-content{
    text-align: center;
}
.contacts-content a{
    font-weight: bold;
    font-family: 'Roboto Condensed';
    font-size: 32px;
    color: #000;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
}
.contacts-content a:hover{
    text-decoration: underline;
}
.vk_logo{
    width: 245px;
    transition: .3s width ease;
}

@media screen and (max-width:1400px){
    .logo-block img{
        width: 305px;
    }
    .slogan{
        font-size: 46px;
    }
    .contacts-item{
        padding: 58px 64px;
    }
    .contacts-content a{
        font-size: 26px;
    }
}

@media screen and (max-width:1200px){
    .slogan{
        font-size: 40px;
    }
    .contacts{
        flex-wrap: wrap;
    }
    .contacts-item{
        padding: 58px 50px;
        width: 50%;
    }
    .contacts-item:nth-child(2)::before{
        display: none;
    }
    .contacts-item:last-child{
        min-width: 100%;
        border-top: 1px solid #C3C3C3;
        margin-top: 60px;
    }
}

@media screen and (max-width:768px){
    .wrapper{
        gap: 45px;
        justify-content: flex-start;
    }
    .logo-block img{
        width: 225px;
    }
    .slogan{
        font-size: 26px;
    }
    .contacts-item{
        min-width: 100%;
        padding: 30px 15px;
        gap: 25px;
    }
    .contacts-item:first-child{
        padding-top: 0px;
    }
    .contacts-item:last-child{
        margin-top: 0px;
    }
    .contacts-item:not(:first-child){
        border-top: 1px solid #C3C3C3;
    }
    .contacts-item::before{
        display: none;
    }
    .contacts-label{
        font-size: 13px;
    }    
}