/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Jun 5, 2017, 1:20:30 PM
    Author     : Kumud.Bhardwaj
*/
    path.svgActive{
       stroke: orangered;
    }
    path.svgNonActive{
        stroke: #ffff66;
    }    
    
    #arcLogoIMG, #arcCartIMG, #arcBeadOuter{
        stroke: orangered;
    }
    div.headerContainer, #siHomeHeader{
        background: linear-gradient(to right, white, orangered, white);
    }

   div.footerDiv{
        background: linear-gradient(to right, white, orangered, white);        
   }

    p.HeaderLink{
        height: 20px; 
        line-height: 20px; 
        cursor: pointer;
        text-align: right; 
        font-size: x-small;
        font-weight: normal; 
        color: white; 
        display: inline-block; 
        width: 55px; 
        margin: 2px 0 0 0;
    }
         
    p.HeaderLink:hover{
        color: #ffff66; 
    }

  
    #txtMainParent {
        -webkit-animation: txtMainParent  2s 2 ease-in-out;
        -webkit-animation-play-state: running;  /* Chrome, Safari, Opera */
        -webkit-animation-delay: 5s;
        animation: txtMainParent 2s 2 ease-in-out;
        animation-delay: 3s;
        animation-play-state: running;
    }

    @-webkit-keyframes txtMainParent {
        0% {stroke : #ffff66; fill: #ffff66;}
        50% {stroke: lime; fill: white;}
        100% {stroke : #ffff66; fill: #ffff66;}
    }   
   
    #txtMainTeacher {
        -webkit-animation: txtMainTeacher 2s 2 ease-in-out;
        -webkit-animation-play-state: running;  /* Chrome, Safari, Opera */
        -webkit-animation-delay: 7s;
        animation: txtMainTeacher 2s 2 ease-in-out;
        animation-delay: 7s;
        animation-play-state: running;
    }

    @-webkit-keyframes txtMainTeacher {
        0% {stroke: #ffff66; fill: #ffff66;}
        50% {stroke: lime; fill: white;}
        100% {stroke: #ffff66; fill: #ffff66;}
    }   

    #txtMainStudent {
        -webkit-animation: txtMainStudent 2s 3 ease-in-out;;
        -webkit-animation-play-state: running;  /* Chrome, Safari, Opera */
        -webkit-animation-delay: 11s;
        animation: txtMainStudent 2s 3 ease-in-out;
        animation-delay: 11s;
        animation-play-state: running;
    }

    @-webkit-keyframes txtMainStudent {
        0% {stroke: orangered;fill: orangered;}
        50% {stroke: lime; fill: white;}
        100% {stroke: orangered;fill: orangered;}
    }   

    
    circle.Active{
    fill-opacity: 0.5;
    fill: orangered;
    stroke: blue;
}

    circle.nonActive{
        fill-opacity: 0.25;
        fill: #ffff66;
        stroke: blue;
    }
    
     circle.datainValid{
        stroke: red;
    }    

    circle.dataValid{
        stroke: green;
    }    
    
    label.inputText{
        color: orangered;
    }
    
    label.checkboxText{
        color: orangered;
    }
    
    legend{
        color: orangered;
    }

    input[type="checkbox"] + label:before {
      border: 1px solid orangered;
    }

    input[type="checkbox"]:checked + label:before {
      background: #ffff66;
      color: orangered;
    }

    input[type="text"]:hover, [type="date"]:hover, [type="password"]:hover, [type="email"]:hover, textarea:hover,
    select:hover, fieldset.elist:hover > legend {
      background-color: #ffff66;
    }

    option:not(:checked), textarea:focus {
      background-color: #ffcccc;
    }

    fieldset {
      border: 2px darkorange solid;
      border-radius: 10px;
    }

    fieldset.elist:hover ul {
      background-color: #ffffff;
    }
    
@media only screen and (max-width: 480px) {
    
    div.headerContainer{
        background: none;
    }
    
    div.footerDiv{
        background: none;        
    }
}