body, h1, h2, p{
  font-family: muli;
}

body::-webkit-scrollbar {width: 6px; height: 4px; background: #ffffff; display: block;}
body::-webkit-scrollbar-thumb { background-color: #ffb300;  }

::-webkit-scrollbar {width: 6px; height: 4px; background: #ffffff; display: none;}
::-webkit-scrollbar-thumb { background-color: red;}

.btn:focus{
  border: hidden;
  outline: hidden;
  box-shadow: none; 
}

#loader {
  margin-top: 45vh;
  z-index: 1;
  width: 50px;
  height: 50px;
 
  border: 10px solid lightgrey;
  border-radius: 50%;
  border-top: 10px solid darkorange;
  width: 50px;
  height: 50px;
  -webkit-animation: spin 0.5s linear infinite;
  animation: spin 0.5s linear infinite;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Add animation to "page content" */
.animate-bottom {
  position: relative;
  -webkit-animation-name: animatebottom;
  -webkit-animation-duration: 1s;
  animation-name: animatebottom;
  animation-duration: 1s
}

@-webkit-keyframes animatebottom {
  from { bottom:-100px; opacity:0 } 
  to { bottom:0px; opacity:1 }
}

@keyframes animatebottom { 
  from{ bottom:-100px; opacity:0 } 
  to{ bottom:0; opacity:1 }
}

#myDiv {
  display: none;
  text-align: center;
}

.modalbg{
  background-color: rgba(0,0,0,0.2);
}

.bounce {
  animation-name: example;
  animation-duration: 6s;
  -webkit-animation-name: example;
  -webkit-animation-duration: 6s;
  -webkit-animation-timing-function: ease-in-out;
  -webkit-animation-delay: 0s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  -webkit-animation-fill-mode: none;
  -webkit-animation-play-state: running;
}


/* Safari 4.0 - 8.0 */
@-webkit-keyframes example {
  0%   {transform: translateY(0px);}
  50% {transform: translateY(-20px);}
  100% {transform: translateY(0px);}
}

/* Standard syntax */
@keyframes example {
 0%   {transform: translateY(0px);}
 50% {transform: translateY(-20px);}
  100% {transform: translateY(20px);}
}

/*//uploadcare*/
.uploadcare--widget__button, .uploadcare--widget__button:hover {
  padding: 20px;
  background-color: white;
  padding: 10px 20px ;
  border: 1px solid #1652f0;
  color: #df1f25;
  font-family: 
  font-weight: 800;
}

.uploadcare--widget__button:hover {
  background-color: #1652f0;
  color: white;
}

/*//blockonomics*/
#blockoPayModal.modal.fade .modal-dialog{
  transform: translate(0,0%)!important;
}

.btn:active, .btn:focus, .btn:hover, {
  outline: red;
  border: red;
  box-shadow: none;
}

.form-control:focus{
  box-shadow: none;
  border: 1px solid  #1652f0;
}

.noshadow:focus{
  box-shadow: none;
}

.form-control:active{
  outline: red;
  border: red;
  box-shadow:  #1652f0;  
  background-color: white;
}


.navv{
  color: white !important;
}


.navlogo{
  background-image: url(vbank.png); 
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain; 
  height: 50px;
}

.navbar-fixed-top.scrolled {
  background-color: #ffffff !important;
  border-bottom : 1px solid rgb(236, 239, 241);
  transition: background-color 200ms linear;
  color: white;
}

.navbar-fixed-top.scrolled .nav-link {
  color: black !important;
}

.box-logo {
  background-image: url('vbank1.jpg');
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}


.gradient{
	background-color: #ffb300; 
}

.sidebar:hover{
  background-color:  darkblue;
  text-decoration: none;
}

.scale:hover{
	    transition: all .2s ease-in-out;
	    -moz-transform:scale(0.9);
	    -webkit-transform:scale(0.9);
	    -o-transform:scale(0.9);
	    -transform:scale(0.9);
	    background-color:  #ffb300;
	    color: white;   
}

.scales:hover{
      transition: all .2s ease-in-out;
      -moz-transform:scale(0.9);
      -webkit-transform:scale(0.9);
      -o-transform:scale(0.9);
      -transform:scale(0.9);
      color: black;   
}

.showh2{
    	color: black;
    }

.hd{
	background-color: white;
	position: relative;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

.hddash{
  background-color: white;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url(index-3.html);
}

.dcoverdiv{
  position: absolute; 
  top: 0px;
  bottom: 0px;
  right: 0px;
  left: 0px;
  background-color: rgba(0,0,0,0.3);
}

.dcoverdivdash{
  position: absolute; 
  top: 0px;
  bottom: 0px;
  right: 0px;
  left: 0px;
  background-color: rgba(0,0,0,0.5);
}


.modalbg{
  background-color: rgba(0,0,0,0.4);
}

.hp2{
	font-size: 18px;
	font-weight: 600;
	
}

.serve{
	color: black;
	margin-bottom: 5px; 
}

.services{
	  font-weight: 500;
  }

.navbar-toggler:focus, .navbar-toggler:active{
	outline: none;
	box-shadow: none;
}

.pay1:focus,.pay2:focus, .pay3:focus, .pay4:focus, .pay5:focus{
  border: hidden;
  box-shadow: none;
  outline: hidden;
  background-color: white;
  margin-left: -10px;
  color:  #05b169;
  text-decoration: none;
  text-underline-position: hidden;
}

.pay1{
  border: hidden;
  box-shadow: none;
  outline: hidden;
  background-color: white;
  margin-left: -10px;
  color:  #05b169;
}

.pay2{
  border: hidden;
  box-shadow: none;
  outline: hidden;
  background-color: white;
  margin-left: -10px;
  color:  #05b169;
}

.pay3{
  border: hidden;
  box-shadow: none;
  outline: hidden;
  background-color: white;
  margin-left: -10px;
  color:  #05b169;
}

.pay4{
  border: hidden;
  box-shadow: none;
  outline: hidden;
  background-color: white;
  margin-left: -10px;
  color:  #05b169;
}

.pay5{
  border: hidden;
  box-shadow: none;
  outline: hidden;
  background-color: white;
  margin-left: -10px;
  color:  #05b169;
}

 /* home page styling */

@media only screen and (min-width: 1200px) {
    /* extra large device */
    .scale:hover{
	    transition: all .2s ease-in-out;
	    -moz-transform:scale(0.9);
	    -webkit-transform:scale(0.9);
	    -o-transform:scale(0.9);
	    -transform:scale(0.9);
    }

    .scalea:hover{
      transition: all .2s ease-in-out;
      -moz-transform:scale(0.9);
      -webkit-transform:scale(0.9);
      -o-transform:scale(0.9);
      -transform:scale(0.9);
      color: #e3000f;
    }
}

@media only screen and (max-width: 600px) {
    /* extra small devices: */
     .homewidgetmargin{
      margin-top: 0px;
    }

    .iconpad{
      padding: 0px;
    }

    .logosize {
      width: 150px;
      margin-left: -5px;
    }

    .textwrapper{

      white-space: nowrap;

    }

    .hideonsmall{
      display: none;
    }

    .pricetabshow{
      display: block;
    }

    .pricetab{
      margin-right: 100px
    }

    .navbar-collapse{
      background-color: #ffffff;
      margin: 0px;
      padding: 0px;
      clear: both;
      position: absolute;
      left: 0px;
      right: 0px;
      top: 60px;
      color: white;
      padding: 0px 20px 20px 20px;
    }

    .nav-link{
      color: white;
    }

    .hh1 {
    	font-size : 44px;
    	font-family:  Slate W01 Bk!important,"Graphik",helvetica;
    }
    .hp{
    	font-size: 20px;
    	font-family:  Slate W01 Bk!important,"Graphik",helvetica;
    	color: #df1f25;
    	font-weight: 400;
    }

    .hp2{
    	font-size: 16px;
    	font-weight: 400;
    	font-family: "Graphik",helvetica!important;
    }
    .services{
    	font-size: 18px; 
    	font-family: "Graphik",helvetica!important;
    }

    .showh4{
    	font-size: 20px;
    	font-weight: 500;
    }

    .serve{
    	font-size: 18px; 
    	font-family: "Graphik",helvetica!important;
    }

    .homeh1{
    	font-size: 30px;
    	font-family:  Slate W01 Bk!important,"Graphik",helvetica;
      font-weight: bold;
    }

    .hdiv{
      height: 60vh;
      margin-left: 10px;
    }

    .hdivdash{
      height: 70vh;
    }

    .hd{
    	height: 60vh;
    }

    .hddash{
      height: 70vh;
    }

   .dcover{
   	height: 60vh;
   }

    .dcoverdash{
    height: 70vh;
   }

   .navv{
   	  text-align: center;
   	  font-weight: 600;
   	  margin-bottom: 10px;
   }

   .navl{
      text-align: center;
      font-weight: 600;
      margin-bottom: 10px;
   }

   .contact{
   	margin-left: 15px;
   	margin-right: 15px;
   }
   .cardimg{
   	margin-left: 20px;
   	margin-right: 20px;
   	padding-bottom: 0px;
   	margin-bottom: 0px;
   }
   .access{
   	text-align: center;
   	margin-top: -50px;
   }
   .price{
   	display: none;
   }
   .profilename{
   	font-size: 20px;
   }
  
   .dbottomslide{
    display: block;
   }
   .dbottomslide1{
    display: none;
   }
   .clearprove{
      clear: both;
    }
      .ppics{
    margin-top: -5px;
   }

   .shift{
    margin-bottom: 0px; 
   }

    .showh2{
      font-size: 20px;
      font-weight: 600;
    }

}

@media only screen and (min-width: 600px) {
    /* small devices: */
  
     .homewidgetmargin{
      margin-top: 0px;
    }

    .iconpad{
      padding: 10px;
    }

    .logosize {
      width: 150px;
      margin-left: -5px;
    }

    .menusmall{
      display: none;
    }

    .hideonsmall{
      display: none;
    }

    .pricetabshow{
      display: none;
    }

    .hh1 {
    	font-size : 60px;
    	color: green
    }
    .hp{
    	font-size: 20px;
    }
     .hdiv{
    	height: 60vh;
    }

     .hdivdash{
      height: 80vh;
    }

    .nav{
    	padding: 30px;
    }
    .hd{
    	height: 60vh
    }

    }
    .hddash{
      height: 80vh;
    } 

    .dcover{
   	    height: 60vh;
   }

    .dcoverdash{
        height: 80vh;
   }

  .navv{
        font-size: 20px;
      font-weight: 400; 
      text-align: center;
   }

   .navl{
        font-size: 20px;
      font-weight: 400; 
      text-align: center;
   }

   .serve{
    	font-size: 18px; 
    	font-family: "Graphik",helvetica!important;
    }

     .showh2{
    	font-size: 20px;
    	font-weight: 600;
    }

    .dbottomslide{
    display: block;
   }

   .shift{
    margin-bottom: -50px;
   }
}

@media only screen and (min-width: 768px) {
    /* medium device */
     .homewidgetmargin{
      margin-top: -80px;
    }

     .iconpad{
      padding: 10px;
    }

    .pricetabshow{
      display: none;
    }

    .logosize {
      width: 180px;
      margin-left: -5px;
    }
    
    .textwrapper{

      white-space: nowrap;

    }

    .hh1 {
    	font-size : 70px;
    }
    .hp{
    	font-size: 20px;
    }
    .hh1{
    	margin-top: 25px;
    }
     .hdiv{
    	height: 70vh;
    }

     .hdivdash{
      height: 80vh;
    }

    .nav{
    	padding: 30px;
    }
    .hd{
    	height: 70vh;
    }

     .hddash{
      height: 80vh
    }

     .dcover{
   	    height: 70vh;
   }

    .dcoverdash{
        height: 80vh;
   }

   .navv{
        font-size: 20px;
      font-weight: 400; 
   }

   .navl{
        font-size: 20px;
      font-weight: 400; 
   }
    .navc{
   	    margin-left: 10px; 
   }

   .serve{
    	font-size: 18px; 
    	font-family: "Graphik",helvetica!important;
    }

     .showh2{
    	font-size: 40px;
    	font-weight: 800;
    }

    .dbottomslide{
    display: none;
   }

   .shiftlarge{
    margin-bottom: 50px;
   }

   .imgsize{
    width: 400px;
     height: 300px;
   }
}

@media only screen and (min-width: 992px) {
    /* large device */
     .homewidgetmargin{
      margin-top: -80px;
    }

     .iconpad{
      padding: 10px;
    }

     .logosize {
      width: 180px;
      margin-left: -15px;
    }

    .pricetabshow{
      display: none;
    }

    .menusmall{
      display: block;
    }


    .hh1 {
    	font-size : 70px;
    }
    .hp{
    	font-size : 25px;
    }
   
    .nav{
    	padding: 30px;
    }
    .homeh1{
    	font-size: 50px;
    }
     .homep{
    	font-size: 20px;
    	font-family:  Slate W01 Bk!important,"Graphik",helvetica;
    }
    .hd{
    	height: 70vh;
    }

    .hddash{
      height: 90vh;
    }

      .hdiv{
      height: 70vh;
    }

     .hdivdash{
      height: 90vh;
    }

     .dcover{
   	    height: 70vh;
   }

    .dcoverdash{
        height: 90vh;
   }
   .navv{
        font-size: 18px;
      font-weight: 400; 
   }

   .navl{
        font-size: 18px;
      font-weight: 400; 
   }
    .navc{
   	    margin-left: 10px; 
   }
   .socials{
   	    float: right;
   }

   .serve{
    	font-size: 18px; 
    	font-family: "Graphik",helvetica!important;
    }

    .showh2{
    	font-size: 60px;
    	font-weight: 900;
    }

   .dbottomslide{
    display: none;
   }

   .shiftlarge{
    margin-bottom: 50px;
   }

   .imgsize{
    width: 400px;
     height: 300px;
   }

   .pad{
    padding: 30px;
   }

   .signup{
    margin-left: 5px;
   }
}

@media only screen and (min-width: 1200px) {
    /* extra large device */
    
    .cardmargin{
      margin-top: -150px;
    }
     .iconpad{
      padding: 50px;
    }
    
    .services{
      font-size: 20px;
      font-weight: 900;
    }

    .pricetabshow{
      display: none;
    }

    .menusmall{
      display: block;
    }

    .hh1 {
    	font-size : 70px;
    }
    .hp{
    	font-size : 25px;
    	font-family: "Graphik",helvetica!important;
    }
     .hdiv{
    	height: 80vh;
    }

     .hdivdash{
      height: 90vh;
    }
    .nav {
    	padding: 30px;
    }
     .homeh1{
    	font-size: 60px;
      font-weight: 900;
    }
    .homep{
    	font-size: 20px;
    	font-family:  Slate W01 Bk!important,"Graphik",helvetica;
    }
    .hd{
    	height: 80vh;
    }

     .hddash{
      height: 90vh;
    }

     .dcoverdash{
   	    height: 90vh;
   }


     .dcover{
        height: 80vh;
    }

   .navv{
        font-size: 18px;
      font-weight: 400; 
   }

   .navl{
        font-size: 18px;
      font-weight: 400; 
   }
   .navc{
   	    margin-left: 10px; 
   }
    .socials{
   	    float: right;
   }

   .serve{
    	font-size: 18px; 
    	font-family: "Graphik",helvetica!important;
    }

    .showh2{
    	font-size: 50px;
    	font-weight: 900;
    }
   
   .dbottomslide{
    display: none;
   }

   .shiftlarge{
    margin-bottom: 50px;
   }

   .imgsize{
    width: 400px;
     height: 300px;
   }

   .pad{
    padding: 30px;
   }
   .signup{
    margin-left: 5px;
   }

   .homediveh{
    height: 95vh
   }

   .hideonsmall{
    display: block;
   }

    .logosize {
      width: 150px;
      margin-left: -15px;
    }


}

/* show page styling*/

@media only screen and (min-width: 1200px) {
    /* extra large device */
    .showp {
    	font-size : 18px;
    	font-weight: 400;
    }
}


@media only screen and (min-width: 992px) {
    /* large device */
    .showp {
    	font-size : 18px;
    	font-weight: 400;
    }
}

@media only screen and (min-width: 768px) {
    /* medium device */
    .showp {
    	font-size : 18px;
    	font-weight: 400;
    }

}

@media only screen and (min-width: 600px) {
    /* small devices: */
    .showp {
    	font-size : 18px;
    	font-weight: 400px;
    }
}

@media only screen and (max-width: 600px) {
    /* extra small devices: */
    .showp {
    	font-size : 16px;
    	font-weight: 400px;
}

.dontshow{
	display: none;
}

/*mobile name*/