/* W3.CSS 4.13 June 2019 by Jan Egil and Borge Refsnes */
html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}
/* Extract from normalize.css by Nicolas Gallagher and Jonathan Neal git.io/normalize */


/*Customized for torfree.net 
Created using the excellent template Kitchen Sink/W3.CSS available here: https://www.w3schools.com/w3css/tryit.asp?filename=tryw3css_templates_black&stacked=h*/

/*torfree.net colors*/
		#4135b5  /*tfn purple*/
		#6a55c8 /*tfn lighter purple for menu bar 2*/
		#8371d5  /*tfn lighter purple*/
		#d3d0f4  /*tfn lightest purple*/
		#f1f0fb /*tfn very very light purple */		
		#fc9b19  /*tfn orange*/
		#221C5E /*tfn dark purple for buttons*/
		#B30000 /*tfn red*/
		#ece4b7	/* dutch white, used on social profile banners */
		#66cccc /* tfn light blue */
		#e1f6ff /*tfn light light blue*/
		
		
	/*end torfree.net colors */


/* original Kitchen Sink CSS starts */

	/* w3.css starts */

		/* W3.CSS 4.13 June 2019 by Jan Egil and Borge Refsnes */
		html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}
		/* Extract from normalize.css by Nicolas Gallagher and Jonathan Neal git.io/normalize */
		html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}
		article,aside,details,figcaption,figure,footer,header,main,menu,nav,section{display:block}summary{display:list-item}
		audio,canvas,progress,video{display:inline-block}progress{vertical-align:baseline}
		audio:not([controls]){display:none;height:0}[hidden],template{display:none}
		a{background-color:transparent}a:active,a:hover{outline-width:0}
		abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}
		b,strong{font-weight:bolder}dfn{font-style:italic}mark{background:#ff0;color:#000}
		small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
		sub{bottom:-0.25em}sup{top:-0.5em}figure{margin:1em 40px}img{border-style:none}
		code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}hr{box-sizing:content-box;height:0;overflow:visible}
		button,input,select,textarea,optgroup{font:inherit;margin:0}optgroup{font-weight:bold}
		button,input{overflow:visible}button,select{text-transform:none}
		button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}
		button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}
		button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}
		fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}
		legend{color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}
		[type=checkbox],[type=radio]{padding:0}
		[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}
		[type=search]{-webkit-appearance:textfield;outline-offset:-2px}
		[type=search]::-webkit-search-decoration{-webkit-appearance:none}
		::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}
		/* End extract */
		html,body{font-family:Verdana,sans-serif;font-size:15px;line-height:1.5}html{overflow-x:hidden}
		h1{font-size:36px}h2{font-size:30px}h3{font-size:24px}h4{font-size:20px}h5{font-size:18px}h6{font-size:16px}.w3-serif{font-family:serif}
		h1,h2,h3,h4,h5,h6{font-family:"Segoe UI",Arial,sans-serif;font-weight:400;margin:10px 0}.w3-wide{letter-spacing:4px}
		hr{border:0;border-top:1px solid #eee;margin:20px 0}
		.w3-image{max-width:100%;height:auto}img{vertical-align:middle}a{color:inherit}

		.w3-btn,.w3-button{border:none;display:inline-block;padding:8px 16px;vertical-align:middle;overflow:hidden;text-decoration:none;color:inherit;background-color:inherit;text-align:center;cursor:pointer;white-space:nowrap;}
		.w3-btn:hover{box-shadow:0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19)}
		.w3-btn,.w3-button{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}   

		.w3-tooltip,.w3-display-container{position:relative}.w3-tooltip .w3-text{display:none}.w3-tooltip:hover .w3-text{display:inline-block}
		/*
		.w3-ripple:active{opacity:0.5}.w3-ripple{transition:opacity 0s}
		.w3-input{padding:8px;display:block;border:none;border-bottom:1px solid #ccc;width:100%}
		*/
		.w3-select{padding:9px 0;width:100%;border:none;border-bottom:1px solid #ccc}

		/*.w3-modal{z-index:3;display:none;padding-top:100px;position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgb(0,0,0);background-color:rgba(0,0,0,0.4)}
		 .w3-modal-content{margin:auto;background-color:#fff;position:relative;padding:0;outline:0;width:600px}*/

		.w3-responsive{display:block;overflow-x:auto}
		.w3-container:after,.w3-container:before,.w3-panel:after,.w3-panel:before,.w3-row:after,.w3-row:before,.w3-row-padding:after,.w3-row-padding:before,
		.w3-cell-row:before,.w3-cell-row:after,.w3-clear:after,.w3-clear:before,.w3-bar:before,.w3-bar:after{content:"";display:table;clear:both}
		.w3-col,.w3-half,.w3-third,.w3-twothird,.w3-threequarter,.w3-quarter{float:left;width:100%}
		.w3-col.s1{width:8.33333%}.w3-col.s2{width:16.66666%}.w3-col.s3{width:24.99999%}.w3-col.s4{width:33.33333%}
		.w3-col.s5{width:41.66666%}.w3-col.s6{width:49.99999%}.w3-col.s7{width:58.33333%}.w3-col.s8{width:66.66666%}
		.w3-col.s9{width:74.99999%}.w3-col.s10{width:83.33333%}.w3-col.s11{width:91.66666%}.w3-col.s12{width:99.99999%}
		@media (min-width:600px){.w3-col.m1{width:8.33333%}.w3-col.m2{width:16.66666%}.w3-col.m3,.w3-quarter{width:24.99999%}.w3-col.m4,.w3-third{width:33.33333%}
		.w3-col.m5{width:41.66666%}.w3-col.m6,.w3-half{width:49.99999%}.w3-col.m7{width:58.33333%}.w3-col.m8,.w3-twothird{width:66.66666%}
		.w3-col.m9,.w3-threequarter{width:74.99999%}.w3-col.m10{width:83.33333%}.w3-col.m11{width:91.66666%}.w3-col.m12{width:99.99999%}}
		@media (min-width:993px){.w3-col.l1{width:8.33333%}.w3-col.l2{width:16.66666%}.w3-col.l3{width:24.99999%}.w3-col.l4{width:33.33333%}
		.w3-col.l5{width:41.66666%}.w3-col.l6{width:49.99999%}.w3-col.l7{width:58.33333%}.w3-col.l8{width:66.66666%}
		.w3-col.l9{width:74.99999%}.w3-col.l10{width:83.33333%}.w3-col.l11{width:91.66666%}.w3-col.l12{width:99.99999%}}
		.w3-rest{overflow:hidden}.w3-stretch{margin-left:-16px;margin-right:-16px}
		.w3-content,.w3-auto{margin-left:auto;margin-right:auto}.w3-content{max-width:980px}.w3-auto{max-width:1140px}
		.w3-cell-row{display:table;width:100%}.w3-cell{display:table-cell}
		.w3-cell-top{vertical-align:top}.w3-cell-middle{vertical-align:middle}.w3-cell-bottom{vertical-align:bottom}
		.w3-hide{display:none!important}.w3-show-block,.w3-show{display:block!important}.w3-show-inline-block{display:inline-block!important}
		@media (max-width:1205px){.w3-auto{max-width:95%}}
		/*@media (max-width:600px){.w3-modal-content{margin:0 10px;width:auto!important}.w3-modal{padding-top:30px}*/
		.w3-dropdown-hover.w3-mobile .w3-dropdown-content,.w3-dropdown-click.w3-mobile .w3-dropdown-content{position:relative}	
		.w3-hide-small{display:none!important}.w3-mobile{display:block;width:100%!important}.w3-bar-item.w3-mobile,.w3-dropdown-hover.w3-mobile,.w3-dropdown-click.w3-mobile{text-align:center}
		.w3-dropdown-hover.w3-mobile,.w3-dropdown-hover.w3-mobile .w3-btn,.w3-dropdown-hover.w3-mobile .w3-button,.w3-dropdown-click.w3-mobile,.w3-dropdown-click.w3-mobile .w3-btn,.w3-dropdown-click.w3-mobile .w3-button{width:100%}}
		/*@media (max-width:768px){.w3-modal-content{width:500px}.w3-modal{padding-top:50px}}
		@media (min-width:993px){.w3-modal-content{width:900px}.w3-hide-large{display:none!important}.w3-sidebar.w3-collapse{display:block!important}}
		@media (max-width:992px) and (min-width:601px){.w3-hide-medium{display:none!important}}*/
		@media (max-width:992px){.w3-sidebar.w3-collapse{display:none}.w3-main{margin-left:0!important;margin-right:0!important}.w3-auto{max-width:100%}}
		.w3-top,.w3-bottom{position:fixed;width:100%;z-index:1}.w3-top{top:0}.w3-bottom{bottom:0}
		.w3-overlay{position:fixed;display:none;width:100%;height:100%;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.5);z-index:2}
		.w3-display-topleft{position:absolute;left:0;top:0}.w3-display-topright{position:absolute;right:0;top:0}
		.w3-display-bottomleft{position:absolute;left:0;bottom:0}.w3-display-bottomright{position:absolute;right:0;bottom:0}
		.w3-display-middle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%)}
		.w3-display-left{position:absolute;top:50%;left:0%;transform:translate(0%,-50%);-ms-transform:translate(-0%,-50%)}
		.w3-display-right{position:absolute;top:50%;right:0%;transform:translate(0%,-50%);-ms-transform:translate(0%,-50%)}
		.w3-display-topmiddle{position:absolute;left:50%;top:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%)}
		.w3-display-bottommiddle{position:absolute;left:50%;bottom:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%)}
		.w3-display-container:hover .w3-display-hover{display:block}.w3-display-container:hover span.w3-display-hover{display:inline-block}.w3-display-hover{display:none}
		.w3-display-position{position:absolute}
		.w3-circle{border-radius:50%}
		.w3-round-small{border-radius:2px}.w3-round,.w3-round-medium{border-radius:4px}.w3-round-large{border-radius:8px}.w3-round-xlarge{border-radius:16px}.w3-round-xxlarge{border-radius:32px}
		.w3-row-padding,.w3-row-padding>.w3-half,.w3-row-padding>.w3-third,.w3-row-padding>.w3-twothird,.w3-row-padding>.w3-threequarter,.w3-row-padding>.w3-quarter,.w3-row-padding>.w3-col{padding:0 8px}
		.w3-container,.w3-panel{padding:0.01em 16px}.w3-panel{margin-top:16px;margin-bottom:16px}

		.w3-card,.w3-card-2{box-shadow:0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)}

		.w3-xlarge{font-size:24px!important}.w3-xxlarge{font-size:36px!important}.w3-xxxlarge{font-size:48px!important}.w3-jumbo{font-size:64px!important}
		.w3-left-align{text-align:left!important}.w3-right-align{text-align:right!important}.w3-justify{text-align:justify!important}.w3-center{text-align:center!important}

		.w3-margin{margin:16px!important}.w3-margin-top{margin-top:16px!important}.w3-margin-bottom{margin-bottom:16px!important}
		.w3-margin-left{margin-left:16px!important}.w3-margin-right{margin-right:16px!important}
		.w3-padding-small{padding:4px 8px!important}.w3-padding{padding:8px 16px!important}.w3-padding-large{padding:12px 24px!important}
		.w3-padding-16{padding-top:16px!important;padding-bottom:16px!important}.w3-padding-24{padding-top:24px!important;padding-bottom:24px!important}
		.w3-padding-32{padding-top:32px!important;padding-bottom:32px!important}.w3-padding-48{padding-top:48px!important;padding-bottom:48px!important}
		.w3-padding-64{padding-top:64px!important;padding-bottom:64px!important}
		.w3-left{float:left!important}.w3-right{float:right!important}
		.w3-button:hover{color:#000!important;background-color:#ccc!important}
		.w3-transparent,.w3-hover-none:hover{background-color:transparent!important}
		.w3-hover-none:hover{box-shadow:none!important}

		/* Colors */

		.w3-blue,.w3-hover-blue:hover{color:#fff!important;background-color:#2196F3!important}

		.w3-blue-grey,.w3-hover-blue-grey:hover,.w3-blue-gray,.w3-hover-blue-gray:hover{color:#fff!important;background-color:#607d8b!important}

		.w3-orange,.w3-hover-orange:hover{color:#000!important;background-color:#ff9800!important}

		.w3-light-grey,.w3-hover-light-grey:hover,.w3-light-gray,.w3-hover-light-gray:hover{color:#000!important;background-color:#f1f1f1!important}
		.w3-dark-grey,.w3-hover-dark-grey:hover,.w3-dark-gray,.w3-hover-dark-gray:hover{color:#fff!important;background-color:#616161!important}

		.w3-text-white,.w3-hover-text-white:hover{color:#fff!important}
	
	/* w3.css ends */

	/* w3-theme-black.css starts*/		
		.w3-theme-l5 {color:#000 !important; background-color:#f0f0f0 !important}
		.w3-theme-l4 {color:#000 !important; background-color:#cccccc !important}
		.w3-theme-l3 {color:#fff !important; background-color:#999999 !important}
		.w3-theme-l2 {color:#fff !important; background-color:#666666 !important}
		.w3-theme-l1 {color:#fff !important; background-color:#333333 !important}
		.w3-theme-d1 {color:#fff !important; background-color:#000000 !important}
		.w3-theme-d2 {color:#fff !important; background-color:#000000 !important}
		.w3-theme-d3 {color:#fff !important; background-color:#000000 !important}
		.w3-theme-d4 {color:#fff !important; background-color:#000000 !important}
		.w3-theme-d5 {color:#fff !important; background-color:#000000 !important}

		.w3-theme-light {color:#000 !important; background-color:#f0f0f0 !important}
		.w3-theme-dark {color:#fff !important; background-color:#000000 !important}
		/*.w3-theme-action {color:#fff !important; background-color:#000000 !important}*/

		.w3-theme {color:#fff !important; background-color:#000000 !important}
		.w3-text-theme {color:#000000 !important}
		.w3-border-theme {border-color:#000000 !important}

		.w3-hover-theme:hover {color:#fff !important; background-color:#000000 !important}
		.w3-hover-text-theme:hover {color:#000000 !important}
		.w3-hover-border-theme:hover {border-color:#000000 !important}

	/* w3-theme-black.css starts*/


/* torfree.net customizations start */

/*navigation */
	

			
/* this is important for viewability on v small screens 	*/
	@media
		only screen and (-webkit-min-device-pixel-ratio: 1.5),
		only screen and (-o-min-device-pixel-ratio: 3/2),
		only screen and (min--moz-device-pixel-ratio: 1.5),
		only screen and (min-device-pixel-ratio: 1.5)
	{
		html, body {width:100%; overflow-x:hidden;}
	}
/* end this is important for viewability on v small screens */	


	

	/* Links inside the navbar */

		
		
		
		
/* main 'TORFREE.NET' menu styling */	

	/* The top navigation bar */
	.navbar {
		border-bottom-style: solid;
		border-bottom-width: 1px;
		border-bottom-color: #f2f2f2;
		overflow: hidden;
		background-color:#4135b5;
		position: fixed; /* Set the navbar to fixed position */
		top: 0; /* Position the navbar at the top of the page */
		width: 100%; /* Full width */
		z-index: 100;
		height: 37px;
		margin: 0 -9999rem; /* sends background color across entire screen */
		padding: 0.25rem 9999rem; /* add back negative margin value */	
	} 



	.navbarmenu {
		background-image: url("transparentlines.png");
		background-repeat: repeat-x;
		background-size: 5% 100%;
		overflow: hidden;
		position: fixed; /* Set the navbar to fixed position */
		top: 0; /* Position the navbar at the top of the page */
		width: 100%; /* Full width */
		z-index: 101;
		/*padding-top: .3em;  moves menu items down a bit on small screens */
		height: 36px;
		line-height: 36px;
		}
	
	
		
		@media screen and (min-width: 342px) {
			.navbarmenu {padding-top: 0em;} /* centres menu items vertically on larger screens */
		}
	
	.menutitle {
		padding-left: .4em!important;
		padding-right: .4em!important;
		margin-left: 0em!important;
		margin-right: 0em; 
		border-bottom-style: none;
		font-size: 1.15em!important;
		font-weight: 600;
		color: white;
		} 
	
		@media screen and (min-width: 342px) {
			.menutitle {
				font-size: 1.5em!important;
				font-weight: 600;				
				margin-right: .3em; 
				} 
			}
		
		@media screen and (min-width: 402px) {
			.menutitle {
				font-size: 1.5em!important;
				font-weight: 600;				
				margin-right: .5em; 
				} 
			}
		
	.navbarmenu a, .navbarmenu a:link, .navbarmenu a:visited {
		text-decoration: none;  
		border-bottom-style: none;	
		padding-left: 0;
		padding-right: .25em;
		padding-left: .25em;
		font-size: .9em;
		color: white;
		padding-top: 13px; /*lights up whole block behind menu item */
		padding-bottom: 12px; /*lights up whole block behind menu item */
		}
		
			@media screen and (min-width: 342px) {
			.navbarmenu a, .navbarmenu a:link, .navbarmenu a:visited {
				font-size: 1em; 
				padding-left: .4em; 
				padding-right: .4em; /* increases font size and space between menu items on bigger screens*/
				}
			}
		
			@media screen and (min-width: 402px) {
			.navbarmenu a, .navbarmenu a:link, .navbarmenu a:visited {
				font-size: 1.2em; 
				padding-left: .5em; 
				padding-right: .5em; /* increases font size and space between menu items on bigger screens*/
				} 
			}	
	
	/* Change navbar1 background on mouse-over */
	.navbarmenu a:hover, .navbarmenu a:visited {
		background: #6a55c8; /*tfn lighter purple for menu bar 2*/
		color: white;
		}
	
	/* The second navigation bar */
		
	.navbar2 {
		border-bottom-style: solid;
		border-bottom-width: 1px;
		border-bottom-color: #f2f2f2;
		overflow: hidden;
		background-color: #6a55c8; 
		position: fixed; /* Set the navbar to fixed position */
		top: 36px; /* Position the navbar at the top of the page */
		/*right: 78em;  shifts menu items to right to line up under navbar items - must be used in conjunction with html for contact and prices pages */
		width: 100%; /* Full width */
		z-index: 102;
		height: 36px;
		line-height: 36px;
		margin: 0 -9999rem; /* sends background color across entire screen */
		padding: 0.25rem 9999rem; /* add back negative margin value */
		} 
	
	.navbarmenu2pushdown {top: 36px} /* this moves the navbar2 menu items down */
	
	/* Change navbar 2 background on mouse-over */
		.navbarmenu2 a:hover {
		background: white;
		color: #4135b5;		
		}




	/* These move second menu bar items to the right */
	
	.aboutmenu {padding-left: 2em}
	@media screen and (min-width: 342px) {.aboutmenu {padding-left: 3em;}}
	@media screen and (min-width: 402px) {.aboutmenu {padding-left: 4em;}}	
	
	.contactmenu {padding-left: 8em}	
	@media screen and (min-width: 342px) {.contactmenu {padding-left: 10em;}}
	@media screen and (min-width: 402px) {.contactmenu {padding-left: 11em;}}
		
	.helpmenu {padding-left: 2em}
	@media screen and (min-width: 342px) {.helpmenu {padding-left: 3em;}}
	@media screen and (min-width: 402px) {.helpmenu {padding-left: 3em;}}
	
	.pricesmenu {padding-left: 2em}
	@media screen and (min-width: 342px) {.pricesmenu {padding-left: 4em;}}
	@media screen and (min-width: 402px) {.pricesmenu {padding-left: 3em;}}
	@media screen and (min-width: 600px) {.pricesmenu {padding-left: 12em;}}	
	
		
	
/*End navigation */		
		
		

/*modal tweaks*/

		/*smaller modal text on small screens*/
		
		/*
		.w3-modal-content p {font-size: 1em;}
		@media screen and (min-width: 600px) {
			.w3-modal-content p {font-size: 1.25em;}
			}

		.w3-modal{padding-top:55px; z-index:105;}

		.w3-theme-l1 {background-color: black!important;}
		*/
		
/*end modal tweaks*/





/*all pages */

/*add a bit of space between headlines and lists that don't have any paragraphs in between*/
	h2 + ul {margin-top: 1em;}
	h5 + ul {margin-top: 1em;}


	/*change color of hyperlinks*/
		a:link {
			text-decoration: none; 
			border-bottom: 2px solid #8371d5  /*tfn lighter purple*/
		}
		a:visited {
			text-decoration: none; 
			border-bottom: 2px solid #d3d0f4; /* tfn lightest purple*/
		}
		a:hover {
			text-decoration: none; 
			border-bottom: #221C5E /*tfn dark purple for buttons*/
		}
		a:active {
			text-decoration: none;
			border-bottom: #221C5E /*tfn dark purple for buttons*/
		}

	/*end change color of hyperlinks*/



	/*	this corrects where browsers land on a tags -- the fixed menu at the top pushed it out of whack
	it also prevents anchor tags from showing a bottom border on hover.
	*/		
		.anchor {
			display:block;
			padding-top:100px;
			margin-top:-100px;
			text-decoration: none;
			border-bottom: 0px!important;
			}

		.anchor a:hover {
			border-bottom: 0px!important; 
			text-decoration: none!important;
			}

/*end all pages  */



/*page 1 only*/

/* main headlines */




	.topmain1 h6 {
		margin-top: 1em!important;
		color: #d3d0f4;  /*tfn lightest purple*/
		letter-spacing: .1em;
		line-height: 1.2em;
		font-size: 1em!important;
		font-weight: 900!important;
		}


	@media screen and (min-width: 325px) {
		.topmain1 h6 {
			letter-spacing: .1em;
			line-height: 1.2em;
			font-size: 1.25em!important;
			margin-bottom: 1em;
			}
		}

	@media screen and (min-width: px) {
		.topmain1 h6 {
			letter-spacing: .1em;
			line-height: 1.2em;
			font-size: 1.5em!important;
			}
		}
	
	@media screen and (min-width: 525px) {
		.topmain1 h6 {
			letter-spacing: .1em;
			line-height: 1.2em;
			font-size: 1.75em!important;
			}
		}

		
	.topmain1 h1 {
		text-transform: uppercase;
		font-size: 3.5em;
		}

	@media screen and (min-width: 325px) {
		.topmain1 h1 {font-size: 4em;}
			}

	@media screen and (min-width: 400px) {
		.topmain1 h1 {font-size: 4.5em;}
			}
	
	@media screen and (min-width: 525px) {
			.topmain1 h1 {font-size: 5em;}
			}
		
		
	.topmain1 h2 {
		font-size: 1.5em; 
		line-height: 1.25em; 
		margin-top: 1em!important;
		}	
		
		@media screen and (min-width: 325px) {
			.topmain1 h2 {font-size: 1.5em;}
			}


		@media screen and (min-width: 400px) {
			.topmain1 h2 {font-size: 2em;}
			}
	
		@media screen and (min-width: 525px) {
			.topmain1 h2 {font-size: 2em;}
			}	
		
			
			
/*buttons*/

	/*all buttons*/
		.w3-btn {
			color: black; /*#221C5E!important;*/
			background-color:#fc9b19!important;/*tfn orange*/
			font-weight:900;
			border-bottom: none;
			font-size: 1.25em; 
			line-height: 1.25em; 
			margin-top: .75em;
			margin-bottom: .75em;
			text-decoration: none;
			text-align: center;
			margin-right: auto;
			margin-left: auto;
			display: block;
			width: 6em;
			border-radius: .75em;
			font-size: 1.5em;
			transition: all 0.5s;
			-webkit-transition-duration: 0.5s; /* Safari */
			}
	
	
		.w3-btn:hover {
			background-color: #d3d0f4!important;/*tfn light purple*/
			box-shadow:0px 0px 0px 0px #66cccc;	
			}
			
		.w3-btn:hover a {
			background-color: #d3d0f4!important;/*tfn light purple*/
			box-shadow:0px 0px 0px 0px #66cccc;	
			}
		
		
		
		
		@media screen and (min-width: 600px) {
			.w3-btn {margin-top: 1.75em;}
			}
	
	
	/* front page buttons */
			
		.topmain1 .w3-btn {
			width: 12em!important;
			box-shadow:0px 0px 20px 0px #66cccc;
			animation-delay: 10s!important;
			}
		
		
		@media screen and (min-width: 325px) {
			.topmain1 .w3-btn {}
			}


		@media screen and (min-width: 400px) {
			.topmain1 .w3-btn {}
			}
	
		@media screen and (min-width: 525px) {
			.topmain1 .w3-btn {}
			}
		
		.w3-btn.prices {
			color: white!important; 
			background-color: #4135b5!important;
			width: 8em;
			}	
			
		.w3-btn.prices:hover {
			color: #221C5E!important; 
			background-color: #d3d0f4!important;
			width: 8em;
			}
		

/* end of buttons */		

	

	/* colors of header */
		.w3-theme {
			color: #fff !important;
			background-color: #4135b5 !important; /*tfn purple*/
			margin-top: 37px;
			background-color: #4135b5; /*tfn purple*/
			background-image: url(transparentlines.png);
			background-size: 75% 75%;
			background-position: center;
			background-repeat: no-repeat;
			}
			
			
		
/* gives space between top section and 3 cards */
	
	@media screen and (min-width: 400px) {
		.w3-row-padding {margin-top: 3em!important;}
		}
	
	@media screen and (min-width: 590px) {
		.w3-row-padding {margin-top: 4em!important;}
		}
	
	
	.w3-card {margin-bottom: 2em;}
	
	
/* vertically stacked cards for mobile*/

	.w3-card.w3-container {padding-bottom: 1em;}
	.w3-card.w3-container h3 {margin-bottom: 1em;}	
	.w3-third hr {margin-top: 0em; margin-bottom: 2em;}	
	.cardtext {text-align: left;}
	.cardtext p{font-size: .9em;}

	.cardimage {
		background-color: ;
		float: left;
		margin-top: 1em;
		padding-right: 1em;
		position: relative;
		width: 40%;
		}

	.cardimage img {width: 70%!important;}

	.cardimagepower {
		margin-left: -.25em;
		margin-right: -1em!important;
		}
	
	.cardimagefavourite {margin-left: 0em;}
		
	.cardimageverify {
		margin-left: -.25em;
		margin-right: -.5em!important;		
		}
	
	.circle {
		border-radius: 50%;
		width: 100%;
		height: 0;
		background-color: none;
		padding-bottom: 100%;
		display: ;
		margin-bottom: 5%;
		}
		

		
	@media screen and (min-width: 305px) {
		.cardtext p{font-size: 1.1em;}
		}
		
	@media screen and (min-width: 350px) {	
		.cardtext p{font-size: 1.2em;}
		
		.cardimage {
			margin-bottom: 2em!important;
			margin-right: 1em!important;
			}
		
		.cardimage img {
			width: 100%!important;
			padding-top: 0em;
			
			}
			
		.cardimagefavourite img {
			width: 80%!important;
			padding-top: 0em;
			}
			
		.cardimagepower, .cardimageverify, .cardimagefavourite {width: 25%;}
				
		.circle {display: inline-block;
			margin-left: 25%!important;
			margin-right: 5em!important;
			}	
		}	

	@media screen and (min-width: 400px) {	
		.cardtext p{font-size: 1.25em;}
		
		.cardimage {margin-right: 2em!important;}
		
		.cardimage img {width: 100%!important;}
			
		.cardimagefavourite img {width: 90%!important;}
				
		.circle {margin-left: 20%;}	
		}
	
	
	@media screen and (min-width: 450px) {	
		.cardtext p{font-size: 1.25em;}
		
		.cardimage {margin-right: 2.5em!important; margin-left: 1.2em!important;}
		
		.cardimage img {width: 100%!important;}
			
		.cardimagefavourite img {width: 100%!important;}
				
		.circle {margin-left: 30%!important; }	
		}
	
	
	@media screen and (min-width: 500px) {	
		
		.cardimage {margin-right: 3.5em!important; margin-left: 1.5em!important;}
		}
		
		@media screen and (min-width: 500px) {	
		
		.cardimage {margin-right: 4em!important; margin-left: 2em!important;}
		}
		
	@media screen and (min-width: 600px) {	
		.w3-margin-top {margin-bottom: 1em;}
		
		.cardimage {
			margin-top: 1em!important;
			float: none;
			display: inline-block;
			margin-left: auto;
			margin-right: auto;
			margin-bottom: ;
			padding-right: 0em;
			padding-left: 0em;
			width: 35%;
			display: none;
			}

		.cardimage img {
			width:90%!important;
			padding-top: 0em;
			padding-left: 0em;
			padding-right: 0em;
			}
			
		
			
		.circle {display: block;
			margin-left: auto!important;
			margin-right: auto!important;
			margin-bottom: 0;
			padding-bottom: 80%;
			padding-left: 0em;
			padding-right: 0em;
			background-color: ;}
		
		.sideborderfix p {display: inline-block; margin-bottom: 0px!important;}
		
		.cardimagepower, .cardimageverify, .cardimagefavourite {width: 50%; margin-right: 0!important;}
		
		.cardtext {text-align: center;}	
		.w3-third hr {display: none;}
	}	
	
	
	
	/*turn off shadow on cards*/
			.w3-card {box-shadow: none; margin-bottom: 0px;}
	
		/*add borders sides and bottoms of cards*/
			.sideborder {border-right: 1px; border-left: 1px; border-top: 0px; border-bottom: 0px; border-color: black;}
			

		/*on mobile, bottom borders, on desktop, side borders*/
			@media screen and (min-width: 600px) {
				.sideborder {border-style: solid;}
				.w3-card hr {visibility: hidden;}
			}
	
	
	
	
/* end vertically stacked cards for mobile*/


/* front page picture, greatergood */
	
	
	
	
	.frontpics {
		background-image: url("collagesquare.jpg");
		background-size: auto 100%;
		height: 500px;
		overflow: none;
		
		}
		
	@media screen and (min-width: 1200px) {
		.frontpics {
			background-image: url("collagehoriz.jpg");
			background-size: auto 100%;	
		}
	}
	
	.picturebox {
		margin-top: 2em;
		height: 460px;
		z-index: -3;
		width: 100%;
		position: absolute;
		}
	
	
	@media screen and (min-width: 1200px) {
			.picturebox {
				margin-left: -9999rem!important; /* sends background color across entire screen */
				margin-right: -9999remimportant; /* sends background color across entire screen */
				padding-left: 9999rem!important; /* add back negative margin value */
				padding-right: 9999rem!important; /* add back negative margin value */
			}
	}	
	
	.pictext {
		font-size: 1.25em!important;
		font-weight: 400;
		line-height: .5em;
		width: 60vw;
		margin-right: auto;
		margin-left: auto;
		text-align: center; 
		margin-top: 8em;
		margin-bottom: 9em;
		padding: .5em;
		background: rgba(211, 208, 244, .9);
		border-radius: 25px;
		}
		
	.pictext h4 {
		font-size: 1.75em!important;
		line-height: 1em;
		margin-bottom: .5em;
		font-weight: 800;
		}
	
	@media screen and (min-width: 390px) {
		.pictext {
			margin-top: 4em;
			margin-bottom: 5em;
			font-size: 1.75em!important;
			line-height: .75em;
			width: 300px;}
	}
	
	
	@media screen and (min-width: 800px) {
		.pictext {
			margin-top: 3.5em; 
			margin-bottom: 5em;
			padding: 1.5em;
			padding-bottom: .75em;
			}
		
		.pictext h4 {
			font-size: 2em;
			}
	}
	




	/* end front page picture, greatergood */

.w3-center h4 {font-weight: 100;}




/* price list front*/

	.pricelistfront h5 {
		color: black;
		margin-bottom: 1em;
		}
	
	.pricebackgroundfront {
		margin-top: 0em;
		margin-bottom: 2em;
		margin-left: 0em;
		margin-right: 0em;
		padding-top: 2em;
		padding-bottom: 1em;
		padding-left: 0em;
		padding-right: 1em;
		}
	
	
	
/* price list front end*/




/* front page FAQs */

.frontfaq h5 {
		font-size: 1.25em;
		margin-top: 1.5em;
	padding-left: 5%;
		padding-right: 5%;
		color: #8371d5  /*tfn lighter purple*/;
		}

	.frontfaq p {
		font-size: 1.25em;
		margin-bottom: .5em; 
		margin-top: .5em;
		margin-left: auto; 
		margin-right: auto;	
		padding-left: 5%;
		padding-right: 5%;
		}
		
	
		
	@media screen and (min-width: 800px) {
		.frontfaq h5 {		
		padding-left: 20%;
		padding-right: 20%;
		}
		
		.frontfaq p {		
		padding-left: 20%;
		padding-right: 20%;
		}
	}
	
	/* end front page FAQs */








/* testimonials */
	

.w3-orange {background-color: #ff980073!important}

.w3-green {background-color: #93d2a987}

.w3-lightblue {background-color: #2196F36B}



	.w3-orange, .w3-green, .w3-lightblue {
		margin-right: 10%;
		margin-left: 10%;
		margin-bottom: 2em;
		margin-top: 2em;
		border-radius: 1em;
		}

@media screen and (min-width: 600px) {
		.w3-orange, .w3-green, .w3-lightblue {
		color: black;
		margin-right: 20%;
		margin-left: 20%;
		padding-right: 10%;
		padding-left: 10%;
		margin-bottom: 2em;
		margin-top: 2em;
		}
}

/* testimonials end */

		


/*  closing bullets */

	
	
	/* adjusts padding on bullet list in 'internet for the people' section */	
	.whyTFfront {
		text-align: left;
		padding-right: 5%; 
		padding-left: 5%;}
		
.whyTFfront h6 {font-size: 1.25em; font-weight: 900; margin-bottom: 0em;}


.whyTFfront p {margin-bottom: 1em!important; 
		margin-top: .25em!important;}
			
	
	
	@media screen and (min-width: 600px) {
		.whyTFfront {
			padding-right: 25%; 
			padding-left: 25%;}
			}
	}
	
	

	
	
	
	
/*end page 1 only*/
	
	
/*inside pages only*/
	
	.inside {
		text-align: left!important;
		margin-bottom: 2em; 
		margin-top: 80px!important; 
		padding-left: 2em; 
		padding-right: 2em;
		padding-top: 80px!important;
		background-color: blue;
	}
		
	.inside {
		text-align: left!important;
		margin-bottom: 2em; 
		margin-top: 100px;
		padding-left: 2em; 
		padding-right: 2em;
}



	
	/*price comparison table*/
	
	.pricetable {
		width: 100%;
		font-size: .75em;
		margin-top: 1em;
		line-height: 1em;
		vertical-align: top;
		
		}
	
	.pricetable th {
		font-weight: 700;
		background-color: #4135b5;
		color: white;
		padding-top: 1em;
		padding-bottom: .5em;
		padding-left: .5em;
		padding-right: .5em;
		}
	
	.pricetable td {
		padding-top: 1em;
		padding-bottom: 1em;
		padding-left: .5em;
		padding-right: .5em;
		
		}
	
	.tableservice {font-weight: 700}
	
	@media screen and (min-width: 900px) {
		.pricetable {
		width: 100%;
		font-size: 1.25em;
		margin-top: 1em;
		line-height: 1em;
		vertical-align: top;
		}	
		.pricetable th, td {padding: 1em}
	}
	
	/*end price comparison table*/
	
	
	
	/*price list classes*/
	
	
	.pricebackground {
		margin-top: 0em;
		margin-bottom: 0em;
		margin-left: 0em;
		margin-right: 0em;
		padding-top: .25em;
		padding-bottom: .25em;
		padding-left: 1em;
		padding-right: 0em;}
	
	
	.cableprice {background-color: #f1f0fb;/*tfn very very light purple*/}
	.dslprice {background-color: #e1f6ff;/*tfn light light blue*/}
	
	
	.price {
		font-weight: 800;
		color: #B30000/*tfn red*/;
		text-align: left;
		font-size: 1em;} 
	
	.smallprice {
		font-size: 1em;
		font-style: italic;} 
		
	.italicprice {font-style: italic}
	
	.service {
		font-weight: 900;
		font-size: 1.25em;
		}
		
	.description {
		font-size: 1.25em;
		font-weight: 400;
		font-style: italic;
		}
	
	.description li {
		margin-top: 0em;}
	
	.pricelist {
		padding-right: 1em; 
		padding-left: 1.5em;}
		
	.pricelistfront {
		padding-right: 1em; 
		padding-left: 1.5em;
		margin-bottom: .5em; 
		margin-top: 2em;}	
			
	.pricelistfront p {
		font-size: 1em; 
		font-weight: 400;
		margin-bottom: 0em;}		
			
	.pricelistfront ul, li {
		font-size: .8em;
		margin-left: 1em; 
		margin-right: 1em;
		font-weight: 400;}


	
	@media screen and (min-width: 600px) {
		.pricelistfront p {font-size: 1.25em;}
		.pricelistfront ul, li {font-size: 1em;}
		
		.pricelistfront {
			padding-right: 20%; 
			padding-left: 20%}
		
		
		.pricelist {
			padding-right: 3em; 
			padding-left: 3em;
		}
	}	
		
		
		
	.servicenotes {
		background-color: #e1f6ff70;/*#e1f6ff!important;*/
		padding: 1em; 
		margin-top:0;
		margin-left: 0em;
		margin-right: 0em;
		}
		
	.servicenotes a:visited {
		 border-bottom: 2px solid white;
		}

	.servicenotes p {margin-top: 0; margin-bottom: .5em;}
	
	.servicenotes li {margin-bottom: 1em;}
	
	.servicenotes h5 {margin-top: 0; margin-bottom: 1em; color: black;}
	
	
	/*end price list classes*/
	
	
	
	
	
	
/* end inside pages only*/
	
	
	

	
/*footer*/
	
	.footerbox {
		background-color: #d3d0f4!important; /* tfn lightest purple;*/
		margin-top: 2em;
		height: 460px;
		z-index: -2;
		position: absolute;
		width: 100%;
		}

@media screen and (min-width: 800px) {
			.footerbox {
				margin-left: -9999rem!important; /* sends background color across entire screen */
				margin-right: -9999rem!important; /* sends background color across entire screen */
				padding-left: 9999rem!important; /* add back negative margin value */
				padding-right: 9999rem!important; /* add back negative margin value */
				}
		}
		
	.footertext  {
		padding-top: 4em;
		padding-bottom: 0em;
		position: relative!important;
		margin-right: auto!important;
		margin-left: auto!important;
		text-align: center;	
		width: 300px;	
		position: relative;		
		}
		
	.footertext a:link {
		text-decoration: none; 
		border-bottom: 2px solid #8371d5;  /*tfn lighter purple*/ 
		}
	.footertext a:visited {
		text-decoration: none; 
		border-bottom: 2px solid #f1f0fb; /*tfn very very light purple */
		}
	.footertext a:hover {
		text-decoration: none; 
		border-bottom: 2px solid white;
		}
	
	.footertext a:active {
		text-decoration: none; 
		border-bottom: 2px solid white;
		}
	
	
	.totopofpage a {border-bottom: 0px!important; text-decoration: none!important;}	
	
	
	
	
/*end footer.*/
	
	

	
/*tweaks to kitchen sink theme things*/
	
	.sitemap ul li {margin-bottom: 1em}
	
	/*tweak hr, centred by default */
			hr  {
			height:.15em; 
			border:none; 
			color:#000; 
			background-color: #d3d0f4; 
			width:80%; 
			text-align: center; 
			margin: 0 auto;
			margin-top: 2.5em;
			margin-bottom: 1em;}
			
		/*tweak hr to align left on inside pages*/
			.inside hr {
				width: 100%;
				text-align: left; 
				margin-left: 0em;
				margin-right: 0em;
				margin-top: 3em!important;
				margin-bottom: 1.5em;}
		
	/*end tweak hr*/
	
	
	
	
	
	
	/* various padding things */		
		.w3-container {
			padding-bottom: 2em; padding-top: 0em; padding-right: 0em; padding-left: 0em;}

		.w3-container p {padding-right: .5em; padding-left: .5em;}

		.w3-padding-32 {padding-bottom: 0em!important;}

		.w3-padding-16 {text-align: center;}
	

	
	
	.w3-card img {width: auto;}
	
	.contactcard p {margin-top: 0em;}

	.contactcard {margin-top: 1em;}
	
	
	
	
	
	/*typography*/
	
	
	/*basic kitchen sink type*/
	h1{font-size:36px}
	h2{font-size:30px}
	h3{font-size:24px}
	h4{font-size:20px}
	h5{font-size:18px}
	h6{font-size:16px}
	.w3-serif{font-family:serif}
	
	.w3-wide{letter-spacing:4px}

	
	/*end basic kitchen sink type*/
	
	
	
	
	
	
	
	
	
/*typography*/
	
	h1,h2,h3,h4,h5,h6, p, body, blockquote, ul, li {font-family: Segoe UI, FreeSans, sans-serif;}
	h2,h3,h4,h5,h6 {margin: 0em;}
	
	/*screens of all sizes, even small ones below 600px*/
	
	h1 {font-size: 1.75em; font-weight: 900; line-height: 1em;}
		

	.inside h1 {margin-bottom: 3em; line-height: 1.5em;}

	h2 {font-size: 2.5em; font-weight: 200;}
		

	h3 {font-size: 2.25em; font-weight: 700; line-height: 1.5em;}
		
	/* headline on front page cards */
		.w3-card h3 {font-size: 1.25em; font-weight: 900;}
		
	h4 {font-size: 3em; font-weight: 200; line-height: 1em;}

	h5 {font-size: 1.5em!important; font-weight: 900!important; line-height: 1em; color: #8371d5 /*tfn lighter purple*/;}
		
	h6 {font-size: 1.5em; font-weight: 500; line-height: 1em;}
	
	p {font-size: 1.25em;font-weight: 400!important;}
	
	/* paragraphs in front page cards */
		.w3-card p {margin-top: .3em;}
			
	ul {margin-left: 0; margin-right: 0; margin-top: 0em; margin-bottom: 2.5em; padding-left: 1em;}
	

	li {margin-bottom: 0em; margin-top: 0em; font-size: 1.25em;}

	blockquote {font-weight: 800; margin-left: 0em; margin-right: 0em; padding: .5em; font-size: 1.5em; letter-spacing: .05em;}
	
	/*end screens of all sizes, even small ones below 600px*/	
		
	/*screens 600px wide and above */	
		
	@media screen and (min-width: 600px) {
	
		h1 {font-size: 2em; font-weight: 900; line-height: 1em;}
		
		h2 {font-size: 3em; font-weight: 200;}
	
		h3 {font-size: 2.25em; font-weight: 700; line-height: 1em;}	
		
		/* headline on front page cards */
		.w3-card h3 {font-size: 1.25em;}
		
		h4 {font-size: 3em; font-weight: 200; line-height: 1em;}

		h5 {font-size: 1.5em!important; font-weight: 900!important; line-height: 1em; color: #8371d5;}
		
		h6 {font-size: 1.5em; font-weight: 500; line-height: 1em;}
		
		p {font-size: 1.25em; font-weight: 400!important;}

		ul {margin-left: 0; margin-right: 0; margin-top: 0em; margin-bottom: 2.5em; padding-left: 3em;}
	
		li {margin-bottom: 0em; margin-top: 0em; font-size: 1.25em;}

		blockquote {font-weight: 800; margin-left: 0%; margin-right: 0%; padding-left: 1em; padding-right: 1em; padding-top: 1.5em; padding-bottom: 1.5em; font-size: 1.5em;letter-spacing: .05em;}
	
	}
	
	/*end screens 600px wide and above */