@media (orientation: Portrait), not (min-width: 720px) {
    :root{
        --B0-font-size-1:       min(3.5vh, 5vw);
        --B0-font-size-2:       calc(var(--B0-font-size-1) / 2);
        --B0-font-size-3:       calc(var(--B0-font-size-1) / 3 * 2);
        --B0-font-size-4:       calc(var(--B0-font-size-1) / 4 * 3);

        --B0-p_000-padding:     var(--B0-font-size-3);
        --B0-p_000-font-size:   var(--B0-font-size-3);
        --B0-p_000-margin:      0 0 var(--B0-font-size-3) 0;

        --B0-p_001-padding:     var(--B0-font-size-3);
        --B0-p_001-font-size:   var(--B0-font-size-3);

        --B0-p_002-padding:     var(--B0-font-size-3);
        --B0-p_002-font-size:   var(--B0-font-size-3);

        --B0-div_001-margin:    var(--B0-font-size-2);
        --B0-div_001-padding:   var(--B0-font-size-2);

        --B0-border-radius:     var(--TF0-font-size-2);
    }
}

@media (min-width: 720px) and (orientation: Landscape){
    :root{
        --B0-font-size-1:       min(calc(3vh + 5px), calc(3vw + 5px));
        --B0-font-size-2:       calc(var(--B0-font-size-1) / 2);
        --B0-font-size-3:       calc(var(--B0-font-size-1) / 3 * 2);
        --B0-font-size-4:       calc(var(--B0-font-size-1) / 4 * 3);

        --B0-p_000-padding:     var(--B0-font-size-3);
        --B0-p_000-font-size:   var(--B0-font-size-3);
        --B0-p_000-margin:      0 0 var(--B0-font-size-3) 0;

        --B0-p_001-padding:     var(--B0-font-size-3);
        --B0-p_001-font-size:   var(--B0-font-size-3);

        --B0-p_002-padding:     var(--B0-font-size-3);
        --B0-p_002-font-size:   var(--B0-font-size-3);

        --B0-div_001-margin:    var(--B0-font-size-2);
        --B0-div_001-padding:   var(--B0-font-size-2);

        --B0-border-radius:     var(--TF0-font-size-2);
    }
}

.B0-p_000{
    font-size:          var(--B0-p_000-font-size);
    color:              #3d5b7b;
    padding:            var(--B0-p_000-padding);
    text-align:         center;
    font-family:        "OpenSans-Medium";
    display:            inline-block;
    width:              100%;
}

.B0-p_001{
    font-size:          var(--B0-p_001-font-size);
    color:              #3d5b7b;
    padding:            var(--B0-p_001-padding);
    text-align:         right;
    font-family:        "OpenSans-Medium";
    display:            inline-block;
}

.B0-p_002{
    font-size:          var(--B0-p_002-font-size);
    color:              #18282f;
    padding:            var(--B0-p_002-padding);
    text-align:         left;
    font-family:        "OpenSans-Medium";
    display:            inline-block;
}

.B0-div_000{
    border-radius:      var(--B0-border-radius);
    background-color:   #ffffff;
    width:              100%;
    text-align:         center;
}

.B0-div_001{
    border-radius:      var(--B0-border-radius);
    margin:             var(--B0-div_001-margin);
    padding:             var(--B0-div_001-padding);
    background-color:   #d7eef8;
    display:            inline-block;
}
