@font-face {
    font-family: roboto ;
    src: url(../font/Roboto/Roboto-Regular.ttf);
}

:root{
    --primary-col: orangered;
    --secondary-col: rgb(255, 136, 0);
    --accent: rgb(99, 255, 212);
    --font-small: 12px;
    --font-medium: 14px;
    --font-large: 18px;
    --font-huge: 30px;
    
}

@media  screen and (max-width:700px) {
    *{font-size: var(--font-small);}
    .mobile-hide{display: none;}
    .mobile-inline{display: block;}
    .mobile-inline > div{margin-top: 40px; width: 100%;}
    .banner-inner{padding-top: 150px;}
    .banner-inner > div{background-repeat: no-repeat; background-size: contain;}
}

@media  screen and (min-width:700px) {
    .desktop-hide{display: none;}  
}

.bold-header{font-weight: bold;}

.btn-small{padding: 10px;}
.empty-button{border: none; background: none;}