body, html {
  height: 100%
}

/* Style the <hr> element */
hr {
  margin: auto;
  width: 40%;
	background-color: whitesmoke;
	height: 2px;
}

a {
	letter-spacing: 3px;
	color: whitesmoke;
}

.resume {
	padding-top: 2%;
}

.bgimg {
  /* Background image */
  background-image: url(/assets/randy-fath-h1ShPXfHbTw-unsplash.jpg), url(/Users/mimypp/Documents/practiceCodes/amichaelpalma.github.io/assets/randy-fath-h1ShPXfHbTw-unsplash.jpg);
  /* Full-screen */
  height: 100%;
  /* Center the background image */
  background-position: center;
  /* Scale and zoom in the image */
  background-size: cover;
  /* Add position: relative to enable absolutely positioned elements inside the image (place text) */
  position: relative;
  /* Add a white text color to all elements inside the .bgimg container */
  color: whitesmoke;
  /* Add a font */
  font-family: "Courier New", Courier, monospace;
  /* Set the font-size to 25 pixels */
  font-size: 25px;
}

/* Position text in the top-left corner */
.topleft {
  position: absolute;
  top: 0;
  left: 16px;
}

/* Position text in the bottom-left corner */
.bottomleft {
  position: absolute;
  bottom: 0;
  left: 16px;
	font-size: small;
}

/* Position text in the middle */
.middle {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

/* Style the <hr> element */
hr {
  margin: auto;
  width: 40%;
}

.contact-info {
	width:600px;
	height:3rem;
	padding-top: 10px;
	/* padding-left:15px;
	padding-right:15px; */
}

#st-box {
	float:left;
	padding: 5px;
	border: 2px solid whitesmoke;
	background-color: rgb(223, 148, 82);
	/* width:180px;
	height:160px;
	
	
	border:solid black; */
}
#nd-box {
	float:left;
	/* width:180px;
	height:160px;
	background-color:white; 
	border:solid black; */
	padding: 5px;
	border: 2px solid whitesmoke;
	background-color: rgb(223, 148, 82);
	margin-left: 10%;;
	margin-right: 10%;
	color: black;
}
#rd-box {
	float:left;
	color: black;
	padding: 5px;
	border: 2px solid whitesmoke;
	background-color: rgb(223, 148, 82);
	/* width:180px;
	height:160px;
	background-color:white;
	border:solid black; */
}













/* 

// Making way for new Under Construction view page

.container {
	padding-top: 2%;
}


#profile-picture {
	height: auto;
	background-repeat: no-repeat;
	position: center;
	max-width: 90%;
	display: block;
	margin-left: auto;
	margin-right: auto;
	border-radius: 50%;
	border: 4px solid black;
	box-shadow: 
    inset 0 6px 9px rgba(255,255,255,0.3),
    inset 0 -6px 9px rgba(0,0,0,0.3),
    0 6px 6px rgba(255,255,255,0.9);
}

.text {
	color: white;
	background: black;
	padding-top: 0.5%;
	padding-bottom: 0.5%;
	font-family: 'David Libre', 'serif';
}

ul {
	list-style: none;
}

.contact-info {
	padding-left: 0;
}


a {
	letter-spacing: 3px;
	color: black;
}


.skillbar {
	width: auto;
	background-color: #ddd;
}

.skills {
	text-align: right;
	padding-right: 10px;
	padding-top: 5px;
	line-height: 20px;
	color: white;
}

.ruby {
	width: 50%;
	background-color: #000;
}

.RoR {
	width: 60%;
	background-color: #000;
}

.HTML {
	width: 80%;
	background-color: #000;
}

.CSS {
	width: 70%;
	background-color: #000;
}

.JS {
	width: 20%;
	background-color: #000;
}

.skillset {
	margin-bottom: 1px;
} */

/* .content {
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 50%;
} */

/* 

// Making way for new Under Construction view page

.fullname {
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 90%;
	color: white;
	background: black;
	padding-top: 0.5%;
	padding-bottom: 0.5%;
	font-family: 'David Libre', 'serif';
	text-align: center;
}

.title {
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 90%;
	color: white;
	background: black;
	padding-top: 0.5%;
	padding-bottom: 0.5%;
	font-family: 'David Libre', 'serif';
	text-align: center;
} */


/* .selector-for-some-widget {
  box-sizing: content-box;
} */

/* 

// Making way for new Under Construction view page

.resume {
	display: block;
	text-align: center;
} */