@charset "utf-8";
/* CSS Document */

*{
	margin: 0px;
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif"
}

.buttonactive{
  background-color: #BFBFBF;
}

/* FONTS ANA*/
@font-face {
 font-family: 'icomoon';
  src:  url('../fonts/icomoon.eot?c330xs');
  src:  url('../fonts/icomoon.eot?c330xs#iefix') format('embedded-opentype'),
    url('../fonts/icomoon.ttf?c330xs') format('truetype'),
    url('../fonts/icomoon.woff?c330xs') format('woff'),
    url('../fonts/icomoon.svg?c330xs#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

.glyph {
  font-size: 16px;
  width: 15em;
  padding-bottom: 1em;
  margin-right: 4em;
  margin-bottom: 1em;
  float: left;
  overflow: hidden;
}

.fs1 {
  font-size: 32px;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-Recurso-1 .path1:before {
	font-size: 200px;
font-family: 'icomoon' !important;
  content: "\e900";
  color: red;
}
.icon-Recurso-1 .path2:before {
  content: "\e901";
  margin-left: -0.6640625em;
  color: rgb(0, 0, 0);
}
.icon-Recurso-1 .path3:before {
  content: "\e902";
  margin-left: -0.6640625em;
  color: rgb(255, 255, 255);
}
.icon-Recurso-1 .path4:before {
  content: "\e903";
  margin-left: -0.6640625em;
  color: rgb(255, 255, 255);
}
.icon-Recurso-1 .path5:before {
  content: "\e904";
  margin-left: -0.6640625em;
  color: rgb(255, 255, 255);
}
.icon-Recurso-1 .path6:before {
  content: "\e905";
  margin-left: -0.6640625em;
  color: rgb(255, 255, 255);
}
.icon-Recurso-1 .path7:before {
  content: "\e906";
  margin-left: -0.6640625em;
  color: rgb(255, 255, 255);
}
.icon-Recurso-1 .path8:before {
  content: "\e907";
  margin-left: -0.6640625em;
  color: rgb(255, 255, 255);
}
.icon-Recurso-1 .path9:before {
  content: "\e908";
  margin-left: -0.6640625em;
  color: rgb(255, 255, 255);
}
.icon-Recurso-1 .path10:before {
  content: "\e909";
  margin-left: -0.6640625em;
  color: rgb(255, 255, 255);
}
.icon-Recurso-1 .path11:before {
  content: "\e90a";
  margin-left: -0.6640625em;
  color: rgb(255, 255, 255);
}
.icon-Recurso-1 .path12:before {
  content: "\e90b";
  margin-left: -0.6640625em;
  color: rgb(255, 255, 255);
}
.icon-Recurso-1 .path13:before {
  content: "\e90c";
  margin-left: -0.6640625em;
  color: rgb(255, 255, 255);
}
.icon-Recurso-1 .path14:before {
  content: "\e90d";
  margin-left: -0.6640625em;
  color: rgb(255, 255, 255);
}
.icon-Recurso-1 .path15:before {
  content: "\e90e";
  margin-left: -0.6640625em;
  color: rgb(255, 255, 255);
}
.icon-Recurso-1 .path16:before {
  content: "\e90f";
  margin-left: -0.6640625em;
  color: rgb(255, 255, 255);
}
.icon-Recurso-1 .path17:before {
  content: "\e910";
  margin-left: -0.6640625em;
  color: rgb(255, 255, 255);
}
.icon-Recurso-1 .path18:before {
  content: "\e911";
  margin-left: -0.6640625em;
  color: rgb(255, 255, 255);
}
.icon-Recurso-1 .path19:before {
  content: "\e912";
  margin-left: -0.6640625em;
  color: rgb(255, 255, 255);
}
.icon-Recurso-1 .path20:before {
  content: "\e913";
  margin-left: -0.6640625em;
  color: rgb(0, 0, 0);
}
.icon-Recurso-1 .path21:before {
  content: "\e914";
  margin-left: -0.6640625em;
  color: rgb(0, 0, 0);
}
.icon-Recurso-1 .path22:before {
  content: "\e915";
  margin-left: -0.6640625em;
  color: rgb(0, 0, 0);
}
.icon-Recurso-1 .path23:before {
  content: "\e916";
  margin-left: -0.6640625em;
  color: rgb(0, 0, 0);
}
.icon-Recurso-1 .path24:before {
  content: "\e917";
  margin-left: -0.6640625em;
  color: rgb(0, 0, 0);
}


@font-face {
	font-family: 'Walkway SemiBold';
	src: URL('..//fonts/Walkway SemiBold.ttf') format('truetype');
}

/* NAVIGATION MENU*/
.menu-top {
	margin-top: 0;
	position:fixed;
	z-index:9999;
	width:  100%;
	background: #FFFFFFEE;
	box-shadow: 3px 3px 15px 3px #00000050;
}

.logo-top{
	/*margin-top: 50px;*/
	position:fixed;
	z-index:9999;
	width: 10%;
	/*box-shadow: 3px 3px 15px 3px #00000050;*/
}

.logo-top-p{
padding-top: 3px;
	padding-left: 6px;
	width:"35px";
	float:left;
}

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

li {
  float: right;
}

li a, .dropbtn {
  display: inline-block;
  color: black;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

li a:hover, .dropdown:hover .dropbtn {
	color: white;
  background-color: #232323;
}

li.dropdown {
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content-b {
  display: none;
  position: absolute;
  transform: translateX(-138px);
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdown-content-b a {
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: right;
}

.dropdown-content a:hover {background-color: #f1f1f1; background-color: #747474;}

.dropdown-content-b a:hover {background-color: #f1f1f1; background-color: #747474;}

.dropdown:hover .dropdown-content {
  display: block;
}

.dropdown:hover .dropdown-content-b {
  display: block;
}

/*BODY*/
/* Container RM Studio 74 */
.body-container {
	width: 100%;
}

.body-home {
	width: 100%;
}

.container {
	box-sizing: border-box;
	width: 100%;
	padding-top: 100px;
  	padding-bottom: 60px;
	padding-left: 5%;
	padding-right: 5%;
  	background-color: #232323;
}

.aside-left {
	float: left;
	width: 40%;
  	align-self: center;
}

.aside-content {
	float: right;
	width: 40%;
}

.align-center {
  text-align: center;
}

@font-face {
	font-family: 'Walkway SemiBold';
	src: URL('..//fonts/Walkway SemiBold.ttf') format('truetype');
}

/* Título RM Studio 74*/
.title-text {
	font-family: "Walkway SemiBold", "Roboto","Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
  	font-style: normal;
	font-weight: 100;
	letter-spacing: 0.1em;
  	line-height: 1.5;
	color: white;
}

.display-1 {
  	font-size: 5rem;
	white-space: nowrap;
	 display: inline;
	border-bottom: 1px dashed #E3E3E3;
}

/* Subtitulo The Art... */
.subtitle-text {
	font-family: "Walkway SemiBold" ,"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
  	font-style: normal;
	letter-spacing: 0.1em;
  	line-height: 1.2;
	color: white;
}

.display-2 {
  	font-size: 2rem;
}

@font-face {
  	font-family: 'wind';
	src: URL('..//fonts/wind.ttf') format('truetype');
}

@font-face {
	font-family: 'go around the books';
	src: URL('..//fonts/go around the books.ttf') format('truetype');
}

/* Title Level 3 IMAGE WITH CONTENT, ENGELBERG, ETC */
.display-3 {
	font-family: go around the books, Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
	line-height: 150%;
	letter-spacing: 0.1em;
	font-size: 1.6rem;
	font-size: 2.6rem;
	border-bottom: 1px solid #000000;
	text-shadow: 3px 3px 3px #ababab;
}

/* Text Level 4 bellow IMAGE WITH CONTENT */
.display-4 {
	padding-top: 15px;
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
	font-size: 1.6rem;
	color: darkgrey;
}

/* Text Level 5 bellow List with Projects */
.display-5 {
	padding-top: 15px;
	font-family:  Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif" sans-serif;
	font-size: 1.4rem;
	line-height: 1.3;
}

/* Title above List with Projects */
.font-color-title-aside {
	color:tan;
}

.footer-home {
	width: 100%;
}

.table-content
{
	background-color: #232323;
    display: table;
    width: 100%; /*Optional*/
    table-layout: fixed; /*Optional*/
    border-spacing: 10px; /*Optional*/
	padding-top: 15px;
	padding-bottom: 15px;
}

.footer-content {
	display: table-cell;
	width:30%;
	color: #FFFFFF;
	padding: 0px;
	text-align: center;
	vertical-align:top;
	line-height: 1.6;
}

.footer-content-image {
	display: table-cell;
	text-align: center;
	width: 10%;
}

.footer-title {
	font-size: 1.4rem;
	color: antiquewhite;
}

.footer-lower{
	color: gray;
	padding: 2%;
	background-color: #232323;
	text-align: right;
}

hr{
	height: 1px;
	background-color: #777777;
    border:none;
}

/* Text Blue Links*/
.text-primary {
  	color: #149dcc !important;
	text-decoration: none;
}


@media (max-width: 825px){

	.display-1 {
		font-size: 10vw;
	}
	.display-2 {
		font-size: 5vw;
	}

	.display-3 {
		font-size: 6vw;
	}

	.aside-left {
		background-color: white;
		width: 80%;
		align-self: center;
		padding: 10%;
		margin: auto;
	}

	.aside-content {
		background-color: white;
		width: 80%;
		padding-left: 10%;
		padding-right: 10%;
		padding-bottom: 5%;
		padding-top: 0%;
	}

	.table-content
	{
		background-color: #232323;
    	display: block;
    	width: 100%; /*Optional*/
    	border-spacing: 10px; /*Optional*/
		padding-top: 15px;
		padding-bottom: 15px;
	}

	.footer-content {
		display: block;
		width:100%;
		color: #FFFFFF;
		padding: 0;
		padding-bottom: 5%;
		text-align: center;
	}

	.footer-content-image {
		width: 100%;
		text-align: center;
	}
}

@media (max-width: 570px){
	.menu-top {
		position: relative;
		margin-top: 0;
		z-index:9999;
		width:  100%;
		background: #FFFFFFEE;
		box-shadow: 3px 3px 15px 3px #00000050;
	}
	.container {
		width: 100%;
		padding-top: 30px;
  		padding-bottom: 40px;
  		background-color: #232323;
	}
}