style.css

.wcircle-menu-item{
    border-radius:50%;
    padding:2px;
    width:65px;
    height:65px;
}

.wcircle-menu-item img{
    width: 100%;
    height: 100%;
    border-radius:50%;
}

.circleSelector {
    border-radius: 50%;
    position: absolute; 
    top: 50%;
    transform: translateY(-50%);
    width: 69px; 
    height: 69px;
}

.circleText {
    margin-left: -65px;
    margin-top: 10px;
    font-family: Arial, sans-serif;
    font-weight: bold;
    width: 200px;
    text-align: center;
}

.phrase {
    position:absolute;
    margin-left: 20px;
    font-family: Arial, sans-serif;
    font-weight: bold;
    width: 800px;
    text-align: center;
}

.cyan {
    color:cyan;
}

.green {
    color:green;
}

.red {
    color:red;
}

.yellow {
    color:yellow;
}

.wcircle-icon img{
    width: 100%;
    height: 100%;
    border-radius:50%;
}

.wcircle-icon {
    border-radius:50%;
    padding:2px;
    width:65px;
    height:65px;
}

.composer {
    position: absolute;
    top: 150px;
    width : 850;
    height: 350px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #7777AA;
}

body {   
    background-color: #555588; 
}

.menu_qui {
    left: 100px;
}

.menu_ou {
    left: 275px;
}

.menu_quand {
    left : 450px;
}

.iotSelectorWrapper {
    position: absolute;
    height: 100%;
    width: 275px;
    right: 0px;
    background-color: #77AAAA;
    
}

.menu_iot {
    left: 100px
}