@charset "UTF-8";
	a {
            color: #260224;
            text-decoration: none; /* Removes underline */
        }
        a:hover {
            color: #dfe594;
        }

a:focus { 
    outline: none; 
}

.Logo { max-width: 50%;}

		.nopadding {padding-left: 15px; padding-right: 15px;}


	p {font-family: "stolzl", sans-serif;
font-weight: 200;
		font-style: normal;
	color: #260224; }


.contact {text-align: right; padding-top: 10px;}

.toprowmob {margin-top: 60px;}

.sidepadding {padding-left: 20px; padding-right: 20px;}

.container-fluid { padding: 50px; background-color: #fffff4; } 
.container-fluid p {font-family: "stolzl", sans-serif;
font-weight: 200;
		font-style: normal;
	color: #260224; }

.firstrow {padding-top: 10px; }

.thumbs {padding: 25px;}

.moblogo {display: none;}

.desktoplogo {display: block;}



.arrows { padding-top: 30px }

.forwardarrow {
  display: inline-block;
  width: 90px;
  background-size: cover;
}
	
.forwardarrowstyle {
  background-image: url(https://kimjensen.co.uk/KJ_forwardarrow.svg);
}
.forwardarrowstyle:hover,
.forwardarrowstyle:focus {
  filter: invert(22%) sepia(18%) saturate(1211%) hue-rotate(204deg) brightness(106%) contrast(106%);
}
	
	
		.backwardarrow {
  display: inline-block;
  width: 90px;
  background-size: cover;
}
	
.backwardarrowstyle {
  background-image: url(https://kimjensen.co.uk/KJ_backwardarrow.svg);
}
.backwardarrowstyle:hover,
.backwardarrowstyle:focus {
  filter: invert(22%) sepia(18%) saturate(1211%) hue-rotate(204deg) brightness(106%) contrast(106%);
}





.topnav { background-color: #fffff4; padding: 8px !important; position:fixed; width: 100%; top:0%; right:0%; margin-right: 0; margin-left: 0; z-index: 99; border-bottom: 1px solid #260224; color: #260224 !important; backdrop-filter: blur(8px) !important; -webkit-backdrop-filter: blur(10px); background: rgba(255, 255, 250, 0.6) !important;
 display: flex; flex-wrap: wrap; /* Prevent wrapping */}

	.topnav p {font-family: "stolzl", sans-serif !important; font-weight: 200; font-style: normal; color: #260224; font-size: 16px; line-height: 22px; text-align: right;}

.topnav a { color:#260224; text-decoration: none;}
.topnav a:hover { color:#dfe594; text-decoration: none;}
.topnav a:active { color:#dfe594; text-decoration: none;}


.mailposition { position:fixed; width: 100%; padding: 12px; bottom:4.5%; left:93%; margin-right: 0; margin-left: 0; z-index: 101; }

.logoposition { position:fixed; width: 100%; padding: 12px; top:7%; left:3%; margin-right: 0; margin-left: 0; z-index: 102; }


.alignleft {
	float: left;
}
.alignright {
	float: right;
}

.finallogo {margin-bottom: 70px !important;}

.centredimages {
	display: inline-block;
	vertical-align:middle;
	text-align:center;
	width: 100%;
	height: 100%;
	margin-bottom: 30px;
	}

.screendivs {margin-bottom: 22px;}

.screenimages
{
	display: inline-block;
	vertical-align:middle;
	text-align:center;
	width: 100%;
	height: 100%;
	margin-bottom: 18px;
	}
	
 
		
	


	@media only screen
    and (min-device-width : 200px)
    and (max-device-width : 480px) { 
		
		.contact {text-align: right; padding-top: 3px;}

		.Logo { max-width: 15%;}
		
		.container-fluid { padding: 15px 35px 15px 35px; background-color: #fffff4; }

		
		.firstrow {padding-top: 0 !important; }

		
		.thumbs {padding: 10px !important;}
		
		
		.topnav { background-color: #fffff4; padding: 10px 4px 10px 4px !important; position:fixed; width: 100%; top:0%; right:0%; margin-right: 0; margin-left: 0; z-index: 99; border-bottom: 1px solid #260224; color: #260224 !important; background: rgba(255, 255, 250, 0.6) !important; backdrop-filter: blur(8px) !important; -webkit-backdrop-filter: blur(10px); display: flex; flex-wrap: nowrap; /* Prevent wrapping */}

.topnav p {font-family: "stolzl", sans-serif; font-weight: 200; font-style: normal; color: #260224; font-size: 20px; line-height: 22px; text-align: right;}
		
		.row {padding-bottom: 0; margin-bottom: 0;}
		
		
	
	.projectheader {font-size: 20px; line-height: 26px; text-align: center !important; padding-top: 48px; }
	
	.descriptiontext {font-size: 16px; line-height: 20px; text-align: center !important;}
	
	.ideatext { font-size: 16px; line-height: 20px; text-align: center !important;}
	
	.tagstext { font-size: 13px; line-height: 18px; text-align: center !important;}
		
		.screentext {font-size: 13px; line-height: 18px; text-align: center !important;}

		
	.leaflet { margin-bottom: 30px; margin-top: 30px;}


			.bottommargin {margin-bottom: 35px;}
		
					



@media only screen
    and (min-device-width : 480px)
    and (max-device-width : 1280px) {
		
		.topnav { background-color: #fffff4; padding: 10px; position:fixed; width: 100%; top:0%; right:0%; margin-right: 0; margin-left: 0; z-index: 99; border-bottom: 1px solid #260224; color: #260224 !important; background: rgba(255, 255, 250, 0.6) !important; backdrop-filter: blur(8px) !important; -webkit-backdrop-filter: blur(10px); display: flex; flex-wrap: nowrap;}
		
		.introtext p {font-size: 27px; line-height: 36px; text-align: center; padding-top: 40px; }
		
		.Logo { max-width: 40%;}
}
		
		
		
		.topnav { background-color: #fffff4; position:fixed; width: 100%; padding: 9px 25px 2px 25px; top:0%; right:0%; margin-right: 0; margin-left: 0; z-index: 99; }

	.topnav p {font-family: "stolzl", sans-serif; font-weight: 200; font-style: normal; color: #260224; font-size: 16px; line-height: 21px; text-align: right;}
		
}


@media screen and (min-width:2400px) { 
.topnav { background-color: #fffff4; padding: 10px; position:fixed; width: 100%; top:0%; right:0%; margin-right: 0; margin-left: 0; z-index: 99; border-bottom: 1px solid #260224; color: #260224 !important; backdrop-filter: background: rgba(255, 255, 250, 0.6) !important; blur(8px) !important;}	
	.topnav p {font-family: "stolzl", sans-serif; font-weight: 200; font-style: normal; color: #260224; font-size: 21px; line-height: 30px; text-align: right;}
	
	.Logo { max-width: 60%;}
}
		
/* CSS Document */
@charset "UTF-8";
/* CSS Document */