.center-horizontal {text-align: center;} .margin-top-1 { margin-top:1em; } .margin-top-2 { margin-top:2em; } .margin-top-3 { margin-top:3em; } .margin-top-4 { margin-top:4em; } .margin-top-5 { margin-top:5em; } .margin-bottom-1 { margin-bottom:1em; } .margin-bottom-2 { margin-bottom:2em; } .margin-bottom-3 { margin-bottom:3em; } .margin-bottom-4 { margin-bottom:4em; } .margin-bottom-5 { margin-bottom:5em; } .cursor_pointer { cursor:pointer;} .cursor_not_allowed { cursor:not-allowed;} i.size-1{font-size:2em} i.size-2{font-size:2em} i.size-3{font-size:4em} i.size-4{font-size:7em} i.size-5{font-size:12em} i.size-6{font-size:20em} .color_blue{ color: #428bca} .color_dark{ color: #2b2b2b} .color_gray{ color: #8f8f8f} .color_red{ color: #FF0000} .remove_border { border: 0px; } .vertical-center { height: 100%; /* Fallback for vh unit */ /*min-height: 100vh;*/ /* You might also want to use 'height' property instead. Note that for percentage values of 'height' or 'min-height' properties, the 'height' of the parent element should be specified explicitly. In this case the parent of '.vertical-center' is the element */ } .basculeDiv { width:100%; height: 1.5em; background-color: #eac9c9; text-align: center; font-weight: bold; } .progress_form { position:relative; width:400px; border: 1px solid #ddd; padding: 1px; border-radius: 3px; } .bar_form { background-color: #5bc0de; width:0%; height:20px; border-radius: 3px; } .percent_form { position:absolute; display:inline-block; top:3px; left:48%; }