body{
	  background-color: white;
	  margin:0;
}
p{
	  color:red; 
	  font-size:14px;
	  text-align: center;

}
footer{
	position: relative;
	display:block;
	text-align: center;
	font-style: italic;
	bottom:0;
	left:0;
	right:0;
}
hr{
	color: 1px solid grey;
}
.titleHead{
   	border: 1px solid black;
	background-color: #3498db;
	color: white;
	font-size: 16px;
	font-family: sans-serif;
	text-transform: uppercase;
	padding: 9px;
	width: auto;
	display: block;
	margin: 4px 0px;
	text-align: center;
}
.heart-icon{
	color:red;
	font-size:14px;
}
.controlConatiner{
	text-align: center;
	margin-bottom: 8px;
}

.loader {
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  width: 120px;
  height: 120px;
  z-index:9999;
  top:40%;
  left:47%;
  display:block;
  position: absolute;
  -webkit-animation: spin 2s linear infinite; /* Safari */
  animation: spin 2s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

#overlay {
    position: fixed; /* Sit on top of the page content */
    display: block; /* Hidden by default */
    width: 100%; /* Full width (cover the whole page) */
    height: 100%; /* Full height (cover the whole page) */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5); /* Black background with opacity */
    z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
    cursor: pointer; /* Add a pointer on hover */
}

.note{
    display: inline-flex;
    margin-left: 14px;
}
.addNewCourse, .addNewExperience{
    margin-left: 15px;
    margin-top: 7px;
}

.eduHeader, .wxpHeader{
    border: 1px solid grey;
    display: block;
    background-color: #eee;
    padding: 2px 0px 3px 15px;
    text-transform: capitalize;
}
.eduForm, .wxpForm{
    border:1px solid grey;
    overflow: hidden;
}
.removeEduForm, .removeWxpForm{
    float: right;
    margin-right: 11px;
    color: black;
    background-color: white;
    padding: 0px 2px 0px 1px;
    border: 1px solid black;
    cursor:pointer;
}

 /* For mobile phones: */
@media only screen and (max-width: 768px) {
    footer{
    	position: relative;
    }
    .loader {
    	left:37%;
    }
}