.float{
	position:fixed;
	width:60px;
	height:60px;
	bottom:40px;
	right:40px;
	background-color:#96258f;
	color:#FFF;
	border-radius:50px;
	text-align:center;
	font-size:30px;
	box-shadow: 2px 2px 3px #999;
	z-index:100;
	}
	.my-float{
		margin-top:16px;
	}
	/*change the thinkness of the scrollbar here*/
  /*::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0); 
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
 /*add a shadow to the scrollbar here*/
/*::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 0px rgba(0,0,0,0); 
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
/*this is the little scrolly dealio in the bar*/ 
/*::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: #ff8c40;
    height: 3px;
}
/*nobody needs this little scrollbar corner, I mean really, get rid of it haha*/  
  /*::-webkit-scrollbar-corner       { display: none; height: 0px; width: 0px; }*/
  .input {
        transition: border 0.2s ease-in-out;
        min-width: 280px
    }

    .input:focus+.label,
    .input:active+.label,
    .input.filled+.label {
        font-size: .75rem;
        transition: all 0.2s ease-out;
        top: -0.1rem;
        color: #667eea;
    }

    .label {
        transition: all 0.2s ease-out;
        top: 0.4rem;
      	left: 0;
    }
  .animated {
		-webkit-animation-duration: 1s;
		animation-duration: 1s;
		-webkit-animation-fill-mode: both;
		animation-fill-mode: both;
	}

	.animated.faster {
		-webkit-animation-duration: 500ms;
		animation-duration: 500ms;
	}

	.fadeIn {
		-webkit-animation-name: fadeIn;
		animation-name: fadeIn;
	}

	.fadeOut {
		-webkit-animation-name: fadeOut;
		animation-name: fadeOut;
	}

	@keyframes fadeIn {
		from {
			opacity: 0;
		}

		to {
			opacity: 1;
		}
	}

	@keyframes fadeOut {
		from {
			opacity: 1;
		}

		to {
			opacity: 0;
		}
	}
/* Small (sm) */
@media (max-width: 640px) { 
	#tabs-menu {
		display: none;
	}
	.text-home{
		font-size: 1rem;
	}
	#img_tombol{width:140px; height:54px;}
	#img_tombol2{width:140px; height:50px;}
	.display_desk{
		display:none;
	}
	.display_mob{
		display:block;
	}
	.mob_card{
		width: 100%;
		margin-left: .75rem;
		margin-right: .75rem;
	}
}

@media (min-width: 640px) { 
	#tabs-menu {
		display: none;
	}
	.text-home{
		font-size: 2rem;
	}
	#img_tombol{width:140px; height:47px;}
	#img_tombol2{width:140px; height:50px;}
	.display_desk{
		display:none;
	}
	.display_mob{
		display:block;
	}
	.mob_card{
		width: 100%;
		margin-left: .75rem;
		margin-right: .75rem;
	}
}

/* Medium (md) */
@media (min-width: 768px) { 
	#tabs-menu {
		display: none;
	}
	.text-home{
		font-size: 3rem;
	}
	#img_tombol{width:140px; height:47px;}
	#img_tombol2{width:140px; height:50px;}
	.display_desk{
		display:none;
	}
	.display_mob{
		width:50%;
		display:block;
	}
}

/* Large (lg) */
@media (min-width: 1024px) { 
	#tabs-menu {
		display: -webkit-box;
	}
	.text-home{
		font-size: 3rem;
	}
	#img_tombol{width:140px; height:47px;}
	#img_tombol2{width:140px; height:50px;}
	.display_desk{
		display:none;
	}
	.display_mob{
		width:50%;
		display:block;
	}
}

/* Extra Large (xl) */
@media (min-width: 1280px) {
	#tabs-menu {
		display: -webkit-box;
	}
	.text-home{
		font-size: 3rem;
	}
	#img_tombol{width:140px; height:47px;}
	#img_tombol2{width:140px; height:45px;}
	.display_desk{
		display:block;
	}
	.display_mob{
		display:none;
	}
}