html {
    border: 0;
    margin: 0;
    padding: 0;
    font-family: sans-serif;
}

/*general*/

section.page {
    position: absolute;
    left: 0px;
    width: 100%;
    overflow: hidden;
}

p.letter {
    position: absolute;
    top: -300px;
    font-family: Khmer;
    z-index: 11;
    padding: 0;
    margin: 0;
    color: #004881;
}

p.text {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    color: white;
    font-size: 30px;
    text-align: center;
    z-index: 12;
    line-height: 1.7;
}

span#highlight {
    font-weight: bold;
    /*text-decoration: underline dotted red;*/
    text-decoration: none;
    background: url(underline.png);
    padding-bottom: 4px;
    white-space: nowrap;
    background-repeat: repeat-x;
    background-position: bottom;
    
}

/*custom*/

/*welcome*/
section#welcome {
    background-color: #ffffff;
    height: 100%;
    top: 0;
}

div#title {
    position: absolute;
    top: 20%;
    width: 60%;
    left: 20%;
    height: 40%;
    /*border: 1px black solid;*/
    background-image: url(title.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    z-index: 10;
}

div#lamp {
    position: absolute;
    top: 0;
    left: 70%;
    width: 12%;
    max-width: 140px;
    height: 80%;
    /*border: 1px black solid;*/
    background-image: url(lamp.png);
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: 100%;
    z-index: 9;
}

/*specific*/
section#s {
    background-color: #4cffc4;
}

p#letter_s {
    left: -100px;
}

p#text_s {
    top: 45%;
}


/*measurable*/
section#m {
    background-color: #00dc93;
}

p#letter_m {
    right: -400px;
}

p#text_m {
    top: 40%;
}

/*achievable*/
section#a {
    background-color: #00b6ec;
}

p#letter_a {
    left: -220px;
}

p#text_a {
    top: 45%;
}

/*relevant*/
section#r {
    background-color: #0074ce;
}

p#letter_r {
    right: -140px;
}

p#text_r {
    top: 15%;
}

/*time bound*/
section#t {
    background-color: #004881;
}

p#letter_t {
    left: -200px;
    color: #00dc93;!   
}

p#text_t {
    top: 45%;
}





/*font*/
@font-face {
  font-family: 'Khmer';
  src: url('font/Khmer Sangam MN.eot'); /* IE9 Compat Modes */
  src: url('font/Khmer Sangam MN.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('font/Khmer Sangam MN.woff') format('woff'), /* Modern Browsers */
       url('font/Khmer Sangam MN.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('font/Khmer Sangam MN.svg#709c9ad0ccac3bb5208439c725a2518c') format('svg'); /* Legacy iOS */
       
  font-style:   normal;
  font-weight:  400;
}