@media (min-width: 600px) and (max-width: 899px){
* {
		box-sizing: border-box;
		margin: 0;
		padding: 0;
				}

html, body {
		color: #000;
		font-family: Calibri, Verdana, Helvetica, Arial, sans-serif;
		font-size: 101%;
	/*	font-weight: 500;  */
		line-height: 130%;
		text-align: left;
				}
				
				
h1 {
		font-size: 260%;
		font-weight: 600;
		line-height: 116%;
				}			
			
				
h2 {
		font-size: 190%;
		font-weight: 600;
		line-height: 110%;
		margin-bottom: 30px;
		margin-top: 10px;
				}
				
h2.green {
		color: #8fb0a1;
		padding-top: 30px;
				}		
				
h2.white {
		color: #fff;
		padding-top: 30px;
				}		
				
h3 {
		font-size: 130%;
		font-weight: 500;
		line-height: 110%;		
				}		
				
h3.white {
		color: #fff;
		padding-bottom: 30px;
		padding-top: 20px;
				}		
				
p {
		font-weight: 500;
		padding: 10px 20px 10px 20px;
/*		text-align: left;  */
				}				

header {
		background-color: #8fb0a1;
		justify-content: space-between;
		position: relative;
		display: block;
		align-items: flex-end;
		padding: 15px 20px;
				}

.logo-section img {
		margin-left: 0;
		width: 140px;
		height: auto;
				}

#nav {
		inset: 0;
		background: #8fb0a1; 
		display: flex;
		align-items: center;
	/*	transform: translateY(-40px);  */
		transition: opacity .6s ease, transform .6s ease;
		z-index: 10;
		pointer-events: auto;
		opacity: 1;
		width: 100%;
		gap: 10px;
		flex-direction: row;
		justify-content: flex-end;
		height: 100%;
		flex-wrap: nowrap;
		position: static;
		margin-bottom: 1px;
		margin-left: 12px;
		margin-top: 10px;
				}

#nav.active {
		opacity: 1;
		transform: translateY(0);
		pointer-events: auto;
				}

#nav a {
		font-size: 116%;
	/*	font-weight: 500;  */
		color: #fff;
		text-decoration: none;
				}

#overlay {
		position: fixed;
		inset: 0;
		background: rgba(0,0,0,0.5);
		opacity: 0;
		pointer-events: none;
		transition: opacity .5s ease;
				}

#overlay.active {
		opacity: 1;
		pointer-events: auto;
				}

.hero {
		position: relative;
		background-image: url(/images/home-hero.jpg);
		background-size: cover;
		background-position: center center;
		background-repeat: no-repeat;
		display: flex;
	/*	align-items: center;  */
		margin: 0 auto 0 auto;
		max-width: 100%;		
		width: 100%;
		padding: 0;		
/*		padding-left: 20px;
		padding-right: 20px;  */
		height: 390px;
				}
				
.hero-text {
		text-align: center;
		margin: 0 auto;
				}
				

.hero-text h1 {
		display: inline-block;
		color: #8fb0a1;
		line-height: 1.2;
		font-size: 260%;
		margin-top: 10px;
				}
				
#pro-photo_page .hero {
		background-image: url('/professional-photography-images/professional-photographer-in-northumberland-1.webp');
				}			
				
#corp .hero {
		background-image: url('../corporate-photography-images/professional-photographer-in-sunderland.webp');
				}			
				
#events .hero {
		background-image: url('/events-images/20260325-DSC02434.webp');
				}					
				
				
				
ul.photography {
		padding: 0 0 0 20px;
		margin: 0 0 0 1px
                }

ul.photography li {
		margin: 0 0 0 20px;
		padding: 0 0 4px 4px;
		text-align: left;
                }				

.services-bar {
		background: #8fb0a1;
		display: flex;
		justify-content: space-around;
		margin: 0 auto 0 auto;
		min-width: 100%;
		flex-wrap: wrap;
		gap: 35px;
		padding: 20px 20px 8px 20px;
		flex-direction: column;
		align-items: center;
				}
				
.services-bar h2 {
		color: #fff;
		font-size: 220%;
				}	
				
#services_page .hero {
		background-image: url('/images/P1260112.jpg');
						}
						
.service-image video {
		margin-top: -3px;
		width: 100%;
		height: calc(100% + 3px);
				}							
						
						

.desc-section {
		max-width: 980px;
		margin: 20px auto;
		padding: 0 40px;
				}

			
			
				
#colin-half {
		display: none;
				}

#colin-full {
		display: block;
		width: 100%;
				}				

.story-section {
		max-width: 980px;
		display: flex;
		align-items: center;
		gap: 40px;
		margin: 30px auto 40px auto;
		padding: 0 20px;
		flex-direction: column;
				}

.story-content h2 {
		color: #8fb0a1;
		margin-bottom: 16px;
		margin-left: 20px;
				}

.story-content p {
		margin-bottom: 10px;
				}

.contact-button {
		align-items: center;
		display: inline-block;
		background-color: #8fb0a1;
		color: #fff;
		font-size: 110%;
		text-decoration: none;
		transition: opacity .3s;
		padding: 10px 20px;
		position: relative;
		left: calc(50% - 63px);
		border-radius: 9px;		
				}

.story-image img {
		width: 100%;
		height: auto;
		display: block;
				}

.why-choose-section {
		max-width: 980px;
		margin: 10px auto 30px auto;
		padding: 0 20px;
				}

.why-choose-section h2 {
		color: #8fb0a1;
		text-align: center;
		margin-bottom: 30px;
				}

.why-choose-grid {
		display: grid;
		position: relative;
		grid-template-columns: 1fr;
		gap: 40px;
				}

.why-choose-grid::before,.why-choose-grid::after {
		display: none;
				}

.why-choose-item {
		text-align: center;
				}

.why-choose-item h3 {
		font-size: 24px;
		font-weight: 700;
		color: #8fb0a1;
		margin-bottom: 8px;
				}
				
.why-choose-item p {
		padding: 10px 6px 10px 6px;
				}				


.about-section {
		background: #fff;
				}

.about-container {
		max-width: 1200px;
		margin: 0 auto;
				}

.about-container h1 {
		color: #8fb0a1;
		text-align: center;
		margin-bottom: 10px;
				}
				
/*				
				
.aboout-container > p {
		padding: 10px 30px 20px;
				}	
				
*/				

.about-intro {
	/*	text-align: center;  */
		max-width: 900px;
		margin: 0 auto 60px auto;
				}

.founder-section {
		display: flex;
		align-items: stretch;
		gap: 0;
		max-width: 1000px;
		justify-content: center;
		margin: 0 auto;
				}

.founder-image {
		flex: 1;
		position: relative;
				}

.founder-content {
		flex: 1;
		background-color: #8fb0a1;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
				}

.founder-content h2 {
		color: #fff;
		margin-bottom: 10px;
				}

.founder-content h3 {
		color: #fff;
		margin-bottom: 10px;	
				}

.industrial-gallery {
		background-color: #8fb0a1;
				}

.general-gallery {
		background-color: #fff;
				}

.gallery-container {
		max-width: 900px;
		margin: 0 auto;
				}

.gallery-container h2 {
	/*	color: #fff;  */
		text-align: center;
		margin-bottom: 0;
		padding: 4px 0 2px 0;		
				}

.main-gallery-image {
		width: 100%;
		margin-bottom: 20px;
		position: relative;
				}

.main-gallery-image img {
		cursor: pointer;
		width: 100%;
		height: 350px;
		object-fit: contain;
		display: block;
				}

.gallery-nav {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		background-color: rgba(255,255,255,0.8);
		border: none;
		cursor: pointer;
		transition: background-color .3s;
		padding: 5px 15px;
				}

.gallery-nav:hover {
		background-color: rgba(255,255,255,1);
				}

.gallery-prev {
		left: 10px;
				}

.gallery-next {
		right: 10px;
				}

.gallery-thumbnails {
		display: grid;
		gap: 15px;
		grid-template-columns: repeat(2,1fr);
				}

.gallery-thumbnails img {
		width: 100%;
		height: 120px;
		object-fit: cover;
		cursor: pointer;
		transition: opacity .3s transform .3s;
		border: 3px solid transparent;
				}

.gallery-thumbnails img:hover {
		opacity: 0.8;
		transform: scale(1.05);
				}

.gallery-thumbnails img:active {
		border-color: #8fb0a1;
				}

.industrial-gallery .gallery-thumbnails {
		display: flex;
		justify-content: center;
		overflow: hidden;
		max-width: 900px;
		gap: 10px;
		margin: 0 auto;
				}

.industrial-gallery .thumbnail-track {
		display: flex;
		gap: 10px;
		justify-content: center;		
		transition: transform .3s ease;
				}

.industrial-gallery .gallery-thumbnails img {
		width: calc((100% - 20px) / 3);
		min-width: calc((100% - 20px) / 3);
		height: 100px;
				}

.general-gallery .gallery-thumbnails {
		display: flex;
		overflow: hidden;
		max-width: 900px;
		gap: 15px;
		margin: 0 auto;
				}

.general-gallery .thumbnail-track {
		display: flex;
		gap: 15px;
		transition: transform .3s ease;
				}

.general-gallery .gallery-thumbnails img {
		width: calc((100% - 30px) / 3);
		min-width: calc((100% - 30px) / 3);
		height: 120px;
				}

.services-section {
/*		background: #f5f5f5;  */
		padding: 20px 0 60px 0;
				}

.service-item {
		max-width: 436px;
		display: flex;
		align-items: stretch;
		gap: 0;
		margin: 0 auto 80px;
		flex-direction: column;
		margin-bottom: 40px;
				}

.service-item:last-child {
		margin-bottom: 0;
				}

.service-image {
		flex: 1;
				}

.service-content {
		flex: 1;
		background-color: #8fb0a1;
		display: flex;
		flex-direction: column;
		justify-content: center;
		max-width: 30%;		
		padding: 30px 8px 20px 30px;
				}

.service-content h2 {
		color: #fff;
		margin-bottom: 25px;
				}

.founder-section,.service-item.reverse {
		flex-direction: column;
				}
				
.contact-section {
		max-width: 1200px;
		margin: 60px auto;
		padding: 0 40px;
				}

.contact-section h1 {
		color: #8fb0a1;
		margin-bottom: 20px;
				}

.contact-section > p {
/*		color: #8fb0a1;  */
/*		font-size: 16px;  */
		margin-bottom: 50px;
				}
				
.contact-section p {
	/*	font-size: 120%;  */
	/*	line-height: 1.2;  */
		padding: 0 40px;
				}				

.chat-container {
		background-color: #f5f5f5;
		border-radius: 8px;
		padding: 20px 20px 40px 20px;
				}

.chat-container h2 {
	/*	font-size: 90%;  */
		color: #8fa9a3;
		margin-bottom: 40px;
				}

.contact-info {
		display: flex;
		flex-direction: column;
		gap: 15px;
				}

.chat-container .contact-info {
/*		display: none;  */
		gap: 12px;
		margin-bottom: 20px;
		flex-direction: column;
				}

.info-item h3 {
		color: #2c3e3c;
		margin-bottom: 2px;
				}

.info-item p {
		color: #555;
				}

.contact-form {
		display: flex;
		flex-direction: column;
		gap: 6px;
				}

.form-row {
		display: grid;
		grid-template-columns: 1fr;
		gap: 6px;
				}

.form-group {
		display: flex;
		flex-direction: column;
				}

.form-group label {
		font-size: 14px;
		color: #2c3e3c;
		margin-bottom: 8px;
				}

.form-group input,.form-group textarea {
		border: 1px solid #ccc;
		border-radius: 3px;
		font-size: 14px;
		font-family: inherit;
		background-color: #fff;
		padding: 12px;
				}

.form-group input:focus,.form-group textarea:focus {
		outline: none;
		border-color: #8fa9a3;
				}
				
.form-group #firstName, .form-group #lastName, .form-group #tel {
		max-width: 200px;
				}

.form-group #email {
		max-width: 280px;
				}

.contact-form .form-group label:not(.error) {
		display: none;
				}

.contact-form label.error {
		color: #ff0000;
				}

.form-group.full-width {
		grid-column: 1 / -1;
				}

textarea {
		resize: vertical;
		min-height: 120px;
				}

.checkbox-group {
		display: flex;
		align-items: center;
		gap: 10px;
		margin-top: 10px;
				}

.checkbox-group input[type="checkbox"] {
		width: 18px;
		height: 18px;
		cursor: pointer;
				}

.checkbox-group label {
		font-size: 14px;
		color: #555;
		margin: 0;
				}

.checkbox-group a {
		color: #2c3e3c;
		text-decoration: underline;
				}

.submit-btn {
		background-color: #8fa9a3;
		color: #fff;
		border: none;
		border-radius: 3px;
		font-size: 16px;
		cursor: pointer;
		align-self: flex-start;
		transition: background-color .3s;
		padding: 12px 40px;
				}

.submit-btn:hover {
		background-color: #7a9488;
				}

.submit-btn:disabled {
		background-color: #b5c4bf;
		cursor: not-allowed;
				}
				
				
#answer {
		width: 34px;
				}				
				
				
				

.privacy-section {
		background: #fff;
		min-height: 100vh;
				}

.privacy-container {
		max-width: 800px;
		margin: 0 auto;
		padding: 0 15px;
				}

.privacy-container h1 {
		margin-bottom: 30px;
		text-align: center;
				}

.privacy-dates {
		text-align: center;
		margin-bottom: 20px;
				}

.privacy-dates p {
		font-style: italic;
		margin: 5px 0;
				}

.privacy-divider {
		border: none;
		border-top: 3px solid #000;
		width: 60px;
		margin: 30px auto;
				}

.privacy-content {
				}

.privacy-content h2 {
		margin-top: 30px;
		margin-bottom: 2px;
				}
				
nav a,.privacy-content h2 {
				}

.privacy-content h3 {
		margin-top: 12px;
		margin-bottom: 4px;
				}

.privacy-content p {
		margin-bottom: 15px;
		text-align: left;
				}

.privacy-content p strong {
				}

.funding-section {
		background: #fff;
		padding: 50px 20px 20px 20px;
				}

.funding-logos {
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 60px;
		margin-bottom: 20px;
		flex-wrap: wrap;
				}

.funding-logos img {
		height: 50px;
		width: auto;
				}

.funding-text {
		max-width: 900px;
		margin: 0 auto;
				}

footer {
		background-color: #8fb0a1;
		color: #fff;
		padding: 20px 80px 6px 110px;		
				}

.footer-content {
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		gap: 40px;
		margin: 0;
		padding: 0;
		flex-direction: column;
				}

.footer-left h3,.footer-right h3 {
		margin-bottom: 20px;
				}

.footer-left p {
		margin-bottom: 30px;
				}

.footer-bottom {
		max-width: 980px;
		display: flex;
		align-items: center;
		padding-top: 5px;
		margin: 0 auto;
		flex-direction: column;
		gap: 20px;
		text-align: center;
				}
				
.footer-website {
		font-weight: 500;
		padding-bottom: 10px;		
		padding-left: 20px;
		padding-right: 20px;
		text-align: center;
				}			
				
#ipg footer, #pro-photo_page footer, .std_page footer {
		margin-top: 20px;	/* this controls the amount of white-space (change if needed) */
		text-align: center;
				}	
				
#ipg .hero {
		background-image: url('https://www.egcimaging.co.uk/industrial-photography/industrial-photography/industrial-photography-01.webp');
				}					
				
#pro-photo_page .desc-section, #ipg .desc-section {
		padding: 0 20px;
				}				
				
#pro-photo_page .thumbnail-track, #events .thumbnail-track {
		justify-content: initial;
				}				
				

.privacy-link {
		min-width: 100px;
				}

.logo-section,.contact-item {
		display: flex;
		align-items: center;
		gap: 15px;
				}

.services-bar a:hover,.contact-button:hover {
		opacity: 0.8;
				}

.story-content,.story-image {
		flex: 1;
				}

.founder-image img:first-child,.service-image img {
		width: 100%;
		height: 100%;
		display: block;
		object-fit: cover;
				}

.founder-content p,.service-content p {
		color: #fff;
		padding-left: 0;		
				}

.founder-image,.founder-content,.service-image,.service-content {
		max-width: 100%;
				}

.founder-content,.service-content {
		padding: 10px 30px 36px 30px;
				}

.story-content p,.founder-content h3,.service-content p,.privacy-content h3 {
				}

.contact-item a {
		color: #fff;
		font-size: 105%;
		text-decoration: underline;
				}
				
.privacy-link a {
		color: #fff;
		text-decoration: underline;
				}	

.about-section,.privacy-section {
		padding: 20px 0;
				}

.about-container h1,.gallery-container h2,.service-content h2,.privacy-container h1 {
					}

.footer-left p,.contact-item a {
				}
				
.gallery-section {
		padding: 0 20px 4px 20px;
				}				

.gallery-section,footer {
		padding: 10px 20px;
				}

.footer-left, .footer-right {
		flex: 1;
		text-align: left;
				}
				
.no-padding {
		padding: 0;
				}

.why-green {
		background-color: #8fb0a1;
				}

.alt-grid .why-choose-item {
		text-align: left;
		padding: 18px 18px 10px;
				}			
				
#services_page .why-choose-section {
		margin: 23px auto;
				}

		
#services_page .why-choose-grid::before, #services_page .why-choose-grid::after, .alt-grid::before, .alt-grid::after {
		width: 0;
				}

		
#services_page .why-choose-grid {
		display: flex;
		gap: 43px;
		flex-wrap: wrap;
		justify-content: center;
				}
		
#services_page .why-choose-item h3, .why-green h3 {
		color: #fff;
		font-weight: 600;		
				}	
				
#services_page .why-choose-item p, .why-green p {
		color: #fff;
		font-weight: 500;
				}				
				
#services_page .why-choose-item {
		background-color: #8fb0a1;
		padding: 18px 18px 10px;
		flex: 1 40%;
		flex-grow: 0;
		text-align: left;
				}					

				}