body{font-family:'Acme',sans-serif;height:100%}.alignleft{float:left;margin-right:15px}.alignright{float:right;margin-left:15px}.aligncenter{display:block;margin:0 auto 15px}a:focus{outline:0 solid}img{max-width:100%;height:auto}h2{margin:0 0 15px;font-weight:700}a:hover{text-decoration:none}.header{margin-top:20px;margin-bottom:20px}.header-title{color:black;font-size:45px}.uni-form-input{height:21px;border-radius:0;text-align:center}.btn-primary{margin:10px 10px 30px 10px}.btn-danger{margin-left:15px}.swal-overlay{background-color:#2ba589}select{width:100%}.dangerous{background:black;color:white;font-size:18px}.text-muted{font-size:40px;color:black;margin-bottom:3px}.content{background:black;text-align:justify;color:white;padding:20px 10px;border-radius:7px;box-shadow:4px 4px 10px}
/************ Square *************/

.square {
    transition: 1s;
    margin-top: 20px;
    margin-left: 120px;
    border: 5px solid #000;
    letter-spacing: normal;
    line-height: normal;
    /* Color & Background */
    color: rgb(0, 0, 0);
    /* Box */
    height: 50px;
    width: 50px;
    /* Positioning */
    position: relative;
    /* Effects */
    transform: matrix(6.12323e-17, -1, 1, 6.12323e-17, 0, 0);
    transition: transform 0.4s ease-in-out 0s;
    box-sizing: content-box;
    margin-bottom: 10px;
    border-radius: 10px;
}

.square:hover {
    transition: 0.5s;
    transform: rotate(-180deg);
}

@media screen and (max-width: 736px) {
    .square {
        margin-left: -150px;
        margin-bottom: 20px;
    }
}