#sim { margin: 1% auto; /*background-image: radial-gradient(ellipse at center, white -160%, rgba(255,255,255,0) 100%);*/ /*background-image: radial-gradient(ellipse at center, #4A89DC -160%,#333350 70%);*/ color: #333350; transition: background-color .5s; height: 100%; padding-bottom: 10%; padding: 1em; max-width: 50em; } #sim p { color: inherit; } #sim > h1 { color: inherit; margin: 0; font-size: 350%; font-weight: 800; } #simSubtitle { margin-top: -.5em; font-size: 120%; font-weight: 300; margin-bottom: 2.5em; } #sim .intro { font-style: italic; font-size: 110%; } #sim .intro > div { margin: 1em 0; display: flex; align-items: center; } #sim .intro i { opacity: .9; font-size: 250%; margin-right: .6em; } #sim .intro span { display: inline-block; width: 80%; } #sim .action { margin-top: 5%; margin-bottom: 3%; } #sim .action p { text-align: center; } #sim .intro button { color: white; display: block; text-align: center; background: #4A89DC; padding: .3em 1em; font-size: 140%; margin: 2em auto; width: 8em; border: none; box-shadow: 0px 9px 14px 0px rgba(0, 0, 0, 0.1); opacity: 0.95 } #sim .intro button:hover { box-shadow: none; opacity: 1; } #conversation { margin-top: 6%; font-size: 110%; line-height: normal; min-height: 10em; } #questions-answers { min-width: 50%; transition: width 1s; } #foldedSteps .header { margin-bottom: 1em; } #foldedSteps .header h3 { display: inline; } #foldedSteps .header button { font-size: 80%; color: #2975D1; border: none; } #foldedSteps .header button i { margin-right: .3em; vertical-align: top } #fin { width: 30em; font-style: italic; }