@import url("https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css");
@import url("https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,wght@0,400;0,600;0,700;0,800;1,400;1,700&display=swap");
body, html { height: 100%; }

body.noscroll { overflow: hidden; }

.shadow { -webkit-box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.05); -moz-box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.05); box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.05); }

.shim { width: 100%; float: left; height: 60px; }

.update-list-header { width: 100%; background: url("https://www.onenewsnow.com/media/17260100/onntickerapp-bg.jpg") left top no-repeat; color: #f0f0f0;  background-size: cover; padding: 0px 20px; height: 50px; line-height: 50px; font-size: 17px; font-weight: bold; font-family: "Nunito Sans", Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; font-size: 15px; float: left; }

.update-list-header img { margin-top: 7px; float: left; margin-right: 5px; }

.update-list-header .update-list-header-title { float: left; width: auto;  font-size: 17px; font-weight: bold !important; }

.update-list-header #update-list-loading { float: right; margin-top: 10px; display: none; height: 30px; width: 30px; border-radius: 15px; overflow: hidden; }

.update-list-header #update-list-loading.show { display: block; }

.update-list-header #update-list-client-loading { float: right; margin-top: 10px; display: none; height: 30px; width: 30px; border-radius: 15px; overflow: hidden; }

.update-list-header #update-list-client-loading.show { display: block; }

.update-list { float: left; width: 100%; max-height: 350px; overflow-y: auto; background-color: #FFF; border: solid 1px #DDD; font-family: "Nunito Sans", Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; font-size: 15px; }

.update-list .update { float: left; width: 100%; padding: 20px; padding-top: 15px; position: relative; border-bottom: solid 1px #DDD; cursor: pointer; height: auto; z-index: 90; }

.update-list .update:hover { background-color: #f9f9f9; curor:pointer; }

.update-list .update .update-content-wrapper { float: left; width: 100%; }

.update-list .update .button { position: absolute; top: 15px; right: 20px; padding: 5px; line-height: normal; height: auto; background-color: red; color: #FFF; font-size: 10px; font-weight: bold; z-index: 99999; }

.update-list .update P { font-size: 14px !important; margin-bottom: 15px !important; }

.update-list .update:last-child { border-bottom: none; }

.update-list .update .update-time { float: left; width: auto; margin-bottom: 5px; font-size: 11px; color: #111; pointer-events: none; border: solid 1px #DDD; padding: 2px 10px; border-radius: 12px; background-color: FFF; }

.update-list .update .update-title { font-weight: 700; font-size: 16px; float: left; width: 100%; pointer-events: none; white-space: pre-wrap !important; overflow-wrap: break-word !important; }

.update-list .update .update-content { float: left; width: 100%; pointer-events: none; white-space: pre-wrap !important; overflow-wrap: break-word !important; }

.update-list .update .update-hidden-content { display: none; pointer-events: none; white-space: pre-wrap !important; overflow-wrap: break-word !important; }

.update-list .update.latest-update { animation-name: latest-update-color; animation-duration: 2s; animation-iteration-count: infinite; color: #FFF !important; }

.update-list .update.latest-update .update-time { color: #333 !important; background-color: #FFF !important; }

.update-modal-wrap { position: fixed; height: 100%; width: 100%; top: 0px; left: 0px; z-index: 999999999; background-color: rgba(0, 0, 0, 0.5); padding-top: 50px; display: none; pointer-events: none; }

.update-modal-wrap.show { display: block; pointer-events: all; overflow-y: auto !important; }

.update-modal-wrap .update-modal { width: 100%; max-width: 650px; float: left; height: auto; padding: 20px; background-color: #FFF; z-index: 9999999999; position: absolute; left: 50%; transform: translateX(-50%); -webkit-box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.05); -moz-box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.05); box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.05); }

.update-modal-wrap .update-modal .update-modal-close { position: absolute; top: 5px; right: 5px; font-size: 25px; height: 40x; line-height: 40px; width: 40px; text-align: center; color: #555; cursor: pointer; }

.update-modal-wrap .update-modal .update-modal-close:hover { color: #000; }

.update-modal-wrap .update-modal .update-date-modal-date { font-size: 14px; margin-bottom: 10px; border: solid 1px #DDD; padding: 2px 10px; border-radius: 12px; background-color: FFF; width: auto; float: left; }

.update-modal-wrap .update-modal .update-date-modal-title { font-size: 20px; font-weight: bold; margin-bottom: 10px; overflow-wrap: break-word !important; float: left; width: 100%; }

.update-modal-wrap .update-modal .update-date-modal-content { overflow-wrap: break-word !important; float: left; width: 100%; }

.update-modal-wrap .update-modal .update-date-modal-content p { font-size: 15px !important; margin-bottom: 10px !important; }

.update-modal-open { overflow: hidden; }

#live-viewers { float: left; postition: relative;  margin-left: auto; margin-right: auto; text-align: center; background-color: #cf000f; color: #FFF; width: auto; line-height: 27px; height: 29px; border-radius: 3px; padding-left: 10px; margin-bottom: 10px; letter-spacing: 0.04rem; border: solid 1px #cf000f; font-size: 12px; font-weight: 800; margin-left: 50%; transform: translateX(-50%); }

#live-viewers .ionicon { color: #FFF; font-size: 18px; margin-top: 4px; float: left; margin-left: 5px; }

#live-viewers .live-viewers-title { float: left; }

#live-viewers span { font-weight: 400; float: right; background-color: #FFF; color: #222; float:left; margin-left: 10px; padding-left: 10px; padding-right: 10px; text-transform: uppercase; letter-spacing: 0.05rem; }

@keyframes latest-update-color { 0% { background-color: #f22613; }
  50% { background-color: #cf000f; }
  100% { background-color: #f22613; } }

/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */
