/** Created by Vladimir Spach, November 2014 **/


@import url('https://fonts.googleapis.com/css?family=Merriweather');
@import url('https://fonts.googleapis.com/css?family=Libre+Franklin:400,700');
@import url('https://fonts.googleapis.com/css?family=Lato:400,700');






/** The following coding design the index **/

ul.index {

	list-style-type: none;
	font-size: 1.47em;
	font-weight: bold;
	padding-left: 0;

}

.index {
	font-family: Lato, sans-serif;
	text-decoration: none;
	font-size: 1.25em;
}


/* unvisited link */
a.index:link {
    /* color: #777777;
	text-decoration: none; */
}

/* visited link */
a.index:visited {
    /* color: #8E0052; */
}

/* mouse over link */
a.index:hover {
	opacity: 0.8;
    /* color: #D7D532; */
	text-decoration: none;
}

/* selected link */
a.index:active {
    /*color: #00538E;*/
}

body > div:not(.modal) {
	background-color:white;
	padding:1% 4% 2%;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.25);
	margin-top:0;
}

body {
	margin:0;
	padding:0;
	background: #ddd;
	
	background-size: cover;
	background-attachment: fixed;
	background-position: center;
	/*background-repeat: no-repeat; */
}




/** The following coding design the font **/

h1 {

	font-family: 'Lato', sans-serif;
	font-size: 1.5em;
	color: #087f7d;
	font-size:40px;
	/* text-transform:uppercase; */
	margin-bottom: 10%;
	font-weight: normal;

}



h2 {
	font-family: 'Lato', sans-serif;
	/* text-transform:uppercase; */
	font-size: 1.5em;
	color: #087f7d;
	font-weight: normal;
	margin-top:2em;

}


p {

	font-family: 'Merriweather', serif;
	font-size: 18px;
	line-height: 1.5;
	/* max-width: 70%; */
	margin-bottom:1em;

}



li {
	font-family: 'Merriweather', serif;
	font-size: 18px;
	line-height: 1.5;
	margin-bottom: 1em;
}

ul {

	font-family: Verdana, Arial, sans-serif;
	font-size: 1em;
    padding-left: 15px;


}

td {

	font-family: Verdana, Arial, sans-serif;
	font-size: 0.9em;

}

/** The following coding design the layout **/


div {

	width: 780px;
	width:-webkit-width(800px);
	width:-moz-width(800px);
	width:-o-width(800px);
    margin: 0 auto;
	margin:-webkit-margin(0, auto);
	margin:-moz-margin(0, auto);
	margin:-o-margin(0, auto);


}

#container {
	border:dashed 1px #444;
	background: white;
}

.datamaps-bubble {
	stroke-dasharray:7;
}

.datamaps-bubble {
  /* stroke-dasharray: 100; */
  animation: dash 2.5s linear forwards infinite;
	stroke-dashoffset: 14;
}


@keyframes dash {
  to {
    stroke-dashoffset: 0;
  }
}

div.bluebox {

	box-sizing: border-box;

	/* border:5px solid #8E0052; */
	padding: 20px;
	/* -moz-border-radius:11px; */
	/* -webkit-border-radius:11px; */
	/* border-radius:11px; */
	background: #b0cae0;
	background: #d0e2e5;
	margin-bottom: 40px;


}

.bluebox p {
	max-width:none;
}

p[style*="text-align:center"] {
	max-width: none;
}

table {
	padding: 10px;
  background: #ddd;
}


td {
	padding-left: 0px;
	padding-right: 40px;
	padding-bottom: 50px;
	font-family: 'Merriweather', serif;
	font-size: 18px;
	line-height: 1.4;
}





/** The following coding design the buttons **/


.myButton {

	width: 200px;
	text-transform: uppercase;
	font-family: 'Lato', sans-serif;
/* letter-spacing: 1px; */
/* font-family: monospace, 'Libre Franklin', sans-serif; */


}

.highlight {
	background:rgba(0,200,0,0.25);
	/* background: url("paper-1816679_1920.png"); */
	/* background-size:cover; */
	padding:2em 3em;
	box-sizing: border-box;
	font-family:monospace;
	/* box-shadow: 0px 0px 10px rgba(0,0,0,0.5); */

}


.myButton, .myButton:hover {




}

.myButton {
	font-weight: bold;
}
.myButton {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    padding: .55rem .75rem;
    line-height: 1.5;
    border-radius: .25rem;
    /* transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; */
		transition: color .15s ease-in-out,background-color .1s ease-in-out,border-color .15s ease-in-out;
		color: #212529;
		color: #333;
		background-color: #ffc107;
		background-color: #a6cace;
		/* border-color: #ffc107; */
		text-decoration: none;
		font-size: 14px;
		box-shadow: 0 2px 2px 0px rgba(0,0,0,0.2);
}

.myButton:active {
	position:relative;
	top:1px;
	box-shadow: 0 2px 2px 0px rgba(0,0,0,0);
}

.myButton:hover {
	background-color: #bed9dc;
	/* background-color: #248d92; */
	/* background-color: #e0a800; */
    /* border-color: #d39e00; */
}

.navigation-bar a{
	color:#087f7d;
	text-decoration: none;
	/* opacity: 0.5; */
	font-family: 'Lato', sans-serif;
}

.navigation-bar a:hover {
	color:#a6cace;
}

.section-1 {
	color:#087f7d; /*Turquoise*/
}
.section-2 {
	color: #615a8d; /*Purple*/
}

.section-2:hover {
	color: #856c9b;
}

.part-2 h1, .part-2 h2, .part-2 .navigation-bar a {
	color: #615a8d;
}

.part-3 h1, .part-3 h2, .part-3 .navigation-bar a {
	color:#287c51;
}

.part-4 h1, .part-4 h2, .part-4 .navigation-bar a {
	color: #f26c46;
}

/* light purple: e1dbe7
mid c7bcd2
856c9b */

.part-2 .myButton {
	background-color: #c7bcd2;
}

.part-2 .myButton:hover {
	background-color: #d5cedc;
}

.part-2 .bluebox {
	background-color: #e1dbe7;
}

.part-3 .myButton {
	background-color: #b5cbb7;
}

.part-3 .myButton:hover {
	background-color: #c9dccb;
}

.part-3 .bluebox {
	background-color: #d7e2d7;
}

.section-3 {
	color: #287c51; /* green */
}

.section-4 {
	color: #f26c46; /*orange*/
}

.part-4 .bluebox {
	background: #fbe0d0;
}

.part-4 .myButton{
	background-color: #f9c6aa;
}
.part-4 .myButton:hover{
	background-color: #f5b38f;
}

.introduction {
	/* padding:2%; */
	overflow: hidden;
	box-sizing: border-box;
}

.introduction img {
	width:50%;
	width: 40%;
  margin-top: 7%;
}



.introduction-inner {
	width: 50%;
	float:left;
}

#container {
	width: 100%;
	height: 480px;
}