* {
	font-family: 'Share Tech', sans-serif;
	font-size: 1.1rem;
}
.Tech-h2 {
	font-family: 'Share Tech', sans-serif;
	font-size: 2.4rem;
}
.fs-larger {
	font-size: 1.25rem;
}
.nav-space {
	margin-top: 9.2em;
}
.hand {
	background-image: url("../images/hand_clear.png");
	background-position: bottom;
	background-repeat: no-repeat;
	background-size: 42em;
}
.hsp {
	margin-top: .8em;
	margin-left: auto;
	margin-right: auto;
	padding-bottom:	50px;
	text-align: center;
	cursor: pointer;
}
.sp-btm-pdd {
	padding-bottom:	550px;
}
.section {
	height: 100vh;
	position: relative;
}
.button-sm-blue {
	width: 10rem;
    text-align: center;
    padding: 8px;
	border: 2px solid #da1414;
	border-radius: 5px;
}
.button-sw-wht-txt {
	color: white;
    text-decoration: none;
}
.bg-lightgray {
	background-color: #DDDDDD;
}
.border-right-red {
	border-right: 4px solid #da1414;
	border-left: 1px solid #032a4b;
}
.rancho {
	font-family: 'Rancho', cursive;
	font-size: 1.2rem;
}
.doublebottom {
	border-bottom: .5em double #d2d2d2;
}
.doublebottomblue {
	border-bottom: .5em double #032a4b;
}
.print-border {
	border-radius: 12px;
	background-color: #ecf2fe;
}
.content-bg {
	background-color: white;
    border-radius: 15px;
    border: 5px double red;
}
.content-bg1 {
	background-color: white;
    border-radius: 15px;
    border: 5px double #025194;
}
.content-bg2 {
	background-color: white;
    border-radius: 15px;
    border: 5px double black;
}
.web-bg {
	background-image: url('../images/web-bg.jpg');
	background-repeat: no-repeat;
	background-size: 1950px;
}
.print-bg {
	background-image: url('../images/print-bg.jpg');
	background-repeat: no-repeat;
	background-size: 1950px;
	background-color: #ecf2fe;
}
.art-bg {
	background-image: url('../images/art-bg.jpg');
	background-repeat: no-repeat;
	background-size: 1950px;
	background-color: #97999c;
}
.lt-bg-im {
	background-image:url("../images/left_liner-altGIF.gif");
	background-repeat: repeat-y;
	background-position: center;
	background-size: 60%;
	background-color: #032a4b;
}
/*.lt-bg-im {
	background-image:url("../images/left_liner-alt.png"), linear-gradient(#032a4b, #032a4b, #dddddd);
	background-repeat: repeat-y;
	background-position: center;
	background-size: 60%, 100%;
}*/
.lt-bg-im-2 {
	background-image:url("../images/left_liner-alt.png"), linear-gradient(#dddddd, #032a4b, #032a4b);
	background-repeat: repeat-y;
	background-position: center;
	background-size: 60%, 100%;
}
.lt-bg-im-3 {
	background-image:url("../images/left_liner-alt.png");
	background-repeat: repeat-y;
	background-position: center;
	background-size: 60%;
	background-color: #032a4b;
}
.kite {
	font-family: 'Kite One', sans-serif;
}
.centered {
	text-align: center;
}
.box-shadow {
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  	text-align: center;
}
.bg-linear {
	background-image: radial-gradient(circle, white, white, #535353);
}
.bg-linear-hp-btm {
	background-image: url(../images/border-main-top.png), radial-gradient(circle, white, white, #616161);
    background-position: top center;
    background-repeat: repeat-x, no-repeat;
    background-size: 50%, 100%;
}
.back_up {
	position:fixed;
	bottom: 0;
	right: 0;
	width: 3em;
}
.f-border {
	padding-bottom: 15px;
	border-top: 1px solid #2d2281;
}
.one_hundred {
	width: auto;
	height: auto;
}
.border-bottom-dblue {
	border-bottom:2px solid #032a4b;
}
.border-left-dblue {
	border-bottom:2px solid #032a4b;
}
.border-top-dblue {
	border-bottom:2px solid #032a4b;
}
.border-right-dblue {
	border-bottom:2px solid #032a4b;
}
.hp-bg-w {
	padding: 20px;
	border-radius: 15px;
	margin-top: 40px;
	margin-bottom: 40px;
	background-color: #ffffff;
}
.hp-bg-w-lp {
	padding: 10px;
	border-radius: 10px;
	margin-top: 40px;
	margin-bottom: 40px;
	background-color: #ffffff;
}
.container-sp {
  position: relative;
  width: 100%;
}

.base {
  display: block;
  width: 100%;
  height: auto;
}

.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: auto;
  width: 100%;
  opacity: 0;
  transition: .2s ease;
}

.container-sp:hover .overlay {
  opacity: 1;
}

/* .cover {
  font-size: 20px;
  position: absolute;
  top: 40%;
  left: 40%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
} */

.border-top {
	height: 45px!important;
	background-image: url("../images/border-main-top.png");
	background-repeat: repeat-x;
}
.bg2 {
	background-image:url("../images/border-main-top.png"), url("../images/bg2.jpg");
	background-repeat: repeat-x, no-repeat;
	background-size: 30%, 100%;
	background-position: top right, bottom right;
	background-color: #032a4b;
}
.bg2-alt {
	background-image:url("../images/border-main-top.png"), linear-gradient(#032a4b, #dddddd);
	background-repeat: repeat-x;
	background-size: 60%;
	background-position: top right;
	/* background-color: #032a4b; */
	background-color: #dddddd;
}
.no-padding {
	padding: 0;
}
.wire-frame-btn {
	width: 10em;
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.field {
	display: block;
	margin: 20px;
}
.thumb {
	width: 14.5rem;
}
.db-admin-bdr {
	text-align: left;
	border: 1px solid #8a8a8a;
}
.width-sp {
	width: 80%;
}
.magic {
	background-color: lightgrey;
	-webkit-animation-name: clr-ch; /* Safari 4.0 - 8.0 */
	-webkit-animation-duration: 8s; /* Safari 4.0 - 8.0 */
	animation-name: clr-ch;
	animation-duration: 8s;
	animation-direction: alternate;
	animation-iteration-count: infinite;
}

/* Safari 4.0 - 8.0 */
@-webkit-keyframes clr-ch {
	0%   {background-color: #cd1313;}
	25%  {background-color: #0482c3;}
	50%  {background-color: #032a4b;}
	100% {background-color: #0482c3;}
}

/* Standard syntax */
@keyframes clr-ch {
	0%   {background-color: #cd1313;}
	25%  {background-color: #0482c3;}
	50%  {background-color: #032a4b;}
	100% {background-color: #0482c3;}
}

.magic2 {
	background-color: lightgrey;
	-webkit-animation-name: clr-ch2; /* Safari 4.0 - 8.0 */
	-webkit-animation-duration: 8s; /* Safari 4.0 - 8.0 */
	animation-name: clr-ch2;
	animation-duration: 8s;
	animation-direction: alternate;
	animation-iteration-count: infinite;
}

/* Safari 4.0 - 8.0 */
@-webkit-keyframes clr-ch2 {
	0%   {background-color: #032a4b;}
	25%  {background-color: #656565;}
	50%  {background-color: #cd1313;}
	100% {background-color: #656565;}
}

/* Standard syntax */
@keyframes clr-ch2 {
	0%   {background-color: #032a4b;}
	25%  {background-color: #656565;}
	50%  {background-color: #cd1313;}
	100% {background-color: #656565;}
}

.intro-bg {
	background-color: lightgrey;
	-webkit-animation-name: clr-ch; /* Safari 4.0 - 8.0 */
	-webkit-animation-duration: 30s; /* Safari 4.0 - 8.0 */
	animation-name: clr-ch3;
	animation-duration: 30s;
	animation-direction: alternate;
	animation-iteration-count: infinite;
}

/* Safari 4.0 - 8.0 */
@-webkit-keyframes clr-ch3 {
	0%   {background-color: #ffffff;}
	25%  {background-color: #bebebe;}
	50%  {background-color: #ffffff;}
	100% {background-color: #8feaff;}
}

/* Standard syntax */
@keyframes clr-ch3 {
	0%   {background-color: #ffffff;}
	25%  {background-color: #bebebe;}
	50%  {background-color: #ffffff;}
	100% {background-color: #8feaff;}
}

/* ------------------------------------------------------------------------------------------- */
/* Special */
@media only screen and (max-width: 668px) { 
	.hand {
	background-image: url("../images/hand_clear.png");
	background-position: bottom;
	background-repeat: no-repeat;
	background-size: 28em;
	}
	.hsp {
	margin-top: .8em;
	margin-left: auto;
	margin-right: auto;
	padding-bottom:	30px;
	text-align: center;
	}
	.sp-btm-pdd {
		padding-bottom:	350px;
	}
	.nimg {
		display: none;
	}
	.nlinks {
		display: none;
	}
}f



/* ------------------------------------------------------------------------------------------- */
@media only screen and (min-width: 770px) {
	.hand {
	background-image: url("../images/hand_clear.png");
	background-position: bottom;
	background-repeat: no-repeat;
	background-size: 50em;
	}
	.bg-linear {
	background-image: radial-gradient(circle, white, white, #616161);
	}
	.hsp {
	margin-top: .8em;
	margin-left: auto;
	margin-right: auto;
	padding-bottom:	650px;
	text-align: center;
	}
	.rancho {
	font-family: 'Rancho', cursive;
	font-size: 1.6rem;
	}
	.rancho-h2 {
		font-family: 'Rancho', cursive;
		font-size: 2.6rem;
	}
	.center_div {
		margin-left: auto;
		margin-right: auto;
	}
	.bg2 {
		background-image:url("../images/border-main-top.png"), url("../images/bg2.jpg");
		background-repeat: repeat-x, no-repeat;
		background-size: 30%, 100%;
		background-position: top right, bottom right;
		background-color: #032a4b;
	}
	.bg2-alt {
	background-image:url("../images/border-main-top.png"), linear-gradient(#032a4b, #dddddd);
	background-repeat: repeat-x;
	background-size: 30%;
	background-position: top right;
	background-color: #d9dada;
	}
	.prg_img {
		width: 30em;
	}
	.hp-bg-w {
		padding: 20px;
		border-radius: 15px;
		margin-top: 40px;
		margin-bottom: 40px;
		background-color: #ffffff;
	}
	

	.base {
	  display: block;
	  width: 100%;
	  height: auto;
	}

	
	/* special style */
	.mr-2rem {
		margin-right: 2rem;
	}
	/* ------------- */
	.border-top {
		height: 45px!important;
		background-image: url("../images/border-main-top.png");
		background-repeat: repeat-x;
	}
	.hp-spacing {
		margin-top: 80px;
		margin-bottom: 80px;
	}
}



	
/* ------------------------------------------------------------------------------------------- */
/* bottom buttons and print iPad / iPad Pro */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
	.mr-2rem {
		margin-right:1rem;	
	}
	
	.fs-larger {
		font-size: 1.1rem;
	}
	.innerlink {
		margin-top: 1em;
		border: 1px solid #181818;
		padding: 1em 1.6em .5em 1.6em;
		margin-bottom: 2em;
		color: white;
	}
	.social-button {
		min-width: 10rem;
		display: flex;
		justify-content: center;
		height: 10rem;
		padding: 0.375rem 0.375rem 0;
		margin-right: 2rem;
		background: #eee;
		border-radius: 0.25rem;
		box-shadow: inset 0 1px 2px rgba(0,0,0,0.3);
		perspective: 50rem;
		margin-top: 50px;
		margin-bottom: 100px;
	}
	.cover {
		transform-origin: center bottom;
		transform-style: preserve-3d;
		text-align: center;
		z-index: 99;
	}
	.cover, .cover > * {
		position: absolute;
		top:0;
		left:0;
		width:100%;
		height:100%;
	}
	.cover svg{
		width: 40px;
		height:40px;
		filter: drop-shadow(0 1px 2px rgba(0,0,0,0.25));
	}
	.inner, .outer {
		border-radius: 0.25rem;
		background-image: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,0.1) 100%);
	}
	.outer {
		transform:translateZ(0.25rem);
	}
	.edge {
		top:0.25rem;
		height:0.25rem;
		transform:rotateX(90deg);
		transform-origin: center top;
	}
	.social-button:hover .cover {
		transform:rotateX(-120deg);
	}
	.social-button, .social-button div {
		transition-duration: 0.9s;
		transition-timing-function: ease;
	}
	.shadow {
		position: absolute;
		top:100%;
		left:0;
		width:100%;
		height:8.5rem;
		border-radius: 0.5rem;
		opacity: 0;
		background-image: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%, transparent 100%);
		transform:rotateX(90deg);
		transform-origin: center top;
	}
	.social-button:hover .shadow {
		transform: rotateX(45deg) scale(0.95);
		opacity: 1;
	}

	.webbutton .inner {
		background-image: url('../images/hp-btn-back-mid.png');
		background-repeat: no-repeat;
		background-size: 100%;
		background-position: top;
	}
	.webbutton .outer {
		background-image: url('../images/web-button-front-mid.png');
		background-repeat: no-repeat;
		background-size: 100%;
		background-position: top;
	}
	.webbutton .edge {
		background-color: #031e33;
	}
	.printbutton .inner {
		background-image: url('../images/hp-btn-back-mid.png');
		background-repeat: no-repeat;
		background-size: 100%;
		background-position: top;
	}
	.printbutton .outer {
		background-image: url('../images/print-button-front-mid.png');
		background-repeat: no-repeat;
		background-size: 100%;
		background-position: top;
	}
	.printbutton .edge {
		background-color: #cd1313;
	}
	.artbutton .inner {
		background-image: url('../images/hp-btn-back-mid.png');
		background-repeat: no-repeat;
		background-size: 100%;
		background-position: top;
	}
	.artbutton .outer {
		background-image: url('../images/art-button-front-mid.png');
		background-repeat: no-repeat;
		background-size: 100%;
		background-position: top;
	}
	.artbutton .edge {
		background-color: #032a4b;
	}
}



/* ------------------------------------------------------------------------------------------- */
/* bottom buttons */
@media only screen and (min-width: 1200px) {
	.innerlink {
		margin-top: 1em;
		border: 1px solid #181818;
		padding: 1em 3em .5em 3em;
		margin-bottom: 2em;
		color: white;
	}
	.social-button {
		min-width: 16rem;
		display: flex;
		justify-content: center;
		height: 12rem;
		padding: 0.375rem 0.375rem 0;
		margin-right: 2rem;
		background: #eee;
		/* border-radius: 0.25rem; */
		box-shadow: inset 0 1px 2px rgba(0,0,0,0.3);
		perspective: 50rem;
		margin-top: 50px;
		margin-bottom: 200px;
	}
	.cover {
		transform-origin: center bottom;
		transform-style: preserve-3d;
		text-align: center;
		z-index: 99;
	}
	.cover, .cover > * {
		position: absolute;
		top:0;
		left:0;
		width:100%;
		height:100%;
	}
	.cover svg{
		width: 40px;
		height:40px;
		filter: drop-shadow(0 1px 2px rgba(0,0,0,0.25));
	}
	.inner, .outer {
		border-radius: 0.25rem;
		background-image: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,0.1) 100%);
	}
	.outer {
		transform:translateZ(0.75rem);
	}
	.edge {
		top:0.25rem;
		height:0.75rem;
		transform:rotateX(90deg);
		transform-origin: center top;
	}
	.social-button:hover .cover {
		transform:rotateX(-120deg);
	}
	.social-button, .social-button div {
		transition-duration: 0.9s;
		transition-timing-function: ease;
	}
	.shadow {
		position: absolute;
		top:100%;
		left:0;
		width:100%;
		height:10.5rem;
		/* border-radius: 0.5rem; */
		opacity: 0;
		background-image: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%, transparent 100%);
		transform:rotateX(90deg);
		transform-origin: center top;
	}
	.social-button:hover .shadow {
		transform: rotateX(45deg) scale(0.95);
		opacity: 1;
	}

	.webbutton .inner {
		background-image: url('../images/hp-btn-back.png');
		background-repeat: no-repeat;
		background-size: 100%;
		background-position: top;
	}
	.webbutton .outer {
		background-image: url('../images/web-button-front.png');
		background-repeat: no-repeat;
		background-size: 100%;
		background-position: top;
	}
	.webbutton .edge {
		background-color: #031e33;
	}
	.printbutton .inner {
		background-image: url('../images/hp-btn-back.png');
		background-repeat: no-repeat;
		background-size: 100%;
		background-position: top;
	}
	.printbutton .outer {
		background-image: url('../images/print-button-front.png');
		background-repeat: no-repeat;
		background-size: 100%;
		background-position: top;
	}
	.printbutton .edge {
		background-color: #cd1313;
	}
	.artbutton .inner {
		background-image: url('../images/hp-btn-back.png');
		background-repeat: no-repeat;
		background-size: 100%;
		background-position: top;
	}
	.artbutton .outer {
		background-image: url('../images/art-button-front.png');
		background-repeat: no-repeat;
		background-size: 100%;
		background-position: top;
	}
	.artbutton .edge {
		background-color: #032a4b;
	}
}