regluit/static/scss/landingpage4.scss

396 lines
7.2 KiB
SCSS

@import "variables.scss";
@import "learnmore2.scss";
#expandable {
display: none;
}
#main-container.main-container-fl .js-main {
width:968px;
background:#fff url("#{$image-base}landingpage/container-top.png") top center no-repeat;
}
#js-maincol-fl {
padding:30px 30px 0 30px;
overflow:hidden;
#content-block {
background:none;
padding:0;
}
#js-main-container {
float: left;
width:672px;
}
.js-main-container-inner {
padding-right:40px;
}
h2.page-heading {
margin:0 0 20px 0;
color:$text-blue;
font-size: $font-size-header;
font-weight: bold;
}
}
#user-block1, .user-block2 {
float:left;
}
#user-block1 {
#block-intro-text {
float:left;
width:702px;
font-size: $font-size-header;
}
a#readon {
font-size: $font-size-larger;
}
}
#js-rightcol, #js-rightcol2 {
float:right;
width:230px;
.jsmodule {
float: left;
width: 208px;
background:$pale-blue;
border:1px solid $blue-grey;
@include one-border-radius(12px);
margin-bottom:10px;
padding: 0 10px 10px 10px;
input {
border: none;
@include height(36px);
width:90%;
outline: none;
padding-left: 16px;
font-size: $font-size-larger;
}
input.signup {
border: medium none;
cursor: pointer;
display: inline-block;
overflow: hidden;
padding: 0 31px 0 11px;
width: 111px;
margin-bottom: 10px;
}
input.donate {
cursor: pointer;
display: inline-block;
overflow: hidden;
padding: 0 31px 0 11px;
width: 50%;
}
.donate_amount {
text-align: center;
}
div {
padding:0px;
margin:0px;
}
}
div.button {
padding-top:10px;
text-align: center;
color: #FFF;
}
#donatesubmit {
font-size: $font-size-larger;
}
label {
width:100%;
display:block;
clear:both;
padding:10px 0 5px 0;
}
}
.js-rightcol-padd {
margin:0px;
}
h3.heading {
color:$text-blue;
font-weight:bold;
}
ul.ungluingwhat {
list-style: none;
padding:0;
margin:0 -10px;
li {
margin-bottom:3px;
background:#fff;
padding: 10px;
display:block;
overflow:hidden;
> span {
float: left;
}
}
.user-avatar {
width:43px;
img {
@include one-border-radius(5px);
}
}
.user-book-info {
margin-left: 5px;
width: 160px;
word-wrap: break-word;
font-size: $font-size-default;
line-height: $font-size-default*1.3;
a {
font-weight: normal;
}
}
}
div.typo2 {
background:$pale-blue;
@include one-border-radius(12px);
padding:10px;
font-style:italic;
}
div.signup_btn {
display:block;
overflow:hidden;
a {
background: url("#{$image-base}bg.png") no-repeat scroll right top transparent;
color: #fff;
display: block;
font-size: $font-size-default;
font-weight: bold;
@include height(36px);
letter-spacing: 1px;
text-decoration: none;
text-transform: capitalize;
float:left;
span {
background: url("#{$image-base}bg.png") no-repeat scroll -770px -36px transparent;
display: block;
margin-right: 29px;
padding: 0 5px 0 15px;
}
}
}
.have-content-right-module {
.item-content {
float:left;
width:364px;
font-size: $font-size-larger;
height: 132px;
border-bottom:7px solid $bright-blue;
p {
margin-bottom:20px;
line-height:135%;
}
h2.page-heading {
padding-right:97px;
line-height:43px;
padding-bottom:4px;
padding-top: 5px;
}
}
.content-right-module {
width:268px;
float:right;
h3 {
color:$bright-blue;
text-transform:uppercase;
font-size:24px;
font-weight:normal;
padding:0;
margin:0 0 16px 0;
}
}
}
h2.page-heading {
color:#3c4e52;
font-size:28px !important;
font-style:italic;
font-weight:normal !important;
}
#js-maincontainer-faq {
clear: both;
overflow:hidden;
margin:15px 0;
width:100%;
}
.js-maincontainer-faq-inner {
float:right;
color:$text-blue;
font-size: $font-size-larger;
padding-right:60px;
a {
font-weight:normal;
color:$text-blue;
text-decoration:underline;
}
}
h3.module-title {
padding: 10px 0;
font-size: $font-size-header;
font-weight: normal;
margin: 0;
}
.landingheader {
border-bottom: solid 5px $medium-blue;
float: left;
height:134px;
}
h3.featured_books {
clear: both;
font-weight: normal;
background: $pale-blue;
@include border-radius(10px, 10px, 0, 0);
padding: 10px;
-webkit-margin-before: 0;
}
a.more_featured_books {
float: right;
width: 57px;
height: 305px;
margin: 5px 0;
border: 5px solid white;
line-height: 305px;
text-align: center;
&:hover {
cursor: pointer;
border-color: $pale-blue;
color: $green
}
&.short {
height: 85px;
line-height: 85px;
}
}
.spacer {
height: 15px;
width: 100%;
clear: both;
}
ul#as_seen_on {
margin: 15px 0;
position: relative;
height: 80px;
padding:0px;
li {
float: left;
list-style-type: none;
padding: 10px;
line-height: 80px;
&:hover {
background: $bright-blue;
}
img {
vertical-align: middle;
max-width: 131px;
}
}
}
/* via http://nicolasgallagher.com/pure-css-speech-bubbles/demo/ */
.speech_bubble {
position:relative;
margin:1em 0;
border:5px solid $medium-blue;
color:$text-blue;
@include one-border-radius(10px);
background: #fff;
font-size: $font-size-header;
padding: 1.5em;
&:before {
content: "";
position: absolute;
top:-20px; /* value = - border-top-width - border-bottom-width */
bottom:auto;
left:auto;
right:60px; /* controls horizontal position */
border-width:0 20px 20px;
border-style: solid;
border-color: $medium-blue transparent;
/* reduce the damage in FF3.0 */
display:block;
width:0;
}
&:after {
content: "";
position: absolute;
top:-13px; /* value = - border-top-width - border-bottom-width */
bottom:auto;
left:auto;
right:67px; /* value = (:before right) + (:before border-right) - (:after border-right) */
border-width:0 13px 13px;
border-style: solid;
border-color: #fff transparent;
/* reduce the damage in FF3.0 */
display:block;
width:0;
}
span {
padding-left: 1em;
&:before {
position: absolute;
top: .75em;
left: .75em;
font-size: $font-size-header*2;
content:"\201C";
}
&:after {
position: absolute;
top: .75em;
font-size: $font-size-header*2;
content:"\201D";
}
}
}
#footer {
clear: both;
margin-top:30px;
}