
.normall{
    padding-top: 2%;
}

.list_header{
    font-size: 2rem;
    font-weight: 700;
}

.item-list{
    padding-left: 10%;
    padding-top: 5%;
}

.list-container{
    padding-top: 7%;
}

.windows-text{
    font-weight: 700;
    color: black;   
}

.office-img{
    padding: 0 1%;
        position: relative;
    top: 20%;
}

.office-text{
  margin: auto;
  height: 50px;
      width: 95%;
    font-size: 30px!important;
    font-weight: 700!important;
}

.centered{
   display: flex;
  justify-content: center;
  align-items: center;

}

.vertical-center {
  margin: 0;
  position:relative;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.office-list{
    border: 3px solid #F2F2F2;
    height: 70vh;
    width: auto;
    min-width: 250px;
   
  
}

.office-list li{
    color:black;
    font-weight: 700;
    border-bottom: 1px solid #F2F2F2;
    height: 4vh;
    margin: auto;
    text-align: center;
    padding: 0 20px;
    line-height: 4vh;
    vertical-align: center;
    
   
}
.office-list:last-child{
    border-bottom: 0px solid #F2F2F2;
}

.li-title{
    color: black;
    height: 7vh!important;
    line-height: 7vh!important;
    font-size: 2.5rem;
    font-weight: 700;
}

.li-price{
    height: 7vh!important;
   line-height: 1.4!important;
    font-size: 2rem;
    color: white!important;
    background-color: #018B88;
}

.lihead{
    background-color: #F2F2F2;
}

.empty-li:before{
     position: absolute;
        content: '';
        height: 3px;
		  /* adjust this to move up and down. you may have to adjust the line height of the paragraph if you move it down a lot. */
        bottom: 50%!important; 
       
         margin: 0 auto;
		  left: 0;
        right: 0;
		  width: 8%;
		  background: #018B88;
		  
		  /* optional animation */
		  -o-transition:.5s;
  		  -ms-transition:.5s;
        -moz-transition:.5s;
        -webkit-transition:.5s;
        transition:.5s;
}

.office-item{
    text-align: left!important;
    padding-left: 40%!important;
    font-size: 1.3rem;
}

.office-item img{
    position: absolute;
    right: 67%;
}

.office-box{
        padding-top: 2%;
}

.button-container{
    padding-top: 5%;
    padding-bottom: 7%;
}

.button{
    background-color: #f48d20!important;
}

.button span{
    font-size: 1.5rem;
    font-weight: 700;
}

@media (max-width: 992px){
        
    /*.office-text-container{
        display: inline-block;*/
       /* padding-bottom: 10%;*/
    /*}*/
    
     .office-item{
        font-size: 1.2rem;
    }
}
@media (max-width: 892px){
        
    /*.office-text-container{
        display: inline-block;*/
       /* padding-bottom: 10%;*/
    /*}*/
    
    .office-box{
        padding-top: 5%;
    }
}


@media (max-width: 768px){
    
   /* .centered{
       display: block;
       width: 100%;
      justify-content: center;
      align-items: center;
    
    }*/
    .office-box{
        padding-top: 10%;
    }
    
    .li-price{
        font-size: 1.4rem;
        line-height: 2.1!important;

    }
    
    .li-title{
            font-size: 2.4rem;
    }
    
    .office-item:last-of-type{
        line-height: 1.5;
    }
    
    .list_header{
        padding-left: 10%;
    }

}

@media (max-width: 550px){
        
    .centered{
       display: block;
       width: 100%;
      justify-content: center;
      align-items: center;
    
    }
    
    .li-price{
            font-size: 2rem;
    line-height: 1.5!important;
    }
    
    .office-item:last-of-type{
        line-height: 4vh;
    }
    
    
}

@media (max-width: 510px){
    .office-box:first-of-type{
        padding-top: 20%;
    }
    
    .office-box{
        padding-top: 10%;
    }
}

@media (max-width: 420px){
      .li-price{
        font-size: 2rem;
    }
    
    .office-item{
        font-size: 1.2rem;
    }
}

@media (max-width: 400px){
    .li-price {
        font-size: 1.5rem;
        line-height: 2!important
    }
    
    .office-box:first-of-type{
        padding-top: 45%;
    }
    
    .office-item {
        font-size: 0.9rem;
    }
    
      .office-item:last-of-type{
        line-height: 4vh;
    }
    
}

@media (max-width: 350px){
    .li-price {
        font-size: 1.3rem;
    line-height: 2.2!important;
    }
    
    .office-box:first-of-type{
        padding-top: 45%;
    }
    
    .office-item {
        font-size: 0.9rem;
    }
    
      .office-item:last-of-type{
        line-height: 4vh;
    }
    
}


