diff --git a/addons/addon-base-ui/packages/base-ui/src/parts/Login.js b/addons/addon-base-ui/packages/base-ui/src/parts/Login.js
index fb0f5a6090..19d5bff451 100644
--- a/addons/addon-base-ui/packages/base-ui/src/parts/Login.js
+++ b/addons/addon-base-ui/packages/base-ui/src/parts/Login.js
@@ -178,20 +178,6 @@ class Login extends React.Component {
     const renderBrandingLogo = <Image centered src={this.props.assets.images.loginImage} />;
     return (
       <div className="login-form animated fadeIn">
-        {/*
-        Heads up! The styles below are necessary for the correct render of this example.
-        You can do same with CSS, the main idea is that all the elements up to the `Grid`
-        below must have a height of 100%.
-      */}
-        <style>
-          {`
-        body > div#root,
-        body > div#root > div,
-        body > div#root > div > div.login-form {
-          height: 100%;
-        }
-      `}
-        </style>
         <Grid textAlign="center" style={{ height: '100%' }} verticalAlign="middle">
           <Grid.Column style={{ maxWidth: 450 }}>
             <Form
diff --git a/addons/addon-base-ui/packages/base-ui/src/parts/MainLayout.js b/addons/addon-base-ui/packages/base-ui/src/parts/MainLayout.js
index 66fb6917b9..b79b594c35 100644
--- a/addons/addon-base-ui/packages/base-ui/src/parts/MainLayout.js
+++ b/addons/addon-base-ui/packages/base-ui/src/parts/MainLayout.js
@@ -97,7 +97,7 @@ class MainLayout extends React.Component {
         </Menu.Menu>
       </Menu>,
       <div
-        className="fit animated fadeIn"
+        className="mainLayout fit animated fadeIn"
         style={{
           paddingTop: '40px',
           paddingLeft: '84px',
diff --git a/main/solution/edge-lambda/config/infra/cloudformation.yml b/main/solution/edge-lambda/config/infra/cloudformation.yml
index f1f27a9d8d..e20b4a1422 100644
--- a/main/solution/edge-lambda/config/infra/cloudformation.yml
+++ b/main/solution/edge-lambda/config/infra/cloudformation.yml
@@ -3,17 +3,17 @@ Resources:
   # IAM Role for CloudFront Interceptor Lambda (Lambda@Edge)
   # =============================================================================================
   RoleCloudFrontInterceptor:
-    Type: "AWS::IAM::Role"
+    Type: 'AWS::IAM::Role'
     Properties:
       AssumeRolePolicyDocument:
-        Version: "2012-10-17"
+        Version: '2012-10-17'
         Statement:
           - Effect: Allow
             Principal:
               Service:
                 - lambda.amazonaws.com
                 - edgelambda.amazonaws.com
-            Action: "sts:AssumeRole"
+            Action: 'sts:AssumeRole'
       ManagedPolicyArns:
         - arn:aws:iam::aws:policy/AWSLambdaExecute
         - arn:aws:iam::aws:policy/AmazonS3ReadOnlyAccess
@@ -26,7 +26,7 @@ Resources:
                 - logs:CreateLogGroup
                 - logs:CreateLogStream
                 - logs:PutLogEvents
-              Resource: "arn:aws:logs:*:*:*"
+              Resource: 'arn:aws:logs:*:*:*'
 
   # =============================================================================================
   # CloudFront Interceptor Lambda (Lambda@Edge)
@@ -34,9 +34,9 @@ Resources:
 
   # Lambda@Edge that intercepts CloudFront response and adds various security headers in the response
   EdgeLambda:
-    Type: "AWS::Lambda::Function"
-    # Avoid to try to delete the Edge Lambda because it raises errors until all associations with Cloudfront are removed. 
-    # Even then, replicas are being automatically deleted only 1 hour after the removal of all associations. 
+    Type: 'AWS::Lambda::Function'
+    # Avoid to try to delete the Edge Lambda because it raises errors until all associations with Cloudfront are removed.
+    # Even then, replicas are being automatically deleted only 1 hour after the removal of all associations.
     # After that, the Edge lambda can be deleted manually at https://console.aws.amazon.com/lambda/home
     DeletionPolicy: Retain
     Properties:
@@ -73,7 +73,7 @@ Resources:
             headers["content-security-policy"] = [
               {
                 key: "Content-Security-Policy",
-                value: `default-src 'none'; connect-src ${connectSrc}; img-src 'self' data:; script-src 'self'; style-src 'self' 'unsafe-inline'; font-src 'self' data:`
+                value: `default-src 'none'; connect-src ${connectSrc}; img-src 'self' data:; script-src 'self'; style-src 'strict-dynamic' 'self'; font-src 'self' data:`
               }
             ];
 
diff --git a/main/solution/ui/src/css/basscss-important.css b/main/solution/ui/src/css/basscss-important.css
index 518a3b6960..7698acfa49 100644
--- a/main/solution/ui/src/css/basscss-important.css
+++ b/main/solution/ui/src/css/basscss-important.css
@@ -7,547 +7,982 @@
    semantic ui styles.
 */
 
-.h1{ font-size: 2rem!important }
-.h2{ font-size: 1.5rem!important }
-.h3{ font-size: 1.25rem!important }
-.h4{ font-size: 1rem!important }
-.h5{ font-size: .875rem!important }
-.h6{ font-size: .75rem!important }
+body {
+  height: 100%;
+}
+div#root {
+  height: 100%;
+}
+div.mainLayout {
+  height: 100%;
+}
+div.login-form {
+  height: 100%;
+}
+.h1 {
+  font-size: 2rem !important;
+}
+.h2 {
+  font-size: 1.5rem !important;
+}
+.h3 {
+  font-size: 1.25rem !important;
+}
+.h4 {
+  font-size: 1rem !important;
+}
+.h5 {
+  font-size: 0.875rem !important;
+}
+.h6 {
+  font-size: 0.75rem !important;
+}
 
-.font-family-inherit{ font-family:inherit!important }
-.font-size-inherit{ font-size:inherit!important }
-.text-decoration-none{ text-decoration:none!important }
+.font-family-inherit {
+  font-family: inherit !important;
+}
+.font-size-inherit {
+  font-size: inherit !important;
+}
+.text-decoration-none {
+  text-decoration: none !important;
+}
 
-.bold{ font-weight: bold!important; font-weight: bold!important }
-.regular{ font-weight:normal!important }
-.italic{ font-style:italic!important }
-.caps{ text-transform:uppercase!important; letter-spacing: .2em!important; }
+.bold {
+  font-weight: bold !important;
+  font-weight: bold !important;
+}
+.regular {
+  font-weight: normal !important;
+}
+.italic {
+  font-style: italic !important;
+}
+.caps {
+  text-transform: uppercase !important;
+  letter-spacing: 0.2em !important;
+}
 
-.left-align{ text-align:left!important }
-.center{ text-align:center!important }
-.right-align{ text-align:right!important }
-.justify{ text-align:justify!important }
+.left-align {
+  text-align: left !important;
+}
+.center {
+  text-align: center !important;
+}
+.right-align {
+  text-align: right !important;
+}
+.justify {
+  text-align: justify !important;
+}
 
-.nowrap{ white-space:nowrap!important }
-.break-word{ word-wrap:break-word!important }
+.nowrap {
+  white-space: nowrap !important;
+}
+.break-word {
+  word-wrap: break-word !important;
+}
 
-.line-height-1{ line-height: 1!important }
-.line-height-2{ line-height: 1.125!important }
-.line-height-3{ line-height: 1.25!important }
-.line-height-4{ line-height: 1.5!important }
+.line-height-1 {
+  line-height: 1 !important;
+}
+.line-height-2 {
+  line-height: 1.125 !important;
+}
+.line-height-3 {
+  line-height: 1.25 !important;
+}
+.line-height-4 {
+  line-height: 1.5 !important;
+}
 
-.list-style-none{ list-style:none!important }
-.underline{ text-decoration:underline!important }
+.list-style-none {
+  list-style: none !important;
+}
+.underline {
+  text-decoration: underline !important;
+}
 
-.truncate{
-  max-width:100%!important;
-  overflow:hidden!important;
-  text-overflow:ellipsis!important;
-  white-space:nowrap!important;
+.truncate {
+  max-width: 100% !important;
+  overflow: hidden !important;
+  text-overflow: ellipsis !important;
+  white-space: nowrap !important;
 }
 
-.list-reset{
-  list-style:none!important;
-  padding-left:0!important;
+.list-reset {
+  list-style: none !important;
+  padding-left: 0 !important;
 }
 
-.inline{ display:inline!important }
-.block{ display:block!important }
-.inline-block{ display:inline-block!important }
-.table{ display:table!important }
-.table-cell{ display:table-cell!important }
+.inline {
+  display: inline !important;
+}
+.block {
+  display: block !important;
+}
+.inline-block {
+  display: inline-block !important;
+}
+.table {
+  display: table !important;
+}
+.table-cell {
+  display: table-cell !important;
+}
 
-.overflow-hidden{ overflow:hidden!important }
-.overflow-scroll{ overflow:scroll!important }
-.overflow-auto{ overflow:auto!important }
+.overflow-hidden {
+  overflow: hidden !important;
+}
+.overflow-scroll {
+  overflow: scroll !important;
+}
+.overflow-auto {
+  overflow: auto !important;
+}
 
 .clearfix:before,
-.clearfix:after{
-  content:" "!important;
-  display:table!important
+.clearfix:after {
+  content: ' ' !important;
+  display: table !important;
+}
+.clearfix:after {
+  clear: both !important;
 }
-.clearfix:after{ clear:both!important }
 
 /* .left{ float:left!important }
 .right{ float:right!important } */
 
-.fit{ max-width:100%!important }
-
-.max-width-1{ max-width: 24rem!important }
-.max-width-2{ max-width: 32rem!important }
-.max-width-3{ max-width: 48rem!important }
-.max-width-4{ max-width: 64rem!important }
-
-.border-box{ box-sizing:border-box!important }
-
-.align-baseline{ vertical-align:baseline!important }
-.align-top{ vertical-align:top!important }
-.align-middle{ vertical-align:middle!important }
-.align-bottom{ vertical-align:bottom!important }
-
-.m0{ margin:0!important }
-.mt0{ margin-top:0!important }
-.mr0{ margin-right:0!important }
-.mb0{ margin-bottom:0!important }
-.ml0{ margin-left:0!important }
-.mx0{ margin-left:0!important; margin-right:0!important }
-.my0{ margin-top:0!important; margin-bottom:0!important }
-
-.m1{ margin: .5rem!important }
-.mt1{ margin-top: .5rem!important }
-.mr1{ margin-right: .5rem!important }
-.mb1{ margin-bottom: .5rem!important }
-.ml1{ margin-left: .5rem!important }
-.mx1{ margin-left: .5rem!important; margin-right: .5rem!important }
-.my1{ margin-top: .5rem!important; margin-bottom: .5rem!important }
-
-.m2{ margin: 1rem!important }
-.mt2{ margin-top: 1rem!important }
-.mr2{ margin-right: 1rem!important }
-.mb2{ margin-bottom: 1rem!important }
-.ml2{ margin-left: 1rem!important }
-.mx2{ margin-left: 1rem!important; margin-right: 1rem!important }
-.my2{ margin-top: 1rem!important; margin-bottom: 1rem!important }
-
-.m3{ margin: 2rem!important }
-.mt3{ margin-top: 2rem!important }
-.mr3{ margin-right: 2rem!important }
-.mb3{ margin-bottom: 2rem!important }
-.ml3{ margin-left: 2rem!important }
-.mx3{ margin-left: 2rem!important; margin-right: 2rem!important }
-.my3{ margin-top: 2rem!important; margin-bottom: 2rem!important }
-
-.m4{ margin: 4rem!important }
-.mt4{ margin-top: 4rem!important }
-.mr4{ margin-right: 4rem!important }
-.mb4{ margin-bottom: 4rem!important }
-.ml4{ margin-left: 4rem!important }
-.mx4{ margin-left: 4rem!important; margin-right: 4rem!important }
-.my4{ margin-top: 4rem!important; margin-bottom: 4rem!important }
+.fit {
+  max-width: 100% !important;
+}
+
+.max-width-1 {
+  max-width: 24rem !important;
+}
+.max-width-2 {
+  max-width: 32rem !important;
+}
+.max-width-3 {
+  max-width: 48rem !important;
+}
+.max-width-4 {
+  max-width: 64rem !important;
+}
+
+.border-box {
+  box-sizing: border-box !important;
+}
+
+.align-baseline {
+  vertical-align: baseline !important;
+}
+.align-top {
+  vertical-align: top !important;
+}
+.align-middle {
+  vertical-align: middle !important;
+}
+.align-bottom {
+  vertical-align: bottom !important;
+}
+
+.m0 {
+  margin: 0 !important;
+}
+.mt0 {
+  margin-top: 0 !important;
+}
+.mr0 {
+  margin-right: 0 !important;
+}
+.mb0 {
+  margin-bottom: 0 !important;
+}
+.ml0 {
+  margin-left: 0 !important;
+}
+.mx0 {
+  margin-left: 0 !important;
+  margin-right: 0 !important;
+}
+.my0 {
+  margin-top: 0 !important;
+  margin-bottom: 0 !important;
+}
+
+.m1 {
+  margin: 0.5rem !important;
+}
+.mt1 {
+  margin-top: 0.5rem !important;
+}
+.mr1 {
+  margin-right: 0.5rem !important;
+}
+.mb1 {
+  margin-bottom: 0.5rem !important;
+}
+.ml1 {
+  margin-left: 0.5rem !important;
+}
+.mx1 {
+  margin-left: 0.5rem !important;
+  margin-right: 0.5rem !important;
+}
+.my1 {
+  margin-top: 0.5rem !important;
+  margin-bottom: 0.5rem !important;
+}
+
+.m2 {
+  margin: 1rem !important;
+}
+.mt2 {
+  margin-top: 1rem !important;
+}
+.mr2 {
+  margin-right: 1rem !important;
+}
+.mb2 {
+  margin-bottom: 1rem !important;
+}
+.ml2 {
+  margin-left: 1rem !important;
+}
+.mx2 {
+  margin-left: 1rem !important;
+  margin-right: 1rem !important;
+}
+.my2 {
+  margin-top: 1rem !important;
+  margin-bottom: 1rem !important;
+}
+
+.m3 {
+  margin: 2rem !important;
+}
+.mt3 {
+  margin-top: 2rem !important;
+}
+.mr3 {
+  margin-right: 2rem !important;
+}
+.mb3 {
+  margin-bottom: 2rem !important;
+}
+.ml3 {
+  margin-left: 2rem !important;
+}
+.mx3 {
+  margin-left: 2rem !important;
+  margin-right: 2rem !important;
+}
+.my3 {
+  margin-top: 2rem !important;
+  margin-bottom: 2rem !important;
+}
 
-.mxn1{ margin-left: -.5rem!important; margin-right: -.5rem!important; }
-.mxn2{ margin-left: -1rem!important; margin-right: -1rem!important; }
-.mxn3{ margin-left: -2rem!important; margin-right: -2rem!important; }
-.mxn4{ margin-left: -4rem!important; margin-right: -4rem!important; }
+.m4 {
+  margin: 4rem !important;
+}
+.mt4 {
+  margin-top: 4rem !important;
+}
+.mr4 {
+  margin-right: 4rem !important;
+}
+.mb4 {
+  margin-bottom: 4rem !important;
+}
+.ml4 {
+  margin-left: 4rem !important;
+}
+.mx4 {
+  margin-left: 4rem !important;
+  margin-right: 4rem !important;
+}
+.my4 {
+  margin-top: 4rem !important;
+  margin-bottom: 4rem !important;
+}
 
-.m-auto{ margin:auto!important; }
-.mt-auto{ margin-top:auto!important }
-.mr-auto{ margin-right:auto!important }
-.mb-auto{ margin-bottom:auto!important }
-.ml-auto{ margin-left:auto!important }
-.mx-auto{ margin-left:auto!important; margin-right:auto!important; }
-.my-auto{ margin-top:auto!important; margin-bottom:auto!important; }
+.mxn1 {
+  margin-left: -0.5rem !important;
+  margin-right: -0.5rem !important;
+}
+.mxn2 {
+  margin-left: -1rem !important;
+  margin-right: -1rem !important;
+}
+.mxn3 {
+  margin-left: -2rem !important;
+  margin-right: -2rem !important;
+}
+.mxn4 {
+  margin-left: -4rem !important;
+  margin-right: -4rem !important;
+}
 
-.p0{ padding:0!important }
-.pt0{ padding-top:0!important }
-.pr0{ padding-right:0!important }
-.pb0{ padding-bottom:0!important }
-.pl0{ padding-left:0!important }
-.px0{ padding-left:0!important; padding-right:0!important }
-.py0{ padding-top:0!important;  padding-bottom:0!important }
+.m-auto {
+  margin: auto !important;
+}
+.mt-auto {
+  margin-top: auto !important;
+}
+.mr-auto {
+  margin-right: auto !important;
+}
+.mb-auto {
+  margin-bottom: auto !important;
+}
+.ml-auto {
+  margin-left: auto !important;
+}
+.mx-auto {
+  margin-left: auto !important;
+  margin-right: auto !important;
+}
+.my-auto {
+  margin-top: auto !important;
+  margin-bottom: auto !important;
+}
 
-.p1{ padding: .5rem!important }
-.pt1{ padding-top: .5rem!important }
-.pr1{ padding-right: .5rem!important }
-.pb1{ padding-bottom: .5rem!important }
-.pl1{ padding-left: .5rem!important }
-.py1{ padding-top: .5rem!important; padding-bottom: .5rem!important }
-.px1{ padding-left: .5rem!important; padding-right: .5rem!important }
+.p0 {
+  padding: 0 !important;
+}
+.pt0 {
+  padding-top: 0 !important;
+}
+.pr0 {
+  padding-right: 0 !important;
+}
+.pb0 {
+  padding-bottom: 0 !important;
+}
+.pl0 {
+  padding-left: 0 !important;
+}
+.px0 {
+  padding-left: 0 !important;
+  padding-right: 0 !important;
+}
+.py0 {
+  padding-top: 0 !important;
+  padding-bottom: 0 !important;
+}
 
-.p2{ padding: 1rem!important }
-.pt2{ padding-top: 1rem!important }
-.pr2{ padding-right: 1rem!important }
-.pb2{ padding-bottom: 1rem!important }
-.pl2{ padding-left: 1rem!important }
-.py2{ padding-top: 1rem!important; padding-bottom: 1rem!important }
-.px2{ padding-left: 1rem!important; padding-right: 1rem!important }
+.p1 {
+  padding: 0.5rem !important;
+}
+.pt1 {
+  padding-top: 0.5rem !important;
+}
+.pr1 {
+  padding-right: 0.5rem !important;
+}
+.pb1 {
+  padding-bottom: 0.5rem !important;
+}
+.pl1 {
+  padding-left: 0.5rem !important;
+}
+.py1 {
+  padding-top: 0.5rem !important;
+  padding-bottom: 0.5rem !important;
+}
+.px1 {
+  padding-left: 0.5rem !important;
+  padding-right: 0.5rem !important;
+}
 
-.p3{ padding: 2rem!important }
-.pt3{ padding-top: 2rem!important }
-.pr3{ padding-right: 2rem!important }
-.pb3{ padding-bottom: 2rem!important }
-.pl3{ padding-left: 2rem!important }
-.py3{ padding-top: 2rem!important; padding-bottom: 2rem!important }
-.px3{ padding-left: 2rem!important; padding-right: 2rem!important }
+.p2 {
+  padding: 1rem !important;
+}
+.pt2 {
+  padding-top: 1rem !important;
+}
+.pr2 {
+  padding-right: 1rem !important;
+}
+.pb2 {
+  padding-bottom: 1rem !important;
+}
+.pl2 {
+  padding-left: 1rem !important;
+}
+.py2 {
+  padding-top: 1rem !important;
+  padding-bottom: 1rem !important;
+}
+.px2 {
+  padding-left: 1rem !important;
+  padding-right: 1rem !important;
+}
 
-.p4{ padding: 4rem!important }
-.pt4{ padding-top: 4rem!important }
-.pr4{ padding-right: 4rem!important }
-.pb4{ padding-bottom: 4rem!important }
-.pl4{ padding-left: 4rem!important }
-.py4{ padding-top: 4rem!important; padding-bottom: 4rem!important }
-.px4{ padding-left: 4rem!important; padding-right: 4rem!important }
+.p3 {
+  padding: 2rem !important;
+}
+.pt3 {
+  padding-top: 2rem !important;
+}
+.pr3 {
+  padding-right: 2rem !important;
+}
+.pb3 {
+  padding-bottom: 2rem !important;
+}
+.pl3 {
+  padding-left: 2rem !important;
+}
+.py3 {
+  padding-top: 2rem !important;
+  padding-bottom: 2rem !important;
+}
+.px3 {
+  padding-left: 2rem !important;
+  padding-right: 2rem !important;
+}
 
-.col{
-  float:left!important;
-  box-sizing:border-box!important;
+.p4 {
+  padding: 4rem !important;
+}
+.pt4 {
+  padding-top: 4rem !important;
+}
+.pr4 {
+  padding-right: 4rem !important;
+}
+.pb4 {
+  padding-bottom: 4rem !important;
+}
+.pl4 {
+  padding-left: 4rem !important;
+}
+.py4 {
+  padding-top: 4rem !important;
+  padding-bottom: 4rem !important;
+}
+.px4 {
+  padding-left: 4rem !important;
+  padding-right: 4rem !important;
 }
 
-.col-right{
-  float:right!important;
-  box-sizing:border-box!important;
+.col {
+  float: left !important;
+  box-sizing: border-box !important;
 }
 
-.col-1{
-  width:8.33333%!important;
+.col-right {
+  float: right !important;
+  box-sizing: border-box !important;
 }
 
-.col-2{
-  width:16.66667%!important;
+.col-1 {
+  width: 8.33333% !important;
 }
 
-.col-3{
-  width:25%!important;
+.col-2 {
+  width: 16.66667% !important;
 }
 
-.col-4{
-  width:33.33333%!important;
+.col-3 {
+  width: 25% !important;
 }
 
-.col-5{
-  width:41.66667%!important;
+.col-4 {
+  width: 33.33333% !important;
 }
 
-.col-6{
-  width:50%!important;
+.col-5 {
+  width: 41.66667% !important;
 }
 
-.col-7{
-  width:58.33333%!important;
+.col-6 {
+  width: 50% !important;
 }
 
-.col-8{
-  width:66.66667%!important;
+.col-7 {
+  width: 58.33333% !important;
 }
 
-.col-9{
-  width:75%!important;
+.col-8 {
+  width: 66.66667% !important;
 }
 
-.col-10{
-  width:83.33333%!important;
+.col-9 {
+  width: 75% !important;
 }
 
-.col-11{
-  width:91.66667%!important;
+.col-10 {
+  width: 83.33333% !important;
 }
 
-.col-12{
-  width:100%!important;
+.col-11 {
+  width: 91.66667% !important;
 }
-@media (min-width: 40em){
 
-  .sm-col{
-    float:left!important;
-    box-sizing:border-box!important;
+.col-12 {
+  width: 100% !important;
+}
+@media (min-width: 40em) {
+  .sm-col {
+    float: left !important;
+    box-sizing: border-box !important;
   }
 
-  .sm-col-right{
-    float:right!important;
-    box-sizing:border-box!important;
+  .sm-col-right {
+    float: right !important;
+    box-sizing: border-box !important;
   }
 
-  .sm-col-1{
-    width:8.33333%!important;
+  .sm-col-1 {
+    width: 8.33333% !important;
   }
 
-  .sm-col-2{
-    width:16.66667%!important;
+  .sm-col-2 {
+    width: 16.66667% !important;
   }
 
-  .sm-col-3{
-    width:25%!important;
+  .sm-col-3 {
+    width: 25% !important;
   }
 
-  .sm-col-4{
-    width:33.33333%!important;
+  .sm-col-4 {
+    width: 33.33333% !important;
   }
 
-  .sm-col-5{
-    width:41.66667%!important;
+  .sm-col-5 {
+    width: 41.66667% !important;
   }
 
-  .sm-col-6{
-    width:50%!important;
+  .sm-col-6 {
+    width: 50% !important;
   }
 
-  .sm-col-7{
-    width:58.33333%!important;
+  .sm-col-7 {
+    width: 58.33333% !important;
   }
 
-  .sm-col-8{
-    width:66.66667%!important;
+  .sm-col-8 {
+    width: 66.66667% !important;
   }
 
-  .sm-col-9{
-    width:75%!important;
+  .sm-col-9 {
+    width: 75% !important;
   }
 
-  .sm-col-10{
-    width:83.33333%!important;
+  .sm-col-10 {
+    width: 83.33333% !important;
   }
 
-  .sm-col-11{
-    width:91.66667%!important;
+  .sm-col-11 {
+    width: 91.66667% !important;
   }
 
-  .sm-col-12{
-    width:100%!important;
+  .sm-col-12 {
+    width: 100% !important;
   }
-
 }
-@media (min-width: 52em){
-
-  .md-col{
-    float:left!important;
-    box-sizing:border-box!important;
+@media (min-width: 52em) {
+  .md-col {
+    float: left !important;
+    box-sizing: border-box !important;
   }
 
-  .md-col-right{
-    float:right!important;
-    box-sizing:border-box!important;
+  .md-col-right {
+    float: right !important;
+    box-sizing: border-box !important;
   }
 
-  .md-col-1{
-    width:8.33333%!important;
+  .md-col-1 {
+    width: 8.33333% !important;
   }
 
-  .md-col-2{
-    width:16.66667%!important;
+  .md-col-2 {
+    width: 16.66667% !important;
   }
 
-  .md-col-3{
-    width:25%!important;
+  .md-col-3 {
+    width: 25% !important;
   }
 
-  .md-col-4{
-    width:33.33333%!important;
+  .md-col-4 {
+    width: 33.33333% !important;
   }
 
-  .md-col-5{
-    width:41.66667%!important;
+  .md-col-5 {
+    width: 41.66667% !important;
   }
 
-  .md-col-6{
-    width:50%!important;
+  .md-col-6 {
+    width: 50% !important;
   }
 
-  .md-col-7{
-    width:58.33333%!important;
+  .md-col-7 {
+    width: 58.33333% !important;
   }
 
-  .md-col-8{
-    width:66.66667%!important;
+  .md-col-8 {
+    width: 66.66667% !important;
   }
 
-  .md-col-9{
-    width:75%!important;
+  .md-col-9 {
+    width: 75% !important;
   }
 
-  .md-col-10{
-    width:83.33333%!important;
+  .md-col-10 {
+    width: 83.33333% !important;
   }
 
-  .md-col-11{
-    width:91.66667%!important;
+  .md-col-11 {
+    width: 91.66667% !important;
   }
 
-  .md-col-12{
-    width:100%!important;
+  .md-col-12 {
+    width: 100% !important;
   }
-
 }
-@media (min-width: 64em){
-
-  .lg-col{
-    float:left!important;
-    box-sizing:border-box!important;
+@media (min-width: 64em) {
+  .lg-col {
+    float: left !important;
+    box-sizing: border-box !important;
   }
 
-  .lg-col-right{
-    float:right!important;
-    box-sizing:border-box!important;
+  .lg-col-right {
+    float: right !important;
+    box-sizing: border-box !important;
   }
 
-  .lg-col-1{
-    width:8.33333%!important;
+  .lg-col-1 {
+    width: 8.33333% !important;
   }
 
-  .lg-col-2{
-    width:16.66667%!important;
+  .lg-col-2 {
+    width: 16.66667% !important;
   }
 
-  .lg-col-3{
-    width:25%!important;
+  .lg-col-3 {
+    width: 25% !important;
   }
 
-  .lg-col-4{
-    width:33.33333%!important;
+  .lg-col-4 {
+    width: 33.33333% !important;
   }
 
-  .lg-col-5{
-    width:41.66667%!important;
+  .lg-col-5 {
+    width: 41.66667% !important;
   }
 
-  .lg-col-6{
-    width:50%!important;
+  .lg-col-6 {
+    width: 50% !important;
   }
 
-  .lg-col-7{
-    width:58.33333%!important;
+  .lg-col-7 {
+    width: 58.33333% !important;
   }
 
-  .lg-col-8{
-    width:66.66667%!important;
+  .lg-col-8 {
+    width: 66.66667% !important;
   }
 
-  .lg-col-9{
-    width:75%!important;
+  .lg-col-9 {
+    width: 75% !important;
   }
 
-  .lg-col-10{
-    width:83.33333%!important;
+  .lg-col-10 {
+    width: 83.33333% !important;
   }
 
-  .lg-col-11{
-    width:91.66667%!important;
+  .lg-col-11 {
+    width: 91.66667% !important;
   }
 
-  .lg-col-12{
-    width:100%!important;
+  .lg-col-12 {
+    width: 100% !important;
   }
-
 }
-.flex{ display:-ms-flexbox!important; display:flex!important }
-
-@media (min-width: 40em){
-  .sm-flex{ display:-ms-flexbox!important; display:flex!important }
+.flex {
+  display: -ms-flexbox !important;
+  display: flex !important;
 }
 
-@media (min-width: 52em){
-  .md-flex{ display:-ms-flexbox!important; display:flex!important }
+@media (min-width: 40em) {
+  .sm-flex {
+    display: -ms-flexbox !important;
+    display: flex !important;
+  }
 }
 
-@media (min-width: 64em){
-  .lg-flex{ display:-ms-flexbox!important; display:flex!important }
+@media (min-width: 52em) {
+  .md-flex {
+    display: -ms-flexbox !important;
+    display: flex !important;
+  }
 }
 
-.flex-column{ -ms-flex-direction:column!important; flex-direction:column!important }
-.flex-wrap{ -ms-flex-wrap:wrap!important; flex-wrap:wrap!important }
+@media (min-width: 64em) {
+  .lg-flex {
+    display: -ms-flexbox !important;
+    display: flex !important;
+  }
+}
 
-.items-start{ -ms-flex-align:start!important; align-items:flex-start!important }
-.items-end{ -ms-flex-align:end!important; align-items:flex-end!important }
-.items-center{ -ms-flex-align:center!important; align-items:center!important }
-.items-baseline{ -ms-flex-align:baseline!important; align-items:baseline!important }
-.items-stretch{ -ms-flex-align:stretch!important; align-items:stretch!important }
+.flex-column {
+  -ms-flex-direction: column !important;
+  flex-direction: column !important;
+}
+.flex-wrap {
+  -ms-flex-wrap: wrap !important;
+  flex-wrap: wrap !important;
+}
 
-.self-start{ -ms-flex-item-align:start!important; align-self:flex-start!important }
-.self-end{ -ms-flex-item-align:end!important; align-self:flex-end!important }
-.self-center{ -ms-flex-item-align:center!important; -ms-grid-row-align:center!important; align-self:center!important }
-.self-baseline{ -ms-flex-item-align:baseline!important; align-self:baseline!important }
-.self-stretch{ -ms-flex-item-align:stretch!important; -ms-grid-row-align:stretch!important; align-self:stretch!important }
+.items-start {
+  -ms-flex-align: start !important;
+  align-items: flex-start !important;
+}
+.items-end {
+  -ms-flex-align: end !important;
+  align-items: flex-end !important;
+}
+.items-center {
+  -ms-flex-align: center !important;
+  align-items: center !important;
+}
+.items-baseline {
+  -ms-flex-align: baseline !important;
+  align-items: baseline !important;
+}
+.items-stretch {
+  -ms-flex-align: stretch !important;
+  align-items: stretch !important;
+}
 
-.justify-start{ -ms-flex-pack:start!important; justify-content:flex-start!important }
-.justify-end{ -ms-flex-pack:end!important; justify-content:flex-end!important }
-.justify-center{ -ms-flex-pack:center!important; justify-content:center!important }
-.justify-between{ -ms-flex-pack:justify!important; justify-content:space-between!important }
-.justify-around{ -ms-flex-pack:distribute!important; justify-content:space-around!important }
-.justify-evenly{ -ms-flex-pack:space-evenly!important; justify-content:space-evenly!important }
+.self-start {
+  -ms-flex-item-align: start !important;
+  align-self: flex-start !important;
+}
+.self-end {
+  -ms-flex-item-align: end !important;
+  align-self: flex-end !important;
+}
+.self-center {
+  -ms-flex-item-align: center !important;
+  -ms-grid-row-align: center !important;
+  align-self: center !important;
+}
+.self-baseline {
+  -ms-flex-item-align: baseline !important;
+  align-self: baseline !important;
+}
+.self-stretch {
+  -ms-flex-item-align: stretch !important;
+  -ms-grid-row-align: stretch !important;
+  align-self: stretch !important;
+}
 
-.content-start{ -ms-flex-line-pack:start!important; align-content:flex-start!important }
-.content-end{ -ms-flex-line-pack:end!important; align-content:flex-end!important }
-.content-center{ -ms-flex-line-pack:center!important; align-content:center!important }
-.content-between{ -ms-flex-line-pack:justify!important; align-content:space-between!important }
-.content-around{ -ms-flex-line-pack:distribute!important; align-content:space-around!important }
-.content-stretch{ -ms-flex-line-pack:stretch!important; align-content:stretch!important }
-.flex-auto{
-  -ms-flex:1 1 auto!important;
-      flex:1 1 auto!important;
-  min-width:0!important;
-  min-height:0!important;
+.justify-start {
+  -ms-flex-pack: start !important;
+  justify-content: flex-start !important;
+}
+.justify-end {
+  -ms-flex-pack: end !important;
+  justify-content: flex-end !important;
+}
+.justify-center {
+  -ms-flex-pack: center !important;
+  justify-content: center !important;
+}
+.justify-between {
+  -ms-flex-pack: justify !important;
+  justify-content: space-between !important;
+}
+.justify-around {
+  -ms-flex-pack: distribute !important;
+  justify-content: space-around !important;
+}
+.justify-evenly {
+  -ms-flex-pack: space-evenly !important;
+  justify-content: space-evenly !important;
 }
-.flex-none{ -ms-flex:none!important; flex:none!important }
 
-.order-0{ -ms-flex-order:0!important; order:0!important }
-.order-1{ -ms-flex-order:1!important; order:1!important }
-.order-2{ -ms-flex-order:2!important; order:2!important }
-.order-3{ -ms-flex-order:3!important; order:3!important }
-.order-last{ -ms-flex-order:99999!important; order:99999!important }
+.content-start {
+  -ms-flex-line-pack: start !important;
+  align-content: flex-start !important;
+}
+.content-end {
+  -ms-flex-line-pack: end !important;
+  align-content: flex-end !important;
+}
+.content-center {
+  -ms-flex-line-pack: center !important;
+  align-content: center !important;
+}
+.content-between {
+  -ms-flex-line-pack: justify !important;
+  align-content: space-between !important;
+}
+.content-around {
+  -ms-flex-line-pack: distribute !important;
+  align-content: space-around !important;
+}
+.content-stretch {
+  -ms-flex-line-pack: stretch !important;
+  align-content: stretch !important;
+}
+.flex-auto {
+  -ms-flex: 1 1 auto !important;
+  flex: 1 1 auto !important;
+  min-width: 0 !important;
+  min-height: 0 !important;
+}
+.flex-none {
+  -ms-flex: none !important;
+  flex: none !important;
+}
 
-.relative{ position:relative!important }
-.absolute{ position:absolute!important }
-.fixed{ position:fixed!important }
+.order-0 {
+  -ms-flex-order: 0 !important;
+  order: 0 !important;
+}
+.order-1 {
+  -ms-flex-order: 1 !important;
+  order: 1 !important;
+}
+.order-2 {
+  -ms-flex-order: 2 !important;
+  order: 2 !important;
+}
+.order-3 {
+  -ms-flex-order: 3 !important;
+  order: 3 !important;
+}
+.order-last {
+  -ms-flex-order: 99999 !important;
+  order: 99999 !important;
+}
 
-.top-0{ top:0!important }
-.right-0{ right:0!important }
-.bottom-0{ bottom:0!important }
-.left-0{ left:0!important }
+.relative {
+  position: relative !important;
+}
+.absolute {
+  position: absolute !important;
+}
+.fixed {
+  position: fixed !important;
+}
 
-.z1{ z-index: 1!important }
-.z2{ z-index: 2!important }
-.z3{ z-index: 3!important }
-.z4{ z-index: 4!important }
+.top-0 {
+  top: 0 !important;
+}
+.right-0 {
+  right: 0 !important;
+}
+.bottom-0 {
+  bottom: 0 !important;
+}
+.left-0 {
+  left: 0 !important;
+}
 
-.border{
-  border-style:solid!important;
-  border-width: 1px!important;
+.z1 {
+  z-index: 1 !important;
+}
+.z2 {
+  z-index: 2 !important;
+}
+.z3 {
+  z-index: 3 !important;
+}
+.z4 {
+  z-index: 4 !important;
 }
 
-.border-top{
-  border-top-style:solid!important;
-  border-top-width: 1px!important;
+.border {
+  border-style: solid !important;
+  border-width: 1px !important;
 }
 
-.border-right{
-  border-right-style:solid!important;
-  border-right-width: 1px!important;
+.border-top {
+  border-top-style: solid !important;
+  border-top-width: 1px !important;
 }
 
-.border-bottom{
-  border-bottom-style:solid!important;
-  border-bottom-width: 1px!important;
+.border-right {
+  border-right-style: solid !important;
+  border-right-width: 1px !important;
 }
 
-.border-left{
-  border-left-style:solid!important;
-  border-left-width: 1px!important;
+.border-bottom {
+  border-bottom-style: solid !important;
+  border-bottom-width: 1px !important;
 }
 
-.border-none{ border:0!important }
+.border-left {
+  border-left-style: solid !important;
+  border-left-width: 1px !important;
+}
 
-.rounded{ border-radius: 3px!important }
-.circle{ border-radius:50%!important }
+.border-none {
+  border: 0 !important;
+}
 
-.rounded-top{ border-radius: 3px 3px 0 0!important }
-.rounded-right{ border-radius: 0 3px 3px 0!important }
-.rounded-bottom{ border-radius: 0 0 3px 3px!important }
-.rounded-left{ border-radius: 3px 0 0 3px!important }
+.rounded {
+  border-radius: 3px !important;
+}
+.circle {
+  border-radius: 50% !important;
+}
 
-.not-rounded{ border-radius:0!important }
+.rounded-top {
+  border-radius: 3px 3px 0 0 !important;
+}
+.rounded-right {
+  border-radius: 0 3px 3px 0 !important;
+}
+.rounded-bottom {
+  border-radius: 0 0 3px 3px !important;
+}
+.rounded-left {
+  border-radius: 3px 0 0 3px !important;
+}
 
-.hide{
-  position:absolute !important;
-  height:1px!important;
-  width:1px!important;
-  overflow:hidden!important;
-  clip:rect(1px, 1px, 1px, 1px)!important;
+.not-rounded {
+  border-radius: 0 !important;
 }
 
-@media (max-width: 40em){
-  .xs-hide{ display:none !important }
+.hide {
+  position: absolute !important;
+  height: 1px !important;
+  width: 1px !important;
+  overflow: hidden !important;
+  clip: rect(1px, 1px, 1px, 1px) !important;
 }
 
-@media (min-width: 40em) and (max-width: 52em){
-  .sm-hide{ display:none !important }
+@media (max-width: 40em) {
+  .xs-hide {
+    display: none !important;
+  }
 }
 
-@media (min-width: 52em) and (max-width: 64em){
-  .md-hide{ display:none !important }
+@media (min-width: 40em) and (max-width: 52em) {
+  .sm-hide {
+    display: none !important;
+  }
 }
 
-@media (min-width: 64em){
-  .lg-hide{ display:none !important }
+@media (min-width: 52em) and (max-width: 64em) {
+  .md-hide {
+    display: none !important;
+  }
 }
 
-.display-none{ display:none !important }
+@media (min-width: 64em) {
+  .lg-hide {
+    display: none !important;
+  }
+}
 
+.display-none {
+  display: none !important;
+}