body {
    background-color: #CFCF00;
}

@font-face {
  font-family: dirty;
  src: url(dirty_drags.woff);
}

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

#container {
    background: rgb(236,33,13);
    background: linear-gradient(180deg, rgba(236,33,13,1) 0%, rgba(253,187,45,1) 100%);
    margin: auto;
    border-radius: 10px;
}

#tile-container {
    font-size: 16px;
    width: 95%;
    margin: auto;
    padding: 10px;
}

@media only screen and (max-width: 1000px) {
    #container {
        height: 4800px;
    }

    #tile-container {
        height: 4400px;
    }
}

@media only screen and (min-width: 1001px) {
    #container {
        height: 2600px;
    }
    
    #container {
        height: 2600px;
    }
}

#fire {
    width: 100%;
    height: 200px;
    margin: auto;
}

@media only screen and (max-width: 1000px) {
 #container {
    width: 100%;
    font-size: large;
}


#fire img {
    width: 100%;
    position: fixed;
    bottom: 0px;
}
}

@media only screen and (min-width: 1001px) {
 #container {
    width: 40%;
}
 
#fire img {
    width: 40%;
    position: fixed;
    bottom: 0px;
}
}


#header {
    font-family: dirty;
    font-size: 110px;
    text-align: center;
    padding: 10px;
}

@media only screen and (min-width: 1001px) {
.columns {
    column-width: 100%;
    width: 100%;
    margin: auto;
}
}


.tile {
    color: #004400;
    font-family: fjalla;
    width: 100%;
    margin-top: 20px;
    border-radius: 50px;
    background: rgba(200, 200, 200, 0.6);
}

.tile-text {
    padding: 20px;
}


.inner::-webkit-scrollbar {
        display: none;
      }


img {
    display: block;
}

.center {
    width: 80%;
    margin: auto;
    display: block;
    padding: 6px;
}

@media only screen and (max-width: 1000px) {
h1 {
    font-size: 48px;
}

p {
    font-size: 36px;
}
}

@media only screen and (min-width: 1001px) {
h1 {
    font-size: 27px;
}

p {
    font-size: 18px;
}
}

@media only screen and (max-width: 1000px) {
.columns {
    column-width: 100%;
    width: 100%;
    margin: auto;
}
}

h1 {
    font-family: fjalla;
    text-align: center;
}

.date {
    float: right;
}

@media only screen and (min-width: 1001px) {
.title .date {
    font-size: 12px;
}
}

@media only screen and (max-width: 1000px) {
.title .date {
    font-size: 15;
}
}

a {
    color: #256000;
}