.main__video 
{
    width:100%;
    height:100vh;
}

.main__video .inner-stage {
    display: block;
    position: relative;
    overflow: hidden;
    height: 0;
    padding-top: 56.25%;
}

.main__video iframe 
{
    position: absolute;
    top: 0;
    left: 0;
    width:100%;
    height:100%;
    object-fit: contain;
    object-position: center;
}


.main__about 
{
    margin:50px auto;
    background:var(--footerBackground);
    width:calc(100% - 26px);
    height:300px;
    position:relative;
    padding:10px 20px;
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

@media only screen and (max-width: 1200px)
{
    .main__about
    {
        height:fit-content;
    }
}

.main__aboutInfo 
{
    width:100%;
    height:100%;
    display:flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap:50px;
}

@media only screen and (max-width: 1200px)
{
    .main__aboutInfo 
    {
        flex-direction: column;
    }
}
@media only screen and (max-width: 900px)
{
    .main__aboutInfo 
    {
        gap:30px;
    }
}
.main__aboutImg 
{
    width:320px;
    height:240px;
    object-fit: cover;
    border:2px solid white;
}

@media only screen and (max-width: 1280px)
{
    .main__aboutImg 
    {
        width:240px;
    }
}

.main__aboutGrid 
{
    display:grid;
    grid-template-columns: 1fr 1fr;
    width:100%;
    
    grid-row-gap: 0;
    grid-column-gap: 96px;


}

@media only screen and (max-width: 1340px)
{
    .main__aboutGrid 
    {
        grid-column-gap: 50px;
    }
}

@media only screen and (max-width: 900px)
{
    .main__aboutGrid 
    {
        grid-template-columns: 1fr;
        grid-column-gap:0;
    }
}


.main__aboutElement 
{
    width:100%;
    border-bottom: 1px solid black;
    display:flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding:15px 0 8px 0;
}

.main__aboutElement .name 
{
    margin:0 auto 0 0;
    font-size:16px;
    line-height: 16px;
    color:white;
    font-weight: 400;

}

.main__aboutElement .value
{

    font-size:16px;
    line-height: 16px;
    color:var(--aboutText);
    font-weight: 400;

}


.main__videoTitle
{
    color:var(--titleColor);
    font-size:20px;
    font-weight: 500;
    margin:10px auto 10px 0;
    padding:0 10px;
}

@media only screen and (max-width:730px)
{
    .main__videoTitle
    {
        padding:0 20px;
        text-align: center;
    }
}

.main__videoTop 
{
    margin:20px 0;
    width:100%;
    display:flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding:0 10px;
}

@media only screen and (max-width:730px)
{
    .main__videoTop 
    {
        padding:0 20px;
    }
}
@media only screen and (max-width: 530px)
{
    .main__videoTop 
    {
        flex-wrap: wrap;
        gap:10px;
    }
}

.main__videoProcentage 
{
    font-size:20px;
    font-weight: 500;
    margin:0 10px 0 0;
    color:var(--buttonsBackground);
}
@media only screen and (max-width: 530px)
{
    .main__videoProcentage 
    {
        margin:0;
    }
}

.main__videoLike 
{
    outline:none;
    border:none;
    background:none;
    color:rgba(0, 0, 0, 0.37);
    margin:0 10px 0 0;
}
@media only screen and (max-width: 530px)
{
    .main__videoLike 
    {
        margin:0;
    }
}

.main__videoLike i 
{
    font-size:24px;
}

.main__videoLike:hover 
{
    cursor: pointer;
}
.main__videoDislike 
{
    outline:none;
    border:none;
    background:none;
    color:rgba(0, 0, 0, 0.37);
    margin:0 18px 0 0;
}
@media only screen and (max-width: 530px)
{
    .main__videoDislike
    {
        margin:0;
    }
}

.main__videoDislike i 
{
    font-size:24px;
}

.main__videoDislike:hover 
{
    cursor: pointer;
}

.main__addFavourite 
{
    color:white;
    border:2px solid var(--buttonsBackground);
    background:var(--buttonsBackground);
    font-size:18px;
    font-weight: 500;
    outline:none;
    transition:0.4s;
    padding:5px 14px;
    margin:0 auto 0 0;
    border-radius: 3px;
}

@media only screen and (max-width: 530px)
{
    .main__addFavourite 
    {
        margin:0;
    }
}
.main__addFavourite i 
{
    font-size:16px;
    margin:0 0 0 5px;
}

.main__addFavourite:hover 
{
    background:transparent;
    color:var(--buttonsBackground);
    transition:0.4s;
    cursor: pointer;
}

.main__viewCamera 
{
    width:60%;
    min-width: fit-content;
    padding:6px 10px;
    background:var(--liveBtnGreen);
    border:2px solid var(--liveBtnGreen);
    color:white;
    font-size:18px;
    font-weight: 500;
    text-align: center;
    outline:none;
    text-decoration: none;
    transition:0.4s;
    border-radius: 3px;
}


.main__viewCamera:hover 
{
    background:transparent;
    color:var(--liveBtnGreen);
}

@media only screen and (max-width: 1150px)
{
    .main__viewCamera 
    {
        width:fit-content;
    }
}

@media only screen and (max-width: 530px)
{
    .main__viewCamera 
    {
        width:90%;
    }
}