Tell me, when conducting a code review, what should I look for? How accurate is my CSS/Less code?

Question

css

The code below, which is a modal window without using Javascript, is my modal prototype based on a friend's design:

<a href="#modal">Спросить!</a>


  
      Данный сайт предназначен для просмотра лицам, достигшим совершинолетия
      Вам уже есть 18 лет?
      <a href="#step">Да</a>
      <a href="#">Нет</a>
  



  
      Подтвержение что Вам действительно есть
      +18
      <a href="#">Да</a>
      <a href="#">Нет</a>

How good is my code?

body{
  width:1200px;
  margin:5% auto;
}

#modal > .modal{
  width:470px-12px*2+2;
  height:200px-12px*2+2;
}

#step > .modal{
  width: 630px !important;
  height: 550px !important;
  top: 15%;
}

#step{
  /* opacity: 0.7; */
  /* display: block; */
}


/*Модалька начало*/

.modal-contain {
  display: none;
}

.modal-contain:target {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,.75);
}

.modal-close {
  position: absolute;
  top: 0;
  left: 0;
  float: left;
  width: 100%;
  height: 100%;
  cursor: default;
}

.modal {
  position: absolute;
  top: 35%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
  margin: 0 auto;
  border:12px solid #333;
  background: #fff;
}

/*Модалька конец*/

/*Типографика начало*/

h5{
  color:#313131;
  font-size: 16px;
  margin-top:15px !important;
}
h3{
  color:#FFAB35;
  font-size:24px;
  margin-top:15px !important;
}
h2{
  font-weight: 700;
}
h1{
  color: #FF9000;
  font-size: 64px;
  font-weight: 700;
}
h2,h1{
    margin: 10px;
}
h5,h3,h2,h1,a{
  font-family: ‘Metrophobic’, Arial, serif;
  font-weight: 400; 
  text-align: center;
}

/*Типографика конец*/

/*Кнопки начало*/

.btn{
  text-align:center;
  width:90px;
  height:35px;
  color:white;
  border:none;
  border-radius:4px;
  position: absolute;
  font-size:17px;
}
.yes{
  background:#FF9000;
  left:125px;
}
.no{
  background:#00AEFE;
  right:125px;
}

/*Кнопки конец*/

Are there any best practices? In what direction should I move if I want to get into a big company?

Answer 1

Without reading the code at all, I can say that:
- using id - bad
- using !important - bad
- transform has prefixes for different browsers
- I didn’t see Less in the code, except for calculating the sizes at the beginning
- it’s not clear why you use it in the headers strong, and in links - button
- bad code formatting