#slide3 {
    width:1000px;
    height:768px;
    margin: 0 auto;
    position:relative;
    background: url(../images/girl.png);
}
#slide3 .wrapper{
    width: 830px;
}
.top-bg{
    background: url(../../images/verh.jpg);
    height: 61px;
}
.f-bottom{
    background: url(../../images/niz.jpg);
}
#slide3 h3{
    font-family: "FiraSansMedium";
    font-size: 18px;
    color: #626262;
    line-height: 1.3;
} 
#slide3 .block1{
    float: left;
    width: 280px;
    margin-top: 40px;
}
#slide3 .block1 p{
    font-family: "FiraSansRegular";
    font-size: 18px;
    color: #626262;
    line-height: 1.3;
    margin-bottom: 35px;
}
#slide3 .yellow-b{
    width: 275px;
    height: 210px;
    background: #fef9c3;

}
#slide3 .yellow-b p{
    font-family: "FiraSansItalic";
    font-size: 14.5px;
    padding: 15px;
}
#slide3 .yellow-b p:before{
    content: '!';
    font-family: "FiraSansBold";
    font-size: 51px;
    display: block;
    float: left;
    padding: 0 17px 0 17px;
    line-height: 1;
    color: #ffb600;

}
#slide3 .block2{
    margin-top: 40px;
    margin-left: 20px;
    width: 530px;
    float: right;
}
.blue-b, .yell-b{
    width: 228px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-family: "FiraSansMedium";
    font-size: 18px;
    color: #fff;
    float: left;
    margin: 30px 35px 0 0;
    text-transform: uppercase;
}
.blue-b{
    background: #1337ab;
}
.yell-b{
    background: #ffb600;
}
#slide3 .block2 .left-b, #slide3 .block2 .right-b{
    width: 50%;
    float: left;
    font-size: 16px;
    font-family: "FiraSansRegular";
}
#slide3 .block2 .left-b p, #slide3 .block2 .right-b p{
    line-height: 1.3;
}
#slide3 .block2 .right-b{
    color: #ff0000;
    float: right;
    font-family: "FiraSansItalic";
}
.left-b .one{
    margin: 40px 0 0 20px;
    
}
.left-b .two{
    margin: 80px 0 0 30px;
    position: relative;
}
.left-b .two:after{
    content: url(../images/1.png);
    position: absolute;
    top: 10px;
    right: 50px;
    opacity: 0;
    animation: line 1s;
    animation-delay: 0.2;
    animation-fill-mode: forwards;
}
.left-b .tree{
    margin: 30px 0 0 0px;
    position: relative;
}
.left-b .tree:after{
    content: url(../images/2.png);
    position: absolute;
    top: 2px;
    right: 40px;
    opacity: 0;
    animation: line 1s;
    animation-delay: 0.2;
    animation-fill-mode: forwards;
}
.left-b .four{
    margin: 55px 0 0 20px;
    position: relative;
}
.left-b .four:after{
    content: url(../images/3.png);
    position: absolute;
    top: -47px;
    right: 68px;
    opacity: 0;
    animation: line 1s;
    animation-delay: 0.2;
    animation-fill-mode: forwards;
}
.right-b .one{
    margin: 40px 0 0 110px;
}
.right-b .two{
    margin: 110px 0 0 140px;
    position: relative;
}
.right-b .two:before{
    content: url(../images/4.png);
    position: absolute;
    top: -15px;
    left: -118px;
    opacity: 0;
    animation: line 1s;
    animation-delay: 0.2;
    animation-fill-mode: forwards;
}
.right-b .tree{
    margin: 0px 0 0 140px;
    position: relative;
}
.right-b .tree:before{
    content: url(../images/5.png);
    position: absolute;
    top: 1px;
    left: -144px;
    opacity: 0;
    animation: line 1s;
    animation-delay: 0.2;
    animation-fill-mode: forwards;
}
.right-b .four{
    margin: 0px 0 0 140px;
    position: relative;
    z-index: 3;
}
.right-b .four:before{
    content: url(../images/6.png);
    position: absolute;
    top: 9px;
    left: -118px;
    opacity: 0;
    animation: line 1s;
    animation-delay: 0.2;
    animation-fill-mode: forwards;
    z-index: 1;
}
.right-b .five{
    margin: 45px 0 0 150px;
    position: relative;
}
.right-b .five:before{
    content: url(../images/7.png);
    position: absolute;
    top: -56px;
    left: -151px;
    opacity: 0;
    animation: line 1s;
    animation-delay: 0.2;
    animation-fill-mode: forwards;
    z-index: 1;
}
.bold{
    font-family: "FiraSansBold";
}

@keyframes line {
    from {opacity: 0;}
    to {opacity: 1;}
}