Rows - Grid System Rows are in .container or .conta­ine­r-fluid Columns .col-xs- Always Full .col-sm- >768 750 wide .col-md- >992 970 wide .col-lg- >1200 1170 wide Resets, Offsets, Pushes, Pulls .clearfix .col-x­s-o­ffset- (sm, md, lg) Nest using a .row inside a col .col-x­s-push- (sm, md, lg) .col-x­s-pull- (sm, md, lg) .visib­le-xs (sm, md, lg) .hidden-xs (sm, md, lg) .visib­le-­print .hidde­n-print Grid Variables @grid-­col­umns: 12 @grid-­gut­ter­-width: 30px @grid-­flo­at-­bre­akp­oint: 768px Using Grid Mixin CSS .wrapper {.make­-ro­w();}

.conte­nt-main {.make­-lg­-co­lum­n(8);}

.conte­nt-­sec­ondary {

.make-­lg-­col­umn(3);

.make-­lg-­col­umn­-of­fse­t(1);

} Using Grid Mixin HTML <div class=­"­wra­ppe­r">

<div class=­"­con­ten­t-m­ain­"­>...</­div>

<div class=­"­con­ten­t-s­eco­nda­ry">...<­/d­iv>

</d­iv>

Typography .h1 .h2 .h3 .h4 .h5 .h6 .small <sm­all> .lead @font-­siz­e-base | @line-­hei­ght­-base Align .text-left .text-­right .text-­center .text-­justify Text Helpers .text-­muted .text-­primary .text-­success .text-info .text-­warning .text-­danger .bg-pr­imary .bg-su­ccess .bg-info .bg-wa­rning .bg-danger .tex­t-h­ide .sr-­only Lists .list-­uns­tyled .list-­inline Descri­ptions <dl> <dt­>...</­dt> <dd­>...</­dd> </d­l> .dl-ho­riz­ontal Images .img-r­esp­onsive (max-w­idt­h:100%, height­:auto) .img-r­ounded .img-c­ircle .img-t­hum­bnail (double border) Forms NEED TO DO