.introto__main { display: flex; position: relative; box-sizing: border-box; box-shadow: 2px 2px 2px #CCC; flex-direction: row; flex-wrap: wrap; max-width: 1100px; max-width: 100%; overflow: hidden; border: 1px solid black; margin: auto; } .introto__main-title { font-size: 250%; background: #777; color: #FFF; text-align: center; align-items: center; justify-content: center; } .introto__lead { background: #EEE; padding: 30px 60px; margin-bottom: 30px; } .introto__base { max-width: 1060px; min-height: 55px; margin: auto; padding: 5px 20px; font-size: 1.1em; background: #EEE; border: 1px solid lightgrey; } .introto__tabs-main { height: auto; } .introto__tabs-title { font-size: 1.5em; font-weight: bold; } .introto__columns { display: flex; flex-direction: row; flex-wrap: wrap-reverse; justify-content: center; } .introto__columns-left { display: inline-block; flex: 0 1 0; position: relative; vertical-align: top; min-width: 260px; padding-bottom: 50px; } .introto__columns-left-button { position: absolute; bottom: 0; padding-left: 2em; } .introto__columns-right { display: inline-block; flex: 1 1 0; padding: 1em; min-width: 250px; vertical-align: top; border-left: 1px solid #c9c9c9; }
@media screen and (min-width: 1100px) { .introto__main { max-width: 1100px; } }
@media screen and (min-width: 800px) { .introto__tabs-main { padding: 0.5em; } .introto__columns-right{ padding: 40px; } .introto__columns-left { padding-bottom: 80px; } .introto__columns-left-button{ padding-bottom: 33px; } }