Skip to content

Instantly share code, notes, and snippets.

@jschloss

jschloss/gist:2597038

Created May 4, 2012 19:03
Show Gist options
  • Save jschloss/2597038 to your computer and use it in GitHub Desktop.
Save jschloss/2597038 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
gistfile1.css
/* Sitewide =============================================================== Sitewide ==*/
body, p, .museo-sans {
font-family: rooney-web;
color: #878683;
}
.rooney {
font-family: rooney-web;
}
.trebuchet {
font-family: trebuchet-ms;
}
section {
padding: 30px 0 60px;
border-bottom: 1px solid #ddd;
}
section a {
font-weight: 500;
}
h1,h2,h3,h4,h5 {
font-family: rooney-web, rooney, georgia, serif;
font-weight: 100;
color: #102343;
}
h2 {
font-size: 24px;
line-height: 30px;
font-weight: 100;
margin-bottom: 30px;
}
h2.small {
font-size: 18px;
line-height: 24px;
letter-spacing: -1px;
font-weight: 100;
}
a {
color: #696866;
-webkit-transition: all 120ms ease-in-out;
-moz-transition: all 120ms ease-in-out;
-o-transition: all 120ms ease-in-out;
transition: all 120ms ease-in-out;
}
/* Color palette ============================================================ Color palette ==*/
.sky { color: #329ff3; }
.bg-sky { background-color: #329ff3; }
a:hover, .navy { color: #0f2244; }
.bg-navy { background-color: #0f2244; }
.turquoise { color: #58cfd1 }
}
.bg-turquoise { background-color: #58cfd1; }
.green { color: #1ed57b; }
.bg-green { background-color: #1ed57b; }
.grey { color: #878683; }
.bg-grey, { background-color: #878683; }
.light-grey { color: #e1e0de; }
.bg-light-grey{ background-color: #e1e0de; }
.dark-grey { color: #434851; }
.bg-dark-grey { background-color: #434851; }
/* Nav bar ======================================================================== Nav bar ==*/
.navbar {
margin-bottom: 80px;
z-index: 900;
}
.navbar-inner {
background: #102343;
height: 50px;
border-radius: 0;
}
.navbar .container {
background: none;
border: none;
}
/* Bonobos logo ===*/
.navbar .brand {
background-image: url('../img/bonobos-sprite.png');
background-repeat: no-repeat;
background-color: #fff;
width: 148px;
height: 49px;
text-indent: -9000px;
font-size: 0;
padding: 0;
position: absolute;
left: 50%;
margin-left: -74px;
float: none;
-webkit-transition: background-color 150ms linear;
-moz-transition: background-color 150ms linear;
-o-transition: background-color 150ms linear;
transition: background-color 150ms linear;
}
.navbar .brand:hover {
background-color: #e1e0de;
}
/* ===================================================*/
/* Category links below blue stripe ===*/
.navbar .nav {
clear: left;
background: white;
margin-top: 2px;
}
.navbar .nav > li:first-child {
margin-left: -10px;
}
.navbar .nav > li > a {
font: 500 13px rooney-web, rooney, georgia, serif;
color: #102343;
text-shadow: 0 -1px 0 rgba(255, 255, 255, 1);
padding: 8px 9px 10px 10px;
letter-spacing: 0;
}
@media (min-width: 1200px) {
.navbar .nav > li > a { font-size: 14px; }
}
.navbar .nav > li.last-child > a {
padding-right: 0;
}
.navbar .nav > li > a:hover {
color: #329ff3;
}
/* ===================================================*/
/* Right section for My Account and Cart ===*/
.navbar .right {
list-style: none;
margin: 0;
}
.navbar .right li {
float: left;
position: relative;
}
.navbar .right a {
float: left;
color: #cfd3da;
padding: 14px;
font-family: museo-sans;
font-size: 12px;
line-height: 22px;
display: inline-block;
*display: inline;
/* IE7 inline-block hack */
*zoom: 1;
-webkit-transition: all 150ms ease-in-out;
-moz-transition: all 150ms ease-in-out;
-o-transition: all 150ms ease-in-out;
transition: all 150ms ease-in-out;
}
.navbar .right a .icon{
margin-right: 5px;
width: 20px;
height: 20px;
border-radius: 3px;
background: rgb(115,125,147); /* Old browsers */
background: -moz-linear-gradient(top, rgba(115,125,147,1) 0%, rgba(88,100,126,1) 95%, rgba(83,97,122,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(115,125,147,1)), color-stop(95%,rgba(88,100,126,1)), color-stop(100%,rgba(83,97,122,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(115,125,147,1) 0%,rgba(88,100,126,1) 95%,rgba(83,97,122,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(115,125,147,1) 0%,rgba(88,100,126,1) 95%,rgba(83,97,122,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(115,125,147,1) 0%,rgba(88,100,126,1) 95%,rgba(83,97,122,1) 100%); /* IE10+ */
background: linear-gradient(top, rgba(115,125,147,1) 0%,rgba(88,100,126,1) 95%,rgba(83,97,122,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#737d93', endColorstr='#53617a',GradientType=0 ); /* IE6-9 */
display: inline-block;
*display: inline;
/* IE7 inline-block hack */
*zoom: 1;
-webkit-transition: all 150ms ease-in-out;
-moz-transition: all 150ms ease-in-out;
-o-transition: all 150ms ease-in-out;
transition: all 150ms ease-in-out;
}
.navbar .right .icon i {
margin: -1px 3px;
}
/*Hover */
.navbar .right a:hover {
background: ;
text-decoration: none;
color: #fff;
background: -moz-radial-gradient(center, ellipse cover, rgba(10,25,50,0) 0%, rgba(10,25,50,0.5) 100%); /* FF3.6+ */
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(10,25,50,0)), color-stop(100%,rgba(10,25,50,0.5))); /* Chrome,Safari4+ */
background: -webkit-radial-gradient(center, ellipse cover, rgba(10,25,50,0) 0%,rgba(10,25,50,0.5) 100%); /* Chrome10+,Safari5.1+ */
background: -o-radial-gradient(center, ellipse cover, rgba(10,25,50,0) 0%,rgba(10,25,50,0.5) 100%); /* Opera 12+ */
background: -ms-radial-gradient(center, ellipse cover, rgba(10,25,50,0) 0%,rgba(10,25,50,0.5) 100%); /* IE10+ */
background: radial-gradient(center, ellipse cover, rgba(10,25,50,0) 0%,rgba(10,25,50,0.5) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000a1932', endColorstr='#800a1932',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
-webkit-box-shadow: inset 1px 1px 40px 10px rgba(0, 0, 0, .2);
-moz-box-shadow: inset 1px 1px 40px 10px rgba(0, 0, 0, .2);
box-shadow: inset 1px 1px 40px 10px rgba(0, 0, 0, .2);
}
/* Active */
.navbar .right a:active {
-webkit-box-shadow: inset 1px 1px 30px 30px rgba(0, 0, 0, .2);
-moz-box-shadow: inset 1px 1px 30px 30px rgba(0, 0, 0, .2);
box-shadow: inset 1px 1px 30px 30px rgba(0, 0, 0, .2);
color: rgba(255,255,255,0.7);
}
.navbar .right a:hover .icon, .navbar .right li.dropdown:hover > a .icon {
background: rgb(247,247,246); /* Old browsers */
background: -moz-linear-gradient(top, rgba(247,247,246,1) 0%, rgba(238,237,235,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(247,247,246,1)), color-stop(100%,rgba(238,237,235,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(247,247,246,1) 0%,rgba(238,237,235,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(247,247,246,1) 0%,rgba(238,237,235,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(247,247,246,1) 0%,rgba(238,237,235,1) 100%); /* IE10+ */
background: linear-gradient(top, rgba(247,247,246,1) 0%,rgba(238,237,235,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f6', endColorstr='#eeedeb',GradientType=0 ); /* IE6-9 */
-webkit-box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, .3);
-moz-box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, .3);
box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, .3);
}
/* Nav dropdowns ============================================================= Nav dropdowns ==*/
.navbar .right li.dropdown a:hover, .navbar .right li.dropdown:hover > a {
background: whiteSmoke;
box-shadow: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
color: #434851;
}
.navbar .right li.dropdown ul {
display: none;
position: absolute;
top: 49px;
left: 0;
background: whiteSmoke;
padding: 10px 0 20px;
border: none;
border-radius: 3px;
width:228px;
box-shadow: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
}
.navbar .right li.dropdown:hover ul {
display: block;
}
.navbar .right li.dropdown ul li.divider {
border-bottom: 1px solid #ddd;
padding-bottom: 5px;
margin-bottom: 10px;
}
.navbar .right li.dropdown ul li {
float: left;
clear: both;
margin-left: 15px;
}
.navbar .right li.dropdown ul li a {
color: #102343;
margin: 0;
font: 500 14px rooney-web;
padding: 5px 0;
}
.navbar .right li.dropdown ul li a:hover {
color: #329ff3;
}
.navbar .right li.dropdown ul li h5 {
font-size: 15px;
margin-top: 10px;
margin-bottom: 5px;
}
.navbar .right li.dropdown ul li a.customer-service {
font-size: 13px;
line-height: 20px;
margin: 0;
padding: 0;
float: none;
color: #878683;
}
.navbar .right li.dropdown ul li a.customer-service:hover {
color: #329ff3;
}
.navbar .btn, .navbar .btn-group { margin-top: 0; clear: none;
}
.btn-group .dropdown-toggle { box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none; border-radius: 0;
}
/* Footer ======================================================================== Footer ==*/
footer {
padding-bottom: 40px;
}
footer dt {
margin-top: 20px;
font: 100 18px/30px rooney-web, rooney, georgia, serif;
color: #102343;
}
footer dd {
margin: 0;
}
footer dl.last-child dd {
margin-bottom: 7px;
}
footer dl.last-child dd.last-child {
margin-top: -3px;
}
/* ===================================================*/
/* Left Alert area ===*/
.nav-alert {
float: left;
margin-top: 6px;
text-align: left;
padding: 10px 0;
font-weight: 500;
color: #7e8797;
font-size: 12px;
}
.bonobos-box {
background: url('../img/bonobos-sprite.png') no-repeat -871px 0;
width: 57px;
height: 51px;
margin-bottom: -17px;
margin-top: -20px;
display: inline-block;
*display: inline;
/* IE7 inline-block hack */
*zoom: 1;
}
/* ===========================================================================================*/
/* ===========================================================================================*/
/* Homepage ====================================================================== Homepage ==*/
/* ===========================================================================================*/
/* ===========================================================================================*/
#hero {
margin-top: -80px;
}
.hero {
background: url(../img/home-hero-mar7-2011.jpg) top center no-repeat;
padding: 80px 0 80px;
}
@media (min-width: 1200px) {
.hero { padding-bottom: 110px; }
}
.hero h1 {
font-size: 90px;
line-height: 89px;
font-weight: 500;
letter-spacing: -5px;
text-rendering: optimizeLegibility;
position: relative;
font-family: museo-sans, trebuchet ms, helvetica, arial, sans-serif;
}
@media (min-width: 1200px) {
}
.hero h1 em {
margin: 0 6px 0 -7px;
}
.hero h1 a {
color: #58cfd1;
;
-webkit-transition: color 350ms ease-in-out;
-moz-transition: color 350ms ease-in-out;
-o-transition: color 350ms ease-in-out;
transition: color 350ms ease-in-out;
}
.hero a.img-clickthrough {
display: block;
height: 350px;
margin-top: -20px;
}
.hero h1 a:hover {
text-decoration: none;
color: #329ff3 !important;
}
.hero p {
font: 100 24px/28px rooney-web;
margin-top: 30px;
}
.hero p a {
font-weight: 500;
}
.hero .intro {
font: 100 24px/49px rooney-web, rooney, georgia, serif
margin-bottom: 20px;
}
.hero .nymag {
display: block;
background: url('../img/bonobos-sprite.png') no-repeat 0 -155px;
width: 133px;
height: 26px;
text-indent: -9000px;
font-size: 0;
margin: 0 auto;
}
/* Twitter embeds */
.hero .twt-tweet .entry-title, .hero .twt-tweet .entry-title a, .hero .twt-tweet .entry-title a b {font: 12px/18px rooney-web, rooney, serif!important;}
.hero .twt-tweet .twt-follow-button {
display: none!important;
}
/* Bonobos Nation row*/
#bonobos-nation {
}
#bonobos-nation .bonobos-nation-flag-small {
margin: -85px auto 0;
}
#bonobos-nation a:hover img {
margin-top: -2px;
-webkit-box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, .3);
-moz-box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, .3);
box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, .3);
-webkit-transition: all 120ms ease-in-out;
-moz-transition: all 120ms ease-in-out;
-o-transition: all 120ms ease-in-out;
transition: all 120ms ease-in-out;
}
#bonobos-nation a:active img {
margin-top: 0;
box-shadow: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
}
/* Product listing - Pants ======================================== Product listing - Pants ==*/
.product.pants {
float: left;
text-align: center;
margin-top: -30px;
margin-right: 20px;
width: 17.5%;
font-weight: 700;
position: relative;
}
.product.pants a {
display: block;
width: 175px;
padding-top: 330px;
}
.product.pants a img {
width: 175px;
height: 320px;
position: absolute;
left: 0;
top: 0;
max-width: none;
-webkit-transition: opacity 330ms ease-in-out;
-moz-transition: opacity 200ms ease-in-out;
-o-transition: opacity 200ms ease-in-out;
-ms-transition: opacity 200ms ease-in-out;
transition: opacity 330ms ease-in-out;
}
.product.pants a img.back-view {
opacity: 0;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=00)";
filter: alpha(opacity=00);
-moz-opacity:0;
-khtml-opacity: 0;
}
.product.pants a:hover img.front-view {
}
.product.pants a:hover img.back-view {
opacity: 1;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
-moz-opacity:1;
-khtml-opacity: 1;
}
/* New customers section ============================================ New customers section ==*/
#new-customers {
position: relative;
}
#new-customers #basics ul li, #new-customers #basics ul a {
display: inline-block;
*display: inline;
/* IE7 inline-block hack */
*zoom: 1;
}
#new-customers #basics ul li a {
text-align: center;
width: 190px;
margin-top: 10px;
margin-bottom: 10px;
}
#new-customers #basics ul {
clear: left;
width: 390px;
margin: 50px auto 0;
list-style: none;
display: ;
}
#new-customers #basics a img{
margin: 0 auto 15px;
display: block;
-webkit-transition: all 120ms ease-in-out;
-moz-transition: all 120ms ease-in-out;
-o-transition: all 120ms ease-in-out;
transition: all 120ms ease-in-out;
}
#new-customers #guides figure.last-child {
margin-top: 40px;
margin-bottom: 10px;
}
#new-customers #basics a:hover img {
margin-top: -3px;
margin-bottom: 18px;
}
#new-customers #guides figcaption {
margin-top: 5px;
}
#setstr_container {
top: 30px !important;
}
/* ===========================================================================================*/
/* ===========================================================================================*/
/* Categories Grid ======================================================== Categories grid ==*/
/* ===========================================================================================*/
/* ===========================================================================================*/
#categories-grid {
padding-bottom: 0px;
}
#categories-grid .row-fluid.last-child .span4 {
border-bottom: none;
}
#categories-grid img {
float: left;
}
#categories-grid ul {
list-style: none;
float: left;
padding: 0;
margin: 0;
}
#categories-grid a {
caption-side
}
#categories-grid .row-fluid {
margin-top: 20px;
margin-bottom: 30px;
}
#categories-grid .span4 {
border-bottom: 1px solid #ddd;
padding-bottom: 20px;
min-height: 170px;
}
#categories-grid .span4 ul li a {
width: 150px;
float: left;
display: block;
}
#categories-grid .span4 h3, #categories-grid .span4 ul {
min-width: 150px;
float: left;
}
#categories-grid .span4 h3 a {
color: #102343;
}
#categories-grid h4 {
float: left;
display: block;
text-align: center;
width: 150px;
height: 170px;
#position: relative;
}
#categories-grid h4 a {
display: block;
vertical-align: middle;
text-indent: -9000px;
font-size: 0;
background: url('../img/categories-sprite.jpg') no-repeat;
margin: 0 auto;
float: none;
-webkit-transition: all 120ms ease-in-out;
-moz-transition: all 120ms ease-in-out;
-o-transition: all 120ms ease-in-out;
transition: all 120ms ease-in-out;
#position: absolute; #top: 50%;
}
#categories-grid h4 a:hover {
margin-top: -2px;
}
#categories-grid #cat-new h4 a {
background-position:-56px -24px;
width: 72px;
height: 152px;
}
#categories-grid #cat-pants h4 a {
background-position:-376px -24px;
width: 72px;
height: 152px;
}
#categories-grid #cat-denim h4 a {
background-position:-696px -24px;
width: 72px;
height: 152px;
}
#categories-grid #cat-shirts h4 a {
background-position:-32px -240px;
width: 120px;
height: 130px;
}
#categories-grid #cat-suits h4 a {
background-position:-360px -240px;
width: 120px;
height: 128px;
}
#categories-grid #cat-tees h4 a {
background-position:-664px -240px;
width: 136px;
height: 136px;
}
#categories-grid #cat-shorts h4 a {
background-position:-40px -464px;
width: 104px;
height: 88px;
}
#categories-grid #cat-sweaters h4 a {
background-position:-347px -416px;
width: 125px;
height: 144px;
}
#categories-grid #cat-outerwear h4 a {
background-position:-656px -421px;
width: 152px;
height: 144px;
}
#categories-grid #cat-shoes h4 a {
background-position:-32px -664px;
width: 128px;
height: 56px;
}
#categories-grid #cat-accessories h4 a {
background-position:-352px -632px;
width: 120px;
height: 98px;
}
#categories-grid #cat-giftcards h4 a {
background-position:-688px -648px;
width: 96px;
height: 91px;
}
#categories-grid #cat-seasonal h4 a {
background-position:-40px -840px;
width: 112px;
height: 88px;
}
#categories-grid #cat-sale h4 a {
background-position:-360px -808px;
width: 96px;
height: 128px;
}
/* Reusable elements ==================================================== Reusable elements ==*/
/* Vertical separator line */
.vertical-line {
position: absolute;
left: 50%;
margin-left: -.5px;
width: 1px;
display: block;
height: 94%;
top: 3%;
}
.vertical-line i {
display: block;
height: 100%;
width: 1px;
background: #ddd;
}
/* Bonobos Nation Flag, small */
.bonobos-nation-flag-small {
display: block;
background: url('../img/bonobos-sprite.png') no-repeat 0 -68px;
width: 36px;
height: 29px;
}
/* Format adjustors ====================================================== Format adjustors ==*/
.type11 {
font-size: 11px;
line-height: 14px;
}
.type12 {
font-size: 12px;
line-height: 17px;
}
.down10 {
margin-top: 10px;
}
.down20 {
margin-top: 20px;
}
.down30 {
margin-top: 30px;
}
.down40 {
margin-top: 40px;
}
.down50 {
margin-top: 50px;
}
.down80 {
margin-top: 80px;
}
.down100 {
margin-top: 100px;
}
.down150 {
margin-top: 150px;
}
.down200 {
margin-top: 200px;
}
.left10 {
margin-left: -10px !important
}
.left20 {
margin-left: -20px !important
}
.center{
text-align: center;
}
.centered {
margin-left: auto;
margin-right: auto;
}
.relative {
position: relative;
}
.right {
float: right!important;
}
/* Buttons & Form elements ======================================== Buttons & Form elements==*/
.btn {
font: 500 14px museo-sans, Museo Sans, helvetica, arial, sans-serif;
background: #f3f3f3;
border: 1px solid #f3f3f3;
color: #329ff3;
text-shadow: none;
box-shadow: none;
-moz-box-shadow: none;
-webkit-box-shadow: none;
padding: 15px 20px;
margin-bottom: 10px;
transition: none;
-webkit-transition: none;
-moz-transition: none;
border-radius: 2px;
cursor: pointer;
}
.btn:hover {
background: rgb(247,247,246); /* Old browsers */
background: -moz-linear-gradient(top, rgba(247,247,246,1) 0%, rgba(238,237,235,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(247,247,246,1)), color-stop(100%,rgba(238,237,235,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(247,247,246,1) 0%,rgba(238,237,235,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(247,247,246,1) 0%,rgba(238,237,235,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(247,247,246,1) 0%,rgba(238,237,235,1) 100%); /* IE10+ */
background: linear-gradient(top, rgba(247,247,246,1) 0%,rgba(238,237,235,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f6', endColorstr='#eeedeb',GradientType=0 ); /* IE6-9 */
border-color: #ededed;
border-bottom-color: #ddd;
color: #329ff3;
}
.btn:active {
color: #5db2f3;
-webkit-box-shadow: inset 1px 1px 5px 1px rgba(0, 0, 0, .2);
-moz-box-shadow: inset 1px 1px 5px 1px rgba(0, 0, 0, .2);
box-shadow: inset 1px 1px 5px 1px rgba(0, 0, 0, .2);
}
.btn-primary {
border: 1px solid #4b94f3;
color: #fff;
background: #4b94f3;
}
.btn-primary:hover {
background: rgb(83,156,244); /* Old browsers */
background: -moz-linear-gradient(top, rgba(83,156,244,1) 0%, rgba(86,160,244,1) 2%, rgba(85,159,244,1) 27%, rgba(71,143,242,1) 95%, rgba(72,144,242,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(83,156,244,1)), color-stop(2%,rgba(86,160,244,1)), color-stop(27%,rgba(85,159,244,1)), color-stop(95%,rgba(71,143,242,1)), color-stop(100%,rgba(72,144,242,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(83,156,244,1) 0%,rgba(86,160,244,1) 2%,rgba(85,159,244,1) 27%,rgba(71,143,242,1) 95%,rgba(72,144,242,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(83,156,244,1) 0%,rgba(86,160,244,1) 2%,rgba(85,159,244,1) 27%,rgba(71,143,242,1) 95%,rgba(72,144,242,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(83,156,244,1) 0%,rgba(86,160,244,1) 2%,rgba(85,159,244,1) 27%,rgba(71,143,242,1) 95%,rgba(72,144,242,1) 100%); /* IE10+ */
border-color: #5396e4;
border-bottom-color: #3b72b1;
color: #fff;
}
.btn-primary:active {
color: #cddbe6;
}
.btn-oversize {
padding: 18px 55px;
border-bottom-width: 2px;
font-size: 18px;
}
.btn-small {
padding: 8px 12px;
font-size: 12px;
}
.btn-inline {
padding: 3px 8px;
font-size: inherit;
margin-top: 6px;
}
input,textarea {
padding: 13px;
}
input.input-small {
padding: 5px;
width: 170px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment