/*
Author: Mohammad Zahoor Ali
Website: http://www.sofexindia.com/
*/ 

body {font-family:Arial, Sans-Serif;}
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
a {color:#0067ab; text-decoration:none;}
a:hover {text-decoration:underline;}
.form{width: 100%; margin: 0 auto;}
input[type='text'], 
input[type='email'],
input[type='password']
 {width: 200px; border-radius: 2px;border: 1px solid #0033CC; padding: 10px; color: #000000; font-size: 14px; margin-top: 10px;}
input[type='submit']
{padding: 10px 25px 8px; color: #fff; background-color: #0067ab; text-shadow: rgba(0,0,0,0.24) 0 1px 0; font-size: 16px; box-shadow: rgba(255,255,255,0.24) 0 2px 0 0 inset,#fff 0 1px 0 0; border: 1px solid #0164a5; border-radius: 2px; margin-top: 10px; cursor:pointer;}
input[type='submit']:hover {background-color: #024978;}

input[type='textmin'] {width: 100px; border-radius: 2px;border: 1px solid #0033CC; padding: 10px; color: #000000; font-size: 14px; margin-top: 10px;}
input[type='text1'] {width: 1300px; border-radius: 2px;border: 1px solid #CCC; padding: 10px; color: #333; font-size: 14px; margin-top: 10px;}
input[type='alpha'] {width: 400px; border-radius: 2px;border: 1px solid #CCC; padding: 10px; color: #333; font-size: 14px; margin-top: 10px;}
input[type='beta'] {width: 800px; border-radius: 2px;border: 1px solid #CCC; padding: 10px; color: #333; font-size: 14px; margin-top: 10px;}
input[type='gamma'] {width: 300px; border-radius: 2px;border: 1px solid #CCC; padding: 10px; color: #333; font-size: 14px; margin-top: 10px;}
input[type='delta'] {width: 200px; border-radius: 2px;border: 1px solid #CCC; padding: 10px; color: #333; font-size: 14px; margin-top: 10px;}
input[type='kappa'] {width: 100px; border-radius: 2px;border: 1px solid #CCC; padding: 10px; color: #333; font-size: 14px; margin-top: 10px;}
input[type='mobno'] {width: 150px; border-radius: 2px;border: 1px solid #CCC; padding: 10px; color: #333; font-size: 20px; margin-top: 10px;}
input[type='contmob'] {Height: 30px; width: 200px; border-radius: 2px; border: 1px solid ##006600; padding: 2px; color: #000000; font-size: 14px; margin-top: 2px;}

input[type='id'] {width: 80px; border-radius: 2px;border: 1px solid #CCC; padding: 10px; color: #333; font-size: 14px; margin-top: 10px;}

input[type='memno'] {Height: 100px; width: 500px; border-radius: 5px; border: 2px solid #006600; padding: 10px; color: #ff0066; font-size: 14px; margin-top: 10px;}
div { word-wrap: break-word;}

.blinking{
    animation:blinkingText 2s infinite;
}
@keyframes blinkingText{
    0%{     color: #000;    }
    49%{    color: #000; }
    60%{    color: transparent; }
    99%{    color:transparent;  }
    100%{   color: #000;    }
}




.blinkingxx{
    animation:blinkingText 4s infinite;
}

/* The animation code 
@keyframes blinkingText{
  0%   {background-color:red; left:0px; top:0px;}
  25%  {background-color:yellow; left:200px; top:0px;}
  50%  {background-color:blue; left:200px; top:200px;}
  75%  {background-color:green; left:0px; top:200px;}
  100% {background-color:red; left:0px; top:0px;}
}

@keyframes blinkingText{
    0%{     color: #000;    }
    49%{    color: transparent; }
    50%{    color: transparent; }
    99%{    color:transparent;  }
    100%{   color: #000;    }
}
*/

/* The animation code */
@keyframes blinkingText{
  0%   {background-color: #ffffff;}	
  25%  {background-color: #e6ffee;}	
  50%  {background-color: #ffd6cc;}	
  100% {background-color: #ffffb3;}	


/*
  0%   {background-color: white;}	#ffffff
  25%  {background-color: grey;}	#e6ffee
  50%  {background-color: lightblue;}	#ffd6cc
  100% {background-color: lightgreen;}	#ffffb3

    0%{     color: #000;    }
    49%{    color: #000; }
    60%{    color: transparent; }
    99%{    color:transparent;  }
    100%{   color: #000;    }
*/

}



/* unvisited link */
a:link {
  color: red;
}

/* visited link */
a:visited {
  color: green;
}

/* mouse over link */
a:hover {
  color: hotpink;
}

/* selected link */
a:active {
  color: blue;
}


p.dotted {border-style: dotted;}
p.dashed {border-style: dashed;}
p.solid {border-style: solid;}
p.double {border-style: double;}
p.groove {border-style: groove;}
p.ridge {border-style: ridge;}
p.inset {border-style: inset;}
p.outset {border-style: outset;}
p.none {border-style: none;}
p.hidden {border-style: hidden;}
p.mix {border-style: dotted dashed solid double;}


p.dotted {outline-style: dotted;}
p.dashed {outline-style: dashed;}
p.solid {outline-style: solid;}
p.double {outline-style: double;}
p.groove {outline-style: groove;}
p.ridge {outline-style: ridge;}
p.inset {outline-style: inset;}
p.outset {outline-style: outset;}


div {
//background: linear-gradient(to bottom, #33ccff 0%, #ff99cc 100%);
background: linear-gradient(to top, #ffccff 0%, #99ccff 100%);
}

diz {
// background: linear-gradient(to bottom, #33ccff 0%, #ff99cc 100%);
background: linear-gradient(to top, #ffffff 0%, #ffffff  100%);
}

body {
 background-color: #D5EAFF;
//background-image: linear-gradient(red, yellow, green);
//background-image: linear-gradient(to right, rgba(0,255,255,0), rgba(0,255,255,0.5));
//background-image: linear-gradient(red, yellow, green)
//background-image: linear-gradient(to top, #ffccff 0%, #99ccff 100%);
//bgcolo:"#D5EAFF";
}

h1 {
  color: navy;
  margin-left: 20px;
}

#grad1 {
  background-image: linear-gradient(red, yellow, green);
}

#grad2 {
  background-image: linear-gradient(to right, rgba(255,0,0,0), rgba(255,0,0,1));
}

#grad {
  background-image: linear-gradient(to right, red,orange,yellow,green,blue,indigo,violet); 
}

textarea {
 width: 280px;
 height: 70px;
 background-color: white;
 font-size: 0.85em;
 font-weight: normal;
 font-family: Arial;
 border: 1px solid grey;
 padding: 5px; 
}