A CSS Guru?

Hi all,

I have the following definitions in my custom.css file (for wordpress). It seems like the definition for SERVICES is obliterating on the definition for QFORM.

I am new to CSS and do not see why. Can someone point me in the right direction?

TIA
/*
----------------------------------------------------------------------------
DEFINE SERVICES
----------------------------------------------------------------------------
*/

.services {
width:100%;
/* background-color:#b0e0e6; DEBUG */
margin-top:15px;
display: inliine-flex;
}

.services ul {
width: 25%;
height: 400px;
/* background-color: pink; DEBUG */
/*
padding-left: 2%;
padding-right: 2%;
*/
margin: auto 0;
display: table-cell;
}

.services ul li {
width: 100%;
list-style-type:none;
/* display: inline-block; */
margin-bottom:2%;
}


/*
--------------------------------------------------------------------------------------------
DEFINE QFORM
--------------------------------------------------------------------------------------------
*/

.qform {
list-style-type: none;
width:100%;
background-color:#ECEBE4; /* <-keep for QFORM */
}

.qform ul {
list-style-type: none;
width:100%;
margin: auto 0;
padding-top: 20px;
}

.qform ul li {
list-style-type: none;
line-height: 30px;
display: inline-block;
bottom-margin: 2%;
}