.thankyou--seciton { h1 { .text-uppercase; font-style: italic; } .col { float: left; padding-left: @grid-gutter-width / 2; padding-right: @grid-gutter-width / 2; } .col-left { width: 40%; } .col-right { width: 60%; } p { font-weight: 300; + p { margin-top: 10px; } } li { display: inline-block; vertical-align: middle; + li { margin-left: 10px; } a { display: block; font-size: 18px; font-weight: 900; color: @blue-color; text-decoration: underline; } } } @media screen and (min-width: @screen-md-min) { .thankyou--seciton { padding: 20px 0 50px; h1 { margin-bottom: 75px; } p { font-size: @font-size-large; font-weight: 300; } ul { margin-top: 30px; } } } @media screen and (min-width: @screen-sm-min) and (max-width: @screen-sm-max) { .thankyou--seciton { padding: 20px 0 50px; h1 { margin-bottom: 45px; } p { font-size: 20px; } ul { margin-top: 30px; } } } @media screen and (max-width: @screen-xs-max) { .thankyou--seciton { padding: 20px 0; .text-center; h1 { margin-bottom: 15px; } .col { float: none !important; width: 100% !important; padding: 0 @grid-gutter-width / 2; } figure { display: none; } p { font-size: 18px; } ul { margin-top: 15px; } li { + li { margin-left: 15px; } a { font-size: 16px; } } } } @media screen and (min-width: @screen-sm-min) { .thankyou--seciton { figure { margin-left: -16%; margin-top: -6%; } } }