

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;width:100%;
font-family: 'Roboto', 'Open sans';
 overflow-x:hidden;}
 body::-webkit-scrollbar {
    width: 10px;
}
 
body::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}
 
body::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  outline: 1px solid slategrey;
}
body{/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,e5e5e5+100;White+3D */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top, #ffffff 0%, #e5e5e5 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ffffff 0%,#e5e5e5 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */

}
::selection{background-color:#0273d4;color:#fff}
a{color:#0273d4;text-decoration:none}
a:hover{border-bottom:1px dotted #0273d4}p{margin-bottom:1em}
h1{border-bottom:1px dotted #0273d4;display:block;font-weight:300;margin:2rem 0 1rem;padding-bottom:0.5rem}
.loading{padding:1em}
.demo-header{align-items:center;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffc578+0,fb9d23+100;Orange+3D+%233 */
background: #ffc578; /* Old browsers */
background: -moz-linear-gradient(top, #ffc578 0%, #fb9d23 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ffc578 0%,#fb9d23 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ffc578 0%,#fb9d23 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffc578', endColorstr='#fb9d23',GradientType=0 ); /* IE6-9 */box-shadow:0 0.1em 1.5em rgba(84,85,85,0.5);color:#fff;display:flex;padding:1em}
.demo-header__toggle{background:transparent;border:0.15rem solid #fff;border-left:0;border-right:0;cursor:pointer;font-size:0;height:1.5rem;margin-right:1rem;position:relative;width:2rem}
.demo-header__toggle::after{background:#fff;content:'';height:0.15rem;left:0;margin-top:-0.075rem;position:absolute;top:50%;width:100%}
.demo-sidebar{padding:2em 1em;overflow: hidden;}.demo-sidebar.channelApps-sidebar--over{box-shadow:0 0 2.5em rgba(85,85,85,0.5)}
.demo-contents{padding:0 2em}.demo-control{background-color:#f6f6f6;border:1px solid #545555;cursor:pointer;margin-bottom:0.5em;padding:0.5em 2em;transition:background-color 0.15s}
.demo-control:hover{background-color:#545555;color:#fff}

.channelApps-sidebar-container {
      box-sizing: border-box;
      display: block;
      position: relative;
    }
    .channelApps-sidebar__backdrop {
      background: #000;
      height: 100%;
      left: 0;
      opacity: 0.75;
      pointer-events: auto;
      position: fixed;
      top: 0;
      width: 100%;
      z-index: 99999998;
    }
    .channelApps-sidebar__content {
      display: block;
      height: 100%;
      overflow: auto;
    }
    

    .channelApps-sidebar {
       /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f5f6f6+0,dbdce2+21,b8bac6+49,dddfe3+80,f5f6f6+100;Grey+Pipe */
background: #f5f6f6; /* Old browsers */
background: -moz-linear-gradient(top, #f5f6f6 0%, #dbdce2 21%, #b8bac6 49%, #dddfe3 80%, #f5f6f6 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #f5f6f6 0%,#dbdce2 21%,#b8bac6 49%,#dddfe3 80%,#f5f6f6 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #f5f6f6 0%,#dbdce2 21%,#b8bac6 49%,#dddfe3 80%,#f5f6f6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f6f6', endColorstr='#f5f6f6',GradientType=0 ); /* IE6-9 */
       width: 220px;
    }
    .ingtext{
        font-size: 20px;
    }

     .user{
       right: 20px;
    position: absolute;
     }
     .demo-header{
      position: fixed;
    width: 100%;
    z-index: 999;
     }
     .hidden{
       visibility: hidden;
     }
   .msg{
     color: green;
     font-family: sans-serif;
     font-weight: bold;
     font-size: 20px;
   }
   .hand{
    cursor: pointer;
   }
   .btn{
 cursor: pointer;
   }
   .loader{
display : block;
position : fixed;
z-index: 100;
background-image : url('/images/loader.gif');

background-repeat : no-repeat;
background-position : center;
left : 0;
bottom : 0;
right : 0;
top : 0;
}
.formElmsView   {
  margin-left: calc(25%);
  margin-right: calc(25%);
    /* position: absolute; */
  
        height: 100%;
    margin-bottom: 50px;
}
.dropdown.open .dropdown-menu {
    display: block;
}