body{font-family:Baskerville;}
#logo{width:300px; margin:20px auto;}
#logo img{width:100%; }

#title{width:100%; font-weight:bold; text-align:center; padding:10px 0px; background:rgb(255, 136, 0); color:white; letter-spacing:1px; margin-bottom:20px;}
#cont{text-align:center;}
#cont .box{text-decoration:none;overflow:hidden;display:inline-block; width:35%;  margin:20px; height:350px;border-radius:10px 2px 2px 10px; }
#cont img{width:150%;}
#cont .dtext{position:absolute; display:block; width:35%;  padding-top:150px; padding-bottom:150px; text-align:center; 
color:white; letter-spacing:2px; font-size:45px; height:50px; background:rgba(0,0,0,0.3); border-radius:10px;}
#cont input,#cont select{width:400px; padding-left:5px;height:40px; border:1px solid silver; margin-bottom:20px;}
#cont input[type=submit]{background:green; border:1px solid green; color:white;}
#cont table{width:100%;  border-collapse:collapse; background:white; border-radius:0px 40px 0px 40px;}
#cont table td{padding:10px 20px; font-weight:bold; color:#565454;}
.catecov{background:rgb(255, 136, 0); height:auto;  width:92%; padding:10px 4%; margin-bottom:20px;}

	 .spinner-wrapper {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color:black;
z-index: 999999;
}

	 .sk-folding-cube {
top:48%;
left:48%;
  width: 40px;
  height: 40px;
  position: absolute;
  -webkit-transform: rotateZ(45deg);
          transform: rotateZ(45deg);
}

.sk-folding-cube .sk-cube {
  float: left;
  width: 50%;
  height: 50%;
  position: relative;
  -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
          transform: scale(1.1); 
}
.sk-folding-cube .sk-cube:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color:red;
  -webkit-animation: sk-foldCubeAngle 2.4s infinite linear both;
          animation: sk-foldCubeAngle 2.4s infinite linear both;
  -webkit-transform-origin: 100% 100%;
      -ms-transform-origin: 100% 100%;
          transform-origin: 100% 100%;
}
.sk-folding-cube .sk-cube2 {
  -webkit-transform: scale(1.1) rotateZ(90deg);
          transform: scale(1.1) rotateZ(90deg);
}
.sk-folding-cube .sk-cube3 {
  -webkit-transform: scale(1.1) rotateZ(180deg);
          transform: scale(1.1) rotateZ(180deg);
}
.sk-folding-cube .sk-cube4 {
  -webkit-transform: scale(1.1) rotateZ(270deg);
          transform: scale(1.1) rotateZ(270deg);
}
.sk-folding-cube .sk-cube2:before {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
}
.sk-folding-cube .sk-cube3:before {
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s; 
}
.sk-folding-cube .sk-cube4:before {
  -webkit-animation-delay: 0.9s;
          animation-delay: 0.9s;
}
@-webkit-keyframes sk-foldCubeAngle {
  0%, 10% {
    -webkit-transform: perspective(140px) rotateX(-180deg);
            transform: perspective(140px) rotateX(-180deg);
    opacity: 0; 
  } 25%, 75% {
    -webkit-transform: perspective(140px) rotateX(0deg);
            transform: perspective(140px) rotateX(0deg);
    opacity: 1; 
  } 90%, 100% {
    -webkit-transform: perspective(140px) rotateY(180deg);
            transform: perspective(140px) rotateY(180deg);
    opacity: 0; 
  } 
}

@keyframes sk-foldCubeAngle {
  0%, 10% {
    -webkit-transform: perspective(140px) rotateX(-180deg);
            transform: perspective(140px) rotateX(-180deg);
    opacity: 0; 
  } 25%, 75% {
    -webkit-transform: perspective(140px) rotateX(0deg);
            transform: perspective(140px) rotateX(0deg);
    opacity: 1; 
  } 90%, 100% {
    -webkit-transform: perspective(140px) rotateY(180deg);
            transform: perspective(140px) rotateY(180deg);
    opacity: 0; 
  }
}

@media (max-width:800px){
	#cont .box{display:block; width:90%;}
	#cont .dtext{width:90%; }
	#logo{margin:10px auto;}
	#cont input,#cont select{width:100%; }
}