html, body {
    margin: 0px;
    padding: 0px;
    overflow-x: hidden;
}

.ori-container-fluid {
    margin: 0px;
    padding: 0px;
   
}

.ori-common-page-content
{
width:90%;
margin: auto;
padding:10px;
font-family:'Verdana';
font-size:12px;
}

.ori-table tr,.ori-table-normal tr
{
padding:4px;
line-height: 12px;
height: 18px;
}

.ori-table tr:hover
{
background-color:green;
color:white;
}


 .ori-centre-div {
               width:100%;
               margin-left: auto;
                margin-right: auto;
                padding:5%;
                }

  
 .ori-centre-btn-div {
               width:100%;
               margin-left: auto;
                margin-right: auto;
                padding:5px;
                text-align:center;
                }

  .ori-ph-green
   {
    min-height:35px;
    background: #669900;
    position: relative;
    background-image: linear-gradient(#99CC00,#669900);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#99CC00), to(#669900));
    background-image: -webkit-linear-gradient(top, #99CC00,#669900);
    background-image:    -moz-linear-gradient(top, #99CC00, #669900);
    background-image:     -ms-linear-gradient(top, #99CC00, #669900);
    background-image:      -o-linear-gradient(top, #99CC00, #669900);
    box-shadow: 0px 10px 10px Gray;
    padding-top: 5px;
    padding-left: 10px;
    font-family: Arial;
    font-weight: bold;
    font-size: 15px;
    color: #FFFFFF;
    text-align: left;
    font-style: italic;
    width:100%;
    }

    .ori-Heading-Company h1{
               color: #999999;
               font-size:32px;
               font-family: Cambria;
                         }
             .ori-Heading-Company span{
               color:red;
               color: #FF0000; 
               font-family: 'Lucida Calligraphy';
                 font-size:40px;
                         }
            .ori-Heading-Company h5 {
                color: deepskyblue;
                font-size: 10px;
            }  
            
        @media only screen and (min-width: 1000px)  {
                .ori-Heading-Company h1{
                        font-size:48px;
                         }
             .ori-Heading-Company span{
                     font-size:60px;
                         }
            .ori-Heading-Company h5 {
                   font-size: 14px;
            }  

             .ori-Heading-Company img {
                   float:right;
            }  
}    
                      
  .ori-transparent-block {
                 margin-top:0px; 
               background: rgba(0, 0, 0, 0.3); /* Black background with 0.5 opacity */
                color: white; 
                 width: 100%;
                 height:100%; 
                 text-align:center;
}

      .ori-footer-head-bold {
    font-weight: bold;
     font-size: 16px;
    }


 /*ORI linear separator with shadow effect*/
 .outer {
  width: 1px;
  height: 100%;
  margin: auto;
  position: relative;
  overflow: hidden;
}
 
.inner {
  position: absolute;
  width:100%;
  height: 40%;
  background: grey;
  top: 30%;
  box-shadow: 0px 0px 30px 20px grey;
}

.ori-line-sepearator{
  height:400px;
  display:block;
}


@media only screen and (max-width: 768px)  {
    .ori-line-sepearator {
             display:none;
        }
}



/*button Controls*/

.ori-btn, .ori-button {
    border: none;
    display: inline-block;
    padding: 8px 16px;
    vertical-align: middle;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    background-color: inherit;
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
}
.ori-button-circle{
    border-radius:50%;
}

.ori-btn:hover{
    box-shadow:0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);

}

/*Background colors*/
.ori-black {
    background-color: black;
}

.ori-blueviolet {
    background-color: blueviolet;
}

.ori-red {
    background-color: red;
}

.ori-color-1 {
    background-color:  #435d7d;
}

.ori-green {
    background-color: green;
}

.ori-light-green {
    background-color: #629100;
}

.ori-green {
    background-color: green;
}
.ori-yellow {
    background-color: yellow;
}

.ori-blue {
    background-color: blue;
}

.ori-skyblue {
    background-color: skyblue;
}


.ori-dark-gray {
    background-color: darkgrey;
}


/*colors or Text colors */
.ori-text-white {
    color: white;
}

.ori-text-blue {
    color: blue;
}

.ori-text-red {
   color: red;
}

 .ori-text-bold {
    font-weight: bold;
   }

 .ori-tx-small {
    font-size: 11px;
   }
 .ori-tx-mid {
    font-size: 13px;
   }
 .ori-tx-xs {
    font-size: 16px;
   }
 .ori-tx-xl {
    font-size: 20px;
   }
  .ori-tx-xxl {
    font-size: 24px;
   }

  .ori-font-verdana{
    font-family: "Verdana";
    padding-bottom: 10px;
    padding-top: 10px;
}


.ori-sicon {
    padding: 4px;
     margin: 5px; 
     width: 35px; 
     height: 35px;
      display:block;
      top:auto;
      left:auto;
      border:2px solid silver;
}

.ori-align-right{
    float:right;
}

.ori-align-left{
    float:left;
}



.ori-nav-ul
{
    list-style-type: none;
    margin: 0;
    padding: 0;
    top: 0;
}

.ori-nav-ul li a {
    display: block;
    color: white;
    text-align: center;
    padding: 10px 12px;
    text-decoration: none;
    }

.ori-nav-ul li a:hover {color:aqua;}

/*.ori-container{
   margin: 0px;
   padding: 0px;
   display: flex;
  flex-wrap: wrap; /*  wrap-reverse */
  /*box-sizing: border-box;*/
  /*justify-content: center/flex-start/flex-end/space-around/space-between;
      The align-items property is used to align the flex items vertically.
      align-items:center/flex-start/flex-end/stretch/baseline;
      align-content: center/flex-start/flex-end/space-around/space-between;
  
  }*/

  .ori-date-control{
      max-width:140px;
      font-size:12px;
                  }

   .ori-label{
       padding-right:8px;
      }
   
   .ori-text-small{
        max-width:150px;
   }   

   .ori-text-mid{
        max-width:250px;
   }  

   .ori-margin-small {
      margin:4px 8px;
   }

 .ori-margin-mid {
      margin:4px 16px;
   }

   .ori-margin-large {
      margin:20px;
   }
  
   .ori-no-data
   {
       padding:1em 2em;
       font-size:20px;
       color:orangered;
   }

.ori-modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 100; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.7); /* Black w/ opacity */
   }

   .ori-modal-content-x {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    border: 1px solid #888;
    width: 500px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 0.4s;
    animation-name: animatetop;
    animation-duration: 0.4s;
}
    .ori-modal-content-l {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    border: 1px solid #888;
    width: 80%;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 0.4s;
    animation-name: animatetop;
    animation-duration: 0.4s;
}

   @-webkit-keyframes animatetop {
    from {top:-250px; opacity:0} 
    to {top:0; opacity:1}
}

@keyframes animatetop {
    from {top:-250px; opacity:0}
    to {top:0; opacity:1}
}

.ori-close {
    color: black;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.ori-close:hover, .ori-close:focus {
    color: orangered;
    text-decoration: none;
    cursor: pointer;
}

.ori-modal-header {
    padding: 2px 10px;

    }

.ori-modal-body {
    padding: 5px 10px;
  }

.ori-modal-footer {
    padding: 8px 10px;
    border-top-style: solid;
     border-top-width: 1px;
      border-top-color: #999999;
      min-height:50px;
      }

.ori-single-form{
     margin:auto;
     width:500px;
     border:1px solid blue;
}

@media screen and (max-width: 600px){
    .ori-align-right, .ori-align-left
     {float: none;}
    .ori-modal-content-x,.ori-single-form {width:80%;}
     .ori-text-small,.ori-text-mid{
    max-width:100%;
   }   
      
}

input.ori-invalid,select.ori-invalid{
    border-color:#cf2304;
-webkit-box-shadow: 0px 0px 4px 1px rgba(207,35,4,0.5);
-moz-box-shadow: 0px 0px 4px 1px rgba(207,35,4,0.5);
box-shadow: 0px 0px 4px 1px rgba(207,35,4,0.5);
}

span.ori-invalid {
    display:inline;
    color:red;
    font-size:12px;
    font-style:normal;
}

input.ori-valid,select.ori-valid{
     border-color:#83db70;
-webkit-box-shadow: 0px 0px 4px 1px rgba(131,219,112,0.75);
-moz-box-shadow: 0px 0px 4px 1px rgba(131,219,112,0.75);
box-shadow: 0px 0px 4px 1px rgba(131,219,112,0.75);

}

.ori-text-limegreen
{
    color: limegreen;
      
    }

.ori-aling-centre{
    width:100%;
  margin-left: auto;
  margin-right: auto;
    padding:16px;
    text-align:center;
    }

.ori-edit-link{
    cursor:pointer;
}

.ori-edit-link:hover {
        color:forestgreen;
    }