body{
    font-family: 'Nunito', sans-serif;
}
#maincontainer{
    display: flex;
    background-color:#ddd;
    /* width:100%; */
    flex-wrap: nowrap;
    justify-content: flex-start;

    /* flex-direction: column; */
}

@media screen and (orientation: portrait){

body{    font-size: 40px;
}
    #maincontainer {
      -webkit-flex-direction: column;
      flex-direction: column;
    }
  }
#profile{
    /* width:20%; */
}

#calculator{
    /* width:20%; */
    /*background-color:red;*/
}

#pacer{
    /* width:20%; */
    
}
#pacer table{
    /* width:100%; */
}
#calculator .allurebox{
    background:rgb(161, 144, 156);
}
#calculator .allurebox:nth-child(even){
    background:rgb(124, 119, 123);
}
#pacer tr{background:rgb(129, 151, 142)}
#pacer tr:nth-child(even) {background: rgb(153, 165, 151)}


.modulecontainer>*{
    border: 1px solid rgb(218, 212, 212);
    padding:1em;
}

#put{
padding:1em;
}
#put label{
    display:block;

}

a.button1 {
    display:inline-block;
    padding:0.35em 1.2em;
    border:0.1em solid #FFFFFF;
    margin:0 0.3em 0.3em 0;
    border-radius:0.12em;
    box-sizing: border-box;
    text-decoration:none;
    font-family:'Roboto',sans-serif;
    font-weight:300;
    color:#FFFFFF;
    text-align:center;
    transition: all 0.2s;
    }
a.button1:hover{
    color:#000000;
    background-color:#FFFFFF;
    }
#calculators>div{
    background-color: gray;
    border: 1px solid black;
    margin-bottom: 1em;
    padding:1em;
}
#calculators>div>div{
    
    padding:0.3em;
}
@media all and (max-width:30em){
     a.button1{
    display:block;
    margin:0.4em auto;
     }
}

.colored{
    background-color:red;
}

#stravax .content{
    
    word-wrap: break-word;
}