* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.mainRamCon {
  display: flex;
  flex-direction: column;
}

.botRamCon{
  display: flex;
  flex-direction: column;
  padding-top: 27px;
}

.topRamCon {
  display: flex;
  flex-direction: column;
  gap: 5px;
  align-items: center;
  text-align: center;
}

.headImg {
  max-width: 100%;
  width: 100%;
}

.ramLancerCon {
  display: flex;
  justify-content: space-between;
  padding-top: 107px;
  padding-bottom: 115px;
}

.ramLancerLeftCon {
  padding-top: 41px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  max-width: 374px;
  width: 100%;
}

.ramLancerCenterCon {
  position: relative;
  display: flex;
  align-items: center;
  flex-direction: column;
}

.fontXPGBig {
  position: absolute;
  font-family: "MM-S";
  font-weight: 700;
  font-size: 150px;
  line-height: 150px;
  color: #ffffff;
  text-transform: uppercase;
}

.ramImg {
  max-width: 100%;
  z-index: 1;
}

.ramLancerRightCob {
  padding-top: 101px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.CFCon,
.timeCon {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.mm-bg-XPG-grey {
  background: #272727;
}

.ruleCon {
  display: flex;
  justify-content: space-between;
}

.ruleLetCon {
  padding-top: 72px;
  padding-bottom: 188px;
  display: flex;
  flex-direction: column;
  max-width: 374px;
  width: 100%;
}

.ruleRight {
  padding: 116px 97px 163px 107px;
  background-image: url("/tpl/include/aktsii/RAM-XPG/img/bg1.webp");
  background-repeat: no-repeat;
  background-size: cover;
  max-width: 821px;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.topRuleCon,
.botRuleCon {
  display: flex;
  justify-content: space-between;
  gap: 20px;
}

.ruleInfoCon {
  display: flex;
  flex-direction: column;
  gap: 17px;
  max-width: 249px;
  width: 100%;
}

.ruleIco{
  width: 24px;
  height: 24px;
}

.msiCon{
  display: flex;
}

.msiLeftCon{
  padding-top: 156px;
  padding-bottom: 238px;
  display: flex;
  flex-direction: column;
  max-width: 421px;
  width: 100%;
}

.msiRightCon{
  display: flex;
  gap: 47px;
}

.msiImg{
  max-width: 100%;
}


@media (max-width:1200px) {
  .ramLancerCon{
    flex-direction: column;
    padding-top: 25px;
    padding-bottom: 25px;
  }

  .ramLancerLeftCon{
    max-width: 100%;
  }

  .ramLancerRightCob{
    order: 2;
    align-items: center;
  }

  .ramLancerCenterCon{
    order: 3;
  }

  .CFCon,
  .timeCon{
    align-items: center;
  }

  .ruleCon{
    flex-direction: column;
    align-items: center;
  }

  .ruleLetCon{
    max-width: 100%;
    padding-top: 25px;
    padding-bottom: 25px;
  }

  .ruleRight{
    gap: 25px;
  }

  .msiCon{
    flex-direction: column;
  }

  .msiLeftCon{
    padding-top: 25px;
    padding-bottom: 25px;
    max-width: 100%;
  }

  .msiRightCon{
    display: flex;
    justify-content: center;
  }
}


@media (max-width: 600px) {
  .ruleRight{
    padding: 116px 25px 163px 25px;
  }
}