.wrap{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.col-log>a>p{
    font-family: 'Unbounded', cursive;
    background: linear-gradient(180deg, #5B89A5 34.55%, rgba(91, 137, 165, 0.44) 100%);
    font-size: 72px;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-align: right;
}

.col-log{
    margin-left: -4px;
}

.col-log>a>p:first-child{
    font-size: 27.5px;
    line-height: 69px;
    margin-bottom: -38px;
}
.col-log>a>p:last-child{
    font-size: 54.92px;
    line-height: 69px;
}

header{
    padding: 14px 30px;
}
.homepage header{
    padding: 33px 30px;
    position: relative;
    z-index: 100;
}
.header-item>ul{
    display: flex;
    align-items: center;
}
.header-item>ul>li:not(:last-child){
    margin-right: 30px;
}
.header-item>ul>li>a{
    color: #373737;
    font-size: 20px;
    font-weight: 400;
    line-height: 27px;
    letter-spacing: 0em;
}
.header-item>ul>img{
    width: 26px;
    height: 26px;
}


/* ---------BURGER---------- */
.burger {
    width: 52px;
    height: 22px;
    position: relative;
    cursor: pointer;
}
  
.bar {
    display: block;
    width: 100%;
    height: 2px;
    background-color: rgba(85, 85, 85, 1);
    margin-bottom: 10px;
    transition: transform 0.3s ease;
    border-radius: 10px;
}
  
.burger .bar:last-child {
    margin-bottom: 0;
}
  
.burger.active .bar:first-child {
    transform: translateY(8px) rotate(45deg);
}
  
.burger.active .bar:nth-child(2) {
    opacity: 0;
}
  
.burger.active .bar:last-child {
    transform: translateY(-8px) rotate(-45deg);
}
.burger-menu{
    padding: 37px 0 80px;
    background: linear-gradient(180deg, #5B89A5 0%, #6D9DB9 100%);
}
.burger-close{
    display: block;
    text-align: end;
    padding: 0 30px;
}
.burger-menu>ul>li>a{
    color: #FFF;
    font-size: 25px;
    line-height: normal;
}
.burger-menu>ul>li{
    padding: 25px 30px;
}
.burger-menu>ul>li:hover{
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.00) 100%);
    transition: .3s;
}
.burger-soc{
    margin-top: 10px;
    padding: 0 30px;
    display: flex;
    align-items: center;
}

.burger-soc>span{
    color: #FFF;   
    font-size: 15px;
    font-weight: 300;
    line-height: normal;
}

.burger-soc>a:not(:last-child){
    margin-right: 16px;
}

/* --------search------- */
input{
    background: none;
}

.search-txt{
    border: none;
    background: none;
    outline: none;
    float: left;
    padding: 0;
    color: #ffffff;
    font-size: 16px;
    transition: 0.4s;
    line-height: 25px;
    width: 0px;
    background: linear-gradient(180deg, #5B89A5 0%, #6D9DB9 100%);
    border-radius: 40px;
}
.search-txt::placeholder{
    color: #ffffff;
}


.header-box{
    cursor: pointer;
}
/* .header-box:hover> .search-txt{
    width: 200px;
    padding: 0 6px;
    margin-right: 5px;
} */
.header-txt{
    margin-right: 5px;
}
.search-open{
    width: 150px;
    padding: 0 16px;

}
.popup{
    position: fixed;
    top: 0;
    right: -100%;
    width: 100%;
    z-index: 100;
    transition: 1s;
}
.popup.open{
    right: 0;
}
.popup.close{
    right: -100%;
}
.homepage main{
    background: url(../img/first-page/bg-foto.png) no-repeat;
    background-size: cover;
    background-position: 50px ; 
    
}
.header-item a{
    position: relative;
}
.header-item .active::before{
    content: "";
    display: block;
    position: absolute;
    bottom: -51px;
    width: 100%;
    height: 6px;
    background: #5B89A5;
}
@media screen and (max-width:1480px){

    .header-item>ul>li:not(:last-child) {
        margin-right: 40px;
    }
main>img {
    top: 0;
}
}
@media screen and (max-width:1400px) {
    .header-item>ul>li:not(:last-child) {
        margin-right: 30px;
    }
    .homepage main{
        background-position: 100px;
    }
}
@media screen and (max-width:1199px){
    .homepage main{
        background-position: left;
    }
}
@media screen and (max-width:992px){
    .homepage main{
        background-position: center;
    }
    .main>div>h1{
        font-size: 30px;
    }
    .main>div{
        width: 45%;
    }
}

@media screen and (max-width:510px) {
.col-log {
    margin-left: -4px;
}
    .col-log>a>p:first-child {
        font-size: 18px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }
    .col-log>a>p:last-child {
        font-size: 38px;
    }    

.main>div>p {
    font-family: Roboto;
    font-size: 20px;
    font-weight: 600;
    line-height: 25px;
    letter-spacing: 0em;
    text-align: left;
}

}



