@import url(https://fonts.googleapis.com/css?family=Raleway:400,300,800|Lora:400italic|Playfair+Display:700);
@font-face {
	font-weight: normal;
	font-style: normal;
	font-family: 'codropsicons';
	src:url('../fonts/codropsicons/codropsicons.eot');
	src:url('../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'),
		url('../fonts/codropsicons/codropsicons.woff') format('woff'),
		url('../fonts/codropsicons/codropsicons.ttf') format('truetype'),
		url('../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg');
}

*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.clearfix:before, .clearfix:after { display: table; content: ''; }
.clearfix:after { clear: both; }
.container{
	margin: 0!important;
	padding: 0!important
}
.content p{font-family:'Merriweather', serif!important; font-size: 18px; color: #3A3A3A; line-height: 30px}
	
body {
	background: #fff;
	color: #69606b;
	font-weight: 400;
	font-size: 22px;
	line-height: 1.5;
	font-family: 'Raleway', Arial, sans-serif;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
	padding: 0!important;
	margin: 0!important;
}

.demo-1 {
	background: #FFFFFF;
}

a {
	outline: none;
	color: #33C9A5!important;
	text-decoration: none!important;
}

a:hover, a:focus {
	color: #69606b;
}
h1{font-family: 'Fjalla One', sans-serif!important;}
/* To Navigation Style */
.navbar-inverse{  display: none!important; position: fixed!important;
    z-index: 2000!important;
    width: 100%!important;
	background-image: -webkit-linear-gradient(top,#222A42 0,#222A42 100%)!important;
	border-color:#222A42!important;
    background-color:#222A42!important}

.navbar-inverse .navbar-brand, .navbar-inverse .navbar-nav>li>a {
    text-shadow: 0 -1px 0 rgba(0,0,0,.25);
    font-size: 22px!important;
}
.navbar-inverse .navbar-nav>li>a{
	color:#FFFFFF!important;
	font-size: 19PX!important;
}
.navbar-brand {
	padding-left: 30px!important;
	color:white!important;
	font-family: 'Fjalla One', sans-serif;
	z-index: 2000!important;
	margin-bottom: 0px!important}
.navbar-brand a{
	font-size:25px!important;
}
.navbar-toggle {
	background-color: white!important;
	margin-right: 25px!important}

.navbar-toggle a{font-size: 20px}
.navbar-brand{margin-bottom: 0.3em;}
.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.open>a{
	background-image: linear-gradient(to bottom,#222A42 ,#222A42 100%)!important;
}

.navbar-nav{font-size: 20px;
	padding-left: 20px!important;
	padding-right: 20px!important;
	font-family: 'Fjalla One', sans-serif;
}

.navbar-inverse .navbar-toggle .icon-bar{background-color: black!important;}

.codrops-icon:before {
	text-transform: none;
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	font-family: 'codropsicons';
	text-align: center;
	speak: none;
	margin: 0 0.55em 0 0;
	-webkit-font-smoothing: antialiased;
}

.codrops-icon-drop:before {
	content: "\e001";
}

.codrops-icon-prev:before {
	content: "\e004";
}

.codrops-demos {
	top:0!important;
	left: 0!important;
	padding: 0.2em 0.3em 0.1em 0em!important;
	position: fixed!important;
	width: 100%!important; 
	z-index: 10000!important;
	background-color:#222A42;
	opacity: 0.97!important;
	text-align: center;
	display: block!important;
	height: 50px;
}

.codrops-demos a {
	text-decoration: none!important;
	font-weight: 600!important;
	text-transform: uppercase;
	font-size: 110%!important;
	font-family: 'Fjalla One', sans-serif!important;
	letter-spacing: 1px!important;
	padding: 0.6em;
	display: inline-block;
	margin: 0!important;
	white-space: nowrap;
	color:#F0F2F3!important;
}

.codrops-demos a:hover,
.codrops-demos a.current-demo {
	opacity: 1;
	color: #33C9A5 !important;
}

.codrops-demos a.current-demo {
	border-bottom: 3px solid #33C9A5!important;
	padding-bottom: 1px;
}

.related {
	padding: 3em 0;
	text-align: center;
	font-size: 1.5em;
	position: relative;
}

.demo-5 .related {
	width: 60%;
	margin-left: 40%;
}
.fotoypie{position: relative; width: 100%!important; max-width: 900px; margin: 0 auto;margin-top: 8px!important;margin-bottom: 4em!important}
.lineapie{border-bottom: 4px solid #222A42!important; weight: 100%!important;margin-top: 10px!important; margin-left: 0!important; margin-right: 0!important}
.pie {position: relative;
	font-family:'Merriweather', serif;
	font-size: 15px!important;
	float: left!important;
    width: 100%!important;
    box-sizing: border-box;
    border-left: 25px solid #222A42!important;
    margin-top: 5px!important;
    height: 20px!important;
    background-color: #FFFFFF!important;
	margin-left:0!important;
	margin-right: 0!important}
.texto{padding-top: 25px!important}
#footer{
    position:relative;
    height: 50px;
    display:block;
    width: 100%;
    background: black;
    z-index:500;
    text-align:center!important;
    color: #f2f2f2;
    padding: 2px 0 0 2px;
  }
.pie-pagina {
    padding: 30px 30px;
    background-color: #33C9A5;
}
.pie-pagina p{
	font-family: 'Fjalla One', sans-serif!important;
	font-size: 23px!important;
	color: #3A3A3A
	
}
.logos{display:block}
.logoscel{display:none}
.creditoscel{display:none}

@media screen and (min-width: 2000px){
	
	.codrops-demos {
	top:0!important;
	left: 0!important;
	padding: 0.2em 15em 0.1em 0.1em!important;
	position: fixed!important;
	width: 100%!important; 
	z-index: 10000!important;
	background-color:#222A42;
	opacity: 0.97!important;
	text-align: center;
	display: block!important;
	height: 50px;
}

	.codrops-demos a {
	text-decoration: none!important;
	font-weight: 600!important;
	text-transform: uppercase;
	font-size: 140%!important;
	font-family: 'Fjalla One', sans-serif!important;
	letter-spacing: 1px!important;
	padding: 0.6em;
	display: inline-block;
	margin: 0!important;
	white-space: nowrap;
	color:#F0F2F3!important;
}
}
	
@media screen and (max-width: 1000px){
	.codrops-demos{display: none!important;}
	.navbar-inverse{ display: block!important; position: fixed!important;
		z-index: 2000!important;
		width: 100%!important;
		background-image: -webkit-linear-gradient(top,#222A42 0,#222A42 100%)!important;
		border-color:#222A42!important;
		background-color:#222A42!important}
}	
	
@media screen and (max-width: 800px) {

	.codrops-demos{display: none!important;}
	.navbar-inverse{ display: block!important; position: fixed!important;
		z-index: 2000!important;
		width: 100%!important;
		background-image: -webkit-linear-gradient(top,#222A42 0,#222A42 100%)!important;
		border-color:#222A42!important;
		background-color:#222A42!important}
	.codrops-icon span {
		display: none;
	}

	.related {
		font-size: 80%;
	}
.fotoypie{position: relative; width: 100%!important; max-width: 900px; margin: 0 auto;margin-top: 8px!important;margin-bottom: 11em!important; }
	.pie{font-size: 12px}
	.logos{display:none}
	.logoscel{display:block}
	#creditos{display:none}
	.creditoscel{display:block}
	
	.pie-pagina p{
	font-family: 'Fjalla One', sans-serif!important;
	font-size: 13px!important;
	color: #3A3A3A;
}
}