.fon{
    position: absolute;
    width: 100%;
    z-index: -2;
    top: 0;
}
.blocB{
    height: 1008px;
}
.BG{
    width: 100%;
    background: #ffffff;
    height: 30px;
    position: relative;
    }
    .BG::before{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    background-repeat: repeat;
    height: 10px;
    background-size: 20px 20px;
    background-image:
    radial-gradient(circle at 10px -5px, transparent 12px, rgb(227 227 227) 13px);
}
    .BG::after{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    background-repeat: repeat;
    height: 15px;
    background-size: 40px 20px;
    background-image:
    radial-gradient(circle at 10px 15px, rgb(227 227 227) 12px, transparent 13px);
}
.blocG{
    height: 950px;
    background: rgb(227 227 227);
}
.GB{
    width: 100%;
    background: rgb(227 227 227);
    height: 30px;
    position: relative;
    }
    .GB::before{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    background-repeat: repeat;
    height: 10px;
    background-size: 20px 20px;
    background-image:
    radial-gradient(circle at 10px -5px, transparent 12px, #fff 13px);
}
    .GB::after{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    background-repeat: repeat;
    height: 15px;
    background-size: 40px 20px;
    background-image:
    radial-gradient(circle at 10px 15px, #fff 12px, transparent 13px);
}
.blocW {
    height: 1036px;
}
.WS{
    width: 100%;
    background: #fff;
    height: 30px;
    position: relative;
    }
    .WS::before{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    background-repeat: repeat;
    height: 10px;
    background-size: 20px 20px;
    background-image:
    radial-gradient(circle at 10px -5px, transparent 12px, #471ED2 13px);
}
    .WS::after{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    background-repeat: repeat;
    height: 15px;
    background-size: 40px 20px;
    background-image:
    radial-gradient(circle at 10px 15px, #471ED2 12px, transparent 13px);
}
.blocS{
    background:#471ED2;
    height: 800px;
}
.SG{
    width: 100%;
    background: #471ED2;
    height: 30px;
    position: relative;
    }
    .SG::before{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    background-repeat: repeat;
    height: 10px;
    background-size: 20px 20px;
    background-image:
    radial-gradient(circle at 10px -5px, transparent 12px, #EDEDED 13px);
}
    .SG::after{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    background-repeat: repeat;
    height: 15px;
    background-size: 40px 20px;
    background-image:
    radial-gradient(circle at 10px 15px, #EDEDED 12px, transparent 13px);
}
.blocG2{
    height: 1003px;
    background: rgb(227 227 227);
}
.G2W{
    width: 100%;
    background: rgb(227 227 227);
    height: 30px;
    position: relative;
}
    .G2W::before{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    background-repeat: repeat;
    height: 10px;
    background-size: 20px 20px;
    background-image:
    radial-gradient(circle at 10px -5px, transparent 12px, #fff 13px);
}
    .G2W::after{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    background-repeat: repeat;
    height: 15px;
    background-size: 40px 20px;
    background-image:
    radial-gradient(circle at 10px 15px, #fff 12px, transparent 13px);
}