/* CSS Document by Dieter Schneider 2007 | www.csstemplateheaven.com */

* {margin: 0; padding: 0;}

body {
	 background-image: url(../images/jeans.jpg);

	 background-size: 1290px 1200px;
	 font-size: 100%;
     display: flex;
	 justify-content: center;
}

/*---------------- Main structure --------------*/

#container{
	background-image: url(../images/body3.jpg);
	width: 2000px;
	height: 2000px;
	font-size: 1.5em;
	background-repeat: repeat-y;	
	display: flex;
	flex-direction: column;
	justify-items: center;
	align-items: center;
	}

h1 {
  	margin-left: 100px;
	margin-top: 50px;
	font-size: 30px;
	color: #55311B;
	font-family:'Times New Roman', Times, serif;
	text-align: center;
}

textarea[type=text] {
	width: 1800px;
	height: 405px;
	border-radius: 5px;
    border: 0px;
    background-color: #333333;
	color: #ffffff;
	background-color:  black;
	font-size: 32px;
	border: 1px solid #1c5e5f;
	padding: 15px 50px;
	cursor: pointer;
	margin-left: 10px;
	margin-top:10px;
}

textarea[type=text]:hover {
	color:black;
	background-color: #ffffff;
}


.calc-buttons {
max-width: 2000px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;

}


.button {
margin: 1px;
width: 100px;
border: none;
height: 100px;
border-radius: 4px;
color: #000000;
cursor: pointer;
font-size: 15px;
font-weight: 800;
font-style: normal;
}

button:hover {
  background-color: hsla(180, 100%, 40%, 0.3);
  transition: .2s;
}


.functions-one {
    width: 500px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
}


.functions-two {
    width: 800px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.functions-three {
    width: 500px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.triggers {
    background-color: #ffc266;
}


.numbers {
    background-color: #999999;
}

.basic-stuff {
    background-color: #80d4ff;
}

.complex-stuff {
    background-color: #80ffff;
}



.lengthunit {
    background-color: #d70f0f;
}
.Punit {
    background-color: #0f55d7;
}
.Temunit {
    background-color: #f7e600;
}