/*
* LG Skeleton
* Copyright 2013, LGLab
* 19/01/2013
*/


/* #Base 960 Grid
================================================== */


    /* Containers */
	
    .wrapper                                    { float: left; width: 100%; overflow: hidden;}
	/*
	.ie8 .wrapper                               { overflow: visible; min-width: 1000px;}
	*/
    .container                                  { position: relative; width: 1000px; margin: 0 auto; padding: 0;}
	.container.tight                            { width: 960px;}
	
	.one,
	.onehalf,
	.onethird,
	.twothird,
	.onefourth,
	.threefourth,
	.onefifth,
	.twofifth,
	.threefifth,
	.fourfifth,
	.onesixth,
	.twosixth,
	.threesixth                                 { position: relative; float: left; display: inline; margin-left: 20px;}
	
	.one                                        { width: 960px;}
	.onehalf                                    { width: 470px;}
	.onethird                                   { width: 306px;}
	.twothird                                   { width: 634px;}
	.onefourth                                  { width: 225px;}
	.threefourth                                { width: 715px;}
	.onefifth                                   { width: 176px;}
	.twofifth                                   { width: 372px;}
	.threefifth                                 { width: 568px;}
	.fourfifth                                  { width: 764px;}
	
	.onesixth                                   { width: 143px;}
	.twosixth                                   { width: 307px;}
	.threesixth                                 { width: 470px;}
	
	.onethird.full                              { width: 320px; margin-left:0;}
	.onefourth.full                             { width: 240px; margin-left:0;}
	.onefifth.full                              { width: 192px; margin-left:0;}
	
	.onethird.tight                             { width: 295px;}

   .container.tight .one { margin-left:0;}
	
	/* Rows */
	.norow                                      { margin-bottom: 0px; }
	.row-ten                                    { margin-bottom: 10px; }
    .row-fourteen                               { margin-bottom: 14px; }
    .row                                        { margin-bottom: 20px;}
	.row-thirty                                 { margin-bottom: 30px; }
	.row-thirtyfive                             { margin-bottom: 35px; }
	.row-fourty                                 { margin-bottom: 40px; }
	.row-fifty                                  { margin-bottom: 50px; }
	.row-sixty                                  { margin-bottom: 60px; }
	.row-seventy                                { margin-bottom: 70px; }
	.row-eighty                                 { margin-bottom: 80px; }
	.row-hundred                                { margin-bottom: 100px; }
	.row-twohundred                                { margin-bottom: 200px; }


	/* Tops */
	.top-minusthree                             { margin-top: -3px; }
	.notop                                      { margin-top: 0px; }
	.top-three                                  { margin-top: 3px; }
	.top-ten                                    { margin-top: 10px; }
	.top-fifteen                                { margin-top: 15px; }
	.top-seventeen                              { margin-top: 17px; }
	.top-twenty                                 { margin-top: 20px; }
	.top-thirty                                 { margin-top: 30px; }
	.top-fourty                                 { margin-top: 40px; }
	.top-sixty                                  { margin-top: 60px; }
	.top-eightyfive                             { margin-top: 85px; }
	.top-ninetyfive                             { margin-top: 95px; }
	.top-hundred                                { margin-top: 100px; }
	.top-hundredten                             { margin-top: 110px; }
	.top-hundredfifteen                         { margin-top: 115px; }
	.top-hundredthirty                          { margin-top: 130px; }
	.top-hundredfifty                           { margin-top: 150px; }
	.top-hundredsixty                           { margin-top: 160px; }
	.top-hundredseventy                         { margin-top: 170px; }
	.top-twohundred                             { margin-top: 200px; }
	
	/* Right */
	.right-ten                                  { margin-right: 10px; }
	.right-fifteen                              { margin-right: 15px; }
	.right-twenty                               { margin-right: 20px; }
	
	/* Remove */
	.remove-left                                { margin-left: 0px; }
	.left-twenty                                { margin-left: 20px; }
	

	
	
	/* Images */

	img.scaletofit                             { width: 100%; max-width: 100%; height: auto; display: block;}
	
	
	.font-twenty,
	p.font-twenty                              { font-size: 20px; line-height: 26px;}
	
	.font-twenty li { margin-bottom: 6px;}




/* #Tablet (Portrait)
================================================== */

    /* Note: Design for a width of 768px */

    @media only screen and (min-width: 768px) and (max-width: 999px) {
		
        .container                                  { width: 768px;}
		.container.tight                            { width: 728px;}
        .one                                        { width: 728px;}
		.onehalf                                    { width: 354px;}
		.onethird                                   { width: 228px;}
		.twothird                                   { width: 480px;}
		.onefourth                                  { width: 167px;}
		.threefourth                                { width: 541px;}
		.onefifth                                   { width: 130px;}
		.twofifth                                   { width: 278px;}
		.threefifth                                 { width: 430px;}
		.fourfifth                                  { width: 580px;}
		
		.onethird.full                              { width: 243px;}
	    .onefourth.full                             { width: 182px;}
	    .onefifth.full                              { width: 146px;}
		
		.onethird.tight                             { width: 216px;}
		
		}


/*  #Mobile (Portrait)
================================================== */

    /* Note: Design for a width of 320px */

    @media only screen and (max-width: 767px) {
		
        .container                                 { width: 300px; }
		.one,
		.onehalf,
		.onethird,
		.twothird,
		.onefourth,
		.threefourth,
		.onefifth,
		.twofifth,
		.threefifth,
		.fourfifth                                { margin-left: 15px; margin-right: 15px; width: 270px;}
		
		.container.tight                          { width: 270px;}

        
		
		.top-hundredten, .top-hundredfifteen       { margin-top: 0px; }
		
		.onethird.full,
	    .onefourth.full,
	    .onefifth.full                              { width: 270px;}

.onethird.tight                             { width: 270px; margin-left:0;}
		
		.left-twenty                                { margin-left: 15px; }

    }


/* #Mobile (Landscape)
================================================== */

    /* Note: Design for a width of 480px */

    @media only screen and (min-width: 480px) and (max-width: 767px) {
		
        .container                                 { width: 420px; }
        .one,
		.onehalf,
		.onethird,
		.twothird,
		.onefourth,
		.threefourth,
		.onefifth,
		.twofifth,
		.threefifth,
		.fourfifth,
		.container.tight                          { width: 390px;}
		
		.onethird.full,
	    .onefourth.full,
	    .onefifth.full                              { width: 390px;}

.onethird.tight                             { width: 390px; margin-left:0;}
		
    }


/* #Clearing
================================================== */

    /* Self Clearing Goodness */
    .container:after                               { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

    /* Use clearfix class on parent to clear nested columns,
    or wrap each row of columns in a <div class="row"> */
    .clearfix:before,
    .clearfix:after,
    .row:before,
    .row:after                                     { content: '\0020'; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; }
	
    .row:after,
    .clearfix:after                                { clear: both;}
	
    .row,
    .clearfix                                      { zoom: 1; }


    /* You can also use a <br class="clear" /> to clear columns */
    .clear                                         { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0;}