/*----------------------------------------------------------------------------------------------------------------*\
    PAGE CONTAINERS
\*----------------------------------------------------------------------------------------------------------------*/
.content {
    max-width: 980px;
}

.sectionHeader {
	padding-bottom: 5px !important;
	border-bottom: 1px solid #ccc !important;
	margin-bottom: 20px !important;
	
	text-align: left !important;
}

.row {
    padding: 25px 0;
}

.row.title {
    padding: 10px;
    
    background: #333;
    
    color: #fff;
    font-size: 1.5em;
    line-height: 1em;
}

.row.colours {
    padding: 20px 0 0 0;
    
    text-align: center;
}

.row img {
    width: auto;
}





/*----------------------------------------------------------------------------------------------------------------*\
    COLOURS
\*----------------------------------------------------------------------------------------------------------------*/
.colour {
	width: 200px;
	margin: 0 10px 20px 10px;
	display: inline-block;
	vertical-align: top;
	
	position: relative;
}

.colour .swatch {
	width: 70px;
	height: 70px;
	border: 1px solid #ccc;
	border-radius: 35px;
	display: inline-block;
	
    line-height: 0;
}

.colour .hex {
	font-weight: bold;
}

.colour .name,
.colour .description {
    font-size: 0.9em;
}

.colour .clipboard {
	width: 60px;
	height: 21px;
	padding: 5px;
	border-radius: 20px;
	margin-left: -30px;
	display: none;
	
	color: #fff;
	font-size: 0.7em;
	line-height: 1em;
	
	background: #333;
	
	position: absolute;
	top: 25px;
	left: 50%;
}