body {
	margin:0;
	padding: 0;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;

}

* {
    box-sizing: border-box;

	/* Specify the border colour for the document */
	border-style: solid;
	border-width: 0px;
	border-color: #C5C5C5 !important;
}

a {
	color: black;
}

img {
    display:block;
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    height:auto;
}

.row::after {
    content: "";
    clear: both;
    display: block;
}
[class*="col-"] {
    float: left;
    padding: 15px;
}

#header {
    padding: 2em;
	padding-bottom: 0em;

	margin:auto;
	width: 79%;
	text-align: center;
}
#header img {
    max-width:100%;
    height: auto;
}

#header > h1, #header > h1 a {
	font-weight: 500;
    margin-bottom: 0em;
    text-transform: uppercase;
	text-decoration:none;
}

#header > h3, #header > h3 a {
	font-weight: 300;
    margin-top: -0.7em;
    text-transform: uppercase;
    font-size: 1.5em;
	text-decoration: none;
}



#navigation {

  background-color: #f2f2f2;

}

#navigation ul {
	list-style-type:none;
	padding:0;
	margin:0;
}

#navigation li {
	margin-bottom: 0.5em;
}

#navigation a {
	color:inherit;

	text-transform: uppercase;
    font-weight: normal;
    text-decoration: none;
}

#navigation a:hover {
	text-decoration:underline;
}


#footer {
    background-color: #f2f2f2;
    text-align: center;
    padding: 2em;
}

#instructions_container {
	display: none;
}

#instructions_container img {
	border: 1px solid;
}

h2 {
	text-transform: uppercase;
	font-weight: normal;

	//margin-top: 3em;
	//margin-bottom: 1.5em;
	padding-bottom: 0.2em;
	border-bottom: solid 1px;
}

.part {
	text-transform: uppercase;
	font-weight: normal;

	margin-top: 3em;
	margin-bottom: 1.5em;
	padding-bottom: 0.2em;
	border-bottom: solid 1px;
}


.goal {
    font-size:133%;
    font-style: normal;

	max-width: 950px;

	margin-top: 0em;
    padding: 1em;

	padding-bottom: 2em;
	border-bottom: dashed 1px;
}


.goal div {
    font-size:medium;
    font-style:normal;
}

.activity_container {
	font-weight: normal;
    margin-top: 1.75em;
    border: 0.1em solid;

	padding-left: 1.2em;
	padding-right: 1.2em;

	padding-top: 1.3em;
	padding-bottom: 1.3em;

	background-color: #f2f2f2;
}


.activity {
    padding: 0.5em;

	overflow: hidden;

	background-color: #FBEDD3;
	background-color: white;
}
.activity:not(:first-child) {
	margin-top: 1.2em;
}

.activity div {
    padding: 0.2em;
}

.activity img {
	//content:url(img/gauge_1c.png);
}

.not_started img {
	content:url(img/gauge_1c.png);
}

.started img {
	content:url(img/gauge_2c.png);
}

.done img {
	content:url(img/gauge_3c.png);
}

.description {
	width:65%;
	float:left;
}

.status {
	width:23%;

	margin-top: 0.1em;
	padding-top: 0.5em!important;
	border-top: dotted 1px;
}

@media only screen and (min-width: 768px) {

	.status {
		width:23%;

		padding-left: 0.5em;
		padding-top: inherit;
		margin-top: none;
		border-top: none;
		border-left: dotted 1px;
	}


}




.uu_strategy {
    margin-bottom: 1.7em;
    padding: 0.6em;
    background-color: white;
    background-color: #383838;
    color: white;
    margin-top: -1.4em;
    margin-left: -1.7em;
    margin-right: -1.2em;
}

.uu_strategy_header{
	font-size: 1.1em!important;
    text-transform: uppercase;
    font-style: normal!important;
}

.filler {
	padding: 1px;
}

.less_high {
	padding-bottom: 1px;
}

/* For mobile phones: */
[class*="col-"] {
    width: 100%;
}
@media only screen and (min-width: 768px) {
    /* For desktop: */
    .col-1 {width: 8.33%;}
    .col-2 {width: 16.66%;}
    .col-3 {width: 25%;}
    .col-4 {width: 33.33%;}
    .col-5 {width: 41.66%;}
    .col-6 {width: 50%;}
    .col-7 {width: 58.33%;}
    .col-8 {width: 66.66%;}
    .col-9 {width: 75%;}
    .col-10 {width: 83.33%;}
    .col-11 {width: 91.66%;}
    .col-12 {width: 100%;}
}