Skip to content

Instantly share code, notes, and snippets.

@liamr
Created April 22, 2013 10:48
Show Gist options
  • Save liamr/5433891 to your computer and use it in GitHub Desktop.
Save liamr/5433891 to your computer and use it in GitHub Desktop.
StarterBase - main styles
/*------------------------------------------------------------
Start Main
Created by: Liam R
Contact: hello-at-liamr.com
Copyright 2013
--------------------------------------------------------------*/
/* Responsive Resets
-------------------------------------------------------------- */
@-o-viewport {
width: device-width;
}
@-ms-viewport {
width: device-width;
}
@viewport {
width: device-width;
}
html {
overflow-y: auto;
}
img,
audio,
video,
canvas,
object,
embed {
max-width: 100%;
height: auto;
}
object,embed{height:100%;}
img{-ms-interpolation-mode:bicubic;display:inline-block; border: 0;}
#map_canvas img,#map_canvas embed,#map_canvas object,.map_canvas img,.map_canvas embed,.map_canvas object{max-width:none!important;}
/* --------------------------------------------------------------
// GRID OVERRIDES
-------------------------------------------------------------- */
/*.row { max-width: 767px; } */
[class*="small-block-grid-"] > li {padding: 0 10px 20px;}
/* Micro Clearfix - http://nicolasgallagher.com/micro-clearfix-hack/
For best results, use your favorite clearfix here.
-------------------------------------------------------------- */
.cf:before, .cf:after { content:""; display:table; }
.cf:after { clear:both; }
.cf { zoom:1; } /* For IE 6/7 (trigger hasLayout) */
/* --------------------------------------------------------------
// GENERAL
-------------------------------------------------------------- */
/* Fonts
-------------------------------------------------------------- */
/*@font-face {
font-family: 'bodoni_beregular';
src: url('../fonts/bodoni_reg/bodoni_be_regular-webfont.eot');
src: url('../fonts/bodoni_reg/bodoni_be_regular-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/bodoni_reg/bodoni_be_regular-webfont.woff') format('woff'),
url('../fonts/bodoni_reg/bodoni_be_regular-webfont.ttf') format('truetype'),
url('../fonts/bodoni_reg/bodoni_be_regular-webfont.svg#bodoni_beregular') format('svg');
font-weight: normal;
font-style: normal;
}*/
@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,400,300,600);
/* Layout
-------------------------------------------------------------- */
html,body{font-size:100%;}
body {
background: #111;
margin: 0;
min-height:100%;
height: 100%;
position:relative;margin:0;padding:0;
}
/* Typography
-------------------------------------------------------------- */
body {
font-family: Roboto, 'Open Sans',"Helvetica Neue", Helvetica, Helvetica, Arial, sans-serif;
font-weight:300;
font-style:normal;
line-height:1;
color: #fff;
-webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6 {font-weight: inherit; font-size: inherit;padding-bottom: 0;}
h1 {}
h3 {
margin:0;
padding: 0;
}
p {padding: 0; font-size: 0.95em; line-height: 1.3em; margin-bottom: 15px; }
.caption {font-size: 0.7em;line-height: 1.28571428571429em}
.heading {
margin: 0;
}
.sub-heading {
margin-bottom: 0em;
}
a {
color: #fff;
text-decoration: none;
}
a:focus{outline:none;}
a:focus,
a:hover {
color: #ddd;
opacity: 0.7;
-webkit-transition:opacity 0.2s;
-moz-transition:opacity 0.2s;
-ms-transition:opacity 0.2s;
-o-transition:opacity 0.2s;
transition:opacity 0.2s;
}
.underline {
border-bottom: 1px #B2B2B2 solid;
}
strong, b {
font-weight: 500;
}
blockquote {
font-weight: 100;
font-style: italic;
text-align: center;
line-height: 26px;
}
blockquote p {margin-bottom: 10px}
blockquote footer {
font-weight: 500;
font-style: normal;
}
/* Elements
-------------------------------------------------------------- */
figure{background:#f8f8f8;margin:0;}
figcaption{padding:.5em 1em 1em;}
code{background:#efefef;padding:.5em;}
.left{float:left!important;}
.right{float:right!important;}
.text-left{text-align:left!important;}
.text-right{text-align:right!important;}
.text-center{text-align:center!important;}
.text-justify{text-align:justify!important;}
.hide{display:none;}
.antialiased{-webkit-font-smoothing:antialiased;}
textarea{height:auto;min-height:50px;}
select{width:100%;}
/* Forms
-------------------------------------------------------------- */
form h2 { font-family: SackersGothicLight; color: #fff; font-size: 0.75em; margin-bottom: 10px; text-transform: lowercase; }
form input[type="text"], form input[type="password"] {
background-color: #e5e5e5;
border: none;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
color: #5a5656;
font-size: 14px;
height: 30px;
outline: none;
padding: 0px 10px;
margin-bottom: 10px;
width: 100%;
box-sizing: border-box;
-webkit-appearance:none;
}
form input[type="submit"] {
background-color: #DD5F24;
border: none;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
color: #f4f4f4;
height: 30px;
text-transform: uppercase;
width: 100%;
-webkit-appearance:none;
}
form a {
color: #5a5656;
font-size: 10px;
}
form a:hover { text-decoration: underline; }
/* --------------------------------------------------------------
// LAYOUTS
-------------------------------------------------------------- */
/* HEADER
-------------------------------------------------------------- */
/* MAIN NAVIGATION
-------------------------------------------------------------- */
/* FOOTER
-------------------------------------------------------------- */
/* HOME
-------------------------------------------------------------- */
/* MEDIA QUERIES
-------------------------------------------------------------- */
@media screen and (min-width: 480px) {
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment