/* Created 16 1005 for use with ma-design.com ////////////////////////////////////////////////////////////////// */

/* / UPDATED ::	16 1012 	*/

/* / UPDATED ::	16 1014 	- Standardised names and Screen CSS styles 	*/
/* / FINI 		 ::	16 1027 	- Standardised names and Screen CSS styles 	*/



/* PRINT Styles ///////////////////////////////////////////////////// */


	@media print {

		#Welcome .addTel,
		#Welcome p, 
		header div.logo {
			display: none;
		}
		
	}
	
				
:focus {
    outline: -webkit-focus-ring-color auto 5px;
	outline: unset;
	outline: none;
}


/* / SCREEN Styling ///////////////////////////////////////////////// */

	div#screenInfo:before { 
		white-space: pre; /* or pre-wrap */
	}
	

/* 1366x768px ///////////////      OK works */

@media screen 
	and (height: 768px)
/*  and (min-height: 768px)
  and (max-height: 800px)
  and (min-width: 1370px) 
  and (max-width: 1388px) */
   and (width: 1366px) 

{
	
	div#screenInfo:before { 
		content: "13/15' Laptop 16:9 :: w1366 x h768px update";
		background: purple;
		color: white;
	}
	
		/* LAPTOP - FILTER BUTTONS  ///// */
	.servicesButton,
	.productsButton {
		width: 10Vw;
		height: 4Vh;
		font-size: 10pt;
		line-height: 9pt;
	}
	#filterServices {
		position: relative;
		float: left;
		bottom: unset;
	}
	#filterProducts {
		position: relative;
		float: left;
		bottom: unset;
		right: unset;
		left: 0;
		
	}
	#ServicesButton,
	#ProductsButton {
		box-shadow: 
		0 5px 2px rgba(255,255,255,0), /*bottom external highlight*/ 
		0 -5px 5px rgba(0,0,0,0.1), /*top external shadow*/ 
		inset 0 -1px 1px rgba(0,0,0,0.5), /*bottom internal shadow*/ 
		inset 0 5px 5px rgba(255,255,255,0.8);
	}
	#ProductsButton {
		float: left;
		position: relative;
		left: 10px;
		top: 5px;
	}
	#ServicesButton {  /* Green = Services */
		float: left;
		position: absolute;
		top: 5px;
		left: 30px;
		.margin: 0 0 0 30px;
	}
	
	.productsButton {
		border-radius: 10px;
		padding: 0 5px;
		text-align: center;
	}
	.servicesButton {
		border-radius: 10px;
		padding: 0 5px;
		line-height: 9pt;
		text-align: center;
	}
	
	
	/* Main HEADER /// */
	#Welcome.container a.addTel {
		padding: 0 10px 0 0;
		font-size: 24pt;
		font-size: 3.8Vh;
		position: absolute;
		bottom: 0;
		right: 0;
	}
	
	
}





/* SMARTPHONES //////////////      LANDSCAPE ||  OK works */
@media screen 
  and (min-height: 325px)  /* 375px */
  and (max-height: 400px) 
  and (max-width: 760px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1) 
{	

	div#screenInfo:before { 
		content: "smartPhones LANDSCAPE :: w760 x h375px";
		background: green;
	}
	
	
	/* mini tweaks /// */
	
	/* VIP - amazing disappearing PRODUCTS SEQ = padding: 0 - watch out for this!!! */
	productsseq.products-photo {
		padding: 160px 70px 150px 70px;
	} 
	.products-photo.Left .title-section h2 {
		font-size: 20pt;
		float: right;
		text-align: right;
		padding-right: unset;
		padding-top: unset;
		margin: unset;
		position: relative;
		right: -50px;
		top: -150px;
	}
		
	#ProductsIntro.services.hidePhone {
		display: block!important;
	}
	
	#madesign {	clear: both; }
	
	.about i:before {display: none;}
		
	.products, .services {
		margin-bottom: 40px;
	}
		
	/* FILTER BUTTONS  ///// */
	
	a#filterServices, a#filterProducts {background: rgba(255,255,255,0.9);}
	a#filterServices {border-radius: 100% 0 0 0; }
	a#filterProducts {border-radius: 0 100% 0 0; }
	.servicesButton,
	.productsButton {
		width: 18Vw;
		height: 12Vh;
		font-size: 10pt;
		line-height: 9pt;
	}
	.productsButton {
		padding-top: 3px;
	}
	.servicesButton {
		padding-top: 3px;
		line-height: 9pt;
	}
	
	
	/* Font Styling //////////////// */ 
	
	.about p,
	.services p,
	.products p	{font-size: 10pt; line-height: 14pt; }
	
	p strong {
		font-size: 10pt; line-height: 16pt; 
		display: inline-block;
		width: unset;
	}
	
	
	
	
	/* Visual LOGOTYPE //// */
	
	h2 .logoWrapper {
		display: none;
	}


	/* Main PHOTOS ///// */
	events .services-photo.col-md-6, .services-photo.col-md-6, .products-photo.col-md-6 {
		height: 390px;
	}



	/* MENU Buttons ////// */
	/* tweak - to trim tthe menus to be in sync :: /// */
	#ServicesMenu li.screen {display: none;}
		#ServicesMenu li.mobile {display: none;}
		#ServicesMenu li.mobile i {display: none;}
		#ServicesMenu li.mobile .menuTitle {display: none;}
		#ServicesMenu li.mobile span {display: none;}
	
		#ServicesMenu li.tablet {display: block;}
		#ServicesMenu li.tablet i {display: block;}
		#ServicesMenu li.tablet .menuTitle {display: none;}
		#ServicesMenu li.tablet span {display: none;}
		
		#ServicesMenu li.tablet a span.menuTitle {color: lightsteelblue; padding: 0}
	
		div.menu li a {color: lightsteelblue; padding: 0}
		div.menu li a:hover{color:white!important;}
		div.menu li a span:hover{color:white!important;}
	

	#ProductsMenu li.screen {display: none;}
		#ProductsMenu li.mobile {display: block;}
		#ProductsMenu li.mobile i {display: block;}
		#ProductsMenu li.mobile .menuTitle {display: none;}
		#ProductsMenu li.mobile span {display: none;}
		#ProductsMenu li.tablet {display: none;}
		#ProductsMenu li.tablet i {display: none;}
	
		#ProductsMenu li.mobile a span.menuTitle {color: lightsteelblue; padding: 0}
	
	
	#ServicesMenu ul li, #ProductsMenu ul li {
		float: right;
	}
	#ServicesMenu ul li {
		padding-right: 20px;
	}
	#ProductsMenu ul li {
		padding-right: 30px;
	}

	


	/* Stickly LOGO //// */
	div.stickyLogo.logo a#ahrefLogo {
		height: 18Vh;
		width: 18Vh;
		position: absolute;
		top: 15px;
		left: 15px;
	}


	/* TEXT blocks //// */
	.about.col-md-6, 
	.contact-Text.Left-rh, 
	.services.col-md-6.Left, 
	.products.col-md-6.left,
	.services.col-md-6.Right, 
	.products.col-md-6.Right	{
		padding: 0px 90px 20px 90px;
	}

	.products.Left p,
	.services.Left p {
		text-align: left;
		float: left;
	}
	.products.Right p,
	.services.Right p {
		text-align: left;
	}

	
	/* Welcome Page /// */
	
	#Welcome.container {
		min-width: 250px;
		width: 25Vh;
		min-height: 250px;
		height: 25Vh;
		float: right;

		position: absolute;
		bottom: -20px;
		right: 20Vw;
		.right: unset;
		left: unset!important;
		margin: 15Vh auto;
		.overflow: hidden;
	}
	.container {
		padding-right: 8px; 
		padding-left: 8px;
	}
	.typed .logoWrapper {
		color: white;
		letter-spacing: 0;
		font-size: 24px;
		.width: 126px; /* ratio x 5.25 */
		width: calc(16 * 5.25)px; /*126px; /* ratio x 5.25 */
	}


/* SIXTY YEARS ////////////////////////// 60 Years  */

div.sixtyYears {
    background: rgba(0, 128, 0, 0);
    width: 25Vh;
    min-width: 250px;
    height: 25Vh;
    min-height: 250px;
	margin: 0 auto;
	
    border-radius: 100%;
    box-shadow: 15px 15px 30px rgba(0,0,0,0.6);
    border: 4pt ghostwhite solid;
    float: left;
    position: absolute;
    left: calc(50% - 30px - 60Vh);
    bottom: 5Vw;
	z-index: -1;
}

div.sixLine {
	width: 40Vh;
	height: 4pt;
	left: -3.0Vh;
	top: -7Vh;
}
	
	div.years {
		font-size: 5Vh;
		position: relative;
		left: 8Vh;
		top: 16Vh;		
	}
	span.fromTo {
		display: block;
		color: ghostwhite;
		font-size: 2.2Vh;
		margin-top: 10px;
		font-style: italic;
	}
	
	div.bigYears {
		color: white;
		font-size: 12Vh;
		text-align: centre;
		position: relative;
		left: 45Vh;
		top: 29Vh;
		opacity: 0.3;
	}
	
	header .logo {
		margin-top: 0;
		margin-bottom: 0;
	}
	header .row {
		margin-top: 0;
		.background: red;
		.padding-top: 50px;
	}
	header p {
		width: 100%;
		padding-bottom: 0;
	}
	p.animated.fadeInUp {
		font-size: 8pt;
		color: rgba(236,240,241,0.9);
		word-spacing: 1px;
		line-height: 12pt;
		font-weight: 400;
	
	}
	
	header .social-icons ul {
		position: relative;
		top: -22px;
		left: 5px;
		width: auto;
		float: left;
		.background: red;
		padding: 0;
	}
	header .social-icons li {
		float: left;
		margin: 0 10px 0 0;
	}
	header .social-icons li i.fa {
		font-size: 14pt;
		line-height: 25pt;
		width: 35px;
		height: 35px;
		margin-bottom: 10px;
	}
	p.animated.fadeInUp {
		position: relative;
		float: left;
		top: 20Vh;
		left: 15px;
		width: 100%;
	}

	div.drumcare.logo {
		float: left;
		position: relative;
		top: 90px;
		top: 8Vh;
	}
	header .logo img,
	header div.logo img {
		display: block;
		max-width: 50Vw;
	}
	header div.logo img {
		position: absolute;
		width: 115%;
		top: -55px;
		right: 50px;
	}

	header .mouse-wrapper {
		bottom: -30Vh;
	}
	.container a.addTel,
	#Welcome.container a.addTel {
		padding: 0 10px 0 0;
		font-size: 18pt;
		font-size: 6Vh;
		position: absolute;
		bottom: 9px;
		right: -50px;
	}



/* Association LOGOTYPES /// */
.assocList {
	position: absolute;
	top: 20px;
	right: 20px;
	.background: red!important;
	z-index: 10!important;
	width: auto
}

.assocList .screen {
    display: block; */
}

#Welcome a {color: white;}
a.assocLogo {
	width: 65px;
	margin-bottom: 10px;
	clear: both;
}

a.assocLogo.IPA.screen {
	height: 25px;
}
a.assocLogo.IPA.mobile {  /* size ratio 84% */ 
	height: 54.6px;
	width: 65px;
}


a.assocLogo.UKLA.screen {
	height: 31px;
}
a.assocLogo.UKLA.mobile {  /* size ratio 84% */ 
	height: 42px;
}

a.assocLogo.BSi.screen {
	height: 39.4px;
}
a.assocLogo.BSi.mobile {  /* size ratio 84% */ 
	height: 48.4px;
}

.assocList div.text {
	font-size: 5pt;
	text-align: center;
	color: white;
}
.assocList div.text.BSi {
	position:relative;
	top: -6px;
}




	/* h2 Text on pages //// */
	div.intro-text h2 {
		padding-bottom: 0px;
	}
	/* my Icon on page /// */
	div#myIcon i {
		display: none;
	}




	/* UL Listing Box size /// */
	.services .intro-text ul li,
	.products .intro-text ul li{
		font-size: 10pt;
		line-height: 16pt;
		padding: 5px 0 10px 0;
		clear: left;
	}

	.innovative-photo .title-section, .twitter ul, .services ul, .products ul, .Right.products .intro-text ul, .Right.services .intro-text ul, .Left.products .intro-text ul, .Left.services .intro-text ul {
		background: rgba(0,128,0,0.6);
		width: 100%!IMPORTANT;
		height: auto;
		.max-height: 320px;
		padding: 20px 35px;
		border-radius: 100%;
		box-shadow: 10px 10px 15px rgba(0,0,0,0.1);
		border: 4pt #009933 solid;
	}
	.intro-text ul li {
		margin-bottom: 5px; 
	}
	
	/* License UL Bullets list /// */
	.intro-text.Licens ul {
	    padding: 0px 0px!important;
	}
	.intro-text.Licens ul li {
		font-size: 9pt;
		line-height: 10pt;
		width: 140px;
		margin-right: 10px;
		margin-bottom: 0px; 
		padding-bottom: 5px; 
		clear: unset;
	}


	/* disposal UL List /// */
	.Soluti ul i, 
	.products .intro-text .Soluti ul i {
	   margin-bottom: 20px;
	}

	/* Tel No on botton of Products/ Service Main page /// */
	.services a.addTel,
	.products a.addTel,
	.about a.addTel.showPhone, 
	.Left a.addTel.showPhone,
	.Right a.addTel.showPhone	
	{
		display: block;
		position: relative;
		bottom: -28px;

		margin: 30px 0 0 0;
		left: unset!important;
		right: 0;
		float: right;
		font-size: 4.5Vw;
	}
	
	
		
	.contact-photo,
	#Subscribe {display: none; }
	
	.contact {
		height: auto;
		padding: 60px 0 30px;
	}
	/* Google Zoom in Out ///////// */
	
	#google-container {
		height: 300px;
	}
	#GoogleMap:before {
		content: "Our Location";
		Color: white;
		font-size: 14pt;
		padding-left: 20px;
	}
	.google-map p {
		font-size: 10pt; 
		line-height: 12pt;
		color: white
	}
	
	#zoom-in, #zoom-out {
		.height: 32px;
		.width: 32px;
		.margin-bottom: 10px;
		left: 0;
		top: 60px;
	}
	
	
	
	/* LOCATION */
	
	.contact-info {
		margin-top: 10px; 
		width: 100%;
	}

	.contact-Text.Right .title-section p {display: none}
	
	.contact-Text {
	    padding: 10px 70px 20px 0px;
	    height: auto;
	}

	.contact-Text.col-md-6 .title-section i, 
	.contact-Text.col-md-6 .title-section h2, 
	.contact-info {
		display: block;
		.background: red;
	}
		.contact-Text.col-md-6 .title-section i {
			display: none;
		}
		.contact-Text.col-md-6 .title-section h2,
		.contact-Text.col-md-6 .title-section p	{
			display: none;
		}
		
	.contact-info i {
	    padding: 60px 0 0 0;
	}
	.contact-Text.contact-info {
		margin-top: 0px;
	}
	
	.col-md-4 {
		position: relative;
		min-height: 1px;
		padding-right: 5px;
		padding-left: 55px;
		margin-bottom: 20px;
	}
	.col-md-4.phoneDetails {
		width: auto;
		float: right;
	}
	.col-md-4.emailDetails {
		width: auto;
		float: right;
	}
	.col-md-4.addressDetails {
		width: 100%;
		float: right;
	}
	
	

	
	

	
}





/* SMARTPHONES //////////////      PORTRAIT   ||  OK works */
@media screen 
  and (max-width: 375px) 
  and (max-height: 760px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1) 
{	
	

	div#screenInfo:before { 
		content: "SmartPhones PORTRAIT :: w375 x h760px";
		background: FUCHSIA;
		color: white;
	}

	/* mini tweaks /// */
	
	h1, .h1, h2, .h2, h3, .h3 {
		margin-top: 40px;
		margin-bottom: 10px;
	}

	/* VIP - amazing disappearing PRODUCTS SEQ = padding: 0 - watch out for this!!! */
	productsseq.products-photo {
		padding: 160px 70px 150px 70px;
	} 
	.products-photo.Left .title-section h2 {
		font-size: 20pt;
		float: left;
		text-align: left;
		padding-right: unset;
		padding-top: unset;
		margin: unset;
		position: relative;
		left: -40px;
		top: 130px;
	}
	
	#ProductsIntro.services.hidePhone {
		display: block!important;
	}
	
	#ProductsIntro.services ul {
		.height: auto!important;
		max-height: unset;
	}
	
	#madesign {	clear: both; }

	.about i:before {display: none;}
	
	div.intro-text { width: 100%}
	.about.col-md-6, .contact-Text.Left-rh, .services.col-md-6.Left, .products.col-md-6.left {
		padding: 0px 30px 84px 30px;
	}


	/* MENU Buttons ////// */
	/* tweak - to trim tthe menus to be in sync :: /// */
	#ServicesMenu li.screen {display: none;}
		#ServicesMenu li.mobile {display: block;}
		#ServicesMenu li.mobile i {display: block;}
		#ServicesMenu li.mobile .menuTitle {display: none;}
		#ServicesMenu li.mobile span {display: none;}
	
		#ServicesMenu li.tablet {display: none;}
		#ServicesMenu li.tablet i {display: none;}
		#ServicesMenu li.tablet .menuTitle {display: none;}
		#ServicesMenu li.tablet span {display: none;}
		
		
		div.menu li a {color: lightsteelblue; padding: 0}
		div.menu li a:hover{color:white!important;}
		div.menu li a span:hover{color:white!important;}
	

	#ProductsMenu li.screen {display: none;}
		#ProductsMenu li.mobile {display: block;}
		#ProductsMenu li.mobile i {display: block;}
		#ProductsMenu li.mobile .menuTitle {display: none;}
		#ProductsMenu li.mobile span {display: none;}
		#ProductsMenu li.tablet {display: none;}
		#ProductsMenu li.tablet i {display: none;}
	
		#ProductsMenu li.mobile a span.menuTitle {color: lightsteelblue; padding: 0}
		

	#ServicesMenu ul li, #ProductsMenu ul li {
		float: right;
	}
	#ServicesMenu ul li {
		padding-right: 12px;
	}
	#ProductsMenu ul li {
		padding-right: 30px;
	}

	/* Sticky IMAGE ///// */
	div.stickyLogo.logo a#ahrefLogo {
		height: 15Vh;
		max-height: 60px;
		width: 15Vh;
		max-width: 60px;
		top: 7px;

	}




	/* FILTER BUTTONS  ///// */
	
	.filterButtons.footer {display: none}
	
	.servicesButton,
	.productsButton {
		width: 25Vw;
		height: 6Vh;
		font-size: 10pt;
		line-height: 10pt;
	}
	.productsButton {
		padding:2px 15px 0 5px;
	}
	.servicesButton {
		padding: 2px 5px 0 0;
	}
	
	#filterProducts,
	#filterServices {
		float: unset; /*right; */
		position: unset; /*fixed; */
		right: unset; /*0; */
		bottom: 0;
	}
	div.filterButtons.showScreen {
		position: fixed;
		bottom: -7Vh;
		left: 22Vw;  
		z-index: 10000000000!important;
		background: rgba(255,255,255,0.8);
		border-radius: 50% 50% 0 0 ;
		height: 14Vh;
	}
	
	.servicesButton,
	.productsButton {
		width: 28Vw;
		height: 7Vh;
		font-size: 10pt;
		line-height: 10pt;
	}
	#ProductsButton {
		float: left;
		position: relative;
		left: 0;
	}
	.productsButton {
		background: green;
		padding: 8px 10px 0 12px;
		border-radius: 100% 0 0 0;
		Text-align: right;
	}
	#ServicesButton {
		float: right;
		position: relative;
		left: 0;
	}
	.servicesButton {
		background: red;
		padding: 4px 55px 0 10px;
		border-radius: 0 100% 0 0;
		Text-align: left;
	}
	

	
	footer {
		padding: 20px;
		padding-bottom: 15Vw;  /*/ drop the bottom down by same size as filterButtons */
	}
	
	/* Font Styling //////////////// */ 
	
	.about p,
	.services p,
	.products p	{font-size: 10pt; line-height: 14pt; }
	
	p strong {font-size: 10pt; line-height: 16pt; }
	
	.products.Left p, .services.Left p {
		text-align: left;
	}
		
	/* Welcome Page /// */
	
	div.comment{
		padding: 5Vh;
	}
	#Welcome.container {
		min-width: 300px;
		width: 28Vh;
		min-height: 300px;
		height: 28Vh;
		float: unset;
		right: unset;
		left: unset;
		position: relative;
		bottom: 0;
		margin: 45Vh auto;
		.overflow: hidden;
	}
	header .logo {
		margin-top: 0;
		margin-bottom: 0;
	}
	header .row {
		margin-top: 0;
		.background: red;
		.padding-top: 50px;
	}
	header p {
		width: 100%;
		padding-bottom: 0;
	}
	
	header .social-icons {
		position: absolute;
		margin-top: 0;
		top: -70px;
		left: -15px;
	}

	header .social-icons ul {
		position: relative;
		top: 0;
		width: auto;
		float: left;
		padding: 0;
		right: -245px
	}
	header .social-icons li {
		float: left;
		margin: 0 10px 10px 0;
	}
	header .social-icons li i.fa {
		font-size: 22px;
		line-height: 39px;
	}

	   
		
		
	p.animated.fadeInUp {
		font-size: 9pt;
		line-height: 12pt;
		font-weight: 400;
		position: relative;
		float: left;
		top: 100px;
		top: 14Vh;
		left: 26px;
	}
	div.drumcare.logo {
		float: left;
		position: relative;
		top: 90px;
		top: 8Vh;
	}
	header div.logo img {
		position: absolute;
		width: 100%;
		top: 10px;
	}
	header .logo img,
	header div.logo img {
		display: block;
		max-width: 60Vw;
	}
	header div.logo img {
		position: absolute;
		width: 110%;
		top: 0px;
		right: 13px;
	}

	header .mouse-wrapper {
		bottom: -30Vh;
	}
	.container a.addTel,
	#Welcome.container a.addTel {
		padding: 0 10px 0 0;
		font-size: 7Vw;
		position: absolute;
		bottom: 5px;
		right: -40px;
	}
	
	
	.assocList {
		position: absolute;
		top: 20px;
		right: 20px;
		.background: red!important;
		z-index: 10!important;
		width: auto
	}

	.assocList .screen {
		display: block; */
	}

	#Welcome a {color: white;}
	a.assocLogo {
		width: 65px;
		margin-bottom: 10px;
		clear: both;
	}

	a.assocLogo.IPA.screen {
		height: 25px;
	}
	a.assocLogo.IPA.mobile {  /* size ratio 84% */ 
		height: 54.6px;
		width: 65px;
	}


	a.assocLogo.UKLA.screen {
		height: 31px;
	}
	a.assocLogo.UKLA.mobile {  /* size ratio 84% */ 
		height: 42px;
	}

	a.assocLogo.BSi.screen {
		height: 39.4px;
	}
	a.assocLogo.BSi.mobile {  /* size ratio 84% */ 
		height: 48.4px;
	}

	.assocList div.text {
		font-size: 5pt;
		text-align: center;
		color: white;
	}
	.assocList div.text.BSi {
		position:relative;
		top: -6px;
	}


/* twenty Years + ZERO ///////////////////////////// 20 Years */

	div.sixtyYears {
		position: absolute;		
		top: 120px;
		left: 15px;
		background: rgba(0, 128, 0, 0);
	}
	div.sixtyZero {
		position: absolute;		
		top: 0;
		left: 130px;
		background: rgba(0, 128, 0, 0.8);
	}
	div.sixtyYears,
	div.sixtyZero {
		width: 18Vh;
		min-width: 120px;
		height: 15Vh;
		min-height: 120px;
		margin: 0 auto;
		border-radius: 100%;
		box-shadow: 15px 15px 30px rgba(0,0,0,0.6);
		border: 2pt ghostwhite solid;
		bottom: unset;
		z-index: -1;
	}
	div.sixtyZero {
		background: url('../../../simpleSite/images/17_0820-RUSSIANDOLLS-20-years-LOGO-WHITE-w200px.png')no-repeat!important;
		background-size: 100% 100%!important;
		background-position: top 0px right 0px!important;
		background-color: rgba(0,128,0,1)!important; /* Ramsden & Whale GREEN */
	}

	div.years {
		font-size: 2.5Vh;
		left: 6Vh;
		top: 15Vh;
	}
	div.yearEst {
		font-size: 1.5Vh;
		left: 6Vh;
		top: 65px;
	}

	span.fromTo {
		font-size: 1.5Vh;
		margin-top: 6px;
		font-style: italic;
		width: 120px;
	}
	div.bigYears {
		font-size: 7Vh;
		position: relative;
		left: 80px;
		top: 30px;
	}


	div.twentyYears {
		background: url('../../../simpleSite/images/17_0820-RUSSIANDOLLS-20-years-Logo-WHITE-w200px-SHADOW.png')no-repeat!important;
		background-size: 100% auto!important;
		background-position: 0px 0px;
		z-index: 1000;
		width: 32Vw;
		height: 26Vw;
		position: absolute;
		bottom: unset;
		top: 20px;
		left: 20px;
	}





	/* PAGE  /// */
	
	/* title // */
	.services .intro-text, .about .intro-text {
		padding: 0 0 0 0; */
	}


	/* H3 on TDM page /// */
	.contact-Text.Right-lh, .services.col-md-6.Right, .products.col-md-6.Right {
		padding: 0px 30px 84px 30px;
		text-align: right;
	}


	/* h2 Text on pages //// */
	div.intro-text h2 {
		padding-bottom: 0px;
	}
	/* my Icon on page /// */
	div#myIcon i {
		display: none;
	}


	/* UL Listing Box size /// */
	.intro-text ul li,
	.services .intro-text ul li,
	.products .intro-text ul li{
		font-size: 10pt;
		line-height: 14pt;
		padding: 5px 0 5px 0;
		clear: left;
	}
	.intro-text ul li {
		padding: 3px 0 3px 0;
		clear: left;
	}
	.intro-text.Licens ul li {
		margin-bottom: 5px;
	}
	.Right.services .intro-text ul,
	.intro-text.Products ul {
	    padding: 15px 15px 0px 35px;
	}
	.Right.services .intro-text ul li {
		font-size: 10pt;
		line-height: 11pt;
		padding: 2px 0 2px 0;
		clear: left;
	}
		
	.intro-text ul,
	.services ul, 
	.products ul,
	.Right.products .intro-text ul, 
	.Right.services .intro-text ul {
		.right: 2Vw;
	   . bottom: 0Vw;
		height: 45Vh!important;
		width: 45Vh!important;
	}
	.Right.products .intro-text ul, .Right.services .intro-text ul {
		float: right;
	}
	
	/* License UL Bullets list /// */
	.intro-text.Licens ul {
	    padding: 0px 0px!important;
	}
	.intro-text.Licens ul li {
		font-size: 9pt;
		line-height: 10pt;
		width: 132px;
		margin-right: 10px;
		margin-bottom: 0px; 
		padding-bottom: 5px; 
		clear: unset;
	}

	/* Products Listing ////// */
	#ProductsIntro .intro-text.Products ul {
		padding: 10px 0 0 0px;
	}
	#ProductsIntro .intro-text.Products ul li {
		line-height: 11pt;
		margin-bottom: 5px;
	}


	/* disposal UL List /// */
	.Soluti ul i, 
	.products .intro-text .Soluti ul i {
	   margin-bottom: 20px;
	}

	/* Tel No on botton of Products/ Service Main page /// */
	.services a.addTel,
	.products a.addTel,
	.about a.addTel.showPhone, 
	.Left a.addTel.showPhone,
	.Right a.addTel.showPhone	{
		display: block;
		float: right;
		left: unset!important;
		right: 30px;
	}
	
	.contact-photo,
	#Subscribe {display: none; }
	
	.contact {
		.height: auto;
		.padding: 60px 30px 30px 30px;
	}
	
	/* Brand Slogan ////// */
	
	.Right .brandSlogan {
		float: right;
		right: 60px;
	}


	
	/* Google Zoom in Out ///////// */
	
	.google-map p {
		font-size: 10pt; 
		line-height: 12pt;
		color: white
	}
	
	#zoom-in, #zoom-out {
		.height: 32px;
		.width: 32px;
		.margin-bottom: 10px;
		left: 0;
	}
	
	/* LOCATION */
	.contact-Text.Right .title-section p {display: none}
	
	.contact-Text {
	    padding: 10px 30px 20px 30px;
	    height: auto;
	}

	.contact-Text.col-md-6 .title-section i, 
	.contact-Text.col-md-6 .title-section h2, 
	.contact-info {
		display: block;
		.background: red;
	}
		.contact-Text.col-md-6 .title-section i {
			display: none;
		}
		.contact-Text.col-md-6 .title-section h2,
		.contact-Text.col-md-6 .title-section p	{
			display: none;
		}
		
	.contact-info i {
	    padding: 60px 0 0 0;
	}
	.contact-Text.contact-info {
		margin-top: 0px;
	}
	
	.col-md-4 {
		position: relative;
		min-height: 1px;
		padding-right: 5px;
		padding-left: 55px;
		margin-bottom: 20px;
	}
	.col-md-4.phoneDetails {
		width: auto;
		float: right;
	}
	.col-md-4.emailDetails {
		width: auto;
		float: right;
	}
	.col-md-4.addressDetails {
		width: 100%;
		float: right;
	}
	
	
	/* E-Mail US //////////// */
	
	.col-md-10 {
		width: unset;
		padding: 0 0;
	}
	
	/* Contact Us Page  //////////// */
	
	.contactBlock {
		margin-right:20px;
	}
	.col-md-10 {
		width: unset;
		padding: 0 0 0 20Vw;
	}
	.contact {
		padding: 165px 20px 0px 20px;
	}


}





/* iPad ////////////// */      /* LANDSCAPE   OK works */
@media screen 
  /* and (min-width: 1000px) 
  and (max-width: 1024px)  */
  and (width: 1024px) 
 /* and (min-height: 700px) */
  and (height: 768px) 
/*  and (max-height: 768px) */
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1)
{
		
	div#screenInfo:before { 
		content: "iPad LANDSCAPE :: w1024 x h768px";
		background: blue;
		color: white;
	}

	
	/* Hidden SHOW MENUS //// */
	
	.showPhone {display: block;} 
	#twitter.hidePhone {display: none;}
	#Overview.hidePhone {display: none;}
	.hidePhone {display: none;}
	
	
	/* MENU Buttons ////// */
	/* tweak - to trim tthe menus to be in sync :: /// */
	#ServicesMenu li.screen {display: none;}
		#ServicesMenu li.mobile {display: none;}
		#ServicesMenu li.mobile i {display: none;}
		#ServicesMenu li.mobile .menuTitle {display: none;}
		#ServicesMenu li.mobile span {display: none;}
		
		#ServicesMenu li.tablet {display: block;}
		#ServicesMenu li.tablet i {display: none;}
		#ServicesMenu li.tablet .menuTitle {display: inline-block;}
		#ServicesMenu li.tablet span {display: inline-block;}
		
		#ServicesMenu li.tablet a span.menuTitle {color: lightsteelblue; padding: 0}
		#ServicesMenu div.menu li:hover{color:white;}
		div.menu li a span:hover{color:white!important;}
	

	#ProductsMenu li.screen {display: none;}
		#ProductsMenu li.mobile {display: block;}
		#ProductsMenu li.mobile i {display: none;}
		#ProductsMenu li.tablet {display: none;}
		#ProductsMenu li.tablet i {display: none;}
	
		#ProductsMenu li.mobile a span.menuTitle {color: lightsteelblue; padding: 0}
		

		
		
	/* mini tweaks /// */
	.intro-text h2 {
		padding-bottom: 0px;
	}
	div.menuWrapper {
		font-size: 11pt;
	}

	
	#madesign {clear: both;}
	.about i:before {display: none;}
	
	
	/* FILTER BUTTONS  ///// */
		
	.filterButtons.footer {display: none}
	
	.servicesButton, .productsButton {
		z-index: 10000000000!important;
	}
	
	/* VIP FilterBUTTONS on or off //// */
	.div.showScreen {display: none}
	div.showScreen {display: block}
	div.hideScreen.showPhone {display: none!important}
	
	div.filterButtons.showScreen {
		position: fixed;
		bottom: 0px;
		left: 35Vw;  
		z-index: 10000000000!important;
	}
	

	#filterProducts, 
	#filterServices {
		background: rgba(255,255,245,0.9);
		position: relative;
		float: unset;
		bottom: unset;
		right: unset;
		top: unset;
	}
	#filterServices {
		float: left;
		border-radius: 100% 0 0 0;
	}
	#filterProducts {
		float: left;
		border-radius: 0 100% 0 0;
	}
	
	.servicesButton,
	.productsButton {
		width: 15Vw;
		height: 8Vh;
		font-size: 11pt;
		line-height: 12pt;
	}
	#ProductsButton {
		float: left;
		position: relative;
		left: 0;
		top: 0;
	}
	.productsButton {
		padding: 0 15px 0 12px;
		background: red;
		border-radius: 0 100% 0 0;
		text-align: left;
	}
	
	#ServicesButton {
		position: relative;
		left: 0;
		top: 0;
	}
	.servicesButton {
		padding: 0 15px 0 55px;
		background: green;
		border-radius: 100% 0 0 0;
		text-align: right;
	}
	footer {
		padding: 20px;
		padding-bottom: 8Vw;  /*/ drop the bottom down by same size as filterButtons */
	}


		
	/* Welcome Page /// */
	
	#Welcome.container {
		left: calc(50% + 30px);
	}
	#Welcome.container,
	div.sixtyYears	{
		bottom: 18Vh;
	}
	div.sixtyYears {
		left: calc(50% - 110px - 30Vh);
	}
	div.sixLine {
		left: -7Vh;
		top: -7.1Vh;
	}
	div.bigYears {
		left: 25Vh;
		top: 19Vh;
	}

	p.animated.fadeInUp {
		width: 100%;
		position: absolute;
		top: 22Vh;
		left: 25px;
	}
	#Welcome.container a.addTel {
		position: absolute;
		bottom: 22px;
		right: -34px;
	}
	
	header div.logo, header div.logo img {
		max-width: 36Vw;
		Height: auto;
	}
	header div.logo img {
		position: absolute;
		width: 120%;
		top: -70px;
		right: 53px;
	}
	header .social-icons {
		top: -80px;
		right: -25px;
		width: 50px;
	}
	header .social-icons li i.fa {
		width: 45px;
		height: 45px;
		font-size: 24px;
		line-height: 42px;
		margin-bottom: 10px;
	}



	
	
	/* Stickly LOGO //// */
	div.stickyLogo {
		position: -webkit-sticky;
		position: sticky;
		top: 65px;
		z-index: 1000;
	}
	div.stickyLogo.logo a#ahrefLogo {
		height: 15Vh;
		width: 15Vh;
		position: absolute;
		top: -55px;
		left: 15px;
	}
	
	/* Text / Page ////////////////////////////////////////// */
	
	
	/* Visual LOGO /// */
	
	div.drumcare.logo {
		float: left;
		position: relative;
		top: 0px;
		.top: 10Vh;
		left: -60px;
	}
	
	/* Visual Logo /// */
	.Right .intro-text h2 .logoWrapper {
		position: relative;
		right: unset;
		float: LEFT; 
	}
	
	.services h2, .products h2,
	.about h2, .innovative h2, .section h2, .contact-Text .title-section h2, .team-photo .title-section h2, .team h2 {
		.font-family: 'Oranienbaum', serif;
		font-family: 'Oswald', sans-serif;
		font-size: 16pt;
		font-style: normal;
	}

	 h3, 
	.about h3,
	.services h3,
	.products h3 {
		margin-top: 20px;
		margin-bottom: 10px;
		text-align: right;
		clear: both;
	}
	.about h3 {
		margin-top: 50px;
		margin-bottom: 50px;
		text-align: right;
		clear: both;
	}

	/* TEXT ////////// */
	.intro-text {
		width: 100%;
		padding: 0!important;
	}

	.about.col-md-6, .contact-Text.Left-rh, 
	.services.col-md-6.Left, .products.col-md-6.left,
	.services.col-md-6.Right, .products.col-md-6.Right,
	.services.Right, .products.Right 	{
		padding: 0px 70px 84px 120px;
		min-height: 500px;
	}
	
	p strong,
	.about p, 
	.products p, .services p,
	.services.Left p, .products.Left p,
	.Left.products p .Left.services p,
	.Right.products p .Right.services p	{
		display: inline-block;
		width: 400px;
		text-align: left;
		float: left;
		clear: both;
	}
	
	.about, .about.col-md-6, .services.col-md-6.Left, .products.col-md-6.Left, .services.Left p, .products.Left p {
		text-align: left;
	}
	
	
	/* UL Listing Box size /// */
	.services .intro-text ul li,
	.products .intro-text ul li{
		font-size: 10pt;
		line-height: 16pt;
		padding: 5px 0 5px 0;
		clear: left;

	}

	.innovative-photo .title-section, .services ul, .products ul, .Right.products .intro-text ul, .Right.services .intro-text ul, .Left.products .intro-text ul, .Left.services .intro-text ul {
		background: rgba(0,128,0,0.6);
		width: 100%!important;
		height: auto;
		.max-height: 320px;
		padding: 20px 35px;
		border-radius: 100%;
		box-shadow: 5px 5px 10px rgba(0,0,0,0.6);
		border: 4pt #009933 solid;
	}
	.intro-text ul li {
		margin-bottom: 5px; 
	}

	
	/* twitter BLOCK /// */
	.twitter ul {
		background: rgba(0,128,0,0.6);
		.width: 100%!important;
		width: 420px;
		.height: auto;
		height: 420px;
		padding: 20px 35px;
		border-radius: 100%;
		box-shadow: 5px 5px 10px rgba(0,0,0,0.6);
		border: 4pt #009933 solid;
	}
	
	
	/* disposal UL List /// */
	.Soluti ul i, 
	.products .intro-text .Soluti ul i {
	   margin-bottom: 20px;
	}
		
	/* Tel No on botton of Products/ Service Main page /// */
	.services a.addTel,
	.products a.addTel,
	.about a.addTel.showPhone, 
	.Left a.addTel.showPhone,
	.Right a.addTel.showPhone	{
		display: block;
		float: right;
		left: unset!important;
		right: 70px;
	}
	
	.contact-photo,
	#Subscribe {display: none; }
	
	.contact {
		.height: auto;
		.padding: 60px 30px 30px 30px;
	}
	
	/* Google Zoom in Out ///////// */
	
	#GoogleMap:before {
		content: "Our Location";
		Color: white;
		font-size: 14pt;
		padding-left: 20px;
	}
	
	.google-map p {
		font-size: 10pt; 
		line-height: 12pt;
		color: white
	}
	
	#zoom-in, #zoom-out {
		.height: 32px;
		.width: 32px;
		.margin-bottom: 10px;
		left: 0;
	}
	
	/* LOCATION */
	.contact-Text.Right .title-section p {display: none}
	
	/* tweak to remove hidden text from displaying ?? */
	
	#Location .showScreen.hidePhone,
	.contact-Text.col-md-6.Left-rh.showScreen.hidePhone {
		display: none!important;
	}
	#Location div.hideScreen.showPhone {
		display: block!important;
	}


	.intro-text ul li {
		margin-bottom: 5px; 
	}
	
	/* License UL Bullets list /// */
	.intro-text.Licens ul {
	    padding: 0px 0px!important;
	}
	.intro-text.Licens ul li {
		font-size: 9pt;
		line-height: 10pt;
		width: 140px;
		margin-right: 10px;
		margin-bottom: 0px; 
		padding-bottom: 5px; 
		clear: unset;
	}


	/* disposal UL List /// */
	.Soluti ul i, 
	.products .intro-text .Soluti ul i {
	   margin-bottom: 20px;
	}

	.contact-Text {
	    padding: 10px 30px 20px 30px;
	    height: auto;
		.min-height: 550px;
	}

	/* IMPORTANT to avoid 500% spilt of screen /// */
	.contact-Text.col-md-6 {
		width: 100%;
	}
	
	.contact-info {
		margin-top: 30px; 
		width: 100%;
	}
	
	.contact-Text.col-md-6 .title-section i, 
	.contact-Text.col-md-6 .title-section h2, 
	.contact-info {
		display: block;
		.background: red;
	}
		.contact-Text.col-md-6 .title-section i {
			display: none;
		}
		.contact-Text.col-md-6 .title-section h2,
		.contact-Text.col-md-6 .title-section p	{
			display: none;
		}
		
	.contact-info i {
	    padding: 60px 0 0 0;
	}
	.contact-Text.contact-info {
		margin-top: 0px;
	}
	
	.col-md-4 {
		position: relative;
		min-height: 1px;
		padding-right: 5px;
		padding-left: 55px;
		margin-bottom: 20px;
	}
	.col-md-4.phoneDetails {
		width: auto;
		float: right;
	}
	.col-md-4.emailDetails {
		width: auto;
		float: right;
	}
	.col-md-4.addressDetails {
		width: 100%;
		width: auto;
		float: right;
	}
	
	
	/* E-Mail US //////////// */
	
	.col-md-10 {
		width: 100%;
		padding: 0 20Vw;
	}


	
	
}





/* iPad ////////////// */      /* PORTRAIT   OK works */

@media screen 
  and (min-width: 768px) 
  and (max-width: 1024px) 
   and (max-height: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1)
{
	
	div#screenInfo:before { 
		content: "iPad PORTRAIT :: w768 x h1024px";
		background: orange;
	}
	
		.showPhone {display: block;} 
		.hidePhone {display: none;}
	
	/* Set PAGE SIZE 768x1024px /// */
	
	.about.col-md-6, .contact-Text.Left-rh, 
	.services.col-md-6.Left, .products.col-md-6.left,
	.services.col-md-6.Right, .products.col-md-6.Right,
	.services.Right, .products.Right 	{
		min-height: 524px;
	}
	.services-photo,
	.products-photo
	{
		height: 500px;
	}
	
		
	/* mini tweaks /// */
	
	#ServicesIntro .services.col-md-6.Left .hidePhone { display: block!important}
	
	#ServicesIntro.hidePhone { display: block!important}
	
	#madesign {clear: both; }

	.about i:before {display: none;}
	

	/* MENU Buttons ////// */
	/* tweak - to trim tthe menus to be in sync :: /// */
	#ServicesMenu li.screen {display: none;}
		#ServicesMenu li.mobile {display: none;}
		#ServicesMenu li.mobile i {display: none;}
		#ServicesMenu li.mobile .menuTitle {display: none;}
		#ServicesMenu li.mobile span {display: none;}
		
		#ServicesMenu li.tablet {display: block;}
		#ServicesMenu li.tablet i {display: inline-block;}
		#ServicesMenu li.tablet .menuTitle {display: none;}
		#ServicesMenu li.tablet span {display: none;}
		
		#ServicesMenu li.tablet a span.menuTitle {color: lightsteelblue; padding: 0}
		#ServicesMenu div.menu li:hover{color:white;}
		div.menu li a span:hover{color:white!important;}
	

	#ProductsMenu li.screen {display: none;}
		#ProductsMenu li.mobile {display: block;}
		#ProductsMenu li.mobile i {display: none;}
		#ProductsMenu li.tablet {display: none;}
		#ProductsMenu li.tablet i {display: none;}
	
		#ProductsMenu li.mobile a span.menuTitle {color: lightsteelblue; padding: 0}
		

	#ServicesMenu ul li,
	#ProductsMenu ul li	{
		padding-right: 20px;
	}

	div.menu li a {
		color: lightsteelblue;
		padding: 0;
	}
	div.menu li.Serv17 i.fa.fa-database.fa-spin {
		color: yellow!important;
		padding: 0;
	}
	

	/* FILTER BUTTONS  ///// */
	.servicesButton,
	.productsButton {
		width: 13Vw;
		height: 5Vh;
		font-size: 10pt;
		line-height: 10pt;
	}
	.productsButton {
		padding:2px 15px 0 5px;
	}
	.servicesButton {
		padding: 2px 5px 0 0;
	}
	
	
	/* FILTER BUTTONS  ///// */
	.servicesButton, .productsButton {
		z-index: 10000000000!important;
	}
	
	/* VIP FilterBUTTONS on or off //// */
	.div.showScreen {display: none}
	div.showScreen {display: block}
	div.hideScreen.showPhone {display: none!important}
	
	div.filterButtons.showScreen {
		position: fixed;
		bottom: 0px;
		left: 35Vw;  
		z-index: 10000000000!important;
	}
	
	.div.hideScreen.showPhone {
		position: fixed;
		bottom: 0px;
		left: 35Vw;  
		z-index: 10000000000!important;
	}
	
	#filterProducts,
	#filterServices	{
		background: rgba(255,255,245,0.9);
		position: relative;
		float: unset;
		bottom: unset;
		right: unset;
	}
	#filterServices {
		float: left;
		border-radius: 100% 0 0 0;
	}

	.servicesButton,
	.productsButton {
		width: 15Vw;
		height: 6Vh;
		font-size: 11pt;
		line-height: 12pt;
	}
	#ProductsButton {
		float: left;
		position: relative;
		left: 0;
	}
	.productsButton {
		padding: 5px 15px 0 12px;
		background: red;
		border-radius: 0 100% 0 0;
		Text-align: left;
	}
	#ServicesButton {
		position: relative;
		left: 0;
	}
	.servicesButton {
		padding: 5px 15px 0 12px;
		background: green;
		border-radius: 100% 0 0 0;
		text-align: right;
	}
	footer {
		padding: 20px;
		padding-bottom: 8Vh;  /*/ drop the bottom down by same size as filterButtons */
	}
	
	
	
	
	/* Welcome Page /// */
	
	div.comment{
		padding: 5Vh;
	}
	#Welcome.container {
		min-width: 300px;
		width: 28Vh;
		min-height: 300px;
		height: 28Vh;
		float: unset;
		right: unset;
		left: unset;
		position: relative;
		bottom: 0;
		margin: 25Vh auto;
		.overflow: hidden;
	}
	header .logo {
		margin-top: 0;
		margin-bottom: 0;
	}
	header .row {
		margin-top: 0;
		.background: red;
		.padding-top: 50px;
	}
	header p {
		width: 100%;
		padding-bottom: 0;
	}
	
	header .social-icons {
		position: absolute;
		margin-top: 0;
		top: -70px;
		left: -15px;
	}

	header .social-icons ul {
		position: relative;
		top: 0;
		width: auto;
		float: left;
		.background: red;
		padding: 0;
	}
	header .social-icons li {
		float: left;
		margin: 0 10px 0 0;
	}
	p.animated.fadeInUp {
		font-size: 9pt;
		line-height: 12pt;
		font-weight: 400;
		position: relative;
		float: left;
		top: 140px;
		.top: 20Vh;
		.background: yellow;
	}

	header div.logo img {
		position: absolute;
		width: 100%;
		top: 10px;
		right: -20px;
	}
	header .logo img,
	header div.logo img {
		display: block;
		max-width: 60Vw;
	}
	header .mouse-wrapper {
		bottom: -30Vh;
	}
	.container a.addTel,
	#Welcome.container a.addTel {
		padding: 0 10px 0 0;
		font-size: 3.8Vw;
		position: absolute;
		bottom: 0;
		right: 0;
	}


	/* Sticky MENU /// */
	div.menu, div.menu ul, 
	#ServicesMenu ul li, 
	#ProductsMenu ul li {
		letter-spacing: -0.8px;
	}
	/* Stickly LOGO //// */
	div.stickyLogo {
		position: -webkit-sticky;
		position: sticky;
		top: 65px;
		z-index: 1000;
	}
	div.stickyLogo.logo a#ahrefLogo {
		height: 9Vh;
		width: 9Vh;
		position: absolute;
		top: -55px;
		left: 15px;
	}
	
	

	/* Text / Page /// */
	
	/* Visual LOGO /// */
	div.drumcare.logo {
		float: left;
		position: relative;
		top: 90px;
		top: 0;
		left: -60px;
	}
	.Right .intro-text h2 .logoWrapper {
		position: relative;
		right: UNSET;
		float: LEFT; */
	}
	
	/* Products Page /// */
	/* hide visual log on Companys/ Products pages */
	
	#Products div.drumcare.logo { visibility: hidden;}
	.products-photo.Left .title-section h2 {
		float: right;
		text-align: right;
		padding-right: 40px;
		padding-top: 20px;
		margin: 0;
	}


	/* Service pages /// */
	.intro-text h2 {
		padding-bottom: 0;
	}

	.services h2, .products h2,
	.about h2, .innovative h2, .section h2, .contact-Text .title-section h2, .team-photo .title-section h2, .team h2 {
		.font-family: 'Oranienbaum', serif;
		font-family: 'Oswald', sans-serif;
		font-size: 16pt;
		font-style: normal;
	}

	 h3, .h3,
	.services h3,
	.products h3 {
		margin-top: 20px;
		margin-bottom: 40px;
		text-align: right;
		clear: both;
	}

	.intro-text {
		width: 100%;
		padding: 0!important;
	}

	.about.col-md-6 {
		padding: 100px 40px 84px 120px;
	}
	.contact-Text.Left-rh, 
	.services.col-md-6.Left, .products.col-md-6.left,
	.services.col-md-6.Right, .products.col-md-6.Right,
	.services.Right, .products.Right 	{
		padding: 0px 40px 84px 120px;
	}
	
	p strong,
	.about p, 
	.products p, .services p,
	.services.Left p, .products.Left p,
	.Left.products p .Left.services p,
	.Right.products p .Right.services p	{
		display: inline-block;
		width: 400px;
		text-align: left;
		float: left;
	}
	
	.about, .about.col-md-6, .services.col-md-6.Left, .products.col-md-6.Left, .services.Left p, .products.Left p {
		text-align: left;
	}

	
	/* Tel No on botton of Products/ Service Main page /// */
	.services a.addTel,
	.products a.addTel,
	.about a.addTel.showPhone, 
	.Left a.addTel.showPhone,
	.Right a.addTel.showPhone	{
		display: block;
		float: right;
		left: unset!important;
		right: 40px;
	}
	

	.contact-photo,
	#Subscribe {display: none; }
	
	.contact {
		.height: auto;
		.padding: 60px 30px 30px 30px;
	}
	
	/* Google Zoom in Out ///////// */
	
	#GoogleMap:before {
		content: "Our Location";
		Color: white;
		font-size: 14pt;
		padding-left: 20px;
	}
	
	.google-map p {
		font-size: 10pt; 
		line-height: 12pt;
		color: white
	}
	
	#zoom-in, #zoom-out {
		.height: 32px;
		.width: 32px;
		.margin-bottom: 10px;
		left: 0;
	}
	
	/* LOCATION */
	.contact-info {
		margin-top: 30px; 
		margin-left: 0;
		width: 100%;
	}
	
	/* tweak to remove hidden text from displaying ?? */
	
	#Location .showScreen.hidePhone,
	.contact-Text.col-md-6.Left-rh.showScreen.hidePhone {
		display: none!important;
	}
	#Location div.hideScreen.showPhone {
		display: block!important;
	}


	
	.contact-Text.Right .title-section p {display: none}
	
	/* Contact Page size */
	.contact {
		height: 883px;  /* 1024 minus 137px from footer */
	}
	.contact-Text {
	    padding: 10px 30px 20px 30px;
	    height: auto;
		height: 424px;
	}

	.contact-Text.col-md-6 .title-section i, 
	.contact-Text.col-md-6 .title-section h2, 
	.contact-info {
		display: block;
		.background: red;
	}
		.contact-Text.col-md-6 .title-section i {
			display: none;
		}
		.contact-Text.col-md-6 .title-section h2,
		.contact-Text.col-md-6 .title-section p	{
			display: none;
		}
		
	.contact-info i {
	    padding: 60px 0 0 0;
	}
	.contact-Text.contact-info {
		margin-top: 0px;
	}
	
	.col-md-4 {
		position: relative;
		min-height: 1px;
		padding-right: 5px;
		padding-left: 55px;
		margin-bottom: 20px;
	}
	.col-md-4.phoneDetails {
		width: auto;
		float: right;
	}
	.col-md-4.emailDetails {
		width: auto;
		float: right;
	}
	.col-md-4.addressDetails {
		width: 100%;
		float: right;
	}
	
	
	/* E-Mail US //////////// */
	
	.col-md-10 {
		width: unset;
		padding: 0 15Vw;
	}

	
}






/* 19" screen 4x3 ////////////// */
@media screen 
   and (min-width: 1250px) 
   and (max-width: 1600px) 
   and (min-height: 1180px) 
   and (max-height: 1280px) 
{
	
	/* SCREEN SIZE CHECKER //////////////////// */
	div#screenInfo:before { 
		content: "19 inch Monitor :: w1600 x h1280px";
		background: DEEPPINK;
	}
	



}






/* HD laptop screen 16x9 ///////////// */ /* OK works  on 1366x768*/
@media screen 
	and (min-height: 850px) /* 865 */
	and  (max-height: 1050px) /* 1042 */
	and (min-width: 1730px)  /*1745 */
	and (max-width: 1920px) /* 1920 */

{

	/* SCREEN SIZE CHECKER //////////////////// */
	div#screenInfo:before { 
		content: "HD Laptop :: w1920 x h1050px";
		background: DEEPPINK;
	}
	
	


}






/* 27" HD laptop screen 16x9 ///////////// */

/* and (min-height: 1280px) /* 1350 */
/*.and  (max-height: 1400px) /* 1350 */
/* and (min-width: 1950px)  /* 2182 */
/* .and (max-width: 3500px) /* 2400 */

@media screen 
	and (min-width: 1920px) 
/*	and (max-width: 3500px) /* 2400 */
/*	and (min-height: 1300px)  */
{
	
	/* SCREEN SIZE CHECKER //////////////////// */
	div#screenInfo:before { 
		content: "27 inch Monitor :: w2200 x h1350px";
		background: BLACK;
		color: WHITE;
		
		.width: 10Vw;
		width: 220px;
		.Height: 10Vh;
		height: 135px;
	}
	
	/* Logotype on Welcome */
	header div.logo img {
		position: absolute;
		width: 120%;
		top: -58px;
		right: 65px;
	}
	.welcome a.addTel, .container a.addTel, .subscribe a.addTel, .contact a.addTel, .contact-photo a.addTel {
		font-size: 2Vw;
	}
	p.animated.fadeInUp {
		top: 17Vh;
	}
	
	div.sixLine {
		width: 30Vh;
		left: -5.0Vh;
		top: -7.4Vh;
	}
	div.years {
		font-size: 2.5Vh;
		left: 5Vh;
		top: 8Vh;
	}
	span.fromTo {
		font-size: 1.7Vh;
		margin-top: 10px;
		font-style: italic;
	}
	div.bigYears {
		font-size: 15Vh;
		position: relative;
		left: 25Vh;
		top: 10Vh;
		opacity: 0.3;
	}
	div.sixtyYears {
		left: calc(50% - 30px - 26Vh);
		bottom: 10Vw;
	}
	
	
	
}

/* My TOSHIBA USB Screen ////////// */

@media screen 
  and (min-width: 1650px) /* OK works  on 1366x768*/
  and (max-width: 1708px) 
  and (min-height: 840px) 
  and (max-height: 970px) /* OK works  on 1366x768*/
{

	/* SCREEN SIZE CHECKER //////////////////// */
	div#screenInfo:before { 
		content: "My TOSHIBA USB Screen :: w1708 x h960px";
		background: SPRINGGREEN;
	}
	
	
	
	
	

	
}



/* DAWN'S @ Ramsdens 1024 x 819px ///////////////      in development */

@media screen 
	and (height: 819px)
/*  and (min-height: 768px)
  and (max-height: 800px)
  and (min-width: 1370px) 
  and (max-width: 1388px) */
   and (width: 1024px) 

{
	
	div#screenInfo:before { 
		content: "Dawn's Monitor \A Ramsden & Whale Limited \A \A Screen Size: \A 4x3 :: w1024 x h819px \A \A Dawn, sorry but you really do \A need a new monitor \A Clive :-)";
		white-space: pre; /* or pre-wrap */
		background: rgba(0,128,0,1); /* green */
		color: white;
	}
	
	/*	.showPhone {display: block;} 
		.hidePhone {display: none;} 
	*/
	
	/* Set PAGE SIZE 768x1024px /// */
	
	.twitter,
	.google-map,
	.subscribe,
	.team-photo, .contact-photo, .contact,
	.about.col-md-6, .contact-Text.Left-rh, 
	.services.col-md-6.Left, .products.col-md-6.left,
	.services.col-md-6.Right, .products.col-md-6.Right,
	.services.Right, .products.Right 	{
		.min-height: 600px;
		height: 600px;
		width: 50%; /*!important; */
	}
	.services-photo,
	.products-photo
	{
		height: 600px;
		width: 50%!important;
	}
	
		
	/* mini tweaks /// */
	
	#ServicesIntro .services.col-md-6.Left .hidePhone { display: block!important}
	
	#ServicesIntro.hidePhone { display: block!important}
	
	#madesign {clear: both; }

	.about i:before {display: none;}
	
	/* .fa.fa-fw.fa-twitter.twitter {width: 100%!important}
	

	/* MENU Buttons ////// */
	/* tweak - to trim tthe menus to be in sync :: /// */
	#ServicesMenu li.screen {display: inline-block;}
		#ServicesMenu li.mobile {display: none;}
		#ServicesMenu li.mobile i {display: none;}
		#ServicesMenu li.mobile .menuTitle {display: none;}
		#ServicesMenu li.mobile span {display: none;}
		
		#ServicesMenu li.tablet {display: none;}
		#ServicesMenu li.tablet i {display: none;}
		#ServicesMenu li.tablet .menuTitle {display: none;}
		#ServicesMenu li.tablet span {display: none;}
		
		#ServicesMenu li.tablet a span.menuTitle {color: lightsteelblue; padding: 0}
		#ServicesMenu div.menu li:hover{color:white;}
		div.menu li a span:hover{color:white!important;}
	

	#ProductsMenu li.screen {display: display;}
		#ProductsMenu li.mobile {display: none;}
		#ProductsMenu li.mobile i {display: none;}
		#ProductsMenu li.tablet {display: none;}
		#ProductsMenu li.tablet i {display: none;}
	
		#ProductsMenu li.mobile a span.menuTitle {color: lightsteelblue; padding: 0}
		
		
	li.screen i.fa.fa-print:before {
		color: yellow!important;
	}
	li.screen i.fa,
	.menuTitle i.fa.fa-print:before {
		margin-right: 2px;
	}

	div.menuWrapper {
		font-size: 11pt;
	}
	#ServicesMenu ul li,
	#ProductsMenu ul li	{
		padding-right: 0px;
	}

	div.menu li span {
		padding-right: 3px;
		padding-left: 3px;
	}
	div.menu li a {
		color: lightsteelblue;
		padding: 0;
	}
	div.menu li.Serv17 i.fa.fa-database.fa-spin {
		color: yellow!important;
		padding: 0;
	}
	

	/* FILTER BUTTONS  ///// */
	.servicesButton,
	.productsButton {
		width: 13Vw;
		height: 5Vh;
		font-size: 10pt;
		line-height: 10pt;
	}
	.productsButton {
		padding:2px 15px 0 5px;
	}
	.servicesButton {
		padding: 2px 5px 0 0;
	}
	
	
	/* FILTER BUTTONS  ///// */
	.servicesButton, .productsButton {
		z-index: 10000000000!important;
	}
	
	/* VIP FilterBUTTONS on or off //// */
	.div.showScreen {display: none}
	div.showScreen {display: block}
	div.hideScreen.showPhone {display: none!important}
	
	div.filterButtons.showScreen {
		position: fixed;
		bottom: 0px;
		left: 33.5Vw;  
		z-index: 10000000000!important;
	}
	
	.div.hideScreen.showPhone {
		position: fixed;
		bottom: 0px;
		left: 35Vw;  
		z-index: 10000000000!important;
	}
	
	#filterProducts,
	#filterServices	{
		background: rgba(255,255,245,0.9);
		position: relative;
		float: unset;
		bottom: unset;
		right: unset;
	}
	#filterServices {
		float: left;
		border-radius: 100% 0 0 0;
	}

	.servicesButton,
	.productsButton {
		width: 15Vw;
		height: 6Vh;
		font-size: 11pt;
		line-height: 12pt;
	}
	#ProductsButton {
		float: left;
		position: relative;
		left: 0;
	}
	.productsButton {
		padding: 5px 15px 0 12px;
		background: red;
		border-radius: 0 100% 0 0;
		Text-align: left;
	}
	#ServicesButton {
		position: relative;
		left: 0;
	}
	.servicesButton {
		padding: 5px 15px 0 12px;
		background: green;
		border-radius: 100% 0 0 0;
		text-align: right;
	}
	footer {
		padding: 20px;
		padding-bottom: 8Vh;  /*/ drop the bottom down by same size as filterButtons */
	}
	
	
	/* FONT STYLING //// */
	
	.about p, .products p, .services p {
		width: 33Vw;
		padding: 0;
		margin: 0;
		padding-bottom: 10px;

		font-size: 10pt;		
		line-height: 14pt;
	}
	
	
	/* Innovation BLOCK //// */
	.innovative .icon {
		position: relative;
		left: -15px;
	}
	.innovative .info {
		margin-left: -10px;
	}
	.innovative p {
		font-size: 10pt;
		line-height: 18pt;
		color: #8c9398;
	}


	/* License UL Bullets list /// */
	.intro-text.Licens ul {
	    padding: 20px 20px!important;
	}
	.intro-text.Licens ul li {
		font-size: 8pt;
		line-height: 8pt;
		width: 105px;
		margin-right: 10px;
		margin-bottom: 0px; 
		padding-bottom: 8px; 
		clear: unset;
	}
	.services .intro-text.Licens i, .products .intro-text.Licens i, .Right.services .intro-text.Licens i, .Right.products .intro-text.Licens i {
		clear: right;
		height: 25px;
		width: 25px;
		line-height: 28px;
		float: left;
		display: block;
		box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
		border: 2px black solid;
		border-radius: 100%;
	}


	/* disposal UL List /// */
	.Soluti ul i, 
	.products .intro-text .Soluti ul i {
	   margin-bottom: 20px;
	}
	
	/* Welcome + 60 Years Logo //////////// */
	
	div.sixLine {
		left: -8Vh;
		top: -6.4Vh;
	}
	

	#Welcome.container {
	    position: absolute;
		left: calc(50% + 30px);
	}
	#Welcome.container,
	div.sixtyYears {
		bottom: 15Vw;	
	}
	div.sixtyYears {
		position: absolute;
		left: calc(50% - 90px - 30Vh);
	}
	
	div.bigYears {
		top: 17Vh;
	}
}