MusareReact/frontend/app/styles/main.scss

// @import "musare-theme";
@import "colors";
@import "breakpoints";
@import "login";
@import "navbar";
@import "register";
@import "setPassword";
@import "settings";
@import "termsPrivacy";
@import "profile";
@import "team";
@import "home";
@import "specific/button";
@import "specific/form";
@import url("https://fonts.googleapis.com/css?family=Roboto:100,400,500,700");

html, body {
	margin: 0;
	padding: 0;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
	min-width: 320px;
	text-rendering: optimizeLegibility;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	background-color: #F5F5F5;
	color: $musare_color_primary_gray;
}

* {
	padding: 0;
	margin: 0;
	border: 0;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
}

h1 {
	text-align: center;

	font-size: 32px;
	line-height: 43px;
	margin-bottom: 16px;
}

.hidden {
	display: none;
}

// Temp Start
.liked {
	color: green;
}

.disliked {
	color: red;
}

.overlay {
	display: block;
	position: absolute;
	top: 64px;
	bottom: 0;
	right: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-color: #03a9f4;
	z-index: 2;
}
// Temp End
main {
	margin-left: auto;
	margin-right: auto;

	margin-top: 16px;
	width: 296px;

	.custom-messages {
		border: solid 1px;
		padding: 8px;
		margin-bottom: 16px;

		&.custom-messages-error {
			border-color: $musare_color_primary_red;
			color: $musare_color_primary_red;
		}

		&.custom-messages-info {
			border-color: $musare_color_dark_blue;
			color: $musare_color_dark_blue;
		}

		&.custom-messages-success {
			border-color: $musare_color_green;
			color: $musare_color_green;
		}

		p {
			font-weight: 500;

			font-size: 16px;
			line-height: 21px;
			margin-bottom: 8px;
		}

		ul {
			list-style-position: inside;

			li {
				font-size: 14px;
				line-height: 19px;
			}
		}
	}

	a {
		color: $musare_color_primary_blue;
		text-decoration: none;
		transition: .1s ease;

		&:hover, &:active {
			color: $musare_color_secondary_blue;
		}
	}
}