Template:Banner-main/styles.css

From Gulf States Flood Help
.sol-main-banner {
	width: 100%;
	height: auto;
	margin: 0;
	margin-bottom: 1em;
	padding: 0;
	border: 1px solid #ddd;
	border-radius: 4px;
	position: relative;
}
.sol-main-banner img {
	max-width: 948px;
	height: 100%;
	opacity: 0.5;
}
.sol-main-banner-title {
	position: absolute;
	top: 30px;
	left: 30px;
}
.sol-main-banner-title img {
	opacity: 1;
}
.sol-main-banner-tagline {
	position: absolute;
	bottom: 32px;
	left: 40px;
	font-size: 1.8em;
	font-weight: 700;
	line-height: 1.2em;
	font-family: Merriweather;
	color: #333;
	text-shadow: 
	  1px 1px 4px white,
      0 0 1em #eee,
      0 0 0.2em #ddd;
}

.highlight {
	font-family: Merriweather;
	color: #F05E26;
}

.sol-main-banner-block {
	position: absolute;
	top: 2em;
	right: 1em;
}
.sol-main-banner-button {
	width: 260px;
	margin-bottom: 1em;
	padding: 0;
	font-size: 1.5em;
}

.sol-main-banner-button .mw-ui-button {
	background-color: #fafafa;
	padding: 0.5em 1em;
	width: 100%;
	border-radius: 4px;
	font-weight: 600;
}

.sol-main-banner-button .mw-ui-button:hover {
	background-color: white;
	box-shadow: 
	  0 1px 1px rgba(0, 0, 0, 0.075),
      0 2px 2px rgba(0, 0, 0, 0.075),
      0 4px 4px rgba(0, 0, 0, 0.075),
      0 8px 8px rgba(0, 0, 0, 0.075),
      0 16px 16px rgba(0, 0, 0, 0.075)
    ;
}