.dc-tree {
  font-family: 'DINOT',Arial,Helvetica,Sans-serif;
  position: relative;
  font-size: 2.5rem;
  font-weight: bold;
  height: 100%;
  overflow: hidden;
}

.dc-tree * { 
    box-sizing: border-box; 
   }
.dctree-prev {
  margin-top: 10px;
  display: block;
  font-size: 1.7rem;
  font-weight: normal;  
}
.dctree-card {
  text-align: center;
  position: absolute;
  left: 0px; 
  display: none;
}

[class^="dctree-message"] {
  padding: 10px;
  margin-bottom: 0px;
}
 [class^="dctree-answer"] { 
 padding: 20px;
 text-align: center;
 margin: 30px auto 0px;
 font-weight: normal;
 text-transform: uppercase; 
 border: 1px solid transparent;
 cursor: pointer;
}
.blue {
  background: #0049ab;
  color: #fff;
}
.blue:hover {    
    filter: alpha(opacity=80); /* internet explorer */
    opacity: 0.8;       
}
.blue:active {      
    background: #fff;
    color: #0049ab;
    border-color: #0049ab;
}
.green {
    background: #9ab827;
    color: #fff;
}
.green:hover {
    filter: alpha(opacity=80); /* internet explorer */
    opacity: 0.8;     
}
.green:active {      
    background: #fff;
    color: #9ab827;
    border-color: #9ab827;
}

.dc-arrow {
    clear: both;
    width: 100%;
    height: 100px;
    background-size: contain !important;
}

.sme, .sbb, .sip {
    background: url(down1.png) no-repeat;
}

/* MEDIA QUERIES */ @media screen and (min-width: 47.5em ) { 

.dc-arrow {
    width: 100%;
    height: 100%;
    min-height: 200px;
}

.sme {
    background: url(down1.png) no-repeat;
}
.sbb {
    background: url(down2.png) no-repeat;
}
.sip {
    background: url(down3.png) no-repeat;
}
}