
/* __________-----------------_______________---------------- __________-----------------_______________----------------  */ 
     /*Form*/   
    body {font-family: Arial, Helvetica, sans-serif;}
        * {box-sizing: border-box;}
        
        /* Button used to open the contact form - fixed at the bottom of the page */
        .open-button {
          background-color: #555;
          color: white;
          padding: 16px 20px;
          border: none;
          cursor: pointer;
          opacity: 0.8;
          position: fixed;
          bottom: 23px;
          right: 28px;
          width: 280px;
        }
        
        /* The popup form - hidden by default */
        .form-popup {
          display: none;
          position: fixed;
          bottom: 0;
          right: 15px;
          border: 3px solid #f1f1f1;
          z-index: 9;
          
        }
        
        /* Add styles to the form container */
        .form-container {
          max-width: 300px;
          padding: 10px;
          background-color: white;
        }
        
        /* Full-width input fields */
        .form-container input[type=text], .form-container input[type=password] {
          width: 100%;
          padding: 15px;
          margin: 5px 0 22px 0;
          border: none;
          background: #f1f1f1;
        }
        
        /* When the inputs get focus, do something */
        .form-container input[type=text]:focus, .form-container input[type=password]:focus {
          background-color: #ddd;
          outline: none;
        }
        
        /* Set a style for the submit/login button */
        .form-container .btn {
          background-color: #04AA6D;
          color: white;
          padding: 16px 20px;
          border: none;
          cursor: pointer;
          width: 100%;
          margin-bottom:10px;
          opacity: 0.8;
        }
        
        /* Add a red background color to the cancel button */
        .form-container .cancel {
          background-color: red;
        }
        
        /* Add some hover effects to buttons */
        .form-container .btn:hover, .open-button:hover {
          opacity: 1;
        }
        
        
     /* __________-----------------_______________---------------- __________-----------------_______________----------------  */ 
     /* Mouse Scroll*/   
        
    body {
          background: #333;
        }
        
        
        *, *:before, *:after {
          -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
         }
        
        
        .mouse_scroll {
          display: block;
          margin: 0 auto;
          width: 24px;
          height: 100px;
          margin-top: 125px;
        }
        
        
        .m_scroll_arrows
        {
          display: block;
          width: 5px;
          height: 5px;
          -ms-transform: rotate(45deg); /* IE 9 */
          -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
          transform: rotate(45deg);
           
          border-right: 2px solid #c71d3a;
          border-bottom: 2px solid #c71d3a;
          margin: 0 0 3px 4px;
          
          width: 16px;
          height: 16px;
        }
        
        
        .unu
        {
          margin-top: 1px;
        }
        
        .unu, .doi, .trei
        {
            -webkit-animation: mouse-scroll 1s infinite;
            -moz-animation: mouse-scroll 1s infinite;
            animation: mouse-scroll 1s infinite;
          
        }
        
        .unu
        {
          -webkit-animation-delay: .1s;
          -moz-animation-delay: .1s;
          -webkit-animation-direction: alternate;
          
          animation-direction: alternate;
          animation-delay: alternate;
        }
        
        .doi
        {
          -webkit-animation-delay: .2s;
          -moz-animation-delay: .2s;
          -webkit-animation-direction: alternate;
          
          animation-delay: .2s;
          animation-direction: alternate;
          
          margin-top: -6px;
        }
        
        .trei
        {
          -webkit-animation-delay: .3s;
          -moz-animation-delay: .3s;
          -webkit-animation-direction: alternate;
          
          animation-delay: .3s;
          animation-direction: alternate;
          
          
          margin-top: -6px;
        }
        
        .mouse {
          height: 42px;
          width: 24px;
          border-radius: 14px;
          transform: none;
          border: 2px solid white;
          top: 170px;
        }
        
        .wheel {
          height: 5px;
          width: 2px;
          display: block;
          margin: 5px auto;
          background: white;
          position: relative;
          
          height: 4px;
          width: 4px;
          border: 2px solid #fff;
          -webkit-border-radius: 8px;
                  border-radius: 8px;
        }
        
        .wheel {
          -webkit-animation: mouse-wheel 0.6s linear infinite;
          -moz-animation: mouse-wheel 0.6s linear infinite;
          animation: mouse-wheel 0.6s linear infinite;
        }
        
        @-webkit-keyframes mouse-wheel{
           0% {
            opacity: 1;
            -webkit-transform: translateY(0);
            -ms-transform: translateY(0);
            transform: translateY(0);
          }
        
          100% {
            opacity: 0;
            -webkit-transform: translateY(6px);
            -ms-transform: translateY(6px);
            transform: translateY(6px);
          }
        }
        @-moz-keyframes mouse-wheel {
          0% { top: 1px; }
          25% { top: 2px; }
          50% { top: 3px;}
          75% { top: 2px;}
          100% { top: 1px;}
        }
        @-o-keyframes mouse-wheel {
        
           0% { top: 1px; }
          25% { top: 2px; }
          50% { top: 3px;}
          75% { top: 2px;}
          100% { top: 1px;}
        }
        @keyframes mouse-wheel {
        
           0% { top: 1px; }
          25% { top: 2px; }
          50% { top: 3px;}
          75% { top: 2px;}
          100% { top: 1px;}
        }
        
        @-webkit-keyframes mouse-scroll {
        
          0%   { opacity: 0;}
          50%  { opacity: .5;}
          100% { opacity: 1;}
        }
        @-moz-keyframes mouse-scroll {
        
          0%   { opacity: 0; }
          50%  { opacity: .5; }
          100% { opacity: 1; }
        }
        @-o-keyframes mouse-scroll {
        
          0%   { opacity: 0; }
          50%  { opacity: .5; }
          100% { opacity: 1; }
        }
        @keyframes mouse-scroll {
        
          0%   { opacity: 0; }
          50%  { opacity: .5; }
          100% { opacity: 1; }
        }
              