.j-pro input[type="text"],
.j-pro input[type="number"],
.j-pro input[type="tel"],
.j-pro input[type="password"],
.j-pro input[type="email"],
.j-pro input[type="search"],
.j-pro input[type="url"],
.j-pro textarea,
.j-pro select {
	background:#fff;
	border:1px solid rgba(0,0,0,.12);
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	-o-border-radius:3px;
	border-radius:3px;
	color:rgba(0,0,0,.87);
	display:block;
	font-family: 'CircularStd', sans-serif !important;
	font-size:16px;
	height:48px;
	padding:10px 15px;
	width:100%;
	outline:none;
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-transition:all.4s;
	-moz-transition:all.4s;
	-ms-transition:all.4s;
	-o-transition:all.4s;
	transition:all.4s;
}
.j-pro input[type="text"]:hover,
.j-pro input[type="password"]:hover,
.j-pro input[type="email"]:hover,
.j-pro input[type="search"]:hover,
.j-pro input[type="url"]:hover,
.j-pro textarea:hover,
.j-pro select:hover { border:2px solid rgba(48,63,159,.6); }

.j-pro input[type="text"]:focus,
.j-pro input[type="password"]:focus,
.j-pro input[type="email"]:focus,
.j-pro input[type="search"]:focus,
.j-pro input[type="url"]:focus,
.j-pro textarea:focus,
.j-pro select:focus { border:2px solid rgba(48,63,159,.9); }


.bg-form{
    min-height: 100vh;
}
 .bg {
background-size: cover;
background-position: center;
     min-height: 100vh;
}
.bg-form {
background-image: url(../images/bg.jpg)!important;
background-repeat:  no-repeat  center center !important;
background-size: cover !important;
}
  @media (min-width: 601px) {
      .holder{
     padding-right: 40px !important;   
     padding-left: 40px !important   
    }
    }
@media (max-width: 600px) {
 .bg {
width: 100%;
     background-size: cover;
background-position: center;
     display: none;
    } 
    .holder{
     padding: 5px !important   
    }
    h4 span{
        font-size: 15px !important;
    }
    .holder-logo{
        margin-bottom: 10px !important;
    }
}




.span{
font-size: 9px !important;
}
label.cabinet {
display: block;
cursor: pointer;
position: relative;
}

label.cabinet input.file {

height: 150px;
width: 150px;
opacity:0;
-moz-opacity: 0;
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
margin-top: -200px;
}

#upload-demo {
width: 250px;
height: 250px;
padding-bottom: 25px;
}
.gambar {
width: 200px;
height: 200px;

}
figure figcaption {
position: absolute;
top: 40px;
right:0px;
color: #fff;
width: 100%;
font-size: 12px;
left:12px;
}



label.cabinets {
display: block;
cursor: pointer;
position: relative;
border: dashed 2px #ccc;
height: 150px;
}

.figures > input.files {
height: 110px;
width: 100%;
opacity:0 !important;
-moz-opacity: 0 !important;
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0) !important;
margin-top: -220px !important;
}

#upload-demos {
width: 100%;
height: 150px;
padding-bottom: 25px;
}
.gambars {
width: 200px;
height: 200px;

}
.figures {
position: absolute;
top: 40px;
right:0px;
color: #fff;
width: 100%;
font-size: 12px;
left:12px;
display: none;
}


#top{
margin-top:20px;  
}
.btn-container{
background:#fff;
border-radius:5px;
padding-bottom:20px;
margin-bottom:20px;
    opacity: 0.5;
-moz-opacity: 0.5;
border: dashed 2px #ccc;
}
.white{
color:white;
}
.imgupload{
color:#ccc;
padding-top:40px;
font-size:4em;
}
#namefile{
color:black;
}

.btn-primary{
color: #333;
background: transparent !important;
    border: transparent !important;
}

/*these two are set to not display at start*/
.imgupload.ok{
display:none;
color:green;
}
.imgupload.stop{
display:none;
color:red;
}


/*this sets the actual file input to overlay our button*/ 
#fileup{
opacity: 0;
-moz-opacity: 0;
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
width:200px;
cursor: pointer;
position:absolute;
left: 50%;
transform: translateX(-50%);
bottom: 40px;
height: 50px;
}

/*switch between input and not active input*/
#submitbtn{
padding:5px 50px;
display:none;
}
#fakebtn{
padding:5px 40px;
}


/*www.emilianocostanzo.com*/
#sign{
color:#1E2832;
position:fixed;
right:10px;
bottom:10px;
text-shadow:0px 0px 0px #1E2832;
transition:all.3s;
}
#sign:hover{
color:#1E2832;
text-shadow:0px 0px 5px #1E2832;
}