i2r

/**
 * The first commented line is your dabblet’s title
 */

background: #f06;
background: linear-gradient(45deg, #f06, yellow);
min-height: 100%;

color: #fff;

i2r

/**
 * The first commented line is your dabblet’s title
 */

html, body {
height: 100%;
}

i2r

/**
 * The first commented line is your dabblet’s title
 */

html, body {
height: 100%;
}

i2r

/**
 * The first commented line is your dabblet’s title
 */

html, body {
height: 100%;
}

span {
	display: inline-block;

i2r

/**
 * The first commented line is your dabblet’s title
 */

html, body {
height: 100%;
}

span {
	display: inline-block;

i2r

/**
 * The first commented line is your dabblet’s title
 */
html, body {
	height: 100%;
}
.container {
	display: flex;
	flex-direction: column-reverse;
}

i2r

/**
 * The first commented line is your dabblet’s title
 */
html, body {
	height: 100%;
}
.container {
	display: flex;
	flex-direction: column-reverse;
}

i2r

/**
 * The first commented line is your dabblet’s title
 */
html, body {
	height: 100%;
}

.box:hover,
.box:hover + .box {
    background: #FFF5D1;

i2r

/**
 * The first commented line is your dabblet’s title
 */

.box1, .box2 {
display: inline-block;
border: solid 1px rgba(0,0,0, 0.3);
height: 90px;
vertical-align: top;
}

i2r

/**
 * The first commented line is your dabblet’s title
 */

.box1, .box2 {
display: inline-block;
border: solid 1px rgba(0,0,0, 0.3);
height: 90px;
vertical-align: top;
}