Issue 2844 - Create Microsoft Edge coming soon landing page

static/css/index.css

 #content h1, #content h2
 {
   font-size: 16px;
 }
 
 #content .sprite
 {
   background-image: url(../img/sprite-index.png);
 }
 
+#abb-banner
+{
+  background-color: #ffffff;
+  display: none;
+  padding: 50px 40px 40px 40px;
+  margin-bottom: 30px;
+  text-align: center;
+}
+
+#abb-banner h2
+{
+  font-size: 28px;
+  font-weight: bold;
+  color: #333333;
+  margin: 0px;
+}
+
+#abb-banner img
+{
+  margin: 30px 0px 40px 0px;
+  width: 40%;
+  min-width: 200px;
+}
+
+#abb-banner a
+{
+  display: none;
+  padding: 20px;
+  background-color: #2f8ecb;
+  text-decoration: none;
+  font-size: 24px;
+  font-weight: bold;
+  color: #ffffff;
+  border-radius: 5px;
+}
+
+#content.ua-android,
+#content.ua-ios
+{
+  margin-top: 0px;
+}
+
+#content.ua-android #abb-banner,
+#content.ua-ios #abb-banner,
+#content.ua-android #abb-android-download,
+#content.ua-ios #abb-ios-download
+{
+  display: block;
+}
+
+#content.ua-android #adblock-browser-notification,
+#content.ua-ios #adblock-browser-notification
+{
+  display: none;
+}
+
 #main, #video
 {
   display: inline-block;
 }
 
-#video, #maxthon-instruction, edge-incoming
-{
-  background: white;
+#video, #maxthon-instruction, #edge-teaser
+{
+  background: #ffffff;
   padding: 10px;
   border: 1px solid #c9c9c9;
   box-shadow: 1px 1px 0 0 #dbdbdb;
 }
 
 #maxthon-instruction,
 html[lang^="zh_"] #content.maxthon #video,
 #content.maxthon #feature-free,
 #feature-maxthon
 {
   display: none;
 }
 
 html[lang^="zh_"] #content.maxthon #maxthon-instruction
 {
   display: inline-block;
   padding: 0px;
 }
 
 #content.maxthon #feature-maxthon
 {
   display: inline-block;
-}
-
-#feature-edge, #edge-incoming
-{
-  display: none;
-}
-
-#content.edge #video
-{
-  display: none;
-}
-
-#content.edge #feature-edge
-{
-  display: block;
 }
 
 #summary h1, #summary h2
 {
   font-weight: normal;
   margin: 0;
 }
 
 #summary h1
 {
   font-size: 60px;
   line-height: 50px;
   margin-bottom: 8px;
 }
 
 #summary h2
 {
   font-size: 22px;
   color: #d50215;
 }
 
 #summary ul
 {
   list-style-type: none;
   margin: 10px 0px 27px 0px;
   padding-left: 40px;
   padding-right: 0px;
   color: #333333;
-}
-
-#content.edge #summary ul
-{
-  margin: 10px 0px 18px 0px;
 }
 
 html[dir="rtl"] #summary ul
 {
   padding-right: 40px;
   padding-left: 0px;
 }
 
 #summary li
 {
@@ skipping 285 matching lines @@
 #platform-edge
 {
   background-position: -68px -171px;
 }
 
 #content.edge #platform-edge
 {
   background-position: -68px -151px;
 }
 
+#content h3.subscribe-header
+{
+  font-size: 18px;
+  margin-bottom: 0px;
+}
+
+#edge-subscription h3
+{
+  margin: 19px 0px 10px 0px;
+  color: #2d79c0;
+  font-weight: bold;
+  font-family: Arial;
+  font-size: 14px;
+}
+
+#edge-subscription
+{
+  margin: 0px 0px 10px 40px;
+}
+
+html[dir="rtl"] #edge-subscription
+{
+  margin: 0px 40px 10px 0px;
+}
+
+#edge-subscription input[type=email]
+{
+  border: solid 2px #a5a5a5;
+  padding: 0px 10px;
+  font-size: 14px;
+  font-family: Arial;
+  line-height: 36px;
+  height: 36px; /* IE 8 */
+}
+
+#edge-subscription input[type=email].placeholder
+{
+  color: #a5a5a5;
+}
+
+#edge-subscription button[type=submit]
+{
+  border: solid 1px #357ebd;
+  border-radius: 3px;
+  background-color: #428bca;
+  color: #ffffff;
+  font-size: 14px;
+  font-weight: bold;
+  width: 146px;
+  height: 40px;
+}
+
+
+#edge-subscription form > span, #edge-subscription form.success input,
+#edge-subscription form.success button, #other-browsers, #content.edge #video,
+#edge-subscription, #edge-teaser
+{
+  display: none;
+}
+
+#edge-subscription form .invalid-label
+{
+  margin-top: 15px;
+}
+
+#edge-subscription form.success .sucess-label,
+#edge-subscription form.invalid .invalid-label,
+#edge-subscription form.error .response-error,
+#content.edge #edge-subscription
+{
+  display: block;
+}
+
 .warning-platform,
 .disclaimer,
 #maxthon-notification
 {
   display: none;
   color: #D00;
   text-align: center;
   border: 1px solid #D00;
   padding: 5px;
   border-radius: 5px;
-}
-
-#adblock-browser-notification
-{
-  color: #555555;
-  font-size: 16px;
-  background-color: #FFFFFF;
-  text-align: center;
-  border: 1px solid #D9D9D9;
-  padding: 20px 0px;
 }
 
 .disclaimer
 {
   font-size: 14px;
   color: #000;
   text-align: left;
 }
 
 #content.ua-firefox .warning-platform.firefox,
@@ skipping 179 matching lines @@
 #more-container.chrome #more-chrome,
 #more-container.opera #more-opera,
 #more-container.android #more-android,
 #more-container.internet-explorer #more-internet-explorer,
 #more-container.safari #more-safari,
 #more-container.yandex-browser #more-yandex-browser,
 #more-container.maxthon #more-maxthon
 #more-container.edge #more-edge
 {
   background-color: #dbd4c7;
-}
-#content h3.subscribe-header
-{
-  font-size: 18px;
-  margin-bottom: 0px;
-}
-
-.subscribe-description
-{
-  margin: 19px 0px 10px 0px;
-  color: #2d79c0;
-  font-weight: bold;
-  font-family: Arial;
-  font-size: 14px;
-}
-
-#edge-other-browsers
-{
-  display: none;
-}
-
-#subscribe-textbox
-{
-  border: solid 2px #a5a5a5;
-  margin-right: 0px;
-  padding-left: 10px;
-  padding-right: 10px;
-  font-size: 14px;
-  font-family: Arial;
-  line-height: 36px;
-  height: 36px; /* IE 8 */
-}
-
-#subscribe-textbox.placeholder
-{
-  color: #a5a5a5;
-}
-
-#subscribe-button
-{
-  border: solid 1px #357EBD;
-  border-radius: 3px;
-  background-color: #428BCA;
-  color: #FFFFFF;
-  font-size: 14px;
-  font-weight: bold;
-  min-width: 146px;
-  height: 40px;
-  margin-left: 0px;
-}
-
-#subscribe-button span
-{
-  padding-left: 30px;
-  padding-right: 30px;
-}
-
-#subscribe-form .sucess-label, #response-error,
-#subscribe-form .invalid-label, #subscribe-form.success input,
-#subscribe-form.success button
-{
-  display: none;
-}
-
-#subscribe-form .invalid-label
-{
-  margin-top: 15px;
-}
-
-#subscribe-form.success .sucess-label,
-#subscribe-form.invalid .invalid-label,
-#subscribe-form.error #response-error
-{
-  display: block;
-}
+}