/*********************************************************************************************

Project : rwdgrid - responsive grid system for your next project
URI: http://rwdgrid.com/
Version: 1.0
Author: Vineeth G S 
Author URI: http://www.gsvineeth.com
Github URI: https://github.com/gsvineeth/rwdgrid/

**********************************************************************************************

1.  Normalize.css            
2.  Grid 1200px 
3.  Grid 960px 
4.  Grid 720px
5.  Grid lt 720px/ Mobile 
6.  Responsive Image

 
**********************************************************************************************/


/********************************************************************************************* 
1. normalize.css v2.0.1 | MIT License | git.io/normalize
*********************************************************************************************/   

/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */ 
 *{

    margin: 0;

    padding: 0;

    outline: none;

    font-weight: inherit;

    font-style: inherit;
    
}

/**
 * Correct `block` display not defined in IE 8/9.
 */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section,
summary {
    display: block;
}

/**
 * Correct `inline-block` display not defined in IE 8/9.
 */

audio,
canvas,
video {
    display: inline-block;
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */

audio:not([controls]) {
    display: none;
    height: 0;
}

/**
 * Address styling not present in IE 8/9.
 */

[hidden] {
    display: none;
}

/* ==========================================================================
   Base
   ========================================================================== */

/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */

html {
    font-family: "Apercu","Apercu Light", Calibri, sans-serif;  /* 1 */
    -webkit-text-size-adjust: 100%; /* 2 */
    -ms-text-size-adjust: 100%; /* 2 */
    margin: 0; padding: 0;
}

/**
 * Remove default margin.
 */

body {
    margin: 0;
    margin: 0; padding: 0;
}


/********************************************************************************************* 

2.  Grid 1200px

*********************************************************************************************/

.container-full {
	width: 100%;
}

.container-16, .container-12 {
	position: relative;
	margin:0 auto;
	width: 1200px;
	clear:both;
}
.grid-1, .grid-2, .grid-3, .grid-4, .grid-5, .grid-6, .grid-7, .grid-8, .grid-9, .grid-10, .grid-11, .grid-12, .grid-13, .grid-14, .grid-15, .grid-16 {

	display:inline;
	float: left;
	margin-left: 10px;
	margin-right: 10px;
}
.alpha {
	margin-left: 0;
}
.omega {
	margin-right: 0;
	float: right;
}
.beta {
	margin-left: 0;
	margin-right: 0;
}
.container-16 .grid-1 {
	width:55px;
}
.container-16 .grid-2 {
	width:130px;
}
.container-16 .grid-3 {
	width:205px;
}
.container-16 .grid-4 {
	width:280px;
}
.container-16 .grid-5 {
	width:355px;
}
.container-16 .grid-6 {
	width:430px;
}
.container-16 .grid-7 {
	width:505px;
}
.container-16 .grid-8 {
	width:580px;
}
.container-16 .grid-9 {
	width:655px;
}
.container-16 .grid-10 {
	width:730px;
}
.container-16 .grid-11 {
	width:805px;
}
.container-16 .grid-12 {
	width:880px;
}
.container-16 .grid-13 {
	width:955px;
}
.container-16 .grid-14 {
	width:1030px;
}
.container-16 .grid-15 {
	width:1105px;
}
.container-16 .grid-16 {
	width:1180px;
}
.container-12 .grid-1 {
	width:80px;
}
.container-12 .grid-2 {
	width:180px;
}
.container-12 .grid-3 {
	width:280px;
}
.container-12 .grid-4 {
	width:380px;
}
.container-12 .grid-5 {
	width:480px;
}
.container-12 .grid-6 {
	width:580px;
}
.container-12 .grid-7 {
	width:680px;
}
.container-12 .grid-8 {
	width:780px;
}
.container-12 .grid-9 {
	width:880px;
}
.container-12 .grid-10 {
	width:980px;
}
.container-12 .grid-11 {
	width:1080px;
}
.container-12 .grid-12 {
	width:1180px;
}

/********************************************************************************************* 

3.  Grid 960px (mediaqueries)

*********************************************************************************************/

@media only screen and (min-width: 960px) and (max-width: 1199px) {
.container-16, .container-12 {
	width: 960px;
}
.container-16 .grid-1 {
	width:40px;
}
.container-16 .grid-2 {
	width:100px;
}
.container-16 .grid-3 {
	width:160px;
}
.container-16 .grid-4 {
	width:220px;
}
.container-16 .grid-5 {
	width:280px;
}
.container-16 .grid-6 {
	width:340px;
}
.container-16 .grid-7 {
	width:400px;
}
.container-16 .grid-8 {
	width:460px;
}
.container-16 .grid-9 {
	width:520px;
}
.container-16 .grid-10 {
	width:580px;
}
.container-16 .grid-11 {
	width:640px;
}
.container-16 .grid-12 {
	width:700px;
}
.container-16 .grid-13 {
	width:760px;
}
.container-16 .grid-14 {
	width:820px;
}
.container-16 .grid-15 {
	width:880px;
}
.container-16 .grid-16 {
	width:940px;
}
.container-12 .grid-1 {
	width:60px;
}
.container-12 .grid-2 {
	width:140px;
}
.container-12 .grid-3 {
	width:220px;
}
.container-12 .grid-4 {
	width:300px;
}
.container-12 .grid-5 {
	width:380px;
}
.container-12 .grid-6 {
	width:460px;
}
.container-12 .grid-7 {
	width:540px;
}
.container-12 .grid-8 {
	width:620px;
}
.container-12 .grid-9 {
	width:700px;
}
.container-12 .grid-10 {
	width:780px;
}
.container-12 .grid-11 {
	width:860px;
}
.container-12 .grid-12 {
	width:940px;
}
}
	
/********************************************************************************************* 

4.  Grid 720px (mediaqueries)

*********************************************************************************************/

@media only screen and (min-width: 720px) and (max-width: 959px) {
.container-16, .container-12 {
	width: 720px;
}
.container-16 .grid-1 {
	width:25px;
}
.container-16 .grid-2 {
	width:70px;
}
.container-16 .grid-3 {
	width:115px;
}
.container-16 .grid-4 {
	width:160px;
}
.container-16 .grid-5 {
	width:205px;
}
.container-16 .grid-6 {
	width:250px;
}
.container-16 .grid-7 {
	width:295px;
}
.container-16 .grid-8 {
	width:340px;
}
.container-16 .grid-9 {
	width:385px;
}
.container-16 .grid-10 {
	width:430px;
}
.container-16 .grid-11 {
	width:475px;
}
.container-16 .grid-12 {
	width:520px;
}
.container-16 .grid-13 {
	width:565px;
}
.container-16 .grid-14 {
	width:610px;
}
.container-16 .grid-15 {
	width:655px;
}
.container-16 .grid-16 {
	width:700px;
}
.container-12 .grid-1 {
	width:40px;
}
.container-12 .grid-2 {
	width:100px;
}
.container-12 .grid-3 {
	width:160px;
}
.container-12 .grid-4 {
	width:220px;
}
.container-12 .grid-5 {
	width:280px;
}
.container-12 .grid-6 {
	width:340px;
}
.container-12 .grid-7 {
	width:400px;
}
.container-12 .grid-8 {
	width:460px;
}
.container-12 .grid-9 {
	width:520px;
}
.container-12 .grid-10 {
	width:580px;
}
.container-12 .grid-11 {
	width:640px;
}
.container-12 .grid-12 {
	width:700px;
}
}
	

/********************************************************************************************* 

5.  Grid lt 720px / Mobile (mediaqueries)

*********************************************************************************************/
	
@media only screen and (max-width: 719px) {
.container-12, .container-16 {
	width: 90%;

}
.grid-1, .grid-2, .grid-3, .grid-4, .grid-5, .grid-6, .grid-7, .grid-8, .grid-9, .grid-10, .grid-11, .grid-12, .grid-13, .grid-14, .grid-15, .grid-16 {
	width:100%;
	margin-left: 0px;
	margin-right: 0px;
}
.alpha {
	margin-left: 0;
}
.omega {
	margin-right: 0;
}
.beta {
	margin-left: 0;
	margin-right: 0;
}
.container-16 .grid-1, .container-16 .grid-2, .container-16 .grid-3, .container-16 .grid-4, .container-16 .grid-5, .container-16 .grid-6, .container-16 .grid-7, .container-16 .grid-8, .container-16 .grid-9, .container-16 .grid-10, .container-16 .grid-11, .container-16 .grid-12, .container-16 .grid-13, .container-16 .grid-14, .container-16 .grid-15, .container-16 .grid-16, .container-12 .grid-1, .container-12 .grid-2, .container-12 .grid-3, .container-12 .grid-4, .container-12 .grid-5, .container-12 .grid-6, .container-12 .grid-7, .container-12 .grid-8, .container-12 .grid-9, .container-12 .grid-10, .container-12 .grid-11, .container-12 .grid-12 {
	width:100%;
}
}


/********************************************************************************************* 

6.  Responsive Image

*********************************************************************************************/


img.scale, img.responsive {
	max-width: 100%;
	height: auto;
}
