#shad1 {
 
box-shadow: 20px 20px 18px #413605;
}

#shad2 {
 
box-shadow: 6px 6px 9px #413605;
}




* { box-sizing: border-box:}

/*catch all  */ 
.cen   {
position: absolute; 
top:30%;
WIDTH:=70%;
border: 1px solid  black;

  }




/*phones  */
@media only screen and (max-width: 600px)
{
 .cen   { border-style:none;
position: absolute; 
top:30%;
WIDTH:=90%;
border: 3px solid black;
  }
}


/*large device acer my laptop pc */
@media only screen and (min-width: 992px)
{
 .cen  {   border: 1px solid black;
position: absolute;
top:20%;
left:100px;
width: calc(100% - 200px);
 padding:16px 16px; 
  border-radius: 25px ;

  }
  }


@media only screen and (max-width: 1280px)
{border: 4px solid black;
.cen    { border-style:none;
position: absolute; 
top:15%;
left:200px;
width: calc(100% - 400px);

  }
}

@media only screen and (orientation: landscape) 
{
 .flxcont  {
position: absolute;

top:50%;
left:250px;
width: calc(100% - 500px);
border-radius:5%;
-ms-transform: translateY(-50%);
  transform: translateY(-50%); 
  }  }

@media only screen and (orientation: portrait) 
{
 .flxcont  {
position: absolute;
left:20px;
width: calc(100% - 40px);

color:blue;
border-radius:5%;
-ms-transform: translateY(-50%);
  transform: translateY(-50%); 
  }  }

p.italic {
    font-style: italic;
}
p.small {line-height: 1;}

div.all {text-align:left;}
div.alr {text-align:right;}
div.alc {text-align:center;}

.hv:hover{background:white;
	color:black; }

#corner { border-radius: 40px;padding: 20px; background:#b6b5d0; color: white;}

.w3-buttx{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}

.w3-barr-item{padding:8px 16px;float:left; width:auto;border:none;}

.w3-butt{ width:100%;text-align:center;padding:8px 16px; }

.font1{ background-color: auto;color:white;}

.hv:hover{background:white;
	color:black; }

.colorset{background-color: #f1f1ff;
	color:white;
	cursor: pointer;}

buttonX{background-color:white;
padding: 2px 8px;
 	color: black;
border: 1px solid #413605;
}



.buttond{border: 1px solid white; background-color: #4441a4;
	padding: 2px 8px;
 	color:white; border: 1px solid #413605;

        	background: -webkit-gradient(linear, left top, left bottom, from(#87cefa), to(#4441a4));
	background: -moz-linear-gradient(top, #87cefa,  #4441a4);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#87cefa', endColorstr='#4441a4');
}



.sticky {
  position: fixed;
  top: 0;
  width: 100%;
}
.footer {
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
     background-image: linear-gradient(#f1f1ff,#4441a4); 
   color: white;

}



.headertop {
   position: fixed;

top:0;   
 left: 0;
 
   width: 100%;
   background-color:#4441a4;  
     background-image: linear-gradient(#4441a4,#f1f1ff);  
   color: white;
}

	
.colorset2{ 
	
	background-color: #f1f1ff;
	color:white; 
	width:80%; text-align: center; } 

#graddn {
  height: auto;
  background-color: white; /* For browsers that do not support gradients */
  background-image: linear-gradient(#4441a4,#f1f1ff); 

}
#gradup {
  height: auto;
  background-color: white; /* For browsers that do not support gradients */
  background-image: linear-gradient(#f1f1ff,#4441a4); 

}



/*