A Pen by giantMaguRO

Thumbnail
This awesome code was written by giantmaguro, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright giantmaguro ©
  • HTML
  • CSS
<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>A Pen by  giantMaguRO</title>
  
  
  
      <link rel="stylesheet" href="css/style.css">

  
</head>

<body>

  <footer id="rubio_FOOTER_20">
  <div id="rubio_DIV_1">
    <div id="rubio_DIV_2">
      <div id="rubio_DIV_3">
        <div id="rubio_DIV_4">
          <h3 id="rubio_H3_5">
						CONTACTS
					</h3>
          <p id="rubio_P_6">
            ALLIDEASTUDIO CO.,LTD
            <br id="rubio_BR_7" /> 179/35 NA WONG PRACHA PHATTANA RD,
            <br id="rubio_BR_8" /> SI KAN, DONMUANG, BANGKOK 10210
          </p>
          <p id="rubio_P_9">
            TEL: 02-5658248 FAX: 02-5658249
            <br id="rubio_BR_10" /> EMAIL: CENTER@ALLIDEASTUDIO.COM
          </p>
        </div>
        <div id="rubio_DIV_11">
          <div id="rubio_DIV_12">
            <h2 id="rubio_H2_13">
							HUNGRY FOR CONTENT
						</h2>
            <div id="rubio_DIV_14">
              <h3 id="rubio_H3_15">
								Join out community
							</h3>
              <div id="rubio_DIV_16">
                <img src="img/ico-instagram.jpg" id="rubio_IMG_17" alt='' /><img src="img/ico-line.jpg" id="rubio_IMG_18" alt='' /><img src="img/ico-facebook.jpg" id="rubio_IMG_19" alt='' />
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</footer>
  
  

</body>

</html>

/*Downloaded from https://www.codeseek.co/giantmaguro/a-pen-by-giantmaguro-VeLgYN */
#rubio_FOOTER_20 {
  box-sizing: border-box;
  color: rgb(239, 194, 58);
  height: 350px;
  width: 1366px;
  perspective-origin: 683px 175px;
  transform-origin: 683px 175px;
  border: 0px none rgb(239, 194, 58);
  font: normal normal normal normal 14px / 20px 'Futura Bk BT Book';
  outline: rgb(239, 194, 58) none 0px;
}


/*#rubio_FOOTER_20*/

#rubio_DIV_1 {
  box-sizing: border-box;
  color: rgb(239, 194, 58);
  height: 300px;
  width: 1366px;
  perspective-origin: 683px 150px;
  transform-origin: 683px 150px;
  border: 0px none rgb(239, 194, 58);
  font: normal normal normal normal 14px / 20px 'Futura Bk BT Book';
  outline: rgb(239, 194, 58) none 0px;
  padding: 50px 0px 0px;
}


/*#rubio_DIV_1*/

#rubio_DIV_2 {
  box-sizing: border-box;
  color: rgb(239, 194, 58);
  height: 250px;
  width: 1170px;
  perspective-origin: 585px 125px;
  transform-origin: 585px 125px;
  border: 0px none rgb(239, 194, 58);
  font: normal normal normal normal 14px / 20px 'Futura Bk BT Book';
  margin: 0px 98px;
  outline: rgb(239, 194, 58) none 0px;
  padding: 0px 15px;
}


/*#rubio_DIV_2*/

#rubio_DIV_2:after {
  box-sizing: border-box;
  clear: both;
  color: rgb(239, 194, 58);
  content: '"' '"';
  display: table;
  border: 0px none rgb(239, 194, 58);
  font: normal normal normal normal 14px / 20px 'Futura Bk BT Book';
  outline: rgb(239, 194, 58) none 0px;
}


/*#rubio_DIV_2:after*/

#rubio_DIV_2:before {
  box-sizing: border-box;
  color: rgb(239, 194, 58);
  content: '"' '"';
  display: table;
  border: 0px none rgb(239, 194, 58);
  font: normal normal normal normal 14px / 20px 'Futura Bk BT Book';
  outline: rgb(239, 194, 58) none 0px;
}


/*#rubio_DIV_2:before*/

#rubio_DIV_3 {
  box-sizing: border-box;
  color: rgb(239, 194, 58);
  height: 250px;
  width: 1170px;
  perspective-origin: 585px 125px;
  transform-origin: 585px 125px;
  border: 0px none rgb(239, 194, 58);
  font: normal normal normal normal 14px / 20px 'Futura Bk BT Book';
  margin: 0px -15px;
  outline: rgb(239, 194, 58) none 0px;
}


/*#rubio_DIV_3*/

#rubio_DIV_3:after {
  box-sizing: border-box;
  clear: both;
  color: rgb(239, 194, 58);
  content: '"' '"';
  display: table;
  border: 0px none rgb(239, 194, 58);
  font: normal normal normal normal 14px / 20px 'Futura Bk BT Book';
  outline: rgb(239, 194, 58) none 0px;
}


/*#rubio_DIV_3:after*/

#rubio_DIV_3:before {
  box-sizing: border-box;
  color: rgb(239, 194, 58);
  content: '"' '"';
  display: table;
  border: 0px none rgb(239, 194, 58);
  font: normal normal normal normal 14px / 20px 'Futura Bk BT Book';
  outline: rgb(239, 194, 58) none 0px;
}


/*#rubio_DIV_3:before*/

#rubio_DIV_4 {
  box-sizing: border-box;
  color: rgb(239, 194, 58);
  float: left;
  height: 200px;
  min-height: 1px;
  position: relative;
  width: 585px;
  perspective-origin: 292.5px 100px;
  transform-origin: 292.5px 100px;
  border: 0px none rgb(239, 194, 58);
  font: normal normal normal normal 14px / 20px 'Futura Bk BT Book';
  margin: 0px 0px 50px;
  outline: rgb(239, 194, 58) none 0px;
  padding: 0px 15px;
}


/*#rubio_DIV_4*/

#rubio_H3_5 {
  box-sizing: border-box;
  color: rgb(239, 194, 58);
  height: 28px;
  width: 555px;
  perspective-origin: 277.5px 14px;
  transform-origin: 277.5px 14px;
  border: 0px none rgb(239, 194, 58);
  font: normal normal normal normal 26px / 28.6px 'Futura Bk BT Book';
  margin: 21px 0px 30px;
  outline: rgb(239, 194, 58) none 0px;
}


/*#rubio_H3_5*/

#rubio_P_6 {
  box-sizing: border-box;
  color: rgb(239, 194, 58);
  height: 60px;
  width: 555px;
  perspective-origin: 277.5px 30px;
  transform-origin: 277.5px 30px;
  border: 0px none rgb(239, 194, 58);
  font: normal normal normal normal 14px / 20px 'Futura Bk BT Book';
  margin: 0px 0px 10.5px;
  outline: rgb(239, 194, 58) none 0px;
}


/*#rubio_P_6*/

#rubio_BR_7,
#rubio_BR_8,
#rubio_BR_10 {
  box-sizing: border-box;
  color: rgb(239, 194, 58);
  border: 0px none rgb(239, 194, 58);
  font: normal normal normal normal 14px / 20px 'Futura Bk BT Book';
  outline: rgb(239, 194, 58) none 0px;
}


/*#rubio_BR_7, #rubio_BR_8, #rubio_BR_10*/

#rubio_P_9 {
  box-sizing: border-box;
  color: rgb(239, 194, 58);
  height: 40px;
  width: 555px;
  perspective-origin: 277.5px 20px;
  transform-origin: 277.5px 20px;
  border: 0px none rgb(239, 194, 58);
  font: normal normal normal normal 14px / 20px 'Futura Bk BT Book';
  margin: 0px 0px 10.5px;
  outline: rgb(239, 194, 58) none 0px;
}


/*#rubio_P_9*/

#rubio_DIV_11 {
  box-sizing: border-box;
  color: rgb(239, 194, 58);
  float: left;
  height: 192.5px;
  min-height: 1px;
  position: relative;
  width: 585px;
  perspective-origin: 292.5px 96.25px;
  transform-origin: 292.5px 96.25px;
  border: 0px none rgb(239, 194, 58);
  font: normal normal normal normal 14px / 20px 'Futura Bk BT Book';
  margin: 0px 0px 50px;
  outline: rgb(239, 194, 58) none 0px;
  padding: 0px 15px;
}


/*#rubio_DIV_11*/

#rubio_DIV_12 {
  box-sizing: border-box;
  color: rgb(239, 194, 58);
  height: 147.5px;
  max-width: 80%;
  width: 444px;
  perspective-origin: 222px 73.75px;
  transform-origin: 222px 73.75px;
  border: 1px solid rgb(239, 194, 58);
  font: normal normal normal normal 14px / 20px 'Futura Bk BT Book';
  margin: 45px 0px 0px;
  outline: rgb(239, 194, 58) none 0px;
}


/*#rubio_DIV_12*/

#rubio_H2_13 {
  box-sizing: border-box;
  color: rgb(239, 194, 58);
  height: 35px;
  text-align: center;
  width: 442px;
  perspective-origin: 221px 17.5px;
  transform-origin: 221px 17.5px;
  border: 0px none rgb(239, 194, 58);
  font: normal normal 100 normal 32px / 35.2px 'Futura Bk BT Book';
  margin: 21px 0px 10.5px;
  outline: rgb(239, 194, 58) none 0px;
}


/*#rubio_H2_13*/

#rubio_DIV_14 {
  box-sizing: border-box;
  color: rgb(239, 194, 58);
  display: table;
  height: 79px;
  width: 324px;
  perspective-origin: 162px 39.5px;
  transform-origin: 162px 39.5px;
  border: 0px none rgb(239, 194, 58);
  font: normal normal normal normal 14px / 20px 'Futura Bk BT Book';
  margin: 0px 59px;
  outline: rgb(239, 194, 58) none 0px;
}


/*#rubio_DIV_14*/

#rubio_H3_15 {
  box-sizing: border-box;
  color: rgb(239, 194, 58);
  display: inline-block;
  height: 28px;
  width: 220.469px;
  perspective-origin: 110.234px 14px;
  transform-origin: 110.234px 14px;
  border: 0px none rgb(239, 194, 58);
  font: normal normal 100 normal 26px / 28.6px 'Futura Bk BT Book';
  margin: 21px 0px 30px;
  outline: rgb(239, 194, 58) none 0px;
}


/*#rubio_H3_15*/

#rubio_DIV_16 {
  box-sizing: border-box;
  color: rgb(239, 194, 58);
  display: inline-block;
  height: 27px;
  width: 98.2812px;
  perspective-origin: 49.1406px 13.5px;
  transform-origin: 49.1406px 13.5px;
  border: 0px none rgb(239, 194, 58);
  font: normal normal normal normal 14px / 20px 'Futura Bk BT Book';
  margin: 0px 0px 0px 5px;
  outline: rgb(239, 194, 58) none 0px;
}


/*#rubio_DIV_16*/

#rubio_IMG_17,
#rubio_IMG_18 {
  box-sizing: border-box;
  color: rgb(239, 194, 58);
  height: 30px;
  max-width: 30px;
  vertical-align: middle;
  width: 30px;
  perspective-origin: 15px 15px;
  transform-origin: 15px 15px;
  border: 0px none rgb(239, 194, 58);
  font: normal normal normal normal 14px / 20px 'Futura Bk BT Book';
  margin: -4px 0px 0px;
  outline: rgb(239, 194, 58) none 0px;
}


/*#rubio_IMG_17, #rubio_IMG_18*/

#rubio_IMG_19 {
  box-sizing: border-box;
  color: rgb(239, 194, 58);
  height: 31.0781px;
  max-width: 30px;
  vertical-align: middle;
  width: 30px;
  perspective-origin: 15px 15.5312px;
  transform-origin: 15px 15.5312px;
  border: 0px none rgb(239, 194, 58);
  font: normal normal normal normal 14px / 20px 'Futura Bk BT Book';
  margin: -4px 0px 0px;
  outline: rgb(239, 194, 58) none 0px;
}


/*#rubio_IMG_19*/

Comments