.col11 { float:left; width:91.6666%; }
.col12 { width:100%; }
+.margin0 { margin-left:04.1666%; }
+.margin1 { margin-left:08.3333%; }
+.margin2 { margin-left:16.6666%; }
+.margin3 { margin-left:25.0000%; }
+.margin4 { margin-left:33.3333%; }
+.margin5 { margin-left:41.6666%; }
+.margin6 { margin-left:50.0000%; }
+.margin7 { margin-left:58.3333%; }
+.margin8 { margin-left:66.6666%; }
+.margin9 { margin-left:75.0000%; }
+.margin10 { margin-left:83.3333%; }
+.margin11 { margin-left:91.6666%; }
+.margin12 { margin-left:100.0000%; }
+
+.pad1 { padding: $lineheight/2; }
+.pad2 { padding: $lineheight; }
+
+.fillL { background-color: white; }
/* Default rules for the body of every page */
* {
/* Rules for the main content area */
#content {
- padding: $lineheight;
position: relative;
}
border-left: 1px solid #ccc;
}
+/* Overrides for pages that use new layout conventions */
+.site-verifysignup,
.site-copyright,
.site-welcome {
- .content-heading {
- text-align: center;
- }
-
#content {
- max-width: 700px;
- margin: auto;
+ max-width: 740px;
+ }
+}
+.user-new #content.pad2 {
+ padding: 0;
}
+
+.user-new .content-heading {
+ height: 200px;
+}
+
+.header-illustration {
+ background-position: 0 0;
+ background-repeat: no-repeat;
+ position: absolute;
+}
+
+.header-illustration.new-user-main {
+ height: 200px;
+ width: 100%;
+ left: 0;
+ bottom: 0;
+ background-image: image-url("sign-up-illustration.png");
+}
+
+.header-illustration.new-user-arm {
+ height: 110px;
+ width: 130px;
+ left: 260px;
+ top: 160px;
+ background-image: image-url("sign-up-illustration-arm.png");
+}
+
+@media only screen and (max-width:770px) {
+ .new-user-illustration.new-user-arm { display: none;}
}
.wrapper {
position: relative;
padding: $lineheight;
background: $offwhite;
+ z-index: 2;
h1, h2 {
margin-bottom: $lineheight/2;
line-height: 100%;
float: left;
}
-/* Rules for the login page */
+/* Rules for the log in page */
#login_openid_buttons {
margin-bottom: 0;
float: left;
}
#decline {
- background: $grey;
+ background: $lightblue;
&:hover {
- background: darken($grey, $hovercolor);
+ background: darken($lightblue, $hovercolor);
}
}
}
background: #fff;
}
+/* Rules for the "Verify signup" page */
+.site-verifysignup .content-heading {
+ height: 200px;
+}
+
+.header-illustration.verify-main {
+ background-position: 0 0;
+ background-repeat: no-repeat;
+ position: absolute;
+}
+
+.header-illustration.verify-main {
+ height: 200px;
+ width: 100%;
+ left: 0;
+ bottom: 0;
+ background-image: image-url("verify-illustration.png");
+}
+
/* Rules for the "Welcome" page */
.site-welcome {
.center {
text-align: center;
+ .sprite {
+ float: none;
+ margin: auto;
+ }
}
.drop {
.sprite {
background-image: image-url("welcome-sprite.png");
background-size: 500px 250px;
- display: inline-block;
+ display: block;
+ float: left;
}
+ .icon-list {
+ padding-bottom: 20px;
+ div {
+ margin-bottom: 10px;
+ p {
+ padding-top: 10px;
+ }
+ }
+ }
.sprite.small {
width: 50px;
height: 50px;
background-position: -50px 0;
}
- .sprite.large {
- width: 350px;
- height: 200px;
- }
-
- .sprite.one-map {
- background-position: 0 -50px;
- }
-
.sprite.term {
margin-right: 10px;
vertical-align: middle;
background-position: -300px 0;
}
- .pad1 {
- padding: 10px;
- }
-
- .pad2 {
- padding: 20px;
- }
-
- .one-map {
- position: relative;
- }
-
- .one-map-name {
- position: absolute;
- font-size: 15px;
- font-weight: bold;
- }
-
- .one-map-project-name {
- font-size: 25px;
- top: 70px;
- left: 75px;
- }
-
- .one-map-name-1,
- .one-map-name-5,
- .one-map-name-6 {
- text-align: center;
- display: inline-block;
- width: 200px;
- }
-
- .one-map-name-1 {
- color: #c28d86;
- top: 30px;
- left: -70px;
- }
-
- .one-map-name-2 {
- color: #c28d86;
- top: 25px;
- left: 172px;
- }
-
- .one-map-name-3 {
- color: #94cacc;
- top: 45px;
- left: 140px;
- }
-
- .one-map-name-4 {
- color: #94cacc;
- top: 48px;
- left: 270px;
- }
-
- .one-map-name-5 {
- color: #85c589;
- top: 105px;
- left: 90px;
- }
-
- .one-map-name-6 {
- color: #94cacc;
- top: 138px;
- left: 20px;
- }
-
- .edit-located,
- .edit-geocoded,
- .edit-geolocated {
- display: none;
- }
-
- .start-mapping,
- .sign-up {
- background: #EB6F67;
- color: #FFF;
+ .start-mapping {
margin: auto;
cursor: pointer;
border: none;
- border-radius: 5px;
- border-bottom: 1px solid #A53931;
padding: 20px 40px;
font-size: 30px;
text-decoration: none;