/* 
 * ptrd.css
 *
 * The central CSS for the blog.
 *
 * The following <div> id's will be defined here:
 * 	- wrapper
 *	- inner
 *      - masthead
 *      - sidebar
 *      - footer
 * The following <div> classes will be defined here:
 * 	- article (with localized <span>, <a>, etc class definitions).
 */

/* font-family: 'CenturyGothic',"Century Gothic",'Apple Gothic',sans-serif,Arial,Trebuchet MS,verdana; */

/* General Defaults */
html,body,div,pre,form,fieldset,input,h1,h2,h3,h4,h5,h6,p,textarea,ul,ol,li,dl,dt,dd,blockquote,th,td {  
	margin:0; 
	padding:0; 
}
table { 
	border-collapse:collapse; 
	border-spacing:0; 
}
fieldset,img {  
	border:0; 
} 
address,caption,cite,code { 
	font-style:normal; 
	font-weight:normal; 
} 
ul { 
	list-style:none; 
} 
caption,th { 
	text-align:left; 
} 
h1,h2,h3,h4,h5,h6 { 
	font-size:100%; 
	font-weight:normal; 
} 
q:before,q:after { 
	content:''; 
} 
abbr,acronym { 
	border:0; 
}

/* Default Body Definitions */
body {
	font:14px Helvetica, Arial, sans-serif;
	/* background-color: #FFFEFE; */
        
/* 
        background-image:url('/images/layout/ptrd8.png');
        background-repeat:no-repeat;
        background-attachment:fixed; 
 */
}

/* 
 * Definitions which need to be implemented immediately: 
 *	- the image block for the logo
 *	- the 'linkable' section of the logo 
 */
#masthead h1 { width:980px; height:100px; display:block; text-indent:-9999px; background:transparent url(/images/layout/header.jpg) no-repeat top left; }
#masthead h1 a { width:960px; height:100%; display:block; outline:none; }

/* ---------------------------------- */
/* Triangle overlays                  */
/* ---------------------------------- */

#orangetriangles {
  position: fixed; // reposition logo from the natural layout
  left: 50px;
  top: 10px;
  width: 285px;
  height: 230px;
  z-index: 2;
}

#redtriangles {
  position:fixed;
  left: 0px;
  top: 400px;
  width: 285px;
  height: 230px;
  z-index: 2;
}

#pinktriangles {
  position: fixed;
  left: 1050px;
  top: 120px;
  width: 285px;
  height: 230px;
  z-index: 3;
}

#purpletriangles {
  position: fixed;
  left: 1050px;
  top: 450px;
  width: 285px;
  height: 230px;
  z-index: 4;
}



/* --------------------------------------------------------- */
/* The main window in which the content and sidebar          */
/* appear.                                                   */
/* --------------------------------------------------------- */
#wrapper { 
	margin: 0 auto;
	width: 980px;
	text-align:left;
        background-color: #000000;
}


/* --------------------------------------------------------- */
/* The area for the masthead image.                          */
/* --------------------------------------------------------- */
#masthead { 
    width:980px; 
    height:110px; 
    margin:0 auto; 
    background:#FFFFFF; 
}


/* -------------------------------------------------------- */
/* The main content window, in which all of the articles    */
/* are printed.                                             */
/* -------------------------------------------------------- */
#content {
	width:680px;
	float:left;
        margin-top:2px;
        margin-left:2px;
        background-color: #FFFFFF;
/*
        border-style:solid;
        border-width:2px;
        border-color:#EEEEEE;
*/
}


/* --------------------------------------------------------- */
/* The window in which an individual article is printed.     */
/* --------------------------------------------------------- */
#content .article {
	margin-top:10px;
	margin-bottom:30px;
	margin-left:20px;
        margin-right:22px;
        background-color: #FFFFFF;	
}

/* ---------------------------------------------------------- */
/* Defines the H1 title of the article.                       */
/* ---------------------------------------------------------- */
#content .article .title {
        color:#000000;
        font-size:18pt;
        font-family:Gill Sans;
        text-transform: capitalize;
}


/* ---------------------------------------------------------- */
/* Define the attributes of the block containing the actual   */
/* text of the article.                                       */
/* ---------------------------------------------------------- */
#content .article .article_body {
        margin-top:5px;    
}

/* ---------------------------------------------------------- */ 
/* Defines the color of the links within the article itself.  */
/* -----------------------------------------------------------*/
#content .article .article_body a {
        color:#8a8a8a;
        text-decoration:none;
}


/* ---------------------------------------------------------- */
/* Ensures that if a user hovers over a link in the article,  */
/* that link will change colour.                              */
/* -----------------------------------------------------------*/
#content .article .article_body a:hover {
        text-decoration: underline;
        color: #8a8a8a;
}


/* ------------------------------------------------------------ */
/* The information associated with the article (author, tags)   */
/* ------------------------------------------------------------ */
#content .article .article_info {
        color:#8a8a8a;
        text-transform: uppercase;
        font-size:8pt;
        letter-spacing:1pt;
        font-family:Gill Sans;
}


/* ------------------------------------------------------------- */
/* Defines the color of the links with the article info section. */
/* ------------------------------------------------------------- */
#content .article .article_info a {
        color:#ff00ea;
        text-decoration:none;
}


/* ---------------------------------------------------------- */
/* Over-rides the higher-level definition of 'a:hover' so     */
/* any links will not change color when the user hovers over  */
/* any of the tags                                            */
/* -----------------------------------------------------------*/
#content .article .article_info a:hover {
        text-decoration: underline;
        color: #ff00ea;
}


/* --------------------------------------------------------- */
/* The main frame in which our social media buttons are      */
/* contained.                                                */
/* --------------------------------------------------------- */
#content .share {
    width:350px;
    float:right;
}


/* --------------------------------------------------------- */
/* The frame containing only the facebook 'like' button. We  */
/* require this in order to vertically align it with the     */
/* other social media buttons within '#share'.               */
/* --------------------------------------------------------- */
#content .share .facebook {
    float:right;
}


/* --------------------------------------------------------- */
/* The frame containing only the twitter 'Tweet' button. We  */
/* require this in order to vertically align it with the     */
/* other social media buttons within '#share'.               */
/* --------------------------------------------------------- */
#content .share .twitter {
    float:right;
}


/* --------------------------------------------------------- */
/* The frame containing only the google '+1' button. We      */
/* require this in order to vertically align it with the     */
/* other social media buttons within '#share'.               */
/* --------------------------------------------------------- */
#content .share .gplus {
    margin-top:3px;
    float:right;
}


/* --------------------------------------------------------- */
/* This frame contains the menu sidebar.                     */
/* --------------------------------------------------------- */
#sidebar { 
    width:290px; 
    margin-top:2px; 
    float:right; 
    border-style:solid; 
    border-color:#EEEEEE; 
    border-width:2px; 
    align:center;
}


/* ---------------------------------------------------------- */
/* The over ride of the H2 tag within the sidebar             */
/* ---------------------------------------------------------- */
#sidebar h2 { 
    color:#000000; 
    text-transform:uppercase; 
    font-size:10pt; 
    font-family:Gill Sans Light;  
}


/* ----------------------------------------------------------- */
/* The frame within the sidebar, to set the margins
/* ----------------------------------------------------------- */
#sidebar .inner_sidebar { 
    width:250px; 
    margin-top:20px; 
    margin-left:20px; 
    margin-right:20px; 
    margin-bottom:20px; 
}


/* ---------------------------------------------------------- */
/* This is the frame for the search box and button            */
/* ---------------------------------------------------------- */
#sidebar .search { 
    display:block; 
    line-height:20px; 
    width:240px; 
    text-align:left; 
}

/* ---------------------------------------------------------- */
/* The sidebar specific link style overrides                  */
/* ---------------------------------------------------------- */
#sidebar  a              { color:#8a8a8a; text-decoration:none; } 
#sidebar  a:hover        { color:#8a8a8a; text-decoration:none; }
#sidebar  a:link         { color:#8a8a8a; text-decoration:none; }
#sidebar  a:visited      { color:#8a8a8a; text-decoration:none; }
#sidebar  a:active       { color:#8a8a8a; text-decoration:none; }


#sidebar .event    { display:block; margin-top:15px; text-align:center; text-transform:uppercase; font-family:Gill Sans Light; font-size:10pt; }
#sidebar .address  { display:block; text-align:center; text-transform:uppercase; color:#8a8a8a; font-family:Gill Sans Light; font-size:9pt; }
#sidebar .event a              { color:#ff00ea; text-decoration:none; }
#sidebar .event a:hover        { color:#ff00ea; text-decoration:none; }
#sidebar .event a:link         { color:#ff00ea; text-decoration:none; }
#sidebar .event a:visited      { color:#ff00ea; text-decoration:none; }
#sidebar .event a:active       { color:#ff00ea; text-decoration:none; }

#sidebar .inner_sidebar .releases   { width:100%; float:right; text-align:center; margin-top:15px; }
#sidebar .inner_sidebar .releases .cover            { display:block; width:100%; float:right; text-align:center; } 
#sidebar .inner_sidebar .releases .descr            { color:#8a8a8a; width:100%; float:right; text-align:center; margin-bottom:15px; font-size:8pt; } 


#sidebar ul { margin: 12px 12px 12px 0px; padding: 10px 3px 3px 0px; }

#sidebar li { 
    margin: 1px 12px 1px 12px;
    padding: 1px 0px 1px 10px; /* Note 0px padding right */
    display:block; background:transparent url(/images/layout/bullet.gif) no-repeat left center; text-align:left;

}

li a              { color:#ff00ea; text-decoration:none; }
li a:hover        { color:#ff00ea; text-decoration:none; }
li a:link         { color:#ff00ea; text-decoration:none; }
li a:visited      { color:#ff00ea; text-decoration:none; }
li a:active       { color:#ff00ea; text-decoration:none; }

/* ---------------------------------------------------------- */
/* The font properties of the search results                  */
/* ---------------------------------------------------------- */
#content .listresults {
    margin-top:10px;
    margin-bottom:30px;
    margin-left:20px;
    margin-right:22px;
    background-color: #FFFFFF;
    text-align:left;
    clear:both;
    width:960px;
    text-transform:uppercase; font-family:Gill Sans Light; font-size:18pt;
    text-color:#FF00EA;
}
#content .listresults h2             { font-weight:bold; font-size:12pt; }
#content .listresults a              { color:#ff00ea; text-decoration:none; }
#content .listresults a:hover        { color:#8a8a8a; text-decoration:none; }
#content .listresults a:link         { color:#ff00ea; text-decoration:none; }
#content .listresults a:visited      { color:#ff00ea; text-decoration:none; }
#content .listresults a:active       { color:#ff00ea; text-decoration:none; }



ul { margin: 12px 12px 12px 0px; padding: 10px 3px 3px 0px; }

li {
    margin: 1px 12px 1px 12px;
    padding: 1px 0px 1px 10px; /* Note 0px padding right */
    display:block; background:transparent url(/images/layout/bullet.gif) no-repeat left center; text-align:left;

}



/* ---------------------------------------------------------- */
/* This frame contains the footer information to go at the    */
/* bottom of the page.                                        */
/* ---------------------------------------------------------- */
#footer {
	text-align:center;
	clear:both;
	width:960px;
	margin:0 auto;
        text-transform:uppercase; font-family:Gill Sans Light; font-size:18pt;
        text-color:#8a8a8a;
}
#footer a              { color:#8a8a8a; text-decoration:none; }
#footer a:hover        { color:#ff00ea; text-decoration:none; }
#footer a:link         { color:#8a8a8a; text-decoration:none; }
#footer a:visited      { color:#8a8a8a; text-decoration:none; }
#footer a:active       { color:#8a8a8a; text-decoration:none; }
}