/***************************************************
		    GENERAL STYLE			
***************************************************/

html, body {

	font-family:'Lato', sans-serif;
	font-size: 16px;
	color: #0e3657;	/* 0e3657 0f113a*/
	width: 100%;
	margin: 0px;
	padding: 0px;
	background-color: #ddd;
	overflow-x: auto;
}

#page {
	max-width: 1280px;
	margin-left: auto;
	margin-right: auto;
	padding: 0px 8% 0px 8%;
	background-color: #fff;
}
	
	
/* TEXT */	
h1, h2 { font-family: 'Ropa Sans', sans-serif; clear: right; }
	
h1 {
	font-size: 300%;
	font-weight: bold;
	padding: 120px 0px 30px 0px;
	margin: 50px 0px 0px 0px;
	
	/**Gradient Fix**/
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

#title p { font-family: 'Ropa Sans', sans-serif; font-size: 150%; }
h2 { font-size: 170%; font-weight: normal;  margin-bottom: 50px; }
h3 { font-size: 110%; font-weight: bold; margin-bottom: 15px; }
h4 {  }
p { width: 60%; margin: 0px;  }
ul { list-style-image: url(../../src/images/graphics/bullet-BlueRoundedSquare.png); }
ul.no-bullet { list-style: none; }
span.bullet { color: #50cfff; }

/* DEFAULT LINKS */
a, a:visited, a:hover, a:focus, a:active {
	color: #ce3d86;
	text-decoration: underline;
	padding: 3px;
	border: 1px solid transparent;
	display: inline-block;
}
a:hover, a:focus { color: #ff43a0; }
a:focus { border: 1px solid #ff43a0; }

.button, .button:visited, .button:hover, .button:focus, .button:active {
	height: 38px;
	min-width: 100px;
	color: #fff;
	font-family: 'Ropa Sans', sans-serif;
	font-size: 20px;
	text-align: center;
	text-decoration: none;
	line-height: 38px;
	padding: 0px 20px;
	background-color: #ff43a0;
	border: none;
	border-bottom: 6px solid #ce3d86;
	box-shadow: 3px 5px rgba(0, 0, 0, .3);
	transition: transform .05s ease-out;
}

.button:hover, .button:focus {
	transform: translate(0px, -5px);	
	box-shadow: 5px 7px rgba(0, 0, 0, .2);
	cursor: pointer;	
}

.button:focus {	
	box-shadow: 0px 0px 20px rgba(255, 67, 160, .8);
	
}

/* GRADIENT */
.gradient { background-image: linear-gradient(to right, #0f113a, #0f113a, #0086bd); }

/***************************************************
					HEADER			
***************************************************/

/********	NAVIGATION	********/

nav {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 50px;
	padding: 0px;
	color: #fff;
	text-align: right;
	/* border-bottom: 2px solid #0086bd; */
	box-shadow: 0px 5px 2px rgba(0, 0, 0, .2);
	
	
}

nav a, nav a:visited, nav a:hover, nav a:focus, nav a:active {	
	color: #fff;
	display: inline-block;
	padding: 15px 0px 11px 0px;
	margin: auto 2%;
	text-decoration: none;
	border: none;
	border-bottom: 5px solid transparent;
}

nav a:hover, nav a:focus {
	border-color: #ff43a0;
}

.nav-button, .nav-button:visited, .nav-button:hover, .nav-button:focus, .nav-button:active {
	height:28px;
	font-size: 18px;
	line-height: 34px;
	margin: 0px 2% 0px 0px;
}

a#logo {
	height: 40px;
	width: 300px;
	line-height: 40px;
	text-align: center;
	padding: 0px;
	margin: 5px 0px 5px 8%;
	border:none;
	background-color: rgba(255, 255, 255, .5);
	float: left;
}
p#skip, p#skip a { font-size: 5px; opacity: 1.0; clear: both; }

/********	HEADER/BANNER	********/

header { height: 400px; }

/***************************************************
					SECTIONS			
***************************************************/

section {
	padding: 50px 0px;
	border-top: 2px solid #0086bd; 
	-moz-border-image: -moz-linear-gradient(to right, #0f113a, #0f113a, #0086bd);
	  -webkit-border-image: -webkit-linear-gradient(to right, #0f113a, #0f113a, #0086bd);
	  border-image: linear-gradient(to right, #0f113a, #0f113a, #0086bd);
	  border-image-slice: 1;
}

.tiles { margin-left: 85px; }

.tile-sm {
	display: inline-block;
	width: 33%;
	padding: 0px;
	margin: 0px 0% 50px 0px;
	background-color: #fff;
}

.tile-sm p { width: 70%; }

.icon-h2 {
	width: 60px;
	height: 60px;
	margin-right: 25px;
	background-color: #ff43a0;
	border: none;
	float: left;
}

.icon-h3 {
	width: 65px;
	height: 75px;
	border: 3px solid #ff43a0;
}

.interrupt {
	width:108%;
	color: #fff;
	font-family: 'Ropa Sans', sans-serif;
	font-size: 150%;
	line-height: 150%;
	padding: 16%;
	margin-left: -16%;
	border: none;
	border-radius: 6px;
	background-color: #0f113a;
}

.interrupt p { width:60%; }
/********	CONTACT   ********/

#contact { border: none; }

form {
	color: #fff;
	width: 60%;
	padding: 5%;
	margin: 0px auto 0px auto;
	background-color: #0f113a;
	border: none;
	border-radius: 6px;
}

input[type=text] {
	width: 98%;
	padding: 1%;
	margin-top: 5px;
	margin-bottom: 20px;
	background-color: #fff;
	border-radius: 4px;
}
input[type=radio] { margin: 10px 5px 0px 0px; }
fieldset { margin: 0px; padding: 0px; border:none; }
label { margin-right:50px; }
input[type=submit] { width: 130px; margin: 40px 0px 20px 0px; }

/***************************************************
					FOOTER			
***************************************************/

footer {
	height: 100px;
	color: #fff;
	padding: 50px 8%;
	background-image: linear-gradient(to right, #0f113a, #0f113a, #0086bd);
}

footer p { width: 60%; }