body {
  color: #34393f;
  font-family: arial;
}

a, a:visited, a:hover, a:checked {
  color: #34393f;
  text-decoration: underline;
}

#mtitle {
  position: relative;
  width: 36%;
  left: 32%;
  text-align: center;
  font-size: 32px;
  font-weight: 700;
}

#whatIs {
  margin-top: 25px;
}

#whatContent, #learnContent {
  position: relative;
  width: 36%;
  left: 32%;
  border: 3px solid #A7A392;
  padding: 15px;
  border-radius: 0px 0px 25px 25px;
}

.masterContent {
  position: relative;
  width: 36%;
  left: 32%;
  border: 3px solid #A7A392;
  padding: 15px;
  border-radius: 0px 0px 25px 25px;
}

.arrow {
  display: inline-block;
  cursor: pointer;
  font-size: 40px;
  font-weight: 700;
  padding: 0px 40px;
  position: relative;
}

.arrowLeft:hover {
  animation-name: aLeft;
  animation-duration: 0.5s;
}

@keyframes aLeft{
  from{left: 0px;}
  to{left: -10px;}
}


.arrowRight:hover {
  animation-name: aRight;
  animation-duration: 0.5s;
}

@keyframes aRight {
  from {left: 0px;}
  to {left: 10px;}
}

.arrow::selection {
    background: transparent;
}

.arrowText {
  padding: 0px 0px;
  font-weight: initial;
}

.whatIsTitle {
  text-align: center;
  font-size: 24px;
  margin-top: 35px;
  margin-bottom: 15px;
}

.whatIsText {
  text-align: center;
  font-size: 14px;
  line-height: 2;
}

.whatIsList {
  display: inline-block;
  text-align: left;
}

.section {
  position: relative;
  width: 36%;
  left: 32%;
  text-align: center;
  font-size: 24px;
  margin-top: 35px;
  font-weight: 700;
  padding-top: 15px;
  padding-bottom: 15px;
  border-radius: 25px;
  border: 3px solid #A7A392;
  transition-property: background;
  transition-duration: 1s;
  padding: 15px;
}

  .section:hover {
    cursor: pointer;
    background: #A7A392;
  }

  .section::selection {
    background: transparent;
  }


.noSel{
  transition-property: color;
  transition-duration: 0.5s
}

.noSel::selection {
  background: transparent;
}

.noSel:hover {
  cursor: pointer;
  color: #A7A392;
}

@media only screen and (max-device-width: 430px) {
  #whatContent {
    position: relative;
    width: 36%;
    left: 10%;
    border: 3px solid #A7A392;
    padding: 15px;
    border-radius: 0px 0px 25px 25px;
    min-width: 333px;
  }

  .masterContent {
    position: relative;
    width: 36%;
    left: 32%;
    border: 3px solid #A7A392;
    padding: 15px;
    border-radius: 0px 0px 25px 25px;
  }

  .section {
    position: relative;
    width: 36%;
    left: 10%;
    text-align: center;
    font-size: 24px;
    margin-top: 35px;
    font-weight: 700;
    padding-top: 15px;
    padding-bottom: 15px;
    border-radius: 25px;
    border: 3px solid #A7A392;
    transition-property: background;
    transition-duration: 1s;
    padding: 15px;
    min-width: 333px;
  }

    .section::selection {
      background: transparent;
    }
}

@media only screen and (max-device-width: 768px) {
  /* Styles */
}

/* Animations */
.invisible {
display: none;
}