FinalsClub/public/assets/css/scss/partials/_pages.scss

/*----------------------------------------------------------------

[Table of contents]

 0.General
 1.Home
 2.Schools
 3.Courses
 4.Course
 5.Notes

----------------------------------------------------------------*/

/* 0.`General
---------------------------------------------- */

#messages {
	@extend .grid-8;
	padding: $base/2;
}

/* 1.`Home
---------------------------------------------- */

#pg_home {

    .subheader {
        text-align: center;
        padding: $base*2 0;
				border: 0;
				background: none;
    }

    h1 {
        @extend .futura;
    }

    .section-home {
        margin-bottom: $base;
    }
}

#intro-video {
    @extend .grid-4;
}

#intro-text {
    @extend .grid-4;
}

#intro-schools {
    @extend .grid-8;

    h4 {
    }

    li {
        @include inline-block;
        position: relative;
        padding: $base/4 0;
        padding-right: $base/2;
        @extend .small;

        &:after {
            content: "";
            position: absolute;
            right: 3px;
            top: 50%;
            width: 3px;
            height: 2px;
            background-color: #999;
        }
    }
}


/* 2.`Schools
---------------------------------------------- */

#schools {

    li {
        @extend .group;
    }

    a {
        display: block;
        float: left;
        clear: both;
        padding: $base/4;


        &:hover {

            .school_name {
                color: $mustard;
            }

            .number_of_courses, .number_of_notes {
                color: #444;
            }
        }

        span {
            @include transition( color );
        }
    }

    .icon-pair, .text-pair {
        @include inline-block;
    }

    .icon-pair {
        margin-right: $base/2;
    }

    .school_name {
        @extend .large;
        color: #333;
    }

    .number_of_courses, .number_of_notes {
        @extend .futura-oblique;
        color: #999;
    }
}

/* 3.`Courses
---------------------------------------------- */

#pg_courses {

    .main-content {
        @extend .grid-5;
    }

    .course {
        position: relative;
				clear: both;
        margin-bottom: $base/2;

        .course-name {
            display: block;
            margin-bottom: $base/4;
            @extend .plump;
            text-transform: capitalize;
            color: #000;

            &:hover {
                color: $mustard;
            }
        }

        .course-description {
            color: #777;
        }

        .course-content {
            padding-bottom: $base;
            margin-left: 60px;
            @include dotted-x( bottom );
        }

        .course-data {
            position: absolute;
            top: 0;
            color: #bfbfbf;
        }

        .course-data-item {
            margin-bottom: $base/6;
            text-align: center;
        }

        .course-data-number {
            @extend .fat;
            @extend .futura-oblique;
        }

        .course-data-description {
            margin-top: $base/-3;
        }
    }
}

/* 4.`Course
---------------------------------------------- */

#pg_lectures {

		.main-content {
		@extend .grid-5;
	}

	.lecture {
		padding-bottom: $base;
		margin-bottom: $base/2;
		@include dotted-x( bottom );
	}

	.lecture-name {
		display: block;
		margin-bottom: $base/4;
		@extend .big;
		color: #000;
		@include transition( color );

		&:hover {
			color: $mustard;
		}
	}
}

/* 5.`Notes
---------------------------------------------- */

#pg_notes {

	.main-content {
		@extend .grid-5;
	}
}