@media (max-width: 575.98px) { .card-header{ font-size: 20px } #insert-button{ font-size: 1em; } div[data-notify="container"] { width: 30% !important; } .container{ max-width: 100%; } .top-space{ display:none; } .left-button{ margin-bottom: 20px; } } @media (min-width: 576px) and (max-width: 767.98px) { .card-header{ font-size: 20px } #insert-button{ font-size: 1em; } div[data-notify="container"] { width: 30% !important; } } .uThumbnail{ height: 30%; padding-left: 20px; padding-right: 20px; } .hqThumbnail{ width: 240px; } .pt-3-half { padding-top: 1.4rem; } div[data-notify="container"] { width: 10%; } .insert-button{ font-size: 18px; } table th { font-size: 16px !important; font-weight: 500 !important; } table td { font-size: 14px !important; font-weight: 400 !important; } /* 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 */ #loading-modal.modal { display: none; position: fixed; z-index: 1000; top: 0; left: 0; height: 100%; width: 100%; background: rgba( 255, 255, 255, .8 ) url('../img/ajax-loader.gif') 50% 50% no-repeat; } /* When the body has the loading class, we turn the scrollbar off with overflow:hidden */ body.loading #loading-modal.modal { overflow: hidden; } /* Anytime the body has the loading class, our modal element will be visible */ body.loading #loading-modal.modal { display: block; } .modal-description{ color: grey; margin-top: 0.5rem; } .modal-footer{ text-align: center !important; display: block !important; } /* CSS for google sign in button*/ #signinButton { display: inline-block; background: white; color: #444; /* width: 190px; */ border-radius: 5px; border: thin solid #888; box-shadow: 1px 1px 1px grey; white-space: nowrap; } #signinButton:hover { cursor: pointer; } span.label { font-family: 'Roboto', sans-serif; font-weight: normal; color: black; font-size:14px; } span.icon { background: url('https://upload.wikimedia.org/wikipedia/commons/thumb/5/53/Google_%22G%22_Logo.svg/30px-Google_%22G%22_Logo.svg.png') transparent 5px 50% no-repeat; ; display: inline-block; vertical-align: middle; width: 42px; height: 42px; } span.buttonText { display: inline-block; vertical-align: middle; padding-left: 5px; padding-right: 5px; font-size: 14px; font-weight: bold; /* Use the Roboto font that is loaded in the */ font-family: 'Roboto', sans-serif; } .sign-out-button{ text-align: center; padding-top: 20px; }