body {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
   font-family: 'Museo Sans Cyrl', sans-serif;
   color: #333333;
   height: 100%;
   }
   h1 {
      margin: 0;
   }

@font-face {
   font-family: 'Museo Sans Cyrl';
   src: url('/static/fonts/MuseoSansCyrl-500.ttf');
}

@font-face {
   font-family: 'Museo Sans Cyrl Bold';
   src: url('/static/fonts/MuseoSansCyrl-700.ttf');
}
a {
   color:  #6933DC;
   text-decoration: none;

}
.header {
   padding: 40px 0 40px;
   border-bottom: 1px solid #DCDCF3;

}

.container {
   max-width: 1200px;
   margin: 0 auto;
   min-height: 100%;
 
}

.common-title {
   font-family: 'Museo Sans Cyrl Bold', sans-serif;
font-size: 48px;
line-height: 58px;
}


.big-title {
   font-family: "Museo Sans Cyrl Bold", sans-serif;
   font-size: 54px;
   line-height: 65px;
   color: #333333;

}
.big-title > span {
color: #6933DC;

}
.common-title > span {
   color: #6933DC;
}

.button {
   background: #6933DC;
   border-radius: 6px;
   padding: 14px 35px 14px 35px;
   font-size: 17px;
   color:  #FFFFFF;
   border: 0;
   transition: .4s;
   cursor: pointer;
   text-decoration: none;
}


a.button {
   display: inline-block;
}
   .button:hover {
      background: #38138a;  
   }

   .button:disabled {
      background-color:#e2dfe7 ;
      cursor: not-allowed;
   }

   .footer {
      padding: 40px 0;
      text-align: center;
   font-size: 13px;
   line-height: 16px;
   color: #DCDCF3;
   }

   .pass-question {
      display: flex;
      justify-content: flex-end;
      margin-top: 10px;
   }
   .pass-question a {
     font-size: 17px;
   line-height: 20px;
   text-decoration: none;
   display: flex;
   align-items: center;
   }
   .pass-question a:hover {
      text-decoration: underline;
   }
   .pass-question a img {
      margin-left: 13px;
   }

   .test-pre-title {
      font-size: 20px;
      font-weight: 400;
      line-height: 24px;
      color: #DCDCF3;
      
      }

      .test-pre-title span {
         color: #6933DC;
         margin-left: 15px;

      }

      
.test-question-title {
   font-family: "Museo Sans Cyrl Bold", sans-serif;
font-size: 36px;
line-height: 43px;

}
.test-question-title > span {
color: #6933DC;
}
.test-question-options {
   margin-top: 40px;
   min-height: 344px;
}
.test-question-option {
 
font-size: 20px;
line-height: 24px;
margin-bottom: 20px;
display: flex;
}

.test-question-option > label {
   cursor: pointer;
}


input[type="radio"] {
   appearance: none;
   -webkit-appearance: none;
   width: 20px;
   height: 20px;
   border: 3px solid #6933DC;
   border-radius: 50%;
   margin: 0 13px 0 0;
   transform: translateY(2px);
   display: grid;
   place-content: center;
}

input[type="radio"]::before {
   content: '';
   width: 10px;
   height: 10px;
   border-radius: 50%;
   box-shadow: inset 10px 10px #6933DC;
   transition: .2s ease transform;
   transform: scale(0);
 
}

input[type="radio"].correct::before {
   content: '';
   width: 10px;
   height: 10px;
   border-radius: 50%;
   box-shadow: inset 10px 10px #5FDC33;
   transition: .2s ease transform;
   transform: scale(0);
 
}

input[type="radio"].error::before {
   content: '';
   width: 10px;
   height: 10px;
   border-radius: 50%;
   box-shadow: inset 10px 10px #DC3333;
 
   transition: .2s ease transform;
   transform: scale(0);
 
}
input[type="radio"]:checked::before {
   transform: scale(1);
}

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

.profile {
   display: flex;
   align-items: center;
}

.profile-image{
   margin-right: 5px;
}

.profile-user{
   font-size: 18px;
   font-weight: 400;
   line-height: 18px;
}
.profile-logout{
   font-size: 12px;
   font-weight: 400;
   line-height: 12px;
   color: #6933DC;
}