/* THIS IS FOR SMALLER VIEWPORTS */
@media only screen and (max-width:600px){
	
	/************************************/
	/* RESPONSIVE ABOUT WEBPAGE STYLING */
	/************************************/

	.subheader{
		margin-top: -80px;
		margin-bottom: -1vh;
		display: flex;
		width: 70%;
		background: rgb(218, 41, 28);
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
		border-radius: 5px;
		border-style: none;
		font-size: 10px;
	} 

	.content-container {
        margin-top: 10vh;
		height: 100%;
		width: 90%;
		border-radius: 10px;
		display: flex;
		align-items: center;
		align-self: center;
		flex-direction: column;
		overflow: visible;
	}

	.content {
		width: 90%;
        text-align: left;
		display:flex;
		flex-direction: column;
		align-items: center;
	}

    .content p {
        text-align: left;
    }

    .content h2 {
		text-decoration: underline;
        margin-top: 30px;
		margin-bottom: 10px;
		text-align: center;
		color:rgb(40, 40, 40);
	}

	.content h3{
		text-decoration: underline;
		margin-top: 30px;
		margin-bottom: 25px;
		text-align: center;
		color:rgb(40, 40, 40);
	}
	.content li {
		list-style-type: none;
	}

    .content li a {
		background-color: rgb(218, 41, 28);
		border-radius: 10px;
		padding: 20px;
		color: white;
		text-decoration: none;
		margin-top: 35px;
		transition: 0.3s;
	}
	.content li a:hover {
		background-color: rgb(173, 36, 36);
	}


	/* --------------- PROJECT TUTORIALS --------------- */
	.tutorialContainer {
		display: flex;
        flex-direction: column;
		margin: auto;
		margin-top: 10px;
        width: 90%;
        padding: 30px;
        background-color: #fff;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
        border-radius: 5px;
		min-height: 700px;
	}
	.tutorialContainer h3{
		text-decoration: underline;
	}
	.tutorialContainer h2{
		text-decoration: underline;
	}
	.generalSetTutorial {
		margin-bottom: 10px;
		padding: 10px;
	}
	.flashcardTutorial {
		margin-bottom: 10px;
		padding: 10px;
	}
	.multipleChoiceTutorial {
		margin-bottom: 10px;
		padding: 10px;
	}
	.FITBTutorial {
		margin-bottom: 10px;
		padding: 10px;
	}
	.booleanTutorial {
		margin-bottom: 10px;
		padding: 10px;
	}
	.quizTutorial {
		margin-bottom: 10px;
		padding: 10px;
	}
	/* --------------- PROJECT TUTORIALS --------------- */

}