@font-face {
    font-family: SourceSansProBold;
    src: url('../fonts/SourceSansPro-Bold.otf') format('truetype');
}

@font-face {
    font-family: SourceSansProLight;
    src: url('../fonts/SourceSansPro-Light.otf') format('truetype');
}
@font-face {
    font-family: SourceSansProRegular;
    src: url('../fonts/SourceSansPro-Regular.otf') format('truetype');
}

#vshapes_3d_iframe {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    border: 0;
}



::after, ::before {
    box-sizing: border-box;
}


.modal-dialog-scrollable .modal-footer, .modal-dialog-scrollable .modal-header {
    flex-shrink: 0;
}


.modal-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 1rem;
    padding-bottom: 1rem;
    padding-left: 1rem;
    border-bottom-right-radius: .3rem;
    border-bottom-left-radius: .3rem;
}

modal_footer img {
    vertical-align: middle;
    border-style: none;
    width: 60%;
    height: auto;
}


#side_panel{
    background-color: #ffffff80;
    /*width: 15%;*/
    width: 35vmin;
    /*box-shadow: 0px 0px 50px 1px #000;*/
    box-shadow: 0px 0px 20px 1px #9c9c9c;
    padding:0;
    opacity:100%;
}

.sidebar-menu{
    /*margin-left:-33vmin;*/
    margin-left:-35vmin;
    transition:0.8s all;
    float:left;
}

.side-menu{
    margin-left:0;
}


a:link, a:visited {
    color: #31aadf;
    text-decoration: none;
}


#sfondo{
display:none;
height: 100%;
width:100%;
background-image: url("../images/step_1.jpg");
background-size:cover;
opacity:0.8;
z-index:1;
position: absolute;
top: 0px;
left: 0px;
}

.sezioni{
    height:25%;
    /*border-bottom: 2px solid #1b3e56;*/
    border-bottom: 2px solid #a6d9f3;
    
}

#ModalCenter{
    display:none;
    opacity:1;
    font-family:SourceSansProRegular;
    
}

#step_1{
    display:block;
    padding-top: 0px;
}
#step_2{
    display:none;
    padding-top: 0px;
}
#step_3_powd{
    display:none;
    padding-top: 0px;
}
#step_3_liq{
    display:none;
    padding-top: 0px;
}
#step_4{
    display:none;
    padding-top: 0px;
}

#skip_button{
    display:none;
}

#previous_button{
    display:none;
}

#front_texture{
    background-image:none;
}

.modal-content{
    box-shadow: 0px 0px 20px 1px #9c9c9c;
}

.side_panel_icons{
    object-fit:contain;
    width: 80%;
    padding: 5px;
}

.modal-title{
    height:80%;
}

.modal{
    overflow-x: hidden;
    overflow-y: auto;
}

.card{
    border:0;
}

.hovered_card{
    /*border: 4px solid #91dcf6;*/
    /*background-image: url("../images/modal_1/border_modal_1.png");*/
    background-color: #ddedf685;
    box-shadow: 0px 0px 8px 1px #9c9c9c;
    background-size: 100% 100%;
}

#specifications{
    text-align: center;
    padding-top: 15px;
    line-height: 11px;
}

h1{
  font-family:SourceSansProRegular;
  color: #139dd9;
  font-size: 15pt;
  line-height: 11px;
}
h2{
  font-family:SourceSansProLight;
  color: #1b3e56;
  font-size: 15pt;
  line-height: 11px;
}
h3{
  font-family:SourceSansProLight;
  color: #139dd9;
  font-size: 20pt;
}

.modal-header{
    padding: 0px;
    padding-top: 1rem;

}

.enabled-button:hover {
    color: #1b3e56;
    background-color: #ddedf685;
    box-shadow: 0px 0px 2px 1px #80b3cb;
    /*border-color: #95def7;*/
}


.enabled-button{
  color: #59cbf3;
  font-family:SourceSansProRegular;
  background-color: #ddedf685;  
  background-image:url("../images/buttons_border.png");
  background-size: 100% 100%;  
}

.disabled-button{
  color: #bbe1f4;
  font-family:SourceSansProRegular;
  background-color: #ddedf685;  
}

.disabled-button:hover{
  color: #bbe1f4;
  font-family:SourceSansProRegular;
  background-color: #ddedf685;  
}


.navigation-btn{
    z-index: 3;
    bottom:10%;
}

#buttons {
  text-align: justify;
  font-size: 0.1px;
  width: 20%;
  position: absolute;
  bottom: 5%;
  left: 40%; 
  display:none;
}
#buttons div {
  display: inline-block;
}
 #buttons:after { 
 content: ''; 
width: 100%; 
display: inline-block;
 } 
 
 
#demo_buttons {
  text-align: justify;
  font-size: 0.1px;
  width: 20%;
  position: absolute;
  bottom: 5%;
  left: 40%; 
  display:none;
  z-index:102;
}
#demo_buttons div {
  display: inline-block;
}
#demo_buttons:after { 
 content: ''; 
width: 100%; 
display: inline-block;
 } 
 
.modal.fade .modal-dialog {
    transform: translate(0,-50px);
}

#mode_demo{
    position: absolute;
    bottom: 5%;
    right: 5%;
    display:none;
}

#demo{
    display :none;
    position:fixed;
    z-index:101;
    top: 0;
	left:0;
	width: 100%;
	height: 100%;
}

.menu-btn{
    padding: 0 2vmin;
    cursor:pointer;
    z-index:99;
    position: fixed;
    top: 2vmin;
    /*left: 40vmin;*/
    left: 0vmin;
    transition:0.8s all;
    display:none;
}

.menu-btn:before{
}

.menu-open{
   left: 35vmin; 
}

.modal-dialog-scrollable .modal-body {
    overflow-y: auto;
}

.side-btn{
    height:25%;
    
}

#help{
    position: absolute;
    top: 50px;
    right: 0%;
    z-index: 1051;
    padding-right: 24px;
}

#credits_btn{
   position: fixed;
    top: 0px;
    right: 0%;
    padding-right: 26px;
    background-color: transparent;
    font-family: SourceSansProRegular;
    border: 0px solid transparent;
    font-size: 20px;
    /*color: #1b3e56;*/
    display:block;
	z-index: 1051;
}


.credits-btn{
    color: #125a82;
}

.credits{
    display:none;
    position: fixed;
    /* top: 44px; */
    top: 120px;
    right: 2px;
    padding: 0.5%;
    text-align: center;
    color: #125a82;
    border: 2px solid #a4d6f0;
    border-radius: 5px;
    z-index: 1051;
}

#size_info{
    position: absolute;
    width: 100%;
    bottom: 1rem;
    padding-left: 10%;
    padding-right: 10%;
    text-align: center;
    font-family: SourceSansProRegular;
    font-size: 20px;
    color: #1b3e56;;
    display:block;
}
#graphic_help{
    position: absolute;
    width: 15%;
    right: 42.5%;
    top: 3%;
    text-align: center;
    font-family: SourceSansProRegular;
    font-size: 16px;
    color: #0b7cc1;
    display: none;
    z-index: 1051;
    line-height: 37px;
}

/* #graphic_help{
    position: absolute;
    width: 100%;
    bottom: 1rem;
    padding-left: 10%;
    padding-right: 10%;
    text-align: center;
    font-family: SourceSansProRegular;
    font-size: 20px;
    color: #0b7cc1;
    display:block;
} */

 #back_tex_img_load_card{
    /* width: 121px; */
    /* height: 238px; */
    display:none;
}


 #front_tex_img_load_card{
    /*width: 121px;
    height: 238px;*/
    display:none;
} 

.img_load_header{
    position: reative;
    top: 0%;
    left: 24%;
    width: 20%;
    height: 38px;
    z-index: 1;
    
    /* font-family: SourceSansProBold; */
    /* text-align: center; */
    /* font-size: 20px; */
    /* color: #0b7cc1; */
    
}

.img_load{
    position: relative;
    /* top: 17%; */
    left: 28%;
    width:103px;
    height:185px;
    z-index: 1;
    border-radius:10px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    border: 3px dashed #748998;
    
}

#back_tex_img_load{
    background-image: url(../images/modals/back_tex.png);
}

.bg-light {
    background-color: #1c1a1d !important;
}