/* html5reset.css - 01/11/2011 */ html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video {margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;} body {line-height:1;} article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block;} nav ul {list-style:none;} blockquote,q {quotes:none;} blockquote:before,blockquote:after,q:before,q:after {content:'';content:none;} a {margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent;} /* change colours to suit your needs */ ins {background-color:#ff9;color:#000;text-decoration:none;} /* change colours to suit your needs */ mark {background-color:#ff9;color:#000;font-style:italic;font-weight:bold;} del {text-decoration:line-through;} abbr[title],dfn[title] {border-bottom:1px dotted;cursor:help;} table {border-collapse:collapse;border-spacing:0;} /* change border colour to suit your needs */ hr {display:block;height:1px;border:0;border-top:1px solid #cccccc;margin:1em 0;padding:0;} input,select {vertical-align:middle;} /* RESPONSIVE GRID SYSTEM === */ /* BASIC PAGE SETUP === */ body {margin:0 auto;padding:0;font:100%/1.4 'lucida sans unicode','lucida grande','Trebuchet MS',verdana,arial,helvetica,helve,sans-serif;color:#000;text-align:center;background:#fff url(/css/images/bodyback.png) left top;} button,input,select,textarea {font-family:MuseoSlab100,lucida sans unicode,'lucida grande','Trebuchet MS',verdana,arial,helvetica,helve,sans-serif;color:#333;} /* HEADINGS === */ h1,h2,h3,h4,h5,h6 {font-family:MuseoSlab300,'lucida sans unicode','lucida grande','Trebuchet MS',verdana,arial,helvetica,helve,sans-serif;font-weight:normal;margin-top:0px;letter-spacing:-1px;} h1 {font-family:LeagueGothicRegular,'lucida sans unicode','lucida grande','Trebuchet MS',verdana,arial,helvetica,helve,sans-serif;color:#000;margin-bottom:0.2em;font-size:6em;/* 96 / 16 */ line-height:1.4;} h2 {color:#222;margin-bottom:.5em;margin-top:.5em;font-size:2.75em;/* 40 / 16 */ line-height:1.2;} h3 {color:#333;margin-bottom:0.3em;letter-spacing:-1px;font-size:1.75em;/* 28 / 16 */ line-height:1.3;} h4 {color:#444;margin-bottom:0.5em;font-size:1.5em;/* 24 / 16 */ line-height:1.25;} footer h4 {color:#ccc;} h5 {color:#555;margin-bottom:1.25em;font-size:1em;/* 20 / 16 */} h6 {color:#666;font-size:1em;/* 16 / 16 */} /* TYPOGRAPHY === */ p,ol,ul,dl,address {margin-bottom:1.5em;font-size:1em;/* 16 / 16 = 1 */} p {hyphens:auto;} p.introtext {font-family:MuseoSlab100,'lucida sans unicode','lucida grande','Trebuchet MS',verdana,arial,helvetica,helve,sans-serif;font-size:2.5em;/* 40 / 16 */ color:#333;line-height:1.4em;letter-spacing:-1px;margin-bottom:0.5em;} p.handwritten {font-family:HandSean,'lucida sans unicode','lucida grande','Trebuchet MS',verdana,arial,helvetica,helve,sans-serif;font-size:1.375em;/* 24 / 16 */ line-height:1.8em;margin-bottom:0.3em;color:#666;} p.center {text-align:center;} .and {font-family:GoudyBookletter1911Regular,Georgia,Times New Roman,sans-serif;font-size:1.5em;/* 24 / 16 */} .heart {font-family:Pictos;font-size:1.5em;/* 24 / 16 */} ul,ol {margin:0 0 1.5em 0;padding:0 0 0 24px;} li ul,li ol {margin:0;font-size:1em;/* 16 / 16 = 1 */} dl,dd {margin-bottom:1.5em;} dt {font-weight:normal;} b,strong {font-weight:bold;} hr {display:block;margin:1em 0;padding:0;height:1px;border:0;border-top:1px solid #ccc;} small {font-size:1em;/* 16 / 16 = 1 */} sub,sup {font-size:75%;line-height:0;position:relative;vertical-align:baseline;} sup {top:-.5em;} sub {bottom:-.25em;} .subtext {color:#666;} /* LINKS === */ a {color:#cc1122;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition:all 0.3s ease;transition:all 0.3s ease;text-decoration:none;} a:visited {color:#ee3344;} a:focus {outline:thin dotted;color:rgb(0,0,0);} a:hover,a:active {outline:0;color:#dd2233;} footer a {color:#ffffff;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition:all 0.3s ease;transition:all 0.3s ease;} footer a:visited {color:#fff;} footer a:focus {outline:thin dotted;color:rgb(0,0,0);} footer a:hover,footer a:active {outline:0;color:#fff;} /* IMAGES === */ img {border:0;max-width:100%;} img.floatleft {float:left;margin:0 10px 0 0;} img.floatright {float:right;margin:0 0 0 10px;} /* TABLES === */ table {border-collapse:collapse;border-spacing:0;margin-bottom:1.4em;width:100%;} th,td,caption {padding:.25em 10px .25em 5px;} tfoot {font-style:italic;} caption {background-color:transparent;} /* FORMS === */ form {margin:0;} fieldset {margin-bottom:1.5em;padding:0;border-width:0;} legend {*margin-left:-7px;padding:0;border-width:0;} label{font-weight:normal;cursor:pointer;display:block;margin:10px 0 0 0;position:relative;top:0;left:0;} label.inline{display:inline;margin:0;} label span{color:#666;font-size:0.9em;} label span.right{position:absolute;bottom:0;right:1em;text-align:right;} label.disabled{color:#ccc;} button,search,input,select,textarea {font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle;} button,input {line-height:normal;*overflow:visible;} button,input[type="button"],input[type="reset"],input[type="submit"] {padding:0.5em 1em;margin:0 0 1em 0;cursor:pointer;text-shadow:0 1px 0 #fff;} input[type="checkbox"],input[type="radio"] {box-sizing:border-box;} input[type="search"] {box-sizing:content-box;} button::-moz-focus-inner,input::-moz-focus-inner {padding:0;border:0;} input{display:block;width:97%;margin:0 0 20px 0;border:1px solid #ccc;font-size:1em;padding:5px;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;background:#fff;-moz-box-shadow:inset 0px 0px 6px #ccc;-webkit-box-shadow:inset 0px 1px 6px #ccc;box-shadow:inset 0px 1px 6px #ccc;} input::-webkit-input-placeholder,input:-moz-placeholder,.placeholder{color:#bbb;} input::-moz-focus-inner {border:0;} input[disabled="disabled"],input.disabled{color:#999;background:#f5f5f5;-moz-box-shadow:inset 0px 0px 2px #ddd;-webkit-box-shadow:inset 0px 1px 2px #ddd;box-shadow:inset 0px 1px 2px #ddd;} textarea{width:97%;height:200px;margin:0 0 20px 0;border:1px solid #ccc;padding:5px;font-family:inherit;font-size:0.9em;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;-moz-box-shadow:inset 0px 0px 6px #ccc;-webkit-box-shadow:inset 0px 1px 6px #ccc;box-shadow:inset 0px 1px 6px #ccc;overflow:auto;vertical-align:top;} /* Colors for form validity */ input:valid,textarea:valid {/* Styles */} input:invalid,textarea:invalid {-webkit-box-shadow:0 0 2px #f00;-moz-box-shadow:0 0 2px #f00;box-shadow:0 0 2px #f00;} .no-boxshadow input:invalid,.no-boxshadow textarea:invalid {background-color:#ccc;} /* MAIN LAYOUT	=== */ #skiptomain {display:none;} #wrapper {width:100%;position:relative;text-align:left;} #headcontainer {width:100%;background:url(/css/images/headerback.png) no-repeat center top;} header {clear:both;width:80%;/* 1000px / 1250px */ font-size:0.8125em;/* 13 / 16 */ max-width:92.3em;/* 1200px / 13 */ margin:0 auto;padding:130px 0px 10px 0px;position:relative;color:#000;text-align:center;} #maincontentcontainer {width:100%;} .standardcontainer {} .darkcontainer {background:rgba(102,102,102,0.05);} .lightcontainer {background:rgba(255,255,255,0.25);} #maincontent{clear:both;width:80%;/* 1000px / 1250px */ font-size:0.8125em;/* 13 / 16 */ max-width:92.3em;/* 1200px / 13 */ margin:0 auto;padding:1em 0px;color:#333;line-height:1.5em;position:relative;} .maincontent{clear:both;width:80%;/* 1000px / 1250px */ font-size:0.8125em;/* 13 / 16 */ max-width:92.3em;/* 1200px / 13 */ margin:0 auto;padding:1em 0px;color:#333;line-height:1.5em;position:relative;} #footercontainer {width:100%;border-top:1px solid #000;background:#222 url(/css/images/footerback.png) left top;} footer {clear:both;width:80%;/* 1000px / 1250px */ font-size:0.8125em;/* 13 / 16 */ max-width:92.3em;/* 1200px / 13 */ margin:0 auto;padding:20px 0px 10px 0px;color:#999;} footer strong {font-size:1.077em;/* 14 / 13 */ color:#aaa;} footer a:link,footer a:visited {color:#999;text-decoration:underline;} footer a:hover {color:#fff;text-decoration:underline;} ul.pagefooterlist,ul.pagefooterlistimages {display:block;float:left;margin:0px;padding:0px;list-style:none;} ul.pagefooterlist li,ul.pagefooterlistimages li {clear:left;margin:0px;padding:0px 0px 3px 0px;display:block;line-height:1.5em;font-weight:normal;background:none;} ul.pagefooterlistimages li {height:34px;} ul.pagefooterlistimages li img {padding:5px 5px 5px 0px;vertical-align:middle;opacity:0.75;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";filter:alpha( opacity = 75);-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition:all 0.3s ease;transition:all 0.3s ease;} ul.pagefooterlistimages li a {text-decoration:none;} ul.pagefooterlistimages li a:hover img {opacity:1.0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter:alpha( opacity = 100);} #smallprint {margin-top:20px;line-height:1.4em;text-align:center;color:#999;font-size:0.923em;/* 12 / 13 */} #smallprint p{vertical-align:middle;} #smallprint .twitter-follow-button{margin-left:1em;vertical-align:middle;} #smallprint img {margin:0px 10px 15px 0px;vertical-align:middle;opacity:0.5;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";filter:alpha( opacity = 50);-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition:all 0.3s ease;transition:all 0.3s ease;} #smallprint a:hover img {opacity:1.0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter:alpha( opacity = 100);} #smallprint a:link,#smallprint a:visited {color:#999;text-decoration:none;} #smallprint a:hover {color:#999;text-decoration:underline;} /* SECTIONS === */ .section {clear:both;padding:0px;margin:0px;} /* CODE === */ pre.code {padding:0;margin:0;font-family:monospace;white-space:pre-wrap;font-size:1.1em;} strong.code {font-weight:normal;font-family:monospace;font-size:1.2em;} /* EXAMPLE === */ #example .col {background:#ccc;background:rgba(204,204,204,0.85);} /* NOTES === */ .note {position:relative;padding:1em 1.5em;margin:0 0 1em 0;background:#fff;background:rgba(255,255,255,0.5);overflow:hidden;} .note:before {content:"";position:absolute;top:0;right:0;border-width:0 16px 16px 0;border-style:solid;border-color:transparent transparent #cccccc #cccccc;background:#cccccc;-webkit-box-shadow:0 1px 1px rgba(0,0,0,0.3),-1px 1px 1px rgba(0,0,0,0.2);-moz-box-shadow:0 1px 1px rgba(0,0,0,0.3),-1px 1px 1px rgba(0,0,0,0.2);box-shadow:0 1px 1px rgba(0,0,0,0.3),-1px 1px 1px rgba(0,0,0,0.2);display:block;width:0;/* Firefox 3.0 damage limitation */} .note.rounded {-webkit-border-radius:5px 0 5px 5px;-moz-border-radius:5px 0 5px 5px;border-radius:5px 0 5px 5px;} .note.rounded:before {border-width:8px;border-color:#ff #ff transparent transparent;background:url(/css/images/bodyback.png);-webkit-border-bottom-left-radius:5px;-moz-border-radius:0 0 0 5px;border-radius:0 0 0 5px;} /* SCREENS === */ .siteimage {max-width:90%;padding:5%;margin:0 0 1em 0;background:transparent url(/css/images/stripe-bg.png);-webkit-transition:background 0.3s ease;-moz-transition:background 0.3s ease;-o-transition:background 0.3s ease;transition:background 0.3s ease;} .siteimage:hover {background:#bbb url(/css/images/stripe-bg.png);position:relative;top:-2px;} /* COLUMNS === */ .twocolumns{-moz-column-count:2;-moz-column-gap:2em;-webkit-column-count:2;-webkit-column-gap:2em;column-count:2;column-gap:2em;} /* BUTTONS === */ .button {display:inline-block;outline:none;cursor:pointer;text-align:center;text-decoration:none;color:#fff;padding:.5em 1em;margin:1px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;-webkit-box-shadow:0 1px 2px rgba(0,0,0,.2);-moz-box-shadow:0 1px 2px rgba(0,0,0,.2);box-shadow:0 1px 2px rgba(0,0,0,.2);background:#cc1122 url(/css/images/glass.png) repeat-x 0 50%;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition:all 0.3s ease;transition:all 0.3s ease;font-family:LeagueGothicRegular,'lucida sans unicode','lucida grande','Trebuchet MS',verdana,arial,helvetica,helve,sans-serif;font-size:1.5em;/* 24 / 16 */ } .button:hover {background:#dd2233 url(/css/images/glass.png) repeat-x 0 50%;color:#fff;text-decoration:none;} .button:active {background:#dd2233 url(/css/images/glass.png) repeat-x 0 50%;color:#fff;position:relative;top:1px;} .button:visited {color:#fff;} /* GLOBAL OBJECTS === */ .breaker {clear:both;} .group:before,.group:after {content:"";display:table;} .group:after {clear:both;} .group {zoom:1;/* For IE 6/7 (trigger hasLayout) */} .floatleft {float:left;} .floatright {float:right;} /* VENDOR-SPECIFIC === */ html {-webkit-overflow-scrolling:touch;-webkit-tap-highlight-color:rgb(52,158,219);-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;} .clearfix {zoom:1;}::-webkit-selection {background:rgb(23,119,175);color:rgb(250,250,250);text-shadow:none;}::-moz-selection {background:rgb(23,119,175);color:rgb(250,250,250);text-shadow:none;}::selection {background:rgb(23,119,175);color:rgb(250,250,250);text-shadow:none;} button,input[type="button"],input[type="reset"],input[type="submit"] {-webkit-appearance:button;}::-webkit-input-placeholder {font-size:.875em;line-height:1.4;} input:-moz-placeholder {font-size:.875em;line-height:1.4;} .ie7 img,.iem7 img {-ms-interpolation-mode:bicubic;} input[type="checkbox"],input[type="radio"] {box-sizing:border-box;} input[type="search"] {-webkit-box-sizing:content-box;-moz-box-sizing:content-box;} button::-moz-focus-inner,input::-moz-focus-inner {padding:0;border:0;} p {/* http://www.w3.org/TR/css3-text/#hyphenation */ -webkit-hyphens:auto;-webkit-hyphenate-character:"\2010";-webkit-hyphenate-limit-after:1;-webkit-hyphenate-limit-before:3;-moz-hyphens:auto;} /* SECTIONS === */ .section {clear:both;padding:0px;margin:0px;} /* GROUPING === */ .group:before,.group:after {content:"";display:table;} .group:after {clear:both;} .group {zoom:1;/* For IE 6/7 (trigger hasLayout) */} /* GRID COLUMN SETUP === */ .col {display:block;float:left;margin:1% 0 1% 1.6%;} .col:first-child {margin-left:0;} /* all browsers except IE6 and lower */ /* REMOVE MARGINS AS ALL GO FULL WIDTH AT 480 PIXELS */ @media only screen and (max-width:480px) {.col {margin:1% 0 1% 0%;}} /* GRID OF TWO === */ .span_2_of_2 {width:100%;} .span_1_of_2 {width:49.2%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width:480px) {.span_2_of_2 {width:100%;} .span_1_of_2 {width:100%;}} /* GRID OF THREE === */ .span_3_of_3 {width:100%;} .span_2_of_3 {width:66.1%;} .span_1_of_3 {width:32.2%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width:480px) {.span_3_of_3 {width:100%;} .span_2_of_3 {width:100%;} .span_1_of_3 {width:100%;}} /* GRID OF FOUR === */ .span_4_of_4 {width:100%;} .span_3_of_4 {width:74.6%;} .span_2_of_4 {width:49.2%;} .span_1_of_4 {width:23.8%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width:480px) {.span_4_of_4 {width:100%;} .span_3_of_4 {width:100%;} .span_2_of_4 {width:100%;} .span_1_of_4 {width:100%;}} /* GRID OF FIVE === */ .span_5_of_5 {width:100%;} .span_4_of_5 {width:79.68%;} .span_3_of_5 {width:59.36%;} .span_2_of_5 {width:39.04%;} .span_1_of_5 {width:18.72%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width:480px) {.span_5_of_5 {width:100%;} .span_4_of_5 {width:100%;} .span_3_of_5 {width:100%;} .span_2_of_5 {width:100%;} .span_1_of_5 {width:100%;}} /* GRID OF SIX === */ .span_6_of_6 {width:100%;} .span_5_of_6 {width:83.06%;} .span_4_of_6 {width:66.13%;} .span_3_of_6 {width:49.2%;} .span_2_of_6 {width:32.26%;} .span_1_of_6 {width:15.33%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width:480px) {.span_6_of_6 {width:100%;} .span_5_of_6 {width:100%;} .span_4_of_6 {width:100%;} .span_3_of_6 {width:100%;} .span_2_of_6 {width:100%;} .span_1_of_6 {width:100%;}} /* GRID OF SEVEN === */ .span_7_of_7 {width:100%;} .span_6_of_7 {width:85.48%;} .span_5_of_7 {width:70.97%;} .span_4_of_7 {width:56.45%;} .span_3_of_7 {width:41.92%;} .span_2_of_7 {width:27.42%;} .span_1_of_7 {width:12.91%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width:480px) {.span_7_of_7 {width:100%;} .span_6_of_7 {width:100%;} .span_5_of_7 {width:100%;} .span_4_of_7 {width:100%;} .span_3_of_7 {width:100%;} .span_2_of_7 {width:100%;} .span_1_of_7 {width:100%;}} /* GRID OF EIGHT === */ .span_8_of_8 {width:100%;} .span_7_of_8 {width:87.3%;} .span_6_of_8 {width:74.6%;} .span_5_of_8 {width:61.9%;} .span_4_of_8 {width:49.2%;} .span_3_of_8 {width:36.5%;} .span_2_of_8 {width:23.8%;} .span_1_of_8 {width:11.1%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width:480px) {.span_8_of_8 {width:100%;} .span_7_of_8 {width:100%;} .span_6_of_8 {width:100%;} .span_5_of_8 {width:100%;} .span_4_of_8 {width:100%;} .span_3_of_8 {width:100%;} .span_2_of_8 {width:100%;} .span_1_of_8 {width:100%;}} /* GRID OF NINE === */ .span_9_of_9 {width:100%;} .span_8_of_9 {width:88.71%;} .span_7_of_9 {width:77.42%;} .span_6_of_9 {width:66.13%;} .span_5_of_9 {width:54.84%;} .span_4_of_9 {width:43.55%;} .span_3_of_9 {width:32.26%;} .span_2_of_9 {width:20.97%;} .span_1_of_9 {width:9.68%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width:480px) {.span_9_of_9 {width:100%;} .span_8_of_9 {width:100%;} .span_7_of_9 {width:100%;} .span_6_of_9 {width:100%;} .span_5_of_9 {width:100%;} .span_4_of_9 {width:100%;} .span_3_of_9 {width:100%;} .span_2_of_9 {width:100%;} .span_1_of_9 {width:100%;}} /* GRID OF TEN === */ .span_10_of_10 {width:100%;} .span_9_of_10 {width:89.84%;} .span_8_of_10 {width:79.68%;} .span_7_of_10 {width:69.52%;} .span_6_of_10 {width:59.36%;} .span_5_of_10 {width:49.2%;} .span_4_of_10 {width:39.04%;} .span_3_of_10 {width:28.88%;} .span_2_of_10 {width:18.72%;} .span_1_of_10 {width:8.56%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width:480px) {.span_10_of_10 {width:100%;} .span_9_of_10 {width:100%;} .span_8_of_10 {width:100%;} .span_7_of_10 {width:100%;} .span_6_of_10 {width:100%;} .span_5_of_10 {width:100%;} .span_4_of_10 {width:100%;} .span_3_of_10 {width:100%;} .span_2_of_10 {width:100%;} .span_1_of_10 {width:100%;}} /* GRID OF ELEVEN === */ .span_11_of_11 {width:100%;} .span_10_of_11 {width:90.7%;} .span_9_of_11 {width:81.47%;} .span_8_of_11 {width:72.24%;} .span_7_of_11 {width:63.01%;} .span_6_of_11 {width:53.78%;} .span_5_of_11 {width:44.55%;} .span_4_of_11 {width:35.32%;} .span_3_of_11 {width:26.09%;} .span_2_of_11 {width:16.86%;} .span_1_of_11 {width:7.63%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width:480px) {.span_11_of_11 {width:100%;} .span_10_of_11 {width:100%;} .span_9_of_11 {width:100%;} .span_8_of_11 {width:100%;} .span_7_of_11 {width:100%;} .span_6_of_11 {width:100%;} .span_5_of_11 {width:100%;} .span_4_of_11 {width:100%;} .span_3_of_11 {width:100%;} .span_2_of_11 {width:100%;} .span_1_of_11 {width:100%;}} /* GRID OF TWELVE === */ .span_12_of_12 {width:100%;} .span_11_of_12 {width:91.46%;} .span_10_of_12 {width:83%;} .span_9_of_12 {width:74.54%;} .span_8_of_12 {width:66.08%;} .span_7_of_12 {width:57.62%;} .span_6_of_12 {width:49.16%;} .span_5_of_12 {width:40.7%;} .span_4_of_12 {width:32.24%;} .span_3_of_12 {width:23.78%;} .span_2_of_12 {width:15.32%;} .span_1_of_12 {width:6.86%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width:480px) {.span_12_of_12 {width:100%;} .span_11_of_12 {width:100%;} .span_10_of_12 {width:100%;} .span_9_of_12 {width:100%;} .span_8_of_12 {width:100%;} .span_7_of_12 {width:100%;} .span_6_of_12 {width:100%;} .span_5_of_12 {width:100%;} .span_4_of_12 {width:100%;} .span_3_of_12 {width:100%;} .span_2_of_12 {width:100%;} .span_1_of_12 {width:100%;}}