@import url('https://fonts.googleapis.com/css?family=Muli:200,400,700,700i|Roboto:100,400,400i,700,900');

.muli{
	font-family: 'Muli', sans-serif;
}

.roboto{
	font-family: 'Roboto', sans-serif;
}
.bg-blue-60{
	background-color: rgba(37, 49, 75,.6);
}

ul{
	list-style-type: none;
}

.k-nav-list, #main ul.list {
	margin-top: 0;
} 

#main ul li {
	padding-right: 2rem;
}

#main ul li ul {
	padding: 1rem;
	background-color: #fff;
}

#main ul li a {
	/*font-size: 1.5rem;*/
}

#main ul li ul li a {
	font-size: 1.25rem;
}

#main ul li ul li {
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
}

#second ul li a {
	font-size: 1.5rem;
}

#second ul li a, #main ul li a {
	text-decoration: none;
	color: #777777;
	font-weight: 400;
}


#second ul li:last-child {
	padding-right: 0;
}

#sidebar-body ul {
}
#sidebar-body ul li ul li {
	padding-bottom: 1rem;
}
#sidebar-body ul li a{
	text-decoration: none;
	color: #777777;
	font-weight: 100;

}

#main ul li:hover, 
#main ul li:focus, 
#main ul li a:hover, 
#main ul li a:focus, 
#second ul li a:hover, 
#second ul li a:focus {
	transition: color .15s ease-in-out;
}

#main ul li a:hover, #main ul li:hover, #second ul li a:hover {
	color: #568493;
}

#second .k-nav-current{
	color: #568493;
}

.camera_caption {
	right: 0;
	display: block;
	position: absolute;
	width: 50%;
	background-color: transparent;
	bottom: 5rem;
}

.camera_caption {
	padding-right: 2rem;
	top: 50%;
	bottom: 50%;
	width: 80%;
}

.camera_caption > div {
	background: none;
}

.line-decorated:before{
	content:"";
  display: block;
  position: absolute;
  z-index:-1;
  top: 50%;
  width: 100%;
  border-bottom: 2px solid #777;
}

figure {
	display: block;
	margin-block-start: 0;
	margin-block-end: 0;
	margin-inline-start: 0;
	margin-inline-end: 0;
}

#sets .w-third:nth-child(3n){
	margin-right: 0;
}

figcaption h3 {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
} 

h3 span{
	display: block;
}

#page-title h3 {
	background-color: #EEEEEE;
	margin-right: auto;
	margin-left: auto;
	padding-right: 1rem;
	padding-left: 1rem;
}

h3 span:nth-child(1){
	font-size: 36px;
	font-weight: 700;
}

h3 span:nth-child(2){
	font-size: 28px;
	font-style:italic;
}

.description p:nth-child(2){
	color: #568493;
	font-weight: 400;
	padding-top: 15px;
}

.title span:nth-child(1){
	color: #777776;
	font-weight: 700;
}

.title span:nth-child(2){
	color: #568493;
	font-weight: 700;
	font-style:italic;
	display: block;
}

#sets h3 span:nth-child(2), #page-title h3 span:nth-child(2){
	font-weight: 100;
	font-style:italic;
}

@media screen and (min-width: 30em) {
	#brand {
		width: 40px;
	}
}

@media screen and (max-width: 30em) {
	#brand {
		top: -25%;
		width: 1.5rem;
	}

	#sets h3 span:nth-child(1), #page-title h3 span:nth-child(1), #texts h3 span:nth-child(1){
		font-size: 1.5rem;
		font-weight: 700;
	}

	#sets h3 span:nth-child(2), #page-title h3 span:nth-child(2), #texts h3 span:nth-child(2){
		font-size: 1rem;
		font-style:italic;
	}
}

#icon-back-to-home{
	background: url(../images/chevron.svg);
	transform: rotate(-90deg)
}
#icon-back-to-top{
	background: url(../images/chevron.svg);
}

.chevron-down{
	background: url(../images/chevron-down.svg);
	bottom: -15px;
	width: 70px;
	height: 70px;
	background-size: contain;
	margin: 0 auto;
	left: 0;
	right: 0;
}

.chevron-down-arrow{
	margin-top: 3px;
	background: url(../images/arrow-down.svg);
	width: 25px;
	height: 25px;
	background-size: contain;
}

#pile-navigation{
	background: url(../images/pile.svg);
	top: 1.5rem;
	right: 2rem;
	width: 25px;
	height: 25px;
	background-size: contain;
}

#close-navigation{
	background: url(../images/close-icon.svg);
	top: 2em;
	right: 2em;
	width: 15px;
	height: 15px;
	background-size: contain;
}

#icon-back-to-home, #icon-back-to-top{
	top: 23%;
	right: 4em;
	width: 70px;
	height: 70px;
	background-size: contain;
}

#icon-back-to-top-mobile{
	background: url(../images/chevron_m.svg);
}

#icon-back-to-home-mobile{
	background: url(../images/chevron_m.svg);
	transform: rotate(-90deg)
}

#icon-back-to-home-mobile, #icon-back-to-top-mobile{
	bottom: 1.5rem;
	right: 0;
	width: 40px;
	height: 40px;
	background-size: contain;
}
