/* ==================================================================================================
 * Title:      PastI.css
 * Author:     Héctor S. Enrique
 * Version:    1.0
 * Purpose:    Styles para el Crecimiento del Forraje.
 * Notes:      Version 1.0, Septiembre 2021
 *             - First release.
 * ==================================================================================================*/

.calculator3D {
  width: 460px;
}

input[type=text] {
    width: 90px;
    /* height: 35px; */
    border-radius: 5px;
    border: none;
    background-color: #333333;
    color: #d9d9d9;
    /* padding: 4px 14px 0 1px; */
    margin: 1px;
	text-align:center;
	font-size:12px;
}
input.quart[type=text] {
    width: 45px;
    /* height: 35px; */
    border-radius: 5px;
    border: none;
    background-color: #333333;
    color: #d9d9d9;
    /* padding: 4px 14px 0 1px; */
    margin: 1px 0px 1px 0;
	text-align:center;
	font-size:12px;
}
.combo {
    width: 265px;
    /* height: 35px; */
    border-radius: 5px;
    border: none;
    background-color: #333333;
    color: #d9d9d9;
    /* padding: 4px 0px 0 0px; */
    margin: 1px;
	text-align:center;
	font-size:12px;
}
.calc-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;

}

.label1 {
   margin: 1px; 
   width: 210px;
   border: none;
   height: 25px;
   border-radius: 4px;
   color: #000000;
   padding: 10 0px 0 0px;
   text-align:center;
}

.label3 {
   margin: 1px; 
   width: 210px;
   border: none;
   height: 25px;
   border-radius: 4px;
   color: #d0d0d0;
   background-color: #400000;
   padding: 10 0px 0 0px;
   text-align:center;
}

.label2 {
   margin: 1px 1px 1px 1px;  
   width: 110px;
   border: none;
   /* height: 25px; */
   border-radius: 4px;
   color: #101010;
   background-color: #a0a0a0;
   padding: 1px 1px 1px 1px;
   text-align:center;
}
.label21 {
   margin: 1px 1px 1px 1px;  
   width: 165px;
   border: none;
   /* height: 25px; */
   border-radius: 4px;
   color: #101010;
   background-color: #a0a0a0;
   padding: 1px 1px 1px 1px;
   text-align:center;
}
.label13 {
   margin: 1px 1px 1px 1px;  
   width: 65px;
   border: none;
   /* height: 25px; */
   border-radius: 4px;
   color: #101010;
   background-color: #a0a0a0;
   padding: 1px 1px 1px 1px;
   text-align:center;
}
.label15 {
   margin: 1px 1px 1px 1px;  
   width: 62px;
   border: none;
   /* height: 25px; */
   border-radius: 4px;
   color: #101010;
   background-color: #a0a0a0;
   padding: 1px 1px 1px 1px;
   text-align:center;
}
.label4 {
   margin: 1px 0px 1px 0px;  
   width: 49px;
   border: none;
   /* height: 25px; */
   border-radius: 4px;
   color: #101010;
   background-color: #a0a0a0;
   padding: 1px 1px 1px 1px;
   text-align:center;
}




.rich-label {
   margin: 3px;
   width: 210px;
   border: none;
   height: 25px;
   border-radius: 0px;
   color: #d0d0d0;
   background-color: #000080;
   padding: 10px 10px 0 1px;
   text-align:center;
}
.rich-label3 {
   margin: 1px 1px 1px 0px;  
   width: 65px;
   border: none;
   border-radius: 0px;
   color: #d0d0d0;
   background-color: #000080;
   padding: 1px 1px 1px 1px;
   text-align:center;
}
.rich-label5 {
   margin: 1px 1px 1px 0px;  
   width: 62px;
   border: none;
   border-radius: 0px;
   color: #d0d0d0;
   background-color: #000080;
   padding: 1px 1px 1px 1px;
   text-align:center;
}

.button {
   margin: 3px;
   width: 200px;
   border: none;
   height: 25px;
   border-radius: 4px;
   color: #000000;
   cursor: pointer;
}
.button1 {
   margin: 3px;
   width: 220px;
   border: none;
   height: 25px;
   border-radius: 4px;
   color: #000000;
   cursor: pointer;
}
.button5 {
   margin: 1px 1px 1px 1px;  
   width: 210px;
   border: none;
   height: 20px;
   border-radius: 4px;
   color: #000000;
   cursor: pointer;
}

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


.functions-cero {
	margin-top: 3px;
    width: 450px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

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

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

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

.triggers {
    background-color: #ffc266;
}



.numbers {
    background-color: #999999;
}

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

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

canvas {
	padding:3px 0px 3px 0px;
	/* image-rendering: pixelated; */
}