html, body {
    height: 100%;
}



body {
margin-top: 35px;
}

h2, h3 {
padding-top: 40px;
}

p {
margin-top: 10px;
}


a {
color: red;

}


a:hover {
color: gray;
text-decoration: none;

}

.container-fluid {
padding: 0;
}


#sections {
background: #F1F0EF;
padding: 2%;
}

#about {
padding-top: 10px;
}

footer {
color: gray;
background: #F1F0EF;
max-width: 1400px;
padding: 0 1% 0 1%;
margin: auto;
border: 1px lightgray solid;

}

textarea {
border: 3px red solid;
padding: 10px;
display: block;
width: 100%;
box-sizing: border-box;
height: 300px;
}

#startcode textarea {
border: 3px red solid;
padding: 10px;
display: block;
width: 50%;
box-sizing: border-box;
height: 300px;
}

xmp {
display: inline;
 
}

#resources {
background: #F1F0EF;
border-radius: 10px;
margin-top: 1%;
margin-left: 20px;
}

#resources h2 {
padding-top: 0px;


}



.lead {
margin-bottom: 0px;
font-weight: bold;
}

.sample {
width: 100%;
max-width: 500px;
}

.side {
border-top: 10px white solid;
}

.first {
border: 0;
}

#started {
border-bottom: 1px #f1f1f1 solid;
}

#started h2 {
padding-top: 0px;
}

.jumbotron {
    
    padding: 0;
    margin:0;
    border-radius: 0;
}



.small {
display: inline;
border: 0;
padding: 0;
height: 100%;

}

.row {
background: white;
margin: 0;
}

.col-md-8, .col-md-12{
background: white;
border-bottom: 1px #f1f1f1 solid;

}

.col-md-8 {
min-height: 200px;
display:inline-block;
}

.col-md-4 {
background: #f1f1f1;
display:inline-block;
}

.eachrow {
display: flex;
width: 100%;
}




#intro {
background: lightgray;
border-bottom: 1px #f1f1f1 solid;
border-top: 2px gray solid;
margin-bottom: 1%;
}


.video {
width: 60%;
margin: auto;
}
.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding-bottom: 10px;
}

#main {
max-width: 1400px;
margin: auto;
border: 1px lightgray solid;
}

.home {
background: white;
border: 0;
padding-bottom: 5%;
}

nav p {
padding: 5px;
font-weight: bold;
margin-bottom: 0;
}

nav ul {
margin-top: 0;
}






/* Extra Small Devices, Phones */ 
    @media only screen and (max-width : 480px) {
.video {
width: 100%;

}

#resources {
margin-left: 5px;
}


}

 @media only screen and (max-width : 760px) {
.eachrow {
display: inline;
margin: auto;
}
}