View source for Template:Stylesheet1

<html>
<style>
.ImageRight {
float:right;
vertical-align:text-top;}
.faint
{
opacity:0.4;filter:alpha(opacity=40);
float:left;
}
body{}
.toc {
/* border: thin solid red; */
border-radius: 10px 10px 10px / 50px;

box-shadow: 2px 2px 2px 0px;
	border-radius: 20px;
}
#bodyContent {
	font-family: Arial, Helvetica, sans-serif;
	margin: 0px;
	padding: 0px;
	background-color: #FFFFFF;
	background-repeat: round;
}
td {vertical-align:top}

section {
	border: thin solid #000099;
	border-radius: 20px;
	padding: 10px;
        background-colour:#999999;
box-shadow: 2px 2px 2px 0px;
}

section.discussion {
background-color:aliceblue;
background-image:url('http://dotnet.tech.ubc.ca/CourseWiki/images/8/89/ScreenBeanIdea1.gif');
background-repeat:no-repeat;
width:600px;
padding-left:50px;
}

section.idea {
background-color:aliceblue;
background-image:url('http://dotnet.tech.ubc.ca/CourseWiki/images/8/89/ScreenBeanIdea1.gif');
background-repeat:no-repeat;
width:600px;
padding-left:50px;
}



section.key{
background-color:#FFF380;
background-image:url('http://dotnet.tech.ubc.ca/CourseWiki/images/9/9b/ScreenBeanKey.gif');
background-repeat:no-repeat;
width:600px;
padding-top:50px;
padding-left:50px;
}

section.tools{
background-color:#D3D3D3;
border: thin solid #000000;
background-image:url('http://dotnet.tech.ubc.ca/CourseWiki/images/0/09/ScreenBeanTools.gif');
background-repeat:no-repeat;
width:550px;
padding-top:20px;
padding-left:100px;
}



section.sinkingBig{
background-color:#FFF380;
color: #663300;
border: thin solid #663300;
text-color:#AF7817;
background-image:url('http://dotnet.tech.ubc.ca/CourseWiki/images/7/77/ScreenBeanSinkingAnimated.gif');
background-repeat:no-repeat;
width:375px;
padding-top:20px;
padding-left:275px;
height: 150px;
}



section.sinking{
background-color:#FFF380;
color: #663300;
border: thin solid #663300;
text-color:#AF7817;
background-image:url('http://dotnet.tech.ubc.ca/CourseWiki/images/f/fb/ScreenBeanSinking.gif');
background-repeat:no-repeat;
width:600px;
padding-top:35px;
padding-left:50px;
}

section.puzzled{
background-color:#FDEEF4;
color: #7E587E;
border: thin solid #7E587E;
background-image:url('http://dotnet.tech.ubc.ca/CourseWiki/images/0/0b/ScreenBeanPuzzled.gif');
background-repeat:no-repeat;
width:600px;
padding-top:65px;
padding-left:50px;
}
@font-face {
    font-family: "Gotham-Book";
   src:url("//bosepromktg.com/fonts/gotham/Gotham-Book.otf")
    src:url("//toonz.ca/fonts/gotham/Gotham-Book.otf")
}
</style>
</html>
<noinclude>
<html><section></html>
Ordinary section

<html></section></html>
<html>
<h1 style="font-face:Gotham-Book">Gotham Book</h1>
</html>

<html><section class="discussion"></html>
Discussion
==== CSS ====
Discussion:  Inline styles or Stylesheets
* Formatting toolbar creates inline styles
* CSS 
* Mode Auto or Mode Manual (see bottom right side of status bar)
<html></section></html>



<html><section class="key"></html>

==== Key Concept ====
This is a key concept

<html></section></html>

<html><section class="sinking"></html>
==== Sinking====
Sometimes digging into details feels like

<html></section></html>


<html><section class="sinkingBig"></html>

==== Sinking Big====
Sometimes digging into details feels like
<br />
<br />
<br />
<br />
<br />
<br />how deep is that hole?
<br />
<br />
<br />
<br />




<html></section></html>

<html><section class="tools"></html>
==== Tools====
Learning the tools
<html></section></html>






</noinclude>