@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500&display=swap');

body{
font-family: 'Poppins', sans-serif;
}

/**{
	border: 1pt solid cyan;
}*/
body {
	font-family: 'Poppins', sans-serif;
	color: #503e59;
}

header {
	display: block;
	height: 140px;
	margin: 30px 0;
}

header img {
	margin: 28px 0 0 30px;
	float: left;
	max-width: 15%;
}

nav {
	width: 50%;
	float: right;
	padding: 60px 30px;
	font-size: 18px;
	text-align: right;
	text-transform: uppercase;
}

nav a {
	padding-left: 30px;
}

a {
	text-decoration: none;
	color:#503e59;
}

a:hover,
a.current {
	color: #e6c9f5;
}

.row img{
	width:100%;
	cursor: pointer;
}
.cap{
	text-align: center;
	padding: 10px;
}

.modal-body img{
	width: 100%;
}

button {
  background-color:#503e59;
  border: none;
  color: white;
  padding: 15px ;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 14px;
}

.me{
	width: 50%;
	margin-top: 10px;
}
#about{
	margin-top: 50px;
}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
	/* Typography */
	h2 {
	  font-size: 20px;
	}
	h3 {
	  font-size: 18px;
	}
	p {
	  font-size: 14px;
	}

    /* Header Content */
	header {
	  text-align: center;
	}
	header img {
	  float: none;
	  width: 25%;
	  margin: 20px auto;
    }
    nav {
      width: 100%;
      text-align: center;
      padding: 0px;
    }
    nav a {
      padding: 0 6px;
    }	
    .me{
    	display: none;
    }
}
footer{
	margin-bottom: 40px;
}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
	header img {
		margin: 28px 0 0 30px;
		float: left;
		max-width: 25%;
	}
	h2{
		font-size: 25px;
	}
	p{
		font-size:15px;
	}
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
	Header Content
		header {
		  height: 180px;
		  text-align: center;
		}
		header img {
		  float: none;
		  width: 10%;
		  margin: 20px auto;
		}
		nav {
		  width: 100%;
		  text-align: center;
		  padding: 0px;
		}
		nav a {
		  padding: 0 6px;
		  float:right;
		  margin-right: 5px;
		} 
		p{
			font-size: 16px;
		}
}
/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
	header img {
		margin: 28px 0 0 30px;
		float: left;
		max-width: 25%;
	}
		nav a {
		padding: 0 6px;
		float:right;
		margin-right: 5px;
	} 
	p{
		font-size: 15px;
	}


}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
	header img {
		margin: 28px 0 0 30px;
		float: left;
		max-width: 25%;
	}
		nav a {
		padding: 0 6px;
		float:right;
		margin-right: 5px;
	  } 
}