Template:Intro to single/sandbox/styles.css

/* */

.introtosingle__main {

position: relative;

box-sizing: border-box;

box-shadow: 2px 2px 2px #CCC;

max-width: 100%;

overflow: hidden;

border: 1px solid black;

margin: auto;

padding-bottom: 20px;

}

.introtosingle__main-withbackground {

background-image:url("https://upload.wikimedia.org/wikipedia/commons/9/94/Wikipedia-logo-v2_%2810_percent_opacity%29.svg");

background-position: center -500px;

background-repeat: no-repeat;

background-size: auto 150%;

}

.introtosingle__main-title {

font-size: 250%;

line-height: 150%;

background: #777;

color: #FFF;

text-align: center;

align-items: center;

justify-content: center;

}

.introtosingle__lead {

background-color:rgba(221, 221, 221, 0.5);

padding: 30px 60px;

margin-bottom: 30px;

}

.introtosingle__base {

box-sizing: border-box;

max-width: 1100px;

min-height: 55px;

margin:auto;

padding:5px 20px;

font-size: 1.1em;

background: #EEE;

border: 1px solid lightgrey;

}

.introtosingle__columns {

display: flex;

flex-direction: row;

flex-wrap: wrap-reverse;

justify-content: center;

}

.introtosingle__columns-left,

.introtosingle__columns-left-noborder,

.introtosingle__columns-right {

display:inline-block;

flex:1 1 0;

align-self:flex-end;

vertical-align:top;

min-width:200px;

max-width:300px;

padding:10px;

}

.introtosingle__columns-left {

text-align:right;

justify-content:right;

border-right:solid 1px #ddd;

}

.introtosingle__columns-left-noborder {

text-align:right;

justify-content:right;

}

.introtosingle__columns-right {

text-align:left;

justify-content: left;

}

@media screen and (min-width: 1101px) {

.introtosingle__main {

max-width: 1100px;

}

}