#bottom {
height: auto;
width: 100%;
display: block;
background-color: var(--red);
padding: 2em 2em;
}

#bottom .container {
display: flex;
width: 100%;
max-width: 100%;
flex-wrap: wrap;
}

.ft-1, .ft-2, .ft-3, .ft-4 {
display: block;
color: var(--white);
font-size: 0.85em;
line-height: 140%;
}

.ft-1 {
width: 400px;
}

.ft-2, .ft-3 {
width: calc((100% - 600px) / 2);
}

.ft-4 {
width: 200px; 
}

.ft-4i, .ft-5i {
display: inline-block;
width: 75px;
}

.ft-4ih { display: inline; }

.ft-5 {
display: none;
width: 100%;
margin-top: 1.75em;
}

.ft-6 {
display: block;
color: var(--white);
font-size: 0.65em;
width: 200px;
margin-left: calc(100% - 200px);
}

.ft-1 img {
width: 100%;
max-width: 240px;
display: block;
}

#bottom h3 {
font-size: 1.1em;
font-weight: var(--medium);
display: block;
margin-bottom: 0.65em;
}

a.ft-link {
text-decoration: none;
color: var(--white);
}

a.ft-link:hover {
color: var(--white70);
}


@media only screen and (max-width: 1440px) {
.ft-1 { width: 350px; }
.ft-2, .ft-3 { width: calc((100% - 530px) / 2); }
.ft-4 { width: 180px; }
.ft-6 { width: 180px; margin-left: calc(100% - 180px); }
}


@media only screen and (max-width: 1280px) {
#bottom { padding: 2em 1em; }
}


@media only screen and (max-width: 1240px) {
.ft-1 { width: 320px; }
.ft-2 { width: calc(((100% - 500px) / 2) + 20px); }
.ft-3 { width: calc(((100% - 500px) / 2) - 20px); }
}


@media only screen and (max-width: 1120px) {
.ft-1 { width: 300px; }
.ft-2 { width: calc(((100% - 480px) / 2) + 20px); }
.ft-3 { width: calc(((100% - 480px) / 2) - 20px); }
}


@media only screen and (max-width: 1080px) {
.ft-1 { width: 250px; }
.ft-1 img { max-width: 200px; }
.ft-2 { width: calc(((100% - 430px) / 2) + 20px); }
.ft-3 { width: calc(((100% - 430px) / 2) - 20px); }
}


@media only screen and (max-width: 980px) {
.ft-2 { width: calc(((100% - 250px) / 2) + 20px); }
.ft-3 { width: calc(((100% - 250px) / 2) - 20px); }
.ft-4 { display: none; }
.ft-5 { display: block; }
.ft-6 { width: calc(((100% - 250px) / 2) - 20px); margin-left: calc((((100% - 250px) / 2) + 20px) + 250px); margin-top: 1.75em; }
}


@media only screen and (max-width: 820px) {
.ft-1 { width: 240px; }
.ft-2 { width: calc(((100% - 240px) / 2) + 30px); }
.ft-3 { width: calc(((100% - 240px) / 2) - 30px); }
.ft-6 { width: calc(((100% - 240px) / 2) - 30px); margin-left: calc((((100% - 240px) / 2) + 30px) + 240px); }
}


@media only screen and (max-width: 768px) {
.ft-6 { font-size: 0.75em; }
.ft-4i, .ft-5i { width: 70px; }
}


@media only screen and (max-width: 720px) {
.ft-1 { width: 250px; margin-bottom: 1.75em; }
.ft-2 { width: calc(100% - 250px); margin-bottom: 1.75em; }
.ft-3 { margin-left: 250px; width: calc(((100% - 250px) / 2) + 30px); }
.ft-4 { display: block; width: calc(((100% - 250px) / 2) - 30px); }
.ft-5 { display: none; }
.ft-6 { width: calc(((100% - 250px) / 2) - 30px); margin-left: calc((((100% - 250px) / 2) + 30px) + 250px); }
}


@media only screen and (max-width: 690px) {
.ft-6 { font-size: 0.65em; }
}


@media only screen and (max-width: 660px) {
.ft-1 { width: 210px; }
.ft-1 img { max-width: 180px; }
.ft-2 { width: calc(100% - 210px); }
.ft-3 { margin-left: 210px; width: calc(((100% - 210px) / 2) + 30px); }
.ft-4 { display: block; width: calc(((100% - 210px) / 2) - 30px); }
.ft-6 { width: calc(((100% - 210px) / 2) - 30px); margin-left: calc((((100% - 210px) / 2) + 30px) + 210px); font-size: 0.7em; }
}


@media only screen and (max-width: 630px) {
.ft-6 { font-size: 0.65em; }
}


@media only screen and (max-width: 600px) {
.ft-1 { width: 200px; }
.ft-1 img { max-width: 170px; }
.ft-2 { width: calc(100% - 200px); }
.ft-3 { margin-left: 200px; width: calc(((100% - 200px) / 2) + 30px); }
.ft-4 { display: block; width: calc(((100% - 200px) / 2) - 30px); }
.ft-6 { width: calc(((100% - 200px) / 2) + 30px); margin-left: calc((((100% - 200px) / 2) - 30px) + 200px); font-size: 0.75em; text-align: center; }
}


@media only screen and (max-width: 560px) {
.ft-1 { width: 220px; }
.ft-2 { width: calc(100% - 220px); }
.ft-3 { margin-left: 220px; width: calc(100% - 220px); }
.ft-4 { display: none; }
.ft-5 { display: block; }
.ft-6 { margin-left: 220px; width: calc(100% - 220px); text-align: left; }
}	


@media only screen and (max-width: 480px) {
.ft-1 { width: 190px; }
.ft-1 img { max-width: 160px; }
.ft-2 { width: calc(100% - 190px); }
.ft-3, .ft-6 { margin-left: 190px; width: calc(100% - 190px); }
.ft-6 { font-size: 0.8em; }
.ft-4i, .ft-5i { width: 62px; }
}


@media only screen and (max-width: 419px) {
.ft-1 { width: 100%; }
.ft-1 img { max-width: 200px; }
.ft-2 { width: 100%; }
.ft-3 { margin-left: 0px; width: calc(50% + 30px); }
.ft-4 { display: block; width: calc(50% - 30px); }
.ft-5 { display: none; }
.ft-6 { width: 100%; margin-left: 0; }
}


@media only screen and (max-width: 339px) {
.ft-4ih { display: none; }
.ft-4i, .ft-5i { width: 50px; }
}