/* 2019 - David Humble */

	@-webkit-keyframes rotate {
  from {
    -webkit-transform: rotate(0deg);
  }
  			to { 
    			-webkit-transform: rotate(360deg);
  				}
			}

	img {
  			max-width: 100%;
  			height: auto;
		}
	
	body { 
			margin: 0;
			padding: 0;
			background-color: #30293f;
			color: #ffffff;
			font-family: arial, verdana, sans-serif;
			font-size: medium;
			height: auto;
			/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#6d81c6+0,cedcff+100 */
			background: #6d81c6; /* Old browsers */
			background: -moz-linear-gradient(-45deg, #6d81c6 0%, #cedcff 100%); /* FF3.6-15 */
			background: -webkit-linear-gradient(-45deg, #6d81c6 0%,#cedcff 100%); /* Chrome10-25,Safari5.1-6 */
			background: linear-gradient(135deg, #6d81c6 0%,#cedcff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6d81c6', endColorstr='#cedcff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
		}
							
	body .fcopy {
			text-align: center;
			font-family: arial, verdana, sans-serif;
			font-size: x-small;
			color: #ffffff;
			}
				
	#wrapper {
			background-color: #fdf8f2;
			color: black;
			margin: 30px 40px 30px 40px;
			padding: 10px;
			}
			
	#header { 
			margin: 0px; 
			padding: 3px;
			overflow: none;
			clear: both;
			color: #0000cd; 
			font-weight: bold; 
			font-family: Arial, Verdana, sans-serif; 
			font-size: x-large;
			}
			
	#header-top {
			min-height: 98px;
			overflow: none;
			clear: both;
			vertical-align: middle;
			}
			
	#header img.1ev {
			border: 0px;
			float: left;
			clear: left;
			display: block;
			background-position: 5px 2px;
			background-repeat: no-repeat;
			text-indent: 50px;
			padding: 0px 20px 0px 20px;
			width: 167px;
			height: 98px;
			vertical-align: middle;
			}
			
	#header img.bucksgg {
			border: 0px;
			float: right;
			display: block;
			<!-- background-position: 80% 2px; -->
			background-repeat: no-repeat;
			text-indent: 50px;
			/* padding: 0px 20px 0px 20px; */
			padding: 0;
			width: 98px;
			height: 98px;
			vertical-align: middle;
			}
			
	#header-top span {
			padding: 15px;
			}
	
	#header-bottom {
			border-top: 1px solid #b9d2e3;
			border-bottom: 1px solid #b9d2e3;
			height: auto;
			font-family: arial, verdana, sans-serif;
			font-size: small;
			margin-top: 5px;
			margin-bottom: 5px;
			}

	#header-bottom ul {
			margin: 0;
			padding: 0 30px 0 0;
			text-align: right;
			}
			
	#header-bottom li {
			display: inline;
			xbackground-color: #fdf8f2;
			font-size: small;
			line-height: normal;
			}
			
	#header-bottom a:link, #header-bottom a:visited {
			text-decoration: none;
			xbackground-color: #fdf8f2;
			color: #050845;
			}
			
	#tagline {
			font-weight: bold;
			background-color: #fdf8f2;
			color: #050845;
			font-style: italic;
			margin: 0px;
			padding: 0 0 0 20px;
			/* width min 355px or will display bad in Lin Firefox */
			width: 420px;
			/* width: auto; */
			float: left;
			font-size: small;
			line-height: normal;
			}
				
	.title {
			vertical-align: middle;
			font-size: larger;
			}

.text-rainbow-animation {
  font-family:arial black;
  vertical-align: middle;
  font-size: larger;
  background-image: 
    linear-gradient(to right, red,orange,yellow,green,blue,indigo,violet,red); 
  -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;  
  animation: rainbow-animation 100s linear 2;
  /* animation: rainbow-animation 35s linear 2; */
}

@keyframes rainbow-animation {
    to {
        background-position: 4500vh;
    }
}
				
	#main {
			width: 100%;
			min-height: 600px;
			margin-top: 10px;
			}
			
	#clearone {
			clear: both;
			height: 1px;
			}

		
	#content {
			/* padding: 50px; */
			font-family: arial, verdana, sans-serif;
			color: navy;
			font-size: medium;
			}
			
	li {
			font-size: medium;
		}
			
	.left {
			float: left;
			padding: 0 20px 20px 0;
			}
			
	.rainbow-bar {
			display: block;
			border: 0;
			margin: 0;
			padding: 0;
			overflow: hidden;
			width: 100%;
    		height: 8px;
			/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ff0000+0,ffa500+17,fbe103+33,00ff00+50,0000ff+67,4b0082+83,800080+100;Rainbow */
			background: #ff0000; /* Old browsers */
			background: -moz-linear-gradient(left, #ff0000 0%, #ffa500 17%, #fbe103 33%, #00ff00 50%, #0000ff 67%, #4b0082 83%, #800080 100%); /* FF3.6-15 */
			background: -webkit-linear-gradient(left, #ff0000 0%,#ffa500 17%,#fbe103 33%,#00ff00 50%,#0000ff 67%,#4b0082 83%,#800080 100%); /* Chrome10-25,Safari5.1-6 */
			background: linear-gradient(to right, #ff0000 0%,#ffa500 17%,#fbe103 33%,#00ff00 50%,#0000ff 67%,#4b0082 83%,#800080 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff0000', endColorstr='#800080',GradientType=1 ); /* IE6-9 */
			position: relative;
    	}
			
	.center, .call-to-action--standout { 
 			height: 220px;
 			width: 450px;
			position: relative;
			}
			
	.call-to-action--standout {
			margin: auto;
			border: 3px solid #fdf8f2; 
			/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#1e5799+0,2989d8+50,7db9e8+100 */
			background: #1e5799; /* Old browsers */
			background: -moz-linear-gradient(top, #1e5799 0%, #2989d8 50%, #7db9e8 100%); /* FF3.6-15 */
			background: -webkit-linear-gradient(top, #1e5799 0%,#2989d8 50%,#7db9e8 100%); /* Chrome10-25,Safari5.1-6 */
			background: linear-gradient(to bottom, #1e5799 0%,#2989d8 50%,#7db9e8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 ); /* IE6-9 */
			-webkit-box-shadow: 8px 8px 8px 8px rgba(0, 0, 0, 0.4);
			-moz-box-shadow: 8px 8px 8px 8px rgba(0, 0, 0, 0.4);
			box-shadow: 8px 8px 8px 8px rgba(0, 0, 0, 0.4);
			-webkit-border-radius: 10px;
			-moz-border-radius: 10px;
			border-radius: 10px;
			}
			
	.call-to-action__heading {
			margin: 0;
			position: absolute;
			top: 5%;
			left: 50%;
			-ms-transform: translate(-50%, -5%);
			transform: translate(-50%, -5%);
			color: #ffffff;
		}
		
		.call-to-action__heading h2 {
			color: #ffffff;
		}

	.center, .call-to-action--standout p {
			margin: 0;
			padding: 0 0 5px 0;
			position: absolute;
			top: 50%;
			left: 50%;
			-ms-transform: translate(-50%, -50%);
			transform: translate(-50%, -50%);
			}
			
	.call-to-action--standout p {
			width: 80%;
			padding: 0px 0px 10px 0px;
			text-align: justify;
			color: #ffffff;
			}
			
	.call-to-action__links {
			padding: 10px;
			text-align: center;
		}
	
	.call-to-action__links a:link, a:visited {
  			color: #ffffff;
			background-color: #f44336;
  			padding: 14px 55px;
  			text-align: center;
  			text-decoration: none;;
  			display: inline-block;
  			font-weight: bold;
  			-webkit-border-radius: 10px;
			-moz-border-radius: 10px;
			border-radius: 10px;
			}

	.call-to-action__links a:hover {
			color: #4b4b4b;
  			background-color: hotpink;
			}

	.call-to-action__links a:active {
			color: #ffffff;
  			background-color: hotpink;
			}
			
	.call-to-action__links a:visited {
			color: #ffffff;
		}
		
	.indent {
			margin: 50px;
		}
			
	.rainbow-image {
			position: absolute;
  			top: 8px;
  			right: 90%;
			display: block;
			border: 0;
			margin: 0;
			padding: 0;
			overflow: hidden;
			width: 40px;
    		height: 20px;
			/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ff0000+0,ffa500+17,fbe103+33,00ff00+50,0000ff+67,4b0082+83,800080+100;Rainbow */
			background: #ff0000; /* Old browsers */
			background: -moz-linear-gradient(-45deg, #ff0000 0%, #ffa500 27%, #fbe103 43%, #00ff00 60%, #0000ff 77%, #4b0082 93%, #800080 100%); /* FF3.6-15 */
			background: -webkit-linear-gradient(-45deg, #ff0000 0%,#ffa500 27%,#fbe103 43%,#00ff00 60%,#0000ff 77%,#4b0082 93%,#800080 100%); /* Chrome10-25,Safari5.1-6 */
			background: linear-gradient(135deg, #ff0000 0%,#ffa500 27%,#fbe103 43%,#00ff00 60%,#0000ff 77%,#4b0082 93%,#800080 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff0000', endColorstr='#800080',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
			border-radius: 10px 0 0 0;
			}
			
	* {
  			box-sizing: border-box;
			}
			
	.column-wrapper {
			}

	/* Create three equal columns that floats next to each other */
	.2column {
			background-color: #fdf8f2;
  			float: left;
  			/* width: 33.33%; */
  			/* width: 25%; */
  			width: 50%;
  			padding: 0 10px;
			}

	/* Create three equal columns that floats next to each other */
	.column {
			background-color: #fdf8f2;
  			float: left;
  			/* width: 33.33%; */
  			/* width: 25%; */
  			padding: 0 10px;
			}
			
	/* Remove extra left and right margins, due to padding in columns */
	.row {
			/* background-color: #7b8ece; */
			background-color: #fdf8f2;
			margin: 0 -5px;
			}

	/* Clear floats after the columns */
	.row:after {
		  content: "";
		  display: table;
		  clear: both;
			}
			
	/* Style the counter cards */
	.card {
  			box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2); /* this adds the "card" effect */
  			padding: 16px;
  			text-align: center;
  			background-color: #f1f1f1;
			}
			
	.imgbox {
            display: grid;
            /* height: 100%; */
        }

	.center-fit {
            max-width: 100%;
            max-height: 100vh;
            margin: auto;
        }
			
	.eclient-list-icon {
			border: 0px;
			float: left;
			clear: left;
			display: block;
			background-position: 0px 0px;
			background-repeat: no-repeat;
			/* padding: 0px 20px 0px 20px; */
		   width: 100px;
		   height: 100px;
			}
			
	.eclient-list-instruction {
			border: 0px;
			clear: both;
			}
			
	.eclient-list-item {
					list-style-type: square;
			}
			
	.eclient-list-text-step {
					list-style-type: decimal;
			}
			
	.directory-listing {
			-webkit-columns: 300px 2;
   		-moz-columns: 300px 2;
        	columns: 300px 2;
			}
						
	a:link { color: navy;}
	a:visited { color: navy; }
	a:hover { color: purple; }
	a:active { color: pink; }
	
	.carousel{position:relative}.carousel.pointer-event{-ms-touch-action:pan-y;touch-action:pan-y}.carousel-inner{position:relative;width:100%;overflow:hidden}.carousel-inner::after{display:block;clear:both;content:""}.carousel-item{position:relative;display:none;float:left;width:100%;margin-right:-100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:-webkit-transform .6s ease-in-out;transition:transform .6s ease-in-out;transition:transform .6s ease-in-out,-webkit-transform .6s ease-in-out}@media (prefers-reduced-motion:reduce){.carousel-item{transition:none}}.carousel-item-next,.carousel-item-prev,.carousel-item.active{display:block}.active.carousel-item-right,.carousel-item-next:not(.carousel-item-left){-webkit-transform:translateX(100%);transform:translateX(100%)}.active.carousel-item-left,.carousel-item-prev:not(.carousel-item-right){-webkit-transform:translateX(-100%);transform:translateX(-100%)}.carousel-fade .carousel-item{opacity:0;transition-property:opacity;-webkit-transform:none;transform:none}.carousel-fade .carousel-item-next.carousel-item-left,.carousel-fade
	
  .carousel-inner > .item > img,
  .carousel-inner > .item > a > img {
    width: 70%;
    margin: auto;
  }

	#footer {
			min-height: 85px;
			margin: 0px; 
			padding: 0px;
			overflow: none;
			clear: both;
			font-family: arial, verdana, sans-serif;
			color: #000000;
			}
			
 	#footer .ftext {
				font-size: x-small;
 			 }
			
	#footer img {
			border: 0px;
			float: left;
			clear: left;
			display: block;
			background-position: 5px 2px;
			background-repeat: no-repeat;
			text-indent: 50px;
			padding: 0px 20px 0px 20px;
		   /* width: 167px; */
		   /* height: 83px; */
			}

	table { background-color: #999999; width: 100%; }
	th { color: #ffffff; background-color: #003366; font-family: arial, verdana, sans-serif; font-weight: bold; }
	tr.odd { background-color: #cccccc; }
	tr { color: #000000; }
	tr.even { background-color: #ffffff; }
	tr.blank { background-color: #000000; height: 1px; line-height: 1px; }
	tr:hover { background-color: #999999; }
	td { font-family: arial, verdana, sans-serif; }
	td.blank { background-color: #000000; height: 1px; line-height: 1px; }
	.smallCell
	{
    width: 1px;
    white-space: nowrap;
	}
	
	.luv img {
    		-webkit-animation-name:             rotate; 
    		-webkit-animation-duration:         0.5s; 
    		-webkit-animation-iteration-count:  10;
    		-webkit-animation-timing-function: steps(12, start);
    }
    
    .uniform img {
    		border: 0px;
			float: left;
			clear: left;
			display: block;
    }
    
/* image cross-fade */ 
.fadein img {
    position:absolute;
    /* top:0; */
	 height:512px;
	 width:900px;
	 margin:0 auto;
    -webkit-animation-name: fade;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-duration: 12s;
    animation-name: fade;
    animation-iteration-count: infinite;
    animation-duration: 6s;
}

@-webkit-keyframes fade {
    0% {opacity: 0;}
    20% {opacity: 1;}
    33% {opacity: 1;}
    53% {opacity: 0;}
    100% {opacity: 0;}
}
@keyframes fade {
    0% {opacity: 0;}
    20% {opacity: 1;}
    33% {opacity: 1;}
    53% {opacity: 0;}
    100% {opacity: 0;}
}

#f1 {
    }
#f2 {
    -webkit-animation-delay: -4s;
    background-color: lightblue;
}
#f3 {
    -webkit-animation-delay: -2s;
    background-color: yellow;
}

/* end of image cross-fade */

/* Start of media screen styles */
/* Style for Tablets */
@media only screen and (max-width: 991px) { 
/* start of large tablet styles */ 			 
 			body .fcopy {
 			text-align: center;
			font-family: arial, verdana, sans-serif;
			font-size: xx-small;
			color: #ffffff;
			}
			
			#header {
				font-size: medium;
			}
			
			.title {
				font-size: small;
			}
			
			#header-bottom li {
				display: inline;
				xbackground-color: #fdf8f2;
				font-size: small;
			}
			
			#tagline {
					font-size: small;
			}
					
			#header-bottom {
				height: auto;
			}
			
			#content {
			font-size: small;
			}
			
			.call-to-action--standout p {
				font-size: medium;
			}
			
			li {
				font-size: medium;
			}	
		
			li.small {
				font-size: small;
			}
			
 			 #footer .ftext {
				 font-size: xx-small;
 			 }
		}

@media only screen and (max-width: 600px) {
/* start of medium tablet styles */ 			 
 			body .fcopy {
 			text-align: center;
			font-family: arial, verdana, sans-serif;
			font-size: xx-small;
			color: #ffffff;
			}
			
			#header {
				font-size: small;
			}
			
			.title {
				font-size: small;
			}
			
			#content {
				font-size: small;
			}
			
			#header-bottom li {
				display: inline;
				xbackground-color: #fdf8f2;
				font-size: small;
			}
			
			#tagline {
					font-size: small;
			}

#header-bottom {
				height: auto;
			}
			
			li {
				font-size: medium;
			}
		
			li.small {
				font-size: x-small;
			}
					
			.call-to-action--standout p {
				font-size: medium;
			}
			
			.column {
    			width: 100%;
    			display: block;
    			margin-bottom: 20px;
 			 }
 			 
 			 .column p {
				font-size: medium; 			 
 			 }
 			 
 			 #footer .ftext {
				 font-size: xx-small;
 			 }
		}
		
/* Style for small phones */
@media only screen and (max-width: 479px) {
/* start of phone styles */
			 			 
		 	body .fcopy {
		 	text-align: center;
			font-family: arial, verdana, sans-serif;
			font-size: 0.5em;
			color: #ffffff;
			}
			
			#header {
				font-size: x-small;
			}
			
			.title {
				font-size: small;
			}
			
			#header img.1ev {
				width: 133px;
				height: 76px;
			}
			
			#header img.bucksgg {
				width: 78px;
				height: 78px;
			}
			
			#tagline {
					font-size: small;
			}
			
			#header-bottom li {
				display: inline;
				xbackground-color: #fdf8f2;
				font-size: small;
			}
			
#header-bottom {
				height: auto;
			}
			
			#content {
				font-size: medium;
			}
			
			li {
				font-size: medium;
			}
		
			li.small {
				font-size: x-small;
			}
			
			.call-to-action--standout p {
				font-size: medium;
			}
			
			.column {
    			width: 100%;
    			display: block;
    			margin-bottom: 20px;
 			 }
 			 
 			 .column p {
				font-size: medium; 			 
 			 }
 			 
 			 #footer .ftext {
				 font-size: 0.5em;
 			 }
		}
