@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:300,300i,400,400i,700,700i&display=swap'); 
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,500,600,700,800,300i,400i,500i,600i,700i,800i&display=swap'); 
@font-face { 
  font-family:"iconvault";
  src:url("./fonts/iconvault_forecastfont.woff-#iefix") format("woff"),url("./fonts/iconvault_forecastfont.ttf") format("truetype");
  font-style:normal;
  font-weight:normal;
  font-display:swap;
} 
  body {  
    font-size:100%;
  }  
body { 
/* CSS Variables that may have been missed get put on body */ 
    --icon-mask:  var(--icon-mask-twitter);  
    --icon-mask-width:  2rem;  
    --icon-mask-color:  #000; 
    --icon-mask:  var(--icon-mask-grid); 
} 

* { 
    box-sizing: inherit;
} 

html { 
    border: 0; 
    font-size: 100%; 
    margin: 0; 
    padding: 0; 
    vertical-align: baseline;
} 

html { 
    box-sizing: border-box;
} 

:root { 
    --icon-mask-grid: url("./images/grid.svg"); 
    --icon-mask-twitter: url("./images/twitterx.svg"); 
} 

body { 
    border: 0; 
    font-size: 100%; 
    margin: 0; 
    padding: 0; 
    vertical-align: baseline;
} 

body { 
    line-height: 1;
} 

body { 
    -webkit-font-smoothing: antialiased; 
    -moz-osx-font-smoothing: grayscale;
} 

body { 
    margin-top: 43px !important; 
    background-color: #fff; 
    font-family: "Open Sans",Helvetica,Arial,sans-serif; 
    color: #323232; 
    font-weight: normal; 
    font-style: normal;
} 

*,:before,:after { 
    box-sizing: inherit;
} 

*  { 
    -webkit-font-smoothing: antialiased; 
    -moz-osx-font-smoothing: grayscale;
} 

div { 
    border: 0; 
    font-size: 100%; 
    margin: 0; 
    padding: 0; 
    vertical-align: baseline;
} 

.index-header-wrapper { 
    position: relative; 
    display: flex; 
    align-items: flex-end; 
    flex-wrap: wrap; 
    margin: 0 auto; 
    padding: var(--wrapper-padding, 16px);
} 

@media only screen and (min-width: 1245px){ 
  .index-header-wrapper { 
    width: 1140px;
  } 
}     

@media only screen and (min-width: 1024px){ 
  .index-header-wrapper { 
    padding-bottom: 0;
  } 
}     

section { 
    border: 0; 
    font-size: 100%; 
    margin: 0; 
    padding: 0; 
    vertical-align: baseline;
} 

section { 
    display: block;
} 

.container { 
    margin: 0 auto; 
    width: 96%; 
    margin-left: auto; 
    margin-right: auto; 
    position: relative; 
    background-color: #fff;
} 

@media only screen and (min-width: 1245px){ 
  .container { 
    width: 1140px;
  } 
}     

.index-header { 
    position: relative;
} 

.index-header { 
    width: 100% !important; 
    box-shadow: inset 0 -4px #f90; 
    z-index: 1000;
} 

a { 
    border: 0; 
    font-size: 100%; 
    margin: 0; 
    padding: 0; 
    vertical-align: baseline;
} 

a { 
    color: #111; 
    text-decoration: none;
} 

.index-header .logo  { 
    width: 187px; 
    height: 33px; 
    display: inline-block; 
    background: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%20version%3D%221.1%22%20id%3D%22Layer_1%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%20186%2033%22%20style%3D%22enable-background%3Anew%200%200%20186%2033%3B%22%20xml%3Aspace%3D%22preserve%22%3E%0A%3Cstyle%20type%3D%22text/css%22%3E%0A%09.st0%7Bfill%3A%23000016%3B%7D%0A%09.st1%7Bfill%3A%23F69220%3B%7D%0A%3C/style%3E%0A%3Cg%3E%0A%09%3Cg%3E%0A%09%09%3Cpath%20class%3D%22st0%22%20d%3D%22M85%200v9H72.5709305c-4.5804062%200-8.3527069%201.7360945-11.3201523%204.1%20C58.4183769%2015.3%2057%2018.3%2057%2021.2733269c0%203%201.4%205.9%204.3%208.1%20C64.2182236%2031.8%2068%2033%2072.6%2033h12.1388016H98V0H85z%20M85%2028.0433922h-6.1220627%20c-2.5986023%200-4.6940384-0.7100754-6.3142624-2.1155777c-1.5207596-1.272934-2.2900238-2.9252586-2.2900238-4.6544876%20c0-1.7398586%200.7148972-3.456831%202.2900238-4.6544876C74.3079224%2015.3%2076.3%2015%2078.9%2015H85V28.0433922z%22/%3E%0A%09%09%3Crect%20class%3D%22st1%22%20width%3D%2213%22%20height%3D%226%22/%3E%0A%09%09%3Cg%3E%0A%09%09%09%3Crect%20y%3D%229%22%20class%3D%22st0%22%20width%3D%2212.9%22%20height%3D%2224%22/%3E%0A%09%09%3C/g%3E%0A%09%09%3Cpath%20class%3D%22st0%22%20d%3D%22M122.9845352%2014H137V9h-20.3083191c-4.591301%200-8.3810196%201.7360945-11.3415756%204.1%20c-2.8182373%202.2067614-4.2329865%205.1554575-4.2329865%208.1502962c0%203%201.4%205.9%204.2%208.1%20C108.3106613%2031.8%20112.1%2033%20116.7%2033H137v-4.9566078h-14.0154648%20c-6.6511993%200.0121632-7.6614914-3.2494564-8.040863-4.0433922H137v-6h-22.0563278%20C115.5293884%2017.1%20117.1%2014%20123%2014z%22/%3E%0A%09%09%3Cpath%20class%3D%22st0%22%20d%3D%22M39.0367889%209H17v24h13.2694931V15h7.2503738c3.8147812-0.1127167%203.8%203%203.8%203.8%20V33H54V17.0604858C54%2015.4%2054%209%2039%209z%22/%3E%0A%09%09%3Cpolygon%20class%3D%22st0%22%20points%3D%22182.5%2C9%20167.2%2C9%20161.3%2C14.7%20155.3%2C9%20140%2C9%20153.6%2C21.3%20140%2C33%20155.3%2C33%20161.3%2C27.9%20167.2%2C33%20182.5%2C33%20168.9%2C21.3%22/%3E%0A%09%3C/g%3E%0A%3C/g%3E%0A%3C/svg%3E%0A") no-repeat center center/cover; 
    vertical-align: middle;
} 

a:hover { 
    color: #f60;
} 

ul { 
    border: 0; 
    font-size: 100%; 
    margin: 0; 
    padding: 0; 
    vertical-align: baseline;
} 

ul { 
    list-style: none;
} 

.trending-topics { 
    display: flex; 
    align-items: center; 
    margin-left: 1.25rem;
} 

.header-parts { 
    display: flex; 
    align-items: stretch; 
    margin-left: auto; 
    color: #999999; 
    font: 13px/1.3 'Roboto Condensed', sans-serif;
} 

nav { 
    border: 0; 
    font-size: 100%; 
    margin: 0; 
    padding: 0; 
    vertical-align: baseline;
} 

nav { 
    display: block;
} 

.index-header nav  { 
    display: flex; 
    align-items: center; 
    width: calc(100% + 1.25rem); 
    margin: .625rem -.625rem 0;
} 

.dropdown-container { 
    position: absolute; 
    left: 50%; 
    top: 100%; 
    width: calc(100% + 2rem); 
    max-width: 100vw; 
    padding: 1.5rem 2rem; 
    border-radius: 0 0 .5rem .5rem; 
    background-color: white; 
    box-shadow: 0 1.25rem 2rem rgba(0,0,0,0.2); 
    transform: translateX(-50%);
} 

.dropdown-container[hidden] { 
    display: none;
} 

.header-parts > *  { 
    padding: 0 .75rem;
} 

.header-parts > :not(:last-child)  { 
    border-right: 1px solid #e6e6e6;
} 

.header-parts .calendar  { 
    display: flex; 
    flex-direction: column; 
    justify-content: center; 
    text-align: right;
} 

.header-parts .weather  { 
    display: flex; 
    align-items: stretch; 
    padding-right: 0;
} 

.index-header nav a  { 
    position: relative; 
    font: 1.25rem/1 'Roboto Condensed', sans-serif; 
    text-transform: uppercase; 
    z-index: 100;
} 

.index-header nav a.rovat-link  { 
    padding: .625rem;
} 

.notification { 
    animation: jump .7s ease-out 3s 3;
} 

.notification:after { 
    content: ''; 
    position: absolute; 
    left: 50%; 
    bottom: 0; 
    width: 10px; 
    height: 4px; 
    background-color: white; 
    transform: translateX(-50%) scaleX(0); 
    animation: white-out .5s linear 5s forwards; 
    z-index: 1;
} 

.index-header nav a.rovat-icon  { 
    width: var(--icon-mask-width, 1rem); 
    height: var(--icon-mask-height, 1rem); 
    background-color: var(--icon-mask-color, #000); 
    -webkit-mask: var(--icon-mask) no-repeat center/cover; 
    mask: var(--icon-mask) no-repeat center/cover; 
    margin: .625rem;
} 

.index-header nav a.rovat-icon.navi_twitter  { 
    margin-left: auto; 
    margin-right: 0px !important; 
    --icon-mask: var(--icon-mask-twitter); 
    --icon-mask-width: 2rem; 
    --icon-mask-color: #000;
} 

.index-header nav a.rovat-icon.navi_socials  { 
    --icon-mask: var(--icon-mask-grid);
} 

.loader { 
    display: block; 
    width: 66px; 
    margin: 32px auto; 
    font-size: 0;
} 

time { 
    border: 0; 
    font-size: 100%; 
    margin: 0; 
    padding: 0; 
    vertical-align: baseline;
} 

.exchange-ticker { 
    display: block; 
    columns: 2; 
    column-rule: 1px solid #e6e6e6; 
    column-gap: 1rem; 
    width: 100%; 
    white-space: nowrap;
} 

.header-parts .weather .temperature  { 
    display: flex; 
    flex-direction: column; 
    justify-content: center;
} 

.header-parts .weather .weather-icon  { 
    position: relative; 
    width: 34px; 
    margin-left: 5px;
} 

span { 
    border: 0; 
    font-size: 100%; 
    margin: 0; 
    padding: 0; 
    vertical-align: baseline;
} 

.loader-item { 
    display: inline-block; 
    width: 16px; 
    height: 16px; 
    margin: 0 3px; 
    background-color: #f90;
} 

.loader.animating .loader-item  { 
    animation: flipDelay 2000ms cubic-bezier(0.645, 0.045, 0.355, 1) infinite;
} 

.loader.animating .loader-item:nth-child(1)  { 
    animation-delay: 100ms;
} 

.loader.animating .loader-item:nth-child(2)  { 
    animation-delay: 200ms;
} 

.loader.animating .loader-item:nth-child(3)  { 
    animation-delay: 300ms;
} 

.exchange-ticker .currency-item  { 
    display: block; 
    padding-right: 1rem;
} 

.exchange-ticker .currency-item.baaad  { 
    color: #2dbe22; 
    background: url('data:image/svg+xml;charset=US-ASCII,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 7"><path d="M0 0h10L5 7 0 0z" fill="%232dbe22"/></svg>') no-repeat right/10px;
} 

.exchange-ticker .exchange-item  { 
    display: block; 
    padding-right: 1rem;
} 

.exchange-ticker .exchange-item.baaad  { 
    color: #f43a21; 
    background: url('data:image/svg+xml;charset=US-ASCII,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 7"><path d="M0 0h10L5 7 0 0z" fill="%23f43a21"/></svg>') no-repeat right/10px;
} 

.header-parts .weather .temperature .night  { 
    color: #82b2e4;
} 

.header-parts .weather .temperature .day  { 
    color: #f43a21;
} 

li { 
    border: 0; 
    font-size: 100%; 
    margin: 0; 
    padding: 0; 
    vertical-align: baseline;
} 

[class^="icon-"] { 
    font-family: 'iconvault'; 
    font-weight: normal; 
    font-style: normal; 
    text-decoration: inherit; 
    -webkit-font-smoothing: antialiased; 
    font-size: 2.625em;
} 

.icon-cloud:after { 
    content: "\f106"; 
    color: #ccc; 
    position: absolute;
} 


@keyframes jump { 
  0% {  
      transform: translateY(0); 
      transform: translateY(0px); 
  }  
  50% {  
      transform: translateY(-6px); 
      transform: translateY(-6px); 
  }  
  100% {  
      transform: translateY(0); 
      transform: translateY(0px); 
  }  

} 
@keyframes flipDelay { 
  0% {  
      opacity: 1; 
      transform-origin: 0 0 0; 
      opacity: 1; 
      transform-origin: 0px 0px 0px; 
  }  
  30% {  
      opacity: 0; 
      transform: rotate3d(1, 0, 0, 90deg); 
      transform-origin: 0 0 0; 
      opacity: 0; 
      transform: rotate3d(1, 0, 0, 90deg); 
      transform-origin: 0px 0px 0px; 
  }  
  60% {  
      opacity: 0; 
      transform: rotate3d(1, 0, 0, 90deg); 
      transform-origin: 0 100% 0; 
      opacity: 0; 
      transform: rotate3d(1, 0, 0, 90deg); 
      transform-origin: 0px 100% 0px; 
  }  
  90% {  
      opacity: 1; 
      transform-origin: 0 100% 0; 
      opacity: 1; 
      transform-origin: 0px 100% 0px; 
  }  

}