Answers to FAQs Section

I just made a new FAQs section with cute little effects.
Here's some screen shots:

To see it in action click here.

You can make your own images and adjust the codes to fit your profile if you'd like.

Here's the HTML code:

<div id="casinorules"></div>

<div id="faqs"><div id="analq"></div><div id="phoneq"></div><div id="squirtq"></div></div></a></div>
<a><div id="faqs1"><div id="fistq"></div><div id="pokerq"></div><div id="favsq"></div></div></a></div>


Here's the CSS code:

#casinorules {
  display:block;
  position:relative;
  margin-left:-50px;
  height:84px;
  width:1110px;
  background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNV3nLhzH9HFaxquvsnEkoGqelWinOlnc5f09X1c5ss39HRCpABD5gpI60JrLAXOQaJZGRFRmdMBWDliPW5v2C-7zUa-HBMTAAOVW0QLApvPiVSpqqprG-m_uWu-c5dCihj0RFNLl_p7Xg/s1600/LPr3l0UBslft.png) no-repeat top;
  overflow:hidden;
}


#faqs {
  display:inline-block;
  width:950px;
  height:170px;
  overflow:hidden;
  margin-left:30px;
  border-bottom:0 solid #000;
  -webkit-box-shadow:0 28px 11px -7px rgba(50,50,50,0.0);
  -moz-box-shadow:0 28px 11px -7px rgba(50,50,50,0.0);
  box-shadow:0 28px 11px -7px rgba(50,50,50,0.0);
}

#analq {
  width:308px;
  height:176px;
  float:left;
  display:block;
  background:transparent url(http://i.minus.com/iLHCZGY6rQ1A0.jpg) center top no-repeat;
}

#analq:hover {
  background-image:url(http://i.minus.com/ibaMlqI3jx0Zq5.jpg);
}

#phoneq {
  width:308px;
  height:176px;
  float:left;
  display:block;
  background:transparent url(http://i.minus.com/ibNqPWWSzX2MF.jpg) center top no-repeat;
}

#phoneq:hover {
  background-image:url(http://i.minus.com/ib1p0meJIPqYaJ.jpg);
}

#squirtq {
  width:308px;
  height:176px;
  float:left;
  display:block;
  background:transparent url(http://i.minus.com/iXQUIx7pp0D6D.jpg) center top no-repeat;
}

#squirtq:hover {
  background-image:url(http://i.minus.com/ir3q4j0t4DBQB.jpg);
}

#faqs1 {
  display:inline-block;
  width:950px;
  height:170px;
  overflow:hidden;
  margin-left:30px;
  border-bottom:0 solid #000;
  -webkit-box-shadow:0 28px 11px -7px rgba(50,50,50,0.0);
  -moz-box-shadow:0 28px 11px -7px rgba(50,50,50,0.0);
  box-shadow:0 28px 11px -7px rgba(50,50,50,0.0);
}

#fistq {
  width:308px;
  height:176px;
  float:left;
  display:block;
  background:transparent url(http://i.minus.com/im7MhKv5J9lzQ.jpg) center top no-repeat;
}

#fistq:hover {
  background-image:url(http://i.minus.com/ibp193FjAEuxmV.jpg);
}

#pokerq {
  width:308px;
  height:176px;
  float:left;
  display:block;
  background:transparent url(http://i.minus.com/i18qIzAKBvRTy.jpg) center top no-repeat;
}

#pokerq:hover {
  background-image:url(http://i.minus.com/iJiuRriyRen2e.jpg);
}

#favsq {
  width:308px;
  height:176px;
  float:left;
  display:block;
  background:transparent url(http://i.minus.com/iSaSDIi82bQ8e.jpg) center top no-repeat;
}

#favsq:hover {
  background-image:url(http://i.minus.com/iCNVB8kO58GM6.jpg);
}