@charset "utf-8";


/*//////////////////////////////////////////////////

Title   : misc.css
For     : Style Misc

Author  : Kooy Siew Na
Created : 2010-02-01
Modified: yyyy-mm-dd

----------------------------------------

Content : 1. Button
          2. Title icons
          3. Message boxes

----------------------------------------

//////////////////////////////////////////////////*/


/* ----------------------------------------(=1)
    1. Button
   ---------------------------------------- */
   
/* link btn */
a.button {
    float: left;
    height: 24px;
    padding-right: 10px;
	font-size: 12px;
	text-decoration: none;
	background: url(../images/common/r-light-grey-r.gif) no-repeat top right;
}
a.button span {
    display: block;
	float: left;
    line-height: 24px;
    padding: 0 15px 0 10px;
	background: url(../images/common/r-light-grey-l.gif) no-repeat;
	color: #404040;
}
a.button:hover span {
	color: #ffaa00;
}

/* back to top */
a.back-to-top {
    float: left;
    height: 22px;
    padding-right: 20px;
	font-size: 12px;
	text-decoration: none;
	background: url(../images/common/btn-back-to-top-r.gif) no-repeat top right;
	cursor: pointer;
}
a.back-to-top span {
    display: block;
    line-height: 22px;
    padding: 0 0 0 15px;
	background: url(../images/common/btn-back-to-top-l.gif) no-repeat;
	color: #404040;
}
a.back-to-top:hover span {
	color: #ffaa00;
}

/* form btn */
a.btn-grey {
    float: left;
    height: 23px;
    padding-right: 20px;
	font-size: 12px;
	text-decoration: none;
	background: url(../images/common/r-grey-r.gif) no-repeat top right;
}
a.btn-grey span {
    display: block;
    line-height: 23px;
    padding: 0 0 0 11px;
	background: url(../images/common/r-grey-l.gif) no-repeat;
	color: #fff;
}
a.btn-grey:hover span {
	color: #ffaa00;
}

/* contact btn */
a.btn-contact {
    float: left;
    height: 27px;
    padding-right: 24px;
	font-size: 13px;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	background: url(../images/common/r-contact-btn-r-2.gif) no-repeat top right;
	cursor: pointer;
}
a.btn-contact span {
    display: block;
	float: right;
	height: 27px;
    line-height: 23px;
    padding: 0 3px 0 15px;
	background: url(../images/common/r-contact-btn-l-2.gif) no-repeat;
	color: #404040;
}
a.btn-contact:hover span {
	color: #ffaa00;
}

/* prev next btn */
span.next {
    float: left;
    height: 24px;
    padding-right: 10px;
	font-size: 12px;
	text-decoration: none;
	background: url(../images/common/r-light-grey-r.gif) no-repeat top right;
}
span.next a {
    display: block;
	float: left;
    line-height: 24px;
    padding: 0 15px 0 10px;
	background: url(../images/common/r-light-grey-l.gif) no-repeat;
	color: #404040;
}
span next a:hover{
	color: #ffaa00;
}
span.prev {
    float: left;
    height: 24px;
    padding-right: 10px;
	font-size: 12px;
	text-decoration: none;
	background: url(../images/common/r-light-grey-prev-r.gif) no-repeat top right;
}
span.prev a {
    display: block;
	float: left;
    line-height: 24px;
    padding: 0 0 0 25px;
	background: url(../images/common/r-light-grey-prev-l.gif) no-repeat;
	color: #404040;
}
span.prev a:hover{
	color: #ffaa00;
}


/* ----------------------------------------(=2)
    2. Title icons
   ---------------------------------------- */
.i-expertise {
	padding-left: 40px;
	background: url(../images/common/icon-our-expertise.png) left center no-repeat;
}
.i-clients {
	padding-left: 40px;
	background: url(../images/common/icon-our-client.png) left center no-repeat;
}
.i-welcome {
	padding-left: 40px;
	background: url(../images/common/icon-home.png) left center no-repeat;
}
.i-latest-blog-posts {
	padding-left: 40px;
	background: url(../images/common/icon-latest-blog-post.png) left center no-repeat;
}
.i-about-us {
	padding-left: 40px;
	background: url(../images/common/icon-about.png) left center no-repeat;
}
.i-subscribe-enews {
	padding-left: 35px;
	background: url(../images/common/icon-email.png) left center no-repeat;
}
.i-contact-form {
	padding-left: 40px;
	background: url(../images/common/icon-form.png) left center no-repeat;
}

/* ----- contact panel ----- */
.i-contact-us {
	padding-left: 45px;
	background: url(../images/common/icon-contact-us.png) left center no-repeat;
}
.i-call-us {
	padding-left: 45px;
	background: url(../images/common/icon-call-us.png) left center no-repeat;
}
.i-email-us {
	padding-left: 45px;
	background: url(../images/common/icon-email.png) left center no-repeat;
}
.i-visit-us {
	padding-left: 45px;
	background: url(../images/common/icon-home.png) left center no-repeat;
}
.i-find-us {
	padding-left: 45px;
	background: url(../images/common/icon-find-us.png) left center no-repeat;
}
.i-featured-work {
	padding-left: 45px;
	background: url(../images/common/icon-featured-work.gif) left center no-repeat;
}


/* ----------------------------------------(=3)
    3. Message boxes
   ---------------------------------------- */
.info, .success, .warning, .error, .validation {
	margin: 10px 0;
	padding:15px 10px 15px 50px;
	border: 1px solid;
	background-repeat: no-repeat;
	background-position: 10px center;
}
.info {
	background-color: #BDE5F8;
	background-image: url(../images/common/icon_info.png);
	color: #00529B;
}
.success {
	background-color: #DFF2BF;
	background-image:url(../images/common/icon_success.png);
	color: #4F8A10;
}
.warning {
	background-color: #FEEFB3;
	background-image: url(../images/common/icon_warning.png);
	color: #9F6000;
}
.error {
	background-color: #FFBABA;
	background-image: url(../images/common/icon_error.png);
	color: #D8000C;
}
.validation {
	background-color: #FFCCBA;
	background-image: url(../images/common/icon_validation.png);
	color: #D63301;
}