WordPress Theme PHP Help

Hi Guys.

If i want to change the fonts in my theme

hXXp://hotfashionews.com

Code (markup):

this is how my style.css looks like:

/*  
Theme Name: Paint Job
Theme URI: 
Description: Paint Job is a 2 columns, fixed width, Widget Ready, wordpress theme brought to you 
Version: 1.0
Author: Tanbir
Author URI: 
*/

/* This theme is copyright by solidthemes.com (TA) */
* {
	margin: 0;
	padding: 0;
}

body {
	background: #3a3a3c;
	font-family: "Trebuchet MS";
	font-size: 13px;
	color: #ffffff;
}

input, textarea {
	background: #FFFFFF url(images/img09.gif) repeat-x;
	border: 1px solid #D6D6D6;
	border-top-color: #A3A3A3;
	font: normal 1em/normal "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #E4287C;
}

h1, h2, h3 {
	margin-bottom: 1em;
	letter-spacing: -0.02em;
	font-family: "Trebuchet MS";
}

h1, h1 a, h2, h2 a {
	text-decoration: none;
	color: #E4287C;
}

h1 a:hover, h2 a:hover {
	text-decoration: underline;
}

h1 {
	font-size: 36px;
        font-weight: bold;
        color: #E4287C;
}

h2 {
	font-size: 22px;
}

h3 {
	font-size: 16px;
	font-weight: normal;
	color: #FFFFFF;
}

p, ul, ol {
	margin-bottom: 1.5em;
	line-height: 190%;
}

ul, ol {
	margin-left: 3em;
}

blockquote {
	margin: 0 20px;
	padding: 0 10px 0 25px;
	border-left: 4px solid #ff7800;
}

a {
	color: #E5E5E5;
	text-decoration:none;
}

a:hover {
	text-decoration: underline;
}

a img {
	border: none;
}

img.left {
	float: left;
	margin-right: 20px;
}

img.right {
	float: right;
	margin-right: 20px;
}

hr {
	display: none;
}

/* ====================Logo========================== */

#logo {
background: #3a3a3c url(http://freefashiontv.magnify.net/media/site/57SLPC194HC64651/header_fashion.jpeg);
	width: 850px;
	height: 150px;
	margin: 0 auto;
}

#logo h1, #logo h2 {
	margin: 0;
}

#logo h1 {
	float: left;
	padding-left:290px;
	padding-top: 50px;
}

#logo h2 {
	padding-left:290px;
	padding-top: 96px;
	font-size: 16px;
	font-weight: normal;
}

#logo h2, #logo h2 a {
	color: #ffffff;
}

#logo a {
	text-decoration: none;
}

/* ============Menu================ */

#menu {
	width: 960px;
	height: 62px;
	margin: 0 auto;
	background: #3a3a3c url(images/nav.png) no-repeat;
}

#menu ul {
	margin: 0;
	padding: 21px 0 0 30px;
	list-style: none;
	line-height: normal;
}

#menu li {
	float: left;
	padding: 0 20px 0 22px;
	background: url(images/sep.gif) no-repeat left center;
}

#menu li.first {
	background: none;
}

#menu a {
	text-decoration: none;
	font-size: 14px;
	font-weight: bold;
	color: #FFFFFF;
}

#menu a:hover {
	text-decoration:underline;
}

/* ==========================Search========================== */

#search {
	float: right;
	width: 227px;
}

#search fieldset {
	border: none;
}

#search input {
	float: left;
}

#search #s {
	width: 136px;
	margin-right: 7px;
	padding: 2px 5px;
}

#search #x {
	background: none;
	border: none;
}

/*==================== Banner =======================*/


/*========================== Page===================== */

#page {
	width: 900px;
	margin: 0 auto;
	padding: 20px 35px 45px 25px;
	
}

/* =======================Content=================== */

#content {
	float: left;
	width: 603px;
}

.post {
}

.post .title {
	margin: 0;
	padding: 0 20px;
}

.post .entry {
	padding: 0 20px;
}

.post .meta {
	height: 32px;
	margin: 20px 0 30px 0;
	padding: 7px 0 0 20px;
	color:black;
	background: url(images/postmeta.gif) no-repeat;
	line-height: normal;
}

.postmetadata {
	line-height: normal;
}

.navigation {
	font-weight: bold;
}

.alignleft {
	float: left;
}

.alignright {
	float: right;
}

/* =========================Comments========================= */

#comments, #respond {
	padding-top: 30px;
}

.commentlist {
	margin: 0;
	padding: 0;
	list-style-position: inside;
}

.commentlist li {
	padding: 0 20px;
	border-bottom: 1px solid #E5E5E5;
}

#comment {
	width: 500px;
}

/* ================Sidebar================== */

#sidebar {
	float: right;
	width: 253px;
}

#sidebar ul {
	margin: 0;
	padding: 0;
	list-style: none;
	line-height: normal;
}

#sidebar li {
	margin-bottom: 40px;
	padding: 0 15px 0 20px;
	
}

#sidebar li ul {
}

#sidebar li li {
	margin: 0;
	padding: 5px 0;
	border-bottom: 1px solid #E5E5E5;
}

#sidebar li h2 {
	padding-left:6px;
	height:30px;
	margin-bottom: 15px;
	font-size: 18px;
	background-image:url('images/sidebar.gif');
	background-repeat:repeat-x;
}



/* ============Footer================== */

#footer {
	clear: both;
	width: 910px;
	height: 50px;
	margin: 0 auto;
	padding: 5px 13px;
	background: url(images/footer.gif) no-repeat;
}

#footer p {
	margin: 0;
	line-height: normal;
	color: #333333;
}

#footer a {
	color: #000000;
}

#footer .legal {
	float: left;
	padding-left:5px;
}

#footer .credit {
	float: right;
	padding-right:13px;
}

Code (markup):

Now iv'e found a font called Jackie's Hand. Here;

http://www.kalart.com/fonts.html

Code (markup):

how can i change the Titles Font?

Thanks in Advanced for any help

Cheers

 

Correct me if I'm wrong someone but.. you need to use the standard fonts that come with computers because those that don't have that font installed will not see what you are seeing. You CAN make a graphic using the font though for yur header/ logo.

 

BaaBaa is right. You can only use system fonts in HTML/CSS. Here is a list of options: http://www.ampsoft.net/webdesign-l/WindowsMacFonts.html

Your best bet would be to do as they recommend and just create an image of your logo/wordmark.

If you really want to play around with it, you could look into using a something sIFR. There is a Wordpress plugin here: http://wordpress.org/extend/plugins/wp-sifr/

Might be overkill though, especially if it's just a word or two...