/** * ----------------------------------------------- * * Loading Screen Style *  * @author Yalan Bravo yalanbo@dudev.mx * @version 1.0 * Copyright (c) 2018, Dudev S.A. de C.V. * * ----------------------------------------------- */body{    padding : 0px;    margin:0px;}#loadWrapper{    width: 100%;    height: 100%;    background-color: #3389B6 !important;    background-image: url('../images/cio-bg2.jpg') !important;    background-size: cover;    position: absolute;    margin: 0px !important;    padding: 0px !important;}#loadLegend{    border: solid thin #006699;    padding: 10px 20px;    width: 25%;    min-width: 240px;    margin: 20px;    font-family: Verdana;    background: #FFFFFF;}#loadLegend H3{    color : #006699;    font-size: 1.1rem;}#loadLegend p{    color : #666666;    font-size: .75rem;}#loadLegend h3 img{    margin-bottom: -5px;}/* Start by setting display:none to make this hidden.   Then we position it in relation to the viewport window   with position:fixed. Width, height, top and left speak   for themselves. Background we set to 80% white with   our animation centered, and no-repeating */.modal-loading {    display:    none;    position:   fixed;    z-index:    1000;    top:        0;    left:       0;    height:     100%;    width:      100%;    background: rgba( 255, 255, 255, .8 );}/* When the body has the loading class, we turn   the scrollbar off with overflow:hidden */body.loading {    overflow: hidden;   }/* Anytime the body has the loading class, our   modal element will be visible */body.loading .modal-loading {    display: block;}.modal-loading .img-container{    background: #FFF;    text-align: center;    width: 64px;    height: 64px;    display: block;    position: relative;    margin: auto;    border-radius: 32px;    top: 40%;}.modal-loading .img-container img{    margin: auto !important;    position: relative;    top: 16px;    display: block;}