@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Bitter|Staatliches&display=swap');


/* Reset */

	body {
		margin: 0;
		padding: 0;
		border: 0;
		font-size: 100%;
		font: inherit;
		vertical-align: baseline;
	}

	article, aside, details, footer, header {
		display: block;
	}

	body {
		line-height: 1;
	}

	ol, ul {
		list-style: none;
        padding: 0;
	}


/* MENU */

.topnav {
  overflow: hidden;
  background-color: #ba7e1e;
    font-family: 'bitter';
}

.topnav a {
  float: left;
  display: block;
  color: #fff8ee;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}

.topnav a:hover {
  background-color: #ba7e1e;
  color: #17478f;
}

.topnav a.active {
  background-color: #ffaea3;
  color: #fff8ee;
}

.topnav .icon {
  display: none;
}

@media screen and (max-width: 600px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 600px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
}
	
/* Basic */

	body {
		background: #fff8ee;
	}

/* Tipo */
   
	p {
		color: #17478f;
		font-family: 'Bitter', sans-serif;
		font-size: 1em;
		font-weight: 300;
		line-height: 1.65;
        margin: 0.5em;
	}

h3 {
    font-family: 'Bitter';
    font-size: 1.7em;
    letter-spacing: 0.1em;
    color: #ba7e1e;
    text-decoration: underline;
}


/* foto */

			.image.fit img {
				width: 100%;
			}

		.image.round img {
			border-radius: 100%;
		}

		.image.main {
			display: block;
			margin: 0 0 3em 0;
			width: 100%;
		}

			.image.main img {
				width: 100%;
			}



/* Flex */

	.flex {
		flex-wrap: nowrap;
		display: flex;
		flex-wrap: nowrap;
		justify-content: space-between;
		align-items: stretch;
	}

		.flex.flex-3 .flex-item {

			flex-basis: 30%;
		}

			.flex.flex-3 .flex-item.left {
				text-align: right;
			}

		@media screen and (max-width: 980px) {

			.flex {
				
				flex-wrap: wrap;
			}

				.flex.flex-3 .flex-item {
					
					flex-basis: 100%;
				}

					.flex.flex-3 .flex-item.left {
						text-align: right;
					}

		}

.wrapper {
    margin: 4em 0 4em 0;
}


		
/* Banner */

	#banner {
		
		background-image: url(../imagenes/banner.jpg);
		background-size: cover;
		background-position: center top;
		background-repeat: no-repeat;
		text-align: center;
	}

		#banner h1 {
           font-family: 'Staatliches', serif;
			font-size: 8em;
			color: #f0e7da;
			line-height: 1em;
			margin: 0 0 0.1em 0;
			padding: 0;
            letter-spacing: 0.1em;
		}
		

		@media screen and (max-width: 980px) {

				
				#banner h1 {
					font-size: 6em;
				}

		}

		@media screen and (max-width: 736px) {

			#banner {
				padding: 2em 1em 1em 1em;
			}

		}

		@media screen and (max-width: 480px) {

			
				#banner h1 {
					font-size: 4em;
				}

				#banner p {
					font-size: 1em;
				}

				#banner .button {
					font-size: .9em;
				}

		}


/* Main */
	

	#one .flex-item {
		
		display: flex;
		
		flex-wrap: wrap;
		
		justify-content: space-between;
		
		align-items: stretch;
	}

		#one .flex-item.left div:first-child, #one .flex-item.right div:first-child {
			padding-top: 1em;
		}

		#one .flex-item.left div:last-child, #one .flex-item.right div:last-child {
			
			align-self: flex-end;
		}

		#one .flex-item.left div p, #one .flex-item.right div p {
			margin-bottom: 1em;
		}

		@media screen and (max-width: 1280px) {

			#one .flex-item.left div:first-child, #one .flex-item.right div:first-child {
				padding-top: 0;
			}

			#one .flex-item.left div p, #one .flex-item.right div p {
				margin-bottom: 0;
			}

		}

		@media screen and (max-width: 980px) {

			#one .flex-item {
				
				flex-direction: column;
				text-align: center;
			}

				#one .flex-item.left br, #one .flex-item.right br {
					display: none;
				}

				#one .flex-item.left div:first-child, #one .flex-item.right div:first-child {
					padding-top: 0;
				}

				#one .flex-item.left div:last-child, #one .flex-item.right div:last-child {
					
					align-self: center;
				}

				#one .flex-item.left div p, #one .flex-item.right div p {
					margin-bottom: 2em;
				}

		}

	#one .image.fit {
		margin: 0;
	}

		
@media screen and (max-width: 980px) {

			#one .image.fit {
				margin: 0 auto 2em auto;
				max-width: 60%;
			}

		}

		@media screen and (max-width: 480px) {

			#one .image.fit {
				margin: 0 auto 2em auto;
				max-width: 90%;
			}

		}

	@media screen and (max-width: 980px) {

		#two blockquote br {
			display: none;
		}

	}

	@media screen and (max-width: 980px) {

		#three {
			text-align: center;
		}

	}

/* Footer */

	#footer {
		padding: 1em 0 3em 0;
		background: #ba7e1e;
		text-align: center;
		color: #fff8ee;
        font-family: 'bitter';
        font-size: 0.9em;
        }

		#footer h2 {
            font-family: 'Staatliches', serif;
			font-size: 1.3em;
			color: #f0e7da;
            letter-spacing: 0.1em;
		}
		
		#footer a {
			color: #434343;
			border: 1px solid rgba(0, 0, 0, 0.90);
 			background: #ffaea3;
			border-radius: 15px 15px 15px 15px;
            min-width: 160px;
            padding: .3em;
            text-align: center;
            line-height: 2.5em;
            text-decoration: none;
}

		}