@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');

body{font-family: 'Open Sans', sans-serif;padding: 0;margin: 0;}

.bloc{height:100vh;background: linear-gradient(135deg, #2D2CE0 0%, #C94948 100%);display: flex;justify-content: space-between;align-items: center}
.bloc2{background: linear-gradient(-135deg, #690fb5 0%, #08cdf9 100%)}

.bloc.header{height: 90px;padding: 20px;}
.bloc.header img{width: 60px;}

.page{background: rgba(0,0,0,0.04);padding: 40px;}
.page .content{background:#fff;margin: 50px auto;box-shadow: 0 0 5px rgba(0,0,0,0.08);width: 1200px;padding: 20px;}

.baloba{width: 50%;}
.baloba .first{height: 400px;margin: 0 auto;display: block;transform: rotate(10deg);}

.download{text-align: center;color: #fff;}
.download div{display: flex;justify-content: space-around;margin: 40px auto;width: 60%;}
.download img{width: 200px;}

.title{color: #fff;display: block;text-align: center;font-size: 5em;text-shadow: 0 0 5px rgba(0,0,0,0.3);}

h2{margin-top: 40px;}

a{color: #fff;}

.content.password{text-align: center;width: 600px;}
.content.password p{font-size: .9em}
.content.password input, .content.password .btn{padding: 13px;border: 1px solid #6f38a0;border-radius: 10px;}
.content.password .btn{background: #6f38a0;color: #fff;cursor: pointer;}

#result{padding: 10px;width: calc(100% - 20px);text-align: center;margin-bottom: 10px;border-radius: 10px;}

#step_2{display: none;}
#step_2 div{margin-bottom: 10px;}

@media only screen and (max-width: 960px) {
    
    .baloba, .content.password, .page .content{width: 100%}
    .bloc{height:auto;display: block;text-align: center;padding: 30px 0}
    .title{font-size: 2em;text-align: center}
}