@import url(http://fonts.googleapis.com/css?family=Open+Sans:300);
@import url('custom.css');
/*Responsive Grid System
------------------------------------------------------------*/
.row {
	clear: both;
	padding: 0px;
	margin: 0px;
}
.row [class*="grid"] {
	display: block;
	float:left;
	margin: 0.6% 0 1% 1.6%;
}
.row [class*="grid"]:first-child { 
	margin-left: 0; 
}
.group:before,
.group:after {
	content:"";
	display:table;
}
.group:after {
	clear:both;
}
@media only screen and (min-width:769px){
	.bodywrap {
		max-width:1024px;    /*------------------------------------- Set width of your site */
		margin:0 auto;
	}
	.grid1 {
	   width: 6.86%;
	}
	.grid2 {
	   width: 15.32%;
	}
	.grid3 {
	   width: 23.8%; 
	}
	.grid4 {
	   width: 32.2%; 
	}
	.grid5 {
	   width: 40.7%;
	}
	.grid6 {
	   width: 49.2%;
	}
	.grid7 {
	   width: 57.62%;
	}
	.grid8{
	   width: 66.1%;
	}
	.grid9{
	   width: 74.54%;
	}
	.grid10{
	   width: 83%;
	}
	.grid11{
	   width: 91.46%;
	}
	.grid12 {
	   width: 100%;
	}

}
@media only screen and (max-width:768px){
	.row [class*="grid"] {
		position:relative; 
		width:100%; 
		padding:0; 
		margin: 1% auto; 
		overflow:auto;
		float: none;
	}
	.row [class*="grid"]:first-child{ 
		margin-left: auto; 
	}
}


/*Responsive Navigation Setup Pure CSS
------------------------------------------------------------*/
nav {
    height: 40px;
    width: auto;
    float: right;
    position: relative;
}
nav ul {
    padding: 0;
    margin: 0;
    width: auto;
    height: 40px;
}
nav li {
    display: inline;
    float: left;
}
nav a {
    display: inline-block;
    text-align: center;
    text-decoration: none;
    line-height: 40px;
    padding: 0 20px;
}
nav li a {
    box-sizing:border-box;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
}
nav li:last-child a {
    border-right: 0;
}
nav a:hover, nav a:active {

}
nav a#pull {
    display: none;
}

/*Styles for screen 768px and lower*/
@media only screen and (max-width : 768px) {
	nav { 
        height: auto;
        width: 100%;
        border-bottom: 0;
        background: none;
        float: none;
        margin: 0;
        padding: 25px 0 0 0;
  	}
  	nav ul {
        display: block;
        height: auto;
  	}
  	nav li {
        width: 100%;
        display: block;
        float: none;
        position: relative;
  	}
  	nav a {
        text-align: left;
        width: 100%;
        text-indent: 25px;
        padding: 0;
  	}
	.m-nav {
        margin-top: -50px !important; 
	}
	nav ul {
        display: none;
        height: auto;
	}
    nav a#pull {
        height: 40px;
        padding: 0;
    }
	nav a#pull {
        display: block;
        width: auto;
        position: relative;
	}
	nav a#pull:after {
        content: "";
        background: url('../img/nav-b.png') no-repeat;
        width: 30px;
        height: 30px;
        display: inline-block;
        position: absolute;
        right: 0px;
        top: 10px;
	}
	nav li a {
        border-bottom: 1px dotted #0da98d;
	}
}


/*Things you probably want on your site
------------------------------------------------------------*/
a > img{
    border: 0 !important;
}
embed, img{
    max-width: 100%;
    height: auto;   
}

div.app-title {
	font-family: 'Open Sans', sans-serif;
	text-align: center;
	text-shadow: 0 1px 0 #ccc;
	font-weight: bold;
	color: #283891;
	font-size: 36px;
	margin: 1% 0;
}
