body {
	padding-top: 120px;
	font-family: Arial;
	font-size: 20px;
	background-image: url("https://posts.m4ra.net/img/background.jpg");
}

h4{
	font-size: 20pt;
	text-align: center;
}


div{
	background-color: black;
	color: white;
	padding-left: 25px;
	padding-right: 25px;
	border-radius: 10px;

}

.container {
	width: 60%;
	margin: 0 auto;
	color: white;

}

.index_container {
	width: 800px;
	margin: 0 auto;
}
.index_container th {
		font-size: 12pt;
										}

.index_container	td {
		font-size: 12pt;

	}



a:link, a:visited {
	color: slateGray;
	text-decoration: none;
	border-bottom: 1px dotted slateGray;

}


a:hover {
	color: #444;
	border-bottom-color: #444;
}

small {
	color: #999;
	font-style: italic;
}

p{
	line-height: 30px;

}

ol li {
	line-height: 50px;
}

th {
	font-size: 16pt;
	color: white;

}

td {
	font-size: 16pt;
	color: white;

}


input {
  width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  box-sizing: border-box;
  border: 2px solid black;
  border-radius: 4px;
  color: black;
  font-size: 16pt;
  background-color: white;
}

textarea {
  width: 100%;
  height: 250px;
  padding: 12px 20px;
  box-sizing: border-box;
  border: 2px solid black;
  border-radius: 4px;
  color: black;
  background-color: white;
  resize: none;
  font-size: 16pt;
}

input[type=button], input[type=submit] {
  background-color: white;
  border: 2px solid black;
  color: black;
  padding: 22px 32px;
  text-decoration: none;
  margin: 4px 2px;
  cursor: pointer;
  font-size: 16pt;
  transition-duration: 0.4s;
	width: 100%;
}

input[type="submit"]:hover {
    background-color: gainsboro;
    color: black;
}

select {
  margin: 4px 2px;
  width: 100%;
  padding: 22px 32px;
  font-size: 20px;
  border: 1px solid black;
	border-radius: 4px;
	font-size: 16pt;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: url(https://m4ra.net/posts/assets/down.ico) 96% / 15% no-repeat #FFF;
}

@media (max-width: 540px) {
    body {
        font-size:30pt !important;
    }

    p {
      font-size: 50pt;
      }

    .socials {
        width: 90%;
      }

}

@media screen and (max-width:1200px) and (orientation:landscape){
   i.icons {
    font-size: 50pt;
      }
    p {
        font-size: 2vh;
      }

      .socials {
          width:90%;
        }

        input {
          -webkit-appearance: none; -moz-appearance: none;
          display: block;
          height: 100px;
          width: 80%;
          font-size:5vh;
          margin-top: 5px;


        }

        textarea {
          -webkit-appearance: none; -moz-appearance: none;
          display: block;
          height: 400px;
          width: 80%;
          line-height: 40px; font-size: 17px;
          border: 1px solid #fff;
          font-size:5vh;

        }

        h4 {
          font-size: 6vh;

          }

}

@media screen and (max-width:1200px) and (orientation:portrait) {
    i.icons {
    font-size: 80pt;
    margin-left: 25px;
      }

    i{
      margin-bottom: 5px;
     }

    p{
      font-size: 2vh;
      }

    h1{
    font-size: 100pt;
      }

      .socials {
          width: 90%;
        }

        .Halftext {
          width: 85%;
        }

        .intro{
            font-size: 2vh;

        }

        small{
            font-size: 2vh;

        }

        input {
          -webkit-appearance: none; -moz-appearance: none;
          display: block;
          height: 150px;
          width: 80%;
          font-size:3vh;
          margin-top: 5px;


        }

        textarea {
          -webkit-appearance: none; -moz-appearance: none;
          display: block;
          height: 600px;
          width: 80%;
          line-height: 40px; font-size: 17px;
          border: 1px solid #fff;
          font-size:3vh;

        }

        input[type=button], input[type=submit] {

          font-size: 3vh;
        }

        h4 {
          font-size: 4vh;

          }




    }