I am new to web design. I use Joomla 3 to create a bookshop website. I have designed my homepage the way I like using CSS, the problem is that i want to style other web pages on the website but i cant.
I am using a self made barebones template that has an index.php file and a style.css file. The CSS code I used for the homepage is in the style.css file. I need to create another css file for pages such as "about page" of the website so i can style it the way i want but I don't know how to do this.
The main menu has the following links: home, about us, text books, literature books, stationary, etc
Below is a snapshot of my index.php file.
<?php
defined( '_JEXEC' ) or die( 'Restricted access' );
$doc = JFactory::getDocument();
$doc->addStyleSheet($this->baseurl . '/media/jui/css/bootstrap.min.css'); /* to add bootstrap */
$doc->addStyleSheet($this->baseurl . '/media/jui/css/bootstrap-responsive.css'); /* to add bootstrap responsiveness */
$doc->addStyleSheet('templates/' . $this->template . '/css/style.css');
$doc->addScript('/templates/' . $this->template . '/js/main.js', 'text/javascript');
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" >
<html>
<head>
<jdoc:include type="head" />
</head>
<body>
<div class='header'></div>
<!-- main container -->
<div class='main_container'>
<!-- Main Menu -->
<div class='logo_main_menu'>
<div class='logo'>
</div>
<div class='main_menu'>
<jdoc:include type="modules" name="position-7" style="well" />
</div>
