Difference between revisions of "Template:Intro to/sandbox/styles.css"

From blackwiki
Jump to navigation Jump to search
imported>Sdkb
(Added positioning parameter to get shadow to display over base; removed unneeded parameter for base)
imported>L235
(Undid revision 955574860 by JzG (talk) rv mass rollback on pages that predate grant of TPE per JzG's talk)
 
(One intermediate revision by one other user not shown)
(No difference)

Latest revision as of 06:19, 9 May 2020

/*  */
.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;
	}
}