@charset "utf-8";
.btnasm {border:thin;
colour: green;
pading : 2px 2px;
font-size: 10px;
cursor: pointer;
border-radius:10;
}
.btn1 {
    border: none;
    color: white;
    padding: 14px 28px;
    font-size: 16px;
    cursor: pointer;
	w3-round-large;
	border-radius:10;
}
	
.blueboldheader {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: bold;
	color: #03C;
	background-color: #FFF;
}
.paratitleblue {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: bold;
	color: #009;
	background-color: #FFF;
}
.textarialblack {
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	font-style: normal;
	font-weight: normal;
	color: #000;
	background-color: #FFF;
}
.textarialblacksmall {
	font-family: "Arial Black", Gadget, sans-serif;
	font-size: xx-small;
	font-style: normal;
	line-height: normal;
	color: #000;
	font-weight: normal;
	background-color: #FFF;
}
.headarialblue {
	font-family: Arial, Helvetica, sans-serif;
	font-size: medium;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #009;
	background-color: #FFF;
}
.arialbluelge {
	font-size: 24px;
	font-family: Arial, Helvetica, sans-serif;
	color: #03C;
	font-style: normal;
	font-weight: bolder;
	background-color: #9F3;
}

.blueboldheaderpic {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: bold;
	color: #00F;
	background-color: #FF0;
}
.arialblackmed {
	font-size: small;
	font-family: Arial, Helvetica, sans-serif;
	font-style: normal;
	font-weight: bold;
	background-color: #FFF;
}

.comicboldblack {
	font-family: "Comic Sans MS", cursive;
	font-size: medium;
	font-style: italic;
	font-weight: bold;
	color: #C0C;
	text-decoration: blink;
	background-color: #FFF;
}
.moblarge {
	font-weight: bolder;
	font-size: xx-large;
	font-family: Arial, Helvetica, sans-serif;
	color: #333;
	font-style: normal;
	text-decoration: underline;
	background-color: #FFF;
}
.Mobxlarge {
	font-family: Arial, Helvetica, sans-serif;
	font-size: x-large;
	font-style: normal;
	font-weight: bolder;
	background-color: #FFF;
}

.boldblackbox {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #FFF;
	font-size: x-large;
	background-color: #000;
	text-align: left;
	vertical-align: middle;
}

 .boldbluebox {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #FFF;
	font-size: x-large;
	background-color: #00C;
	text-align: left;
	vertical-align: middle;
}
.boldgreenbox {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #FFF;
	font-size: x-large;
	background-color: #0C0;
	text-align: left;
	vertical-align: middle;
}
.boldorgbox {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #FFF;
	font-size: x-large;
	background-color: #F96;
	text-align: left;
	vertical-align: middle;
}
.boldpinkbox {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #FFF;
	font-size: x-large;
	background-color: #F9F;
	text-align: left;
	vertical-align: middle;
}
.boldredbox {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #FFF;
	font-size: x-large;
	background-color: #F00;
	text-align: left;
	vertical-align: middle;
}
.boldwhitebox {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #000;
	font-size: x-large;
	background-color: #FFF;
	text-align: left;
	vertical-align: middle;
}
.boldyelbox {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #FFF;
	font-size: x-large;
	background-color: #FF6;
	text-align: left;
	vertical-align: middle;
}
.titlecomicred {
	font-family: "Comic Sans MS", cursive;
	font-weight: bold;
	color: #C00;
	font-size: large;
	font-style: italic;
	text-decoration: blink;
	background-color: #F9F;
	
}


.flip-box {
	    float: left;
  background-color: transparent;
  width: 300px;
  height: 400px;
  border: 1px solid #f1f1f1;
  perspective: 1000px;
}

.flip-box-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

.flip-box:hover .flip-box-inner {
  transform: rotateY(180deg);
}

.flip-box-front, .flip-box-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.flip-box-front {
  background-color: #bbb;
  color: black;
}

.flip-box-back {
  background-color: dodgerblue;
  color: white;
  transform: rotateY(180deg);
}


.flip-box-v {
	    float: left;
  background-color: transparent;
  width: 300px;
  height: 400px;
  border: 1px solid #f1f1f1;
  perspective: 1000px;
}

.flip-box-inner-v {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

.flip-box-v:hover .flip-box-inner-v {
  transform: rotateX(180deg);
}

.flip-box-front-v, .flip-box-back-v {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.flip-box-front-v {
  background-color: dodgerblue;
  color: white ;
}

.flip-box-back-v {
  background-color: #bbb;
  color: black;
  transform: rotateX(180deg);
}