#cssmenu ul,
#cssmenu li,
#cssmenu span,
#cssmenu a {
    margin: 0;
    padding: 0;
    position: relative;
}
/*#cssmenu {
  line-height: 1;
  border-radius: 5px 5px 0 0;
  -moz-border-radius: 5px 5px 0 0;
  -webkit-border-radius: 5px 5px 0 0;
  background: #141414;
  background: -moz-linear-gradient(top, #333333 0%, #141414 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #333333), color-stop(100%, #141414));
  background: -webkit-linear-gradient(top, #333333 0%, #141414 100%);
  background: -o-linear-gradient(top, #333333 0%, #141414 100%);
  background: -ms-linear-gradient(top, #333333 0%, #141414 100%);
  background: linear-gradient(to bottom, #333333 0%, #141414 100%);
  border-bottom: 2px solid #0fa1e0;
  width: auto;
}*/



/*#d871e9*/
#cssmenu {
    line-height: 1;
    border-radius: 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0;
    background: #dadada;
    background: -moz-linear-gradient(top, #333333 0%, #dadada 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #333333), color-stop(100%, #dadada));
    background: -webkit-linear-gradient(top, #333333 0%, #dadada 100%);
    background: -o-linear-gradient(top, #333333 0%, #dadada 100%);
    background: -ms-linear-gradient(top, #333333 0%, #dadada 100%);
    background: linear-gradient(to bottom, #333333 0%, #dadada 100%);
    border-bottom: 2px solid #ff4e4e;
    width: auto;
}
#cssmenu:after,
#cssmenu ul:after {
    content: '';
    display: block;
    clear: both;
}
/*#cssmenu a {
  background: #141414;
  background: -moz-linear-gradient(top, #333333 0%, #141414 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #333333), color-stop(100%, #141414));
  background: -webkit-linear-gradient(top, #333333 0%, #141414 100%);
  background: -o-linear-gradient(top, #333333 0%, #141414 100%);
  background: -ms-linear-gradient(top, #333333 0%, #141414 100%);
  background: linear-gradient(to bottom, #333333 0%, #141414 100%);
  color: #ffffff;
  display: block;
  font-family: Helvetica, Arial, Verdana, sans-serif;
  padding: 12px 20px;
  text-decoration: none;
}*/
#cssmenu a {
    background: #333333;
    background: -moz-linear-gradient(top, #333333 0%, #333333 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #333333), color-stop(100%, #333333));
    background: -webkit-linear-gradient(top, #333333 0%, #333333 100%);
    background: -o-linear-gradient(top, #333333 0%, #333333 100%);
    background: -ms-linear-gradient(top, #333333 0%, #333333 100%);
    background: linear-gradient(to bottom, #333333 0%, #333333 100%);
    color: #ffffff;
    display: block;
    font-family: Helvetica, Arial, Verdana, sans-serif;
    padding: 12px 20px;
    text-decoration: none;
}
#cssmenu ul {
    list-style: none;
}
#cssmenu > ul > li {
    display: inline-block;
    float: left;
    margin: 0;
}
#cssmenu.align-center {
    text-align: center;
}
#cssmenu.align-center > ul > li {
    float: none;
}
#cssmenu.align-center ul ul {
    text-align: left;
}
#cssmenu.align-right > ul {
    float: right;
}
#cssmenu.align-right ul ul {
    text-align: right;
}
#cssmenu > ul > li > a {
    color: #ffffff;
    font-size: 15px;
}
#cssmenu > ul > li:hover:after {
    content: '';
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    left: 50%;
    bottom: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    /*#0fa1e0 - blue botton arrow color*/
    border-bottom: 10px solid #ff4e4e;
    margin-left: -10px;
}
#cssmenu > ul > li:first-child > a {
    border-radius: 5px 0 0 0;
    -moz-border-radius: 5px 0 0 0;
    -webkit-border-radius: 5px 0 0 0;
}
#cssmenu.align-right > ul > li:first-child > a,
#cssmenu.align-center > ul > li:first-child > a {
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
}
#cssmenu.align-right > ul > li:last-child > a {
    border-radius: 0 5px 0 0;
    -moz-border-radius: 0 5px 0 0;
    -webkit-border-radius: 0 5px 0 0;
}
#cssmenu > ul > li.active > a,
#cssmenu > ul > li:hover > a {
    color: #ffffff;
    box-shadow: inset 0 0 3px #000000;
    -moz-box-shadow: inset 0 0 3px #000000;
    -webkit-box-shadow: inset 0 0 3px #000000;
    background: #070707;
    background: -moz-linear-gradient(top, #262626 0%, #070707 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #262626), color-stop(100%, #070707));
    background: -webkit-linear-gradient(top, #262626 0%, #070707 100%);
    background: -o-linear-gradient(top, #262626 0%, #070707 100%);
    background: -ms-linear-gradient(top, #262626 0%, #070707 100%);
    background: linear-gradient(to bottom, #262626 0%, #070707 100%);
}
#cssmenu .has-sub {
    z-index: 1;
}
#cssmenu .has-sub:hover > ul {
    display: block;
}
#cssmenu .has-sub ul {
    display: none;
    position: absolute;
    width: 200px;
    top: 100%;
    left: 0;
}
#cssmenu.align-right .has-sub ul {
    left: auto;
    right: 0;
}
#cssmenu .has-sub ul li {
    *margin-bottom: -1px;
}
#cssmenu .has-sub ul li a {
    
    background: #0fa1e0;
    border-bottom: 1px dotted #31b7f1;
    font-size: 11px;
    filter: none;
    display: block;
    line-height: 120%;
    padding: 10px;
    color: #ffffff;
}
#cssmenu .has-sub ul li:hover a {
    background: #0c7fb0;
}
#cssmenu ul ul li:hover > a {
    color: #ffffff;
}
#cssmenu .has-sub .has-sub:hover > ul {
    display: block;
}
#cssmenu .has-sub .has-sub ul {
    display: none;
    position: absolute;
    left: 100%;
    top: 0;
}
#cssmenu.align-right .has-sub .has-sub ul,
#cssmenu.align-right ul ul ul {
    left: auto;
    right: 100%;
}
#cssmenu .has-sub .has-sub ul li a {
    background: #0c7fb0;
    border-bottom: 1px dotted #31b7f1;
}
#cssmenu .has-sub .has-sub ul li a:hover {
    background: #0a6d98;
}
#cssmenu ul ul li.last > a,
#cssmenu ul ul li:last-child > a,
#cssmenu ul ul ul li.last > a,
#cssmenu ul ul ul li:last-child > a,
#cssmenu .has-sub ul li:last-child > a,
#cssmenu .has-sub ul li.last > a {
    border-bottom: 0;
}


.bgformcolor
{
    /*#dadada*/
    background: #ffffff;  

}

.bgtablecontentcolor
{
    /*   background: #d1d1d1;  */
   /*#dadada*/
    background: #ffffff;  

}



/*Card shadow effect S*/
div.card {
    /*width: 250px;*/
    box-shadow: 10px 10px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    text-align: center;
}

div.header {
    background-color: #4CAF50;
    color: white;
    padding: 10px;
    font-size: 40px;
}

div.container {
    padding: 5px;
}
/*Card shadow effect E*/




/*anim text effect S*/
/*h1 {
  font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
  font-size: 92px;
  padding: 80px 50px;
  text-align: center;
  text-transform: uppercase;
  text-rendering: optimizeLegibility;
}
h1.elegantshadow {
  color: #131313;
  background-color: #e7e5e4;
  letter-spacing: .15em;
  text-shadow: 1px -1px 0 #767676, -1px 2px 1px #737272, -2px 4px 1px #767474, -3px 6px 1px #787777, -4px 8px 1px #7b7a7a, -5px 10px 1px #7f7d7d, -6px 12px 1px #828181, -7px 14px 1px #868585, -8px 16px 1px #8b8a89, -9px 18px 1px #8f8e8d, -10px 20px 1px #949392, -11px 22px 1px #999897, -12px 24px 1px #9e9c9c, -13px 26px 1px #a3a1a1, -14px 28px 1px #a8a6a6, -15px 30px 1px #adabab, -16px 32px 1px #b2b1b0, -17px 34px 1px #b7b6b5, -18px 36px 1px #bcbbba, -19px 38px 1px #c1bfbf, -20px 40px 1px #c6c4c4, -21px 42px 1px #cbc9c8, -22px 44px 1px #cfcdcd, -23px 46px 1px #d4d2d1, -24px 48px 1px #d8d6d5, -25px 50px 1px #dbdad9, -26px 52px 1px #dfdddc, -27px 54px 1px #e2e0df, -28px 56px 1px #e4e3e2;
}
h1.deepshadow {
  color: #e0dfdc;
  background-color: #333;
  letter-spacing: .1em;
  text-shadow: 0 -1px 0 #fff, 0 1px 0 #2e2e2e, 0 2px 0 #2c2c2c, 0 3px 0 #2a2a2a, 0 4px 0 #282828, 0 5px 0 #262626, 0 6px 0 #242424, 0 7px 0 #222, 0 8px 0 #202020, 0 9px 0 #1e1e1e, 0 10px 0 #1c1c1c, 0 11px 0 #1a1a1a, 0 12px 0 #181818, 0 13px 0 #161616, 0 14px 0 #141414, 0 15px 0 #121212, 0 22px 30px rgba(0, 0, 0, 0.9);
}
h1.insetshadow {
  color: #202020;
  background-color: #2d2d2d;
  letter-spacing: .1em;
  text-shadow: -1px -1px 1px #111, 2px 2px 1px #363636;
}
h1.retroshadow {
  color: #2c2c2c;
  background-color: #d5d5d5;
  letter-spacing: .05em;
  text-shadow: 4px 4px 0px #d5d5d5, 7px 7px 0px rgba(0, 0, 0, 0.2);
}*/

 

/* DEMO-SPECIFIC STYLES */
.typewriter h1 {
  color: #D9241D;
  font-size: 20px;
  font-family: monospace;
  overflow: hidden; /* Ensures the content is not revealed until the animation */
  border-right: .15em solid orange; /* The typwriter cursor */
  white-space: nowrap; /* Keeps the content on a single line */
  margin: 0 auto; /* Gives that scrolling effect as the typing happens */
  letter-spacing: .15em; /* Adjust as needed */
  -webkit-animation: 
    typing 3.5s steps(30, end),
    blink-caret .5s step-end infinite;
          animation: 
    typing 3.5s steps(30, end),
    blink-caret .5s step-end infinite;
}

/* The typing effect */
@-webkit-keyframes typing {
  from { width: 0 }
  to { width: 100% }
}
@keyframes typing {
  from { width: 0 }
  to { width: 100% }
}

/* The typewriter cursor effect */
@-webkit-keyframes blink-caret {
  from, to { border-color: transparent }
  50% { border-color: orange }
}
@keyframes blink-caret {
  from, to { border-color: transparent }
  50% { border-color: orange }
}
/*anim text effect S*/



/*div effects */
.grow:hover
{
        -webkit-transform: scale(1.3);
        -ms-transform: scale(1.3);
        transform: scale(1.3);
        
}