#alert_message.box { position: fixed; top: 200px; left: 50%; z-index: 10; transform: translateX(-50%); padding: 1rem; background: #f5f5f5; width: 30%; text-align: center; box-shadow: 0px 4px 5px -3px #000; border: solid 1px rgb(233, 233, 233); } #alert_message.box p{ font-size:1.6rem; color: #af1b17; font-weight:bold; } div#alert_message.inline { font-weight: bold; margin: 0px; padding: 0px; display: inline-block; color:#af1b17; } .submit_button { display: block; font-size: 1.5rem; letter-spacing: inherit; padding: .6rem 2rem; border: none; background: #4172c8; color: #fff; border-radius: 2px; text-shadow: 1px 1px 0px #000; } .outline { outline: solid 2px #af1b17 !important; } .hidden{ display: none !important; } .error { outline: solid 2px #e00; } .clickable{ cursor: pointer; } .center_margin{ margin-left: auto; margin-right: auto; } .float-left, .float_left{ float:left; } .float-right, .float_right{ float:right; } .no_wrap { display: inline-block; white-space: nowrap; } .flex_container { display: flex; width: 100%; } .flex_1 { flex: 1; } .flex_2 { flex: 2; } .flex_3 { flex: 3; } .flex_4 { flex: 4; } .flex_5 { flex: 5; } .flex_6 { flex: 6; } .flex_7 { flex: 7; } .flex_8 { flex: 8; } .flex_9 { flex: 9; } .row:before, .row:after{ content:""; display:block; clear:both; } .table { display: table; width: 100%; } .table .tr { display: table-row; width: inherit; } .table .td { display: table-cell; } .drop_shadow_1{ box-shadow: 0px 3px 4px -4px #000; } .drop_shadow_2{ box-shadow: 0px 6px 6px -7px #444; } .drop_shadow_3{ box-shadow: 0px 8px 15px -12px #666; } .drop_shadow_4{ box-shadow: 0px 16px 20px -20px #999; } .drop_shadow_5{ box-shadow: 0px 15px 20px -18px #ccc; } .column_container{ } .column_container .row:after, .column_container .row:before { display: block; content: ""; clear: both; height: 0px; font-size: 0px; line-height: 0px; } .column_container .column{ float:left; margin-left:2%; } /* full width column */ .column_container .column.span_12{ width: 100%; margin-left:0px; float: none; } .column_container .column:first-of-type{ margin-left:0px; } /* 4-column approach */ .column_container .column.span_9{ width:73%; } .column_container .column.span_6{ width: 49%; } .column_container .column.span_3{ width: 23.5%; } /* 3-column approach */ .column_container .column.span_8{ width:64%; } .column_container .column.span_4{ width: 32%; } /* loading */ .loading { width: 100%; position: relative; padding: 40px; } .loading img { position: absolute; top: 50%; left: 50%; margin: -15px; display: block; width: 30px; height: 30px; -webkit-animation: rotation 0.7s infinite steps(12); animation: rotation 0.7s infinite steps(12); } .loading span { position: absolute; top: 50%; left: 50%; margin: 25px -25px; display: block; width: 50px; height: 30px; } @-webkit-keyframes rotation { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(359deg); transform: rotate(359deg); } }