/* 
	A couple styles to make the demo page look good
 */
body {
/*	padding-bottom: 2rem;
	padding-top: 4rem;  */
}

#form-wrapper-startseite .container h3, #form-wrapper-startseite .container h4 {
 color:#fff !important;
}

#form-wrapper .container h3 {
 color:#fff !important;
}

.carbon .container {
 padding-top:300px;
}

.carbon {
/* margin-top:-50px; */
}

.carbon .dm-uploader {
    border: 0.25rem dashed #fff;

}

.carbon h3 {
  font-size:1.3rem;
}

.carbon .h-100 {
    height: 251px !important;
}

.carbon .card-header {
 font-size:0.8rem;
}

.carbon #drag-and-drop-zone {
    height: 251px !important;
}

.carbon .rk-dateiliste {
 margin-top:-20px;
 margin-bottom: 150px;
}

.carbon .rk-dateiliste h3 {
   font-size:0.8rem;
}


.card {
 background: rgba(255,255,255,0.6);
}
.card-header {
 color: #383948;
 background: rgba(0,0,0,.09);
}



#form-wrapper {
  margin-top:0px;
	background-image: url("https://www.3d-profi.de/images/api/3D-druck-online-bestellen-service.webp");

  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;  

  width: 100%;
  height: 603px;
}
#form-wrapper-startseite {
  margin-top:0px;
	background-image: url("https://www.3d-profi.de/images/api/3D-Profi-GmbH-3D-Druck-service-Onlineshop-3d-druck-online.webp");
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;  
  padding-top:40px;
  width: 100%;
  height: 603px;
}

#form-wrapper-carbon {
  margin-top:0px;
	background-image: url("https://www.3d-profi.de/images/api/3d_druck_carbon_3D_Druck_Service_Polyamid_PA11_schwarz_CF_Carbonfaserver....webp");
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;  
  padding-top:40px;
  width: 100%;
  height: auto;
}

#form-no-wrapper {
  background-image: none;
}

#form-no-wrapper .rk-dateiliste {
 color:#000;
}

.container {
 padding-top:50px;
 color:#fff;
}

.btn-primary {
    color: #fff;
    background: linear-gradient(to right, #54B4EA, #017CB0);
    border:0;
}

.btn-danger, .btn-warning {
    border:none;
    border-radius: 3px;
    letter-spacing: 1.5px !important;
    line-height:22px !important;
    padding: 7px 10px;
}

#form-wrapper-startseite .btn-danger, #form-wrapper-startseite .btn-warning {
    border:none;
    border-radius: 3px;
    letter-spacing: 1.5px !important;
    line-height:22px !important;
    padding: 10px 50px;
}

.btn-danger  {
    background: #c92222 !important;
}    

.row {
	margin-bottom: 1rem;
  
/*display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: nowrap;  */
 flex-wrap: nowrap;  
/* 
 display: -webkit-inline-box;
 -webkit-display: flex; 
 -webkit-flex-direction: row; 
 -webkit-align-items: flex-start; 
 display: -webkit-box;  
  align-items: flex-start; */
}

[class*="col-"] {
	padding-top: 1rem;
	padding-bottom: 1rem;
}
hr {
	margin-top: 2rem;
	margin-bottom: 2rem;
}
#files {
    overflow-y: scroll !important;
    min-height: 320px;
}
.h-100 {
    height:351px !important;
}

#form-wrapper-startseite .h-100 {
    height:320px !important;
}

.progress {
    height: 20px;
}  

.card ul {
 margin-top:0px;
}  

.card .mb-2 {
 padding-left:5px;
 margin-bottom: .3rem !important;
}

.dm-uploader {
	border: 0.25rem dashed #54B4EA;
	text-align: center;
}

#form-wrapper-startseite .dm-uploader {
	border: 0.25rem dashed #fff;
	text-align: center;
}
.dm-uploader.active {
	border-color: red;
	border-style: solid;
}

#form-wrapper-startseite .dm-uploader.active {
	border-color: red;
	border-style: solid;
}



@media (min-width: 1920px) {
#form-wrapper-carbon {
  height: 850px;
}
}

@media (max-width: 1919px) {
#form-wrapper-carbon {
  height: 700px;
}
.carbon .container {
 padding-top:200px;
}
}

@media (max-width: 1630px) {
#form-wrapper-carbon {
  height: 600px;
}
}

@media (max-width: 1400px) {
#form-wrapper-carbon {
  height: auto
}
}

@media (max-width: 1630px) {

 .carbon .h-100 {
    height: 200px !important;
}

.carbon #drag-and-drop-zone {
    height: 200px !important;
}

.carbon .mb-5 {
 margin-top: 1rem !important;
 margin-bottom: 1rem !important;
}
.carbon h3 {
  font-size:1rem;
}

.carbon .btn {
  font-size:0.7rem; 
}

.carbon .btn-danger, .carbon .btn-warning {
    line-height: inherit !important;
  }  

}


@media (max-width: 960px) { 

#form-wrapper-carbon {
	background-size: cover;
  background-image: url("https://www.3d-profi.de/images/api/3d_druck_carbon_3D_Druck_Service_mobil_Polyamid_PA11_schwarz_CF_Carbonfa....webp");
  width: 100%;
  height: 1300px;
  background-repeat:no-repeat;
}

.carbon .container {
    padding-top: 350px;
}

.carbon .rk-dateiliste {
 display:none;
}
}

@media (min-width: 768px) {
	#files {
		min-height: 0;
	}
}

@media (min-width: 769px) {
 .card {
  display:flex !important;
}  

.rk-dateiliste {
 margin-top:0px;

} 
}

@media (max-width: 768px) {

#drag-and-drop-zone h3 {
 display:none;
} 
.carbon .mb-5 {
    margin-top: 2rem !important;
}    

#form-wrapper-carbon {

  width: 100%;
  height: 1500px;  
}

.carbon .container {
    padding-top: 300px;
}

 .card {
  display:none !important;
}  

.rk-dateiliste {
 margin-top:-58px;

} 
.row {
    flex-wrap: wrap;
  } 
.col-md-6 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}
.rk_carbon .rk-mobile-logo {
 margin-top: -74px;
}   
}

@media (max-width: 650px) { 
#form-wrapper-carbon {
	background-size: contain;

  width: 100%;
  height: 1300px;
}

.carbon .container {
    padding-top: 220px;
}

}

@media (max-width: 460px) { 
#form-wrapper-carbon {
	background-size: contain;

  width: 100%;
  height: 850px;
}

.carbon .container {
    padding-top: 140px;
}

}


@media (max-width: 375px) { 
.carbon .container {
    padding-top: 125px;
}

}


#debug {
	overflow-y: scroll !important;
	height: 180px;	
}