The document contains CSS code for styling a webpage, including layout definitions, background images, typography, and responsive design elements. It includes styles for various HTML elements such as headers, navigation menus, and tables, as well as animations and transitions. Additionally, it references jQuery UI components for enhanced interactivity in the web design.

1. Chapter 6 Template/Week 6/css/homework.css
/* */
html {
background-image: url("../images/background.jpg");
height:100%;
display:flex;
flex-direction: column;
}
body {
font-family: Verdana, Arial, Helvetica, sans-serif, "Courier
New","Times New Roman";
max-width: 1080px;
width: 95%; /* fixed width was 800 */
height: 450%;
background-color: rgba(255, 255, 255, 0.1); /* White
background with 10% opacity */
margin: 0 auto;

2. padding: 0;
border: 0px solid black;
/* box-shadow: 0 9px 18px 9px; */
}
h1, h2, h3, p {
margin: 0;
padding: 0;
}
/* Header */
header {
background-image: -webkit-linear-gradient(45deg, white 0%,
blue 75%, green 100%);
background-image: -moz-linear-gradient(45deg, white 0%,
blue 75%, green 100%);
background-image: -o-linear-gradient(45deg, white 0%, blue
75%, green 100%);
background-image: linear-gradient(45deg, white 0%, blue
75%, green 100%);

3. padding: .9375em 1.875% .9375em 1.875%; /* 15 / 16; 15 /
800 x 100 */
}
header img {
float: left;
padding-right: 1.875%; /* 15 / 800 x 100 */
width: 10.6%;
max-width: 85px;
min-width: 40px;
}
header h2 {
font-size: 230%;
}
header h3 {
font-size: 125%;
padding-bottom: 15px;
}
h2#result {

4. color: red;
}
/* Drag and Drop */
#boxA, #boxB {
float:left;padding:10px;margin:10px; -moz-user-select:none;
}
#boxA { background-color: #6633FF; width:75px; height:75px;
}
#boxB { background-color: #FF6699; width:150px;
height:150px; }
div#group {
float: left;
}
div#twoBoxesTop {
float: left;

5. }
div#imgDiv {
float: left;
}
div#twoBoxesBot {
float: left;
}
div#div1 {
width: 100px;
height: 100px;
padding: 0px;
border: 1px solid #aaaaaa;
float: left;
}
div#div2 {

6. width: 100px;
height: 100px;
padding: 0px;
border: 1px solid #aaaaaa;
float: right;
}
div#div3 {
width: 100px;
height: 100px;
padding: 0px;
border: 1px solid #aaaaaa;
float: left;
}
div#div4 {
width: 100px;
height: 100px;

7. padding: 0px;
border: 1px solid #aaaaaa;
float: right;
}
/* background video */
.fullscreen-bg {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
overflow: hidden;
z-index: -100;
}

8. .fullscreen-bg__video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
@media (min-aspect-ratio: 16/9) {
.fullscreen-bg__video {
height: 300%;
top: -100%;
}
}
@media (max-aspect-ratio: 16/9) {
.fullscreen-bg__video {
width: 300%;

9. left: -100%;
}
}
@media (max-width: 767px) {
.fullscreen-bg {
background: url('../../images/videoframe.jpg') center center /
cover no-repeat;
}
.fullscreen-bg__video {
display: none;
}
}
.logo {
width: 180px;
height: 100px;
float: left;

10. }
.rImage {
width: 80px;
height: 60px;
float: left;
}
/* main */
main.main {
}
main p#a1 {
font-family: Verdana, Arial, Helvetica, sans-serif, "Courier
New","Times New Roman";
color: blue;
text-align: center;
font-weight: bold
}

11. div#mainContent {
width: 700px;
height: 600px;
border: 1px solid blue;
}
div#mainContent p#mt {
font-family: Verdana, Arial, Helvetica, sans-serif, "Courier
New","Times New Roman";
color: black;
text-align: center;
font-weight: normal;
font-size: 34pt;
}
div#mainContent p#et {
font-family: Verdana, Arial, Helvetica, sans-serif, "Courier
New","Times New Roman";

12. color: black;
text-align: center;
font-weight: normal;
font-size: 24pt;
}
div#mainContent p#ed {
font-family: Verdana, Arial, Helvetica, sans-serif, "Courier
New","Times New Roman";
color: black;
text-align: center;
font-weight: normal;
font-size: 24pt;
}
div#mainContent p#msg01 {
font-family: Verdana, Arial, Helvetica, sans-serif, "Courier
New","Times New Roman";
color: black;

13. text-align: left;
font-weight: normal;
font-size: 14pt;
}
div#img01 {
padding-left: 215px;
}
video#mainVideo {
border: 1px solid #021a40;
}
div#mainVideo {
border: 1px solid blue;
width: 320px;
height: 240px;

14. }
textarea#txta01 {
font-family: Verdana, Arial, Helvetica, sans-serif, "Courier
New","Times New Roman";
color: blue;
text-align: left;
}
label{
display:inline-block;
width:150px;
}
label#bigLabel{
display:inline-block;

15. width:500px;
}
label#bigLabel2{
display:inline-block;
width:400px;
}
label#lbl01 {
font-family: Verdana, Arial, Helvetica, sans-serif, "Courier
New","Times New Roman";
color: black;
text-align: left;
font-weight: bold;
}
label#lbl02 {
font-family: Verdana, Arial, Helvetica, sans-serif, "Courier
New","Times New Roman";
color: black;

16. text-align: left;
font-weight: bold;
}
label#lbl03 {
font-family: Verdana, Arial, Helvetica, sans-serif, "Courier
New","Times New Roman";
color: black;
text-align: left;
font-weight: bold;
width:300px;
}
label#lbl04 {
font-family: Verdana, Arial, Helvetica, sans-serif, "Courier
New","Times New Roman";
color: black;
text-align: left;
font-weight: bold;

17. width:300px;
}
label#lbl05 {
font-family: Verdana, Arial, Helvetica, sans-serif, "Courier
New","Times New Roman";
color: black;
text-align: left;
font-weight: bold;
width:300px;
}
label#lbl06 {
font-family: Verdana, Arial, Helvetica, sans-serif, "Courier
New","Times New Roman";
color: black;
text-align: left;
font-weight: bold;

18. width:300px;
}
label#lbl07 {
font-family: Verdana, Arial, Helvetica, sans-serif, "Courier
New","Times New Roman";
color: black;
text-align: left;
font-weight: bold;
width:200px;
}
label#lbl08 {
font-family: Verdana, Arial, Helvetica, sans-serif, "Courier
New","Times New Roman";
color: black;
text-align: left;
font-weight: bold;
width:200px;

19. }
label#lblc01 {
font-family: Verdana, Arial, Helvetica, sans-serif, "Courier
New","Times New Roman";
color: black;
text-align: center;
font-weight: bold;
font-size: 24pt;
}
label#lblc02 {
font-family: Verdana, Arial, Helvetica, sans-serif, "Courier
New","Times New Roman";
color: black;
text-align: left;
font-weight: normal;
}

20. input#foreColor {
font-family: Verdana, Arial, Helvetica, sans-serif, "Courier
New","Times New Roman";
color: red;
text-align: left;
}
fieldset {
background-color:#ccffcc;
}
legend {
color: red;
font-weight: bold;
}
/* Table */
table {

21. width:100%;
}
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
th, td {
padding: 5px;
text-align: left;
}
table#t01 tr:nth-child(even) {
background-color: #ffffcc;
}
table#t01 tr:nth-child(odd) {
background-color:#fff;
}
table#t01 th {
background-color: #66ffcc;

22. color: black;
}
table img {
border: 1px solid #ddd;
border-radius: 4px;
padding: 5px;
width: 150px;
}
table img:hover {
box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
}
iframe {
display:block;
}

23. /* Sidebar */
aside {
float: left;
width: 100px;
padding: 5px 0;
}
aside#table {
float: left;
width: 50px;
padding: 5px 0;
}
aside#leftside {
float: left;
width: 33%;
padding: 5px 0;
height: 750px;

24. }
aside a {
color:white;
}
/* Navigation menu */
#nav_menu {
clear: left;
}
#nav_menu ul {
list-style: none;
position: relative;
}
#nav_menu ul li {
float: left;
width: 20%; /* 160 / 800 x 100 */

25. }
#nav_menu ul ul {
display: none;
position: absolute;
top: 100%;
}
#nav_menu ul ul li {
float: none;
}
#nav_menu ul li:hover > ul {
display: block;
}
#nav_menu > ul::after {
content: "";
clear: both;
display: block;
}
#nav_menu ul {

26. margin: 0;
padding: 0;
}
#nav_menu ul li:hover ul {
width: 100%;
}
#nav_menu ul li a {
text-align: center;
display: block;
padding: .7em 0;
text-decoration: none;
background-color: #00ff00;
color: red;
}
#nav_menu ul li a.current {
color: orange;
}
#nav_menu ul li a:hover, #nav_menu ul li a:focus {

27. background-color: #ffff99;
}
#nav_list ul {
list-style: none;
padding-left: 1.5em;
}
#nav_list ul li {
width: 100px;
margin-bottom: .5em;
border: 2px solid black; }
#nav_list ul li a {
display: block;
font-weight: bold;
text-decoration: none;
background-color: orange;
padding: .5em 0 .5em .5em;

28. color: black;
}
/* Section */
section {
width: 720px;
float: right;
padding: 5px 5px 5px 5px;
}
section#table {
width: 820px;
float: right;
padding: 5px 5px 5px 5px;
}
section img {
float: left;
padding-right: 1.875%;

29. }
img#i1 {
float: right;
}
section h1 {
font-size: 140%;
margin-bottom: .5em;
}
section h1:first-letter {
font-size: 140%;
}
section h2 {
font-size: 125%;
margin: .8em 0 .5em 0;
}
section h3 {

30. font-size: 110%;
margin: .8em 0 .5em 0;
text-shadow: 2px 2px 5px red;
}
section h4 {
color: white;
text-shadow: 1px 1px 2px black, 0 0 25px blue, 0 0 5px
darkblue;
}
section p {
margin-bottom: .5em;
}
section p#dr1 {
color: Blue;
text-shadow: 1px 1px 2px black, 0 0 25px blue, 0 0 5px
darkblue;
font-size: 185%;

31. }
section a {
font-weight: bold;
color: orange;
}
section a:link, main a:visited {
color: orange;
}
section a:hover, main a:focus {
color: green;
}
section#form h2 {
color: green;
}
section#form h3 {

32. color: blue;
}
section h1#v1 { text-shadow: 2px 2px 5px red;
}
section p#audio1 {
text-align: center;
max-width: 320px;
color: blue;
background-color: yellow;
}
audio#audioControls {
padding-left: 10px;
}
/*
p#v4 {

33. color:black;
}
*/
canvas#drawing {
background-color: rgba(255, 255, 255, 0.6); /* White
background with 60% opacity */
/* width: 600px;
height: 300px; */
border: 1px solid #0000ff;
}
div#c1 {
background-color: rgba(255, 255, 255, 0.1); /* White
background with 10% opacity */
max-width: 350px;
max-height: 180px;
}

34. /*
div#div1 {
width: 100px;
height: 100px;
background-color: red;
-webkit-animation-name: example;
-webkit-animation-duration: 8s;
animation-name: example;
animation-duration: 8s;
}
*/
/* use combinator to set p section within div to yellow
background */
div#d1 > p {
background-color: yellow;
}
/* use combinator to set p section after div to blue background
and text to white */
div#d3 + p {

35. color: white;
background-color: blue;
}
div#twoCol {
padding: 0px;
margin: 0px
width:550px;
}
div#fcs {
float: left;
padding-right: 0px;
margin: 0px
}
div#leftCol1 {

36. float: left;
padding-right: 0px;
margin: 0px
}
div#rightCol1 {
float: right;
padding-left: 0px;
margin: 0px
}
div#leftCol2 {
float: left;
padding-right: 30px;
margin: 0px
}
div#rightCol2 {

37. float: right;
padding-left: 30px;
margin: 0px
}
select#fcs {
background-color: blue;
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes example {
0% {background-color: red;}
25% {background-color: yellow;}
50% {background-color: blue;}
100% {background-color: green;}
}
/* Standard syntax */
@keyframes example {

38. 0% {background-color: red;}
25% {background-color: yellow;}
50% {background-color: blue;}
100% {background-color: green;}
}
.newspaper {
-webkit-column-count: 3; /* Chrome, Safari, Opera */
-moz-column-count: 3; /* Firefox */
column-count: 3;
}
/* Footer */
footer {
clear: both;
border-top: 2px solid black;
padding: 15px;

39. background-image: -webkit-linear-gradient(45deg, black 0%,
orange 25%, white 100%);
background-image: -moz-linear-gradient(45deg, black 0%,
orange 25%, white 100%);
background-image: -o-linear-gradient(45deg, black 0%,
orange 25%, white 100%);
background-image: linear-gradient(45deg, black 0%, orange
25%, white 100%);
}
footer p {
font-size: 90%;
text-align: center;
}
Chapter 6 Template/Week 6/css/jquery-ui.css
/*! jQuery UI - v1.12.1 - 2016-09-14
* http://jqueryui.com
* Includes: core.css, accordion.css, autocomplete.css, menu.css,
button.css, controlgroup.css, checkboxradio.css, datepicker.css,
dialog.css, draggable.css, resizable.css, progressbar.css,
selectable.css, selectmenu.css, slider.css, sortable.css,
spinner.css, tabs.css, tooltip.css, theme.css
* To view and modify this theme, visit
http://jqueryui.com/themeroller/?bgShadowXPos=&bgOverlayX
Pos=&bgErrorXPos=&bgHighlightXPos=&bgContentXPos=&bg
HeaderXPos=&bgActiveXPos=&bgHoverXPos=&bgDefaultXPo
s=&bgShadowYPos=&bgOverlayYPos=&bgErrorYPos=&bgHig

40. hlightYPos=&bgContentYPos=&bgHeaderYPos=&bgActiveYPo
s=&bgHoverYPos=&bgDefaultYPos=&bgShadowRepeat=&bgO
verlayRepeat=&bgErrorRepeat=&bgHighlightRepeat=&bgConte
ntRepeat=&bgHeaderRepeat=&bgActiveRepeat=&bgHoverRepe
at=&bgDefaultRepeat=&iconsHover=url(%22images%2Fui-
icons_555555_256x240.png%22)&iconsHighlight=url(%22imag
es%2Fui-
icons_777620_256x240.png%22)&iconsHeader=url(%22images
%2Fui-
icons_444444_256x240.png%22)&iconsError=url(%22images%
2Fui-
icons_cc0000_256x240.png%22)&iconsDefault=url(%22images
%2Fui-
icons_777777_256x240.png%22)&iconsContent=url(%22images
%2Fui-
icons_444444_256x240.png%22)&iconsActive=url(%22images
%2Fui-
icons_ffffff_256x240.png%22)&bgImgUrlShadow=&bgImgUrlO
verlay=&bgImgUrlHover=&bgImgUrlHighlight=&bgImgUrlHea
der=&bgImgUrlError=&bgImgUrlDefault=&bgImgUrlContent=
&bgImgUrlActive=&opacityFilterShadow=Alpha(Opacity%3D3
0)&opacityFilterOverlay=Alpha(Opacity%3D30)&opacityShado
wPerc=30&opacityOverlayPerc=30&iconColorHover=%235555
55&iconColorHighlight=%23777620&iconColorHeader=%2344
4444&iconColorError=%23cc0000&iconColorDefault=%237777
77&iconColorContent=%23444444&iconColorActive=%23ffffff
&bgImgOpacityShadow=0&bgImgOpacityOverlay=0&bgImgOp
acityError=95&bgImgOpacityHighlight=55&bgImgOpacityCont
ent=75&bgImgOpacityHeader=75&bgImgOpacityActive=65&bg
ImgOpacityHover=75&bgImgOpacityDefault=75&bgTextureSha
dow=flat&bgTextureOverlay=flat&bgTextureError=flat&bgText
ureHighlight=flat&bgTextureContent=flat&bgTextureHeader=fl
at&bgTextureActive=flat&bgTextureHover=flat&bgTextureDefa
ult=flat&cornerRadius=3px&fwDefault=normal&ffDefault=Aria
l%2CHelvetica%2Csans-
serif&fsDefault=1em&cornerRadiusShadow=8px&thicknessSha

41. dow=5px&offsetLeftShadow=0px&offsetTopShadow=0px&opac
ityShadow=.3&bgColorShadow=%23666666&opacityOverlay=.
3&bgColorOverlay=%23aaaaaa&fcError=%235f3f3f&borderCol
orError=%23f1a899&bgColorError=%23fddfdf&fcHighlight=%
23777620&borderColorHighlight=%23dad55e&bgColorHighligh
t=%23fffa90&fcContent=%23333333&borderColorContent=%23
dddddd&bgColorContent=%23ffffff&fcHeader=%23333333&bo
rderColorHeader=%23dddddd&bgColorHeader=%23e9e9e9&fc
Active=%23ffffff&borderColorActive=%23003eff&bgColorActi
ve=%23007fff&fcHover=%232b2b2b&borderColorHover=%23c
ccccc&bgColorHover=%23ededed&fcDefault=%23454545&bor
derColorDefault=%23c5c5c5&bgColorDefault=%23f6f6f6
* Copyright jQuery Foundation and other contributors; Licensed
MIT */
/* Layout helpers
----------------------------------*/
.ui-helper-hidden {
display: none;
}
.ui-helper-hidden-accessible {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
.ui-helper-reset {
margin: 0;
padding: 0;
border: 0;
outline: 0;
line-height: 1.3;

42. text-decoration: none;
font-size: 100%;
list-style: none;
}
.ui-helper-clearfix:before,
.ui-helper-clearfix:after {
content: "";
display: table;
border-collapse: collapse;
}
.ui-helper-clearfix:after {
clear: both;
}
.ui-helper-zfix {
width: 100%;
height: 100%;
top: 0;
left: 0;
position: absolute;
opacity: 0;
filter:Alpha(Opacity=0); /* support: IE8 */
}
.ui-front {
z-index: 100;
}
/* Interaction Cues
----------------------------------*/
.ui-state-disabled {
cursor: default !important;
pointer-events: none;
}

43. /* Icons
----------------------------------*/
.ui-icon {
display: inline-block;
vertical-align: middle;
margin-top: -.25em;
position: relative;
text-indent: -99999px;
overflow: hidden;
background-repeat: no-repeat;
}
.ui-widget-icon-block {
left: 50%;
margin-left: -8px;
display: block;
}
/* Misc visuals
----------------------------------*/
/* Overlays */
.ui-widget-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.ui-accordion .ui-accordion-header {
display: block;
cursor: pointer;
position: relative;
margin: 2px 0 0 0;
padding: .5em .5em .5em .7em;
font-size: 100%;

44. }
.ui-accordion .ui-accordion-content {
padding: 1em 2.2em;
border-top: 0;
overflow: auto;
}
.ui-autocomplete {
position: absolute;
top: 0;
left: 0;
cursor: default;
}
.ui-menu {
list-style: none;
padding: 0;
margin: 0;
display: block;
outline: 0;
}
.ui-menu .ui-menu {
position: absolute;
}
.ui-menu .ui-menu-item {
margin: 0;
cursor: pointer;
/* support: IE10, see #8844 */
list-style-image:
url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///y
H5BAEAAAAALAAAAAABAAEAAAIBRAA7");
}
.ui-menu .ui-menu-item-wrapper {
position: relative;
padding: 3px 1em 3px .4em;
}
.ui-menu .ui-menu-divider {
margin: 5px 0;

45. height: 0;
font-size: 0;
line-height: 0;
border-width: 1px 0 0 0;
}
.ui-menu .ui-state-focus,
.ui-menu .ui-state-active {
margin: -1px;
}
/* icon support */
.ui-menu-icons {
position: relative;
}
.ui-menu-icons .ui-menu-item-wrapper {
padding-left: 2em;
}
/* left-aligned */
.ui-menu .ui-icon {
position: absolute;
top: 0;
bottom: 0;
left: .2em;
margin: auto 0;
}
/* right-aligned */
.ui-menu .ui-menu-icon {
left: auto;
right: 0;
}
.ui-button {
padding: .4em 1em;
display: inline-block;
position: relative;

46. line-height: normal;
margin-right: .1em;
cursor: pointer;
vertical-align: middle;
text-align: center;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
/* Support: IE <= 11 */
overflow: visible;
}
.ui-button,
.ui-button:link,
.ui-button:visited,
.ui-button:hover,
.ui-button:active {
text-decoration: none;
}
/* to make room for the icon, a width needs to be set here */
.ui-button-icon-only {
width: 2em;
box-sizing: border-box;
text-indent: -9999px;
white-space: nowrap;
}
/* no icon support for input elements */
input.ui-button.ui-button-icon-only {
text-indent: 0;
}
/* button icon element(s) */

47. .ui-button-icon-only .ui-icon {
position: absolute;
top: 50%;
left: 50%;
margin-top: -8px;
margin-left: -8px;
}
.ui-button.ui-icon-notext .ui-icon {
padding: 0;
width: 2.1em;
height: 2.1em;
text-indent: -9999px;
white-space: nowrap;
}
input.ui-button.ui-icon-notext .ui-icon {
width: auto;
height: auto;
text-indent: 0;
white-space: normal;
padding: .4em 1em;
}
/* workarounds */
/* Support: Firefox 5 - 40 */
input.ui-button::-moz-focus-inner,
button.ui-button::-moz-focus-inner {
border: 0;
padding: 0;
}
.ui-controlgroup {
vertical-align: middle;
display: inline-block;
}

48. .ui-controlgroup > .ui-controlgroup-item {
float: left;
margin-left: 0;
margin-right: 0;
}
.ui-controlgroup > .ui-controlgroup-item:focus,
.ui-controlgroup > .ui-controlgroup-item.ui-visual-focus {
z-index: 9999;
}
.ui-controlgroup-vertical > .ui-controlgroup-item {
display: block;
float: none;
width: 100%;
margin-top: 0;
margin-bottom: 0;
text-align: left;
}
.ui-controlgroup-vertical .ui-controlgroup-item {
box-sizing: border-box;
}
.ui-controlgroup .ui-controlgroup-label {
padding: .4em 1em;
}
.ui-controlgroup .ui-controlgroup-label span {
font-size: 80%;
}
.ui-controlgroup-horizontal .ui-controlgroup-label + .ui-
controlgroup-item {
border-left: none;
}
.ui-controlgroup-vertical .ui-controlgroup-label + .ui-
controlgroup-item {
border-top: none;
}
.ui-controlgroup-horizontal .ui-controlgroup-label.ui-widget-
content {

49. border-right: none;
}
.ui-controlgroup-vertical .ui-controlgroup-label.ui-widget-
content {
border-bottom: none;
}
/* Spinner specific style fixes */
.ui-controlgroup-vertical .ui-spinner-input {
/* Support: IE8 only, Android < 4.4 only */
width: 75%;
width: calc( 100% - 2.4em );
}
.ui-controlgroup-vertical .ui-spinner .ui-spinner-up {
border-top-style: solid;
}
.ui-checkboxradio-label .ui-icon-background {
box-shadow: inset 1px 1px 1px #ccc;
border-radius: .12em;
border: none;
}
.ui-checkboxradio-radio-label .ui-icon-background {
width: 16px;
height: 16px;
border-radius: 1em;
overflow: visible;
border: none;
}
.ui-checkboxradio-radio-label.ui-checkboxradio-checked .ui-
icon,
.ui-checkboxradio-radio-label.ui-checkboxradio-checked:hover
.ui-icon {
background-image: none;
width: 8px;

50. height: 8px;
border-width: 4px;
border-style: solid;
}
.ui-checkboxradio-disabled {
pointer-events: none;
}
.ui-datepicker {
width: 17em;
padding: .2em .2em 0;
display: none;
}
.ui-datepicker .ui-datepicker-header {
position: relative;
padding: .2em 0;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
position: absolute;
top: 2px;
width: 1.8em;
height: 1.8em;
}
.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
top: 1px;
}
.ui-datepicker .ui-datepicker-prev {
left: 2px;
}
.ui-datepicker .ui-datepicker-next {
right: 2px;
}
.ui-datepicker .ui-datepicker-prev-hover {
left: 1px;
}

51. .ui-datepicker .ui-datepicker-next-hover {
right: 1px;
}
.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
display: block;
position: absolute;
left: 50%;
margin-left: -8px;
top: 50%;
margin-top: -8px;
}
.ui-datepicker .ui-datepicker-title {
margin: 0 2.3em;
line-height: 1.8em;
text-align: center;
}
.ui-datepicker .ui-datepicker-title select {
font-size: 1em;
margin: 1px 0;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
width: 45%;
}
.ui-datepicker table {
width: 100%;
font-size: .9em;
border-collapse: collapse;
margin: 0 0 .4em;
}
.ui-datepicker th {
padding: .7em .3em;
text-align: center;
font-weight: bold;
border: 0;

52. }
.ui-datepicker td {
border: 0;
padding: 1px;
}
.ui-datepicker td span,
.ui-datepicker td a {
display: block;
padding: .2em;
text-align: right;
text-decoration: none;
}
.ui-datepicker .ui-datepicker-buttonpane {
background-image: none;
margin: .7em 0 0 0;
padding: 0 .2em;
border-left: 0;
border-right: 0;
border-bottom: 0;
}
.ui-datepicker .ui-datepicker-buttonpane button {
float: right;
margin: .5em .2em .4em;
cursor: pointer;
padding: .2em .6em .3em .6em;
width: auto;
overflow: visible;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-
current {
float: left;
}
/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi {
width: auto;

53. }
.ui-datepicker-multi .ui-datepicker-group {
float: left;
}
.ui-datepicker-multi .ui-datepicker-group table {
width: 95%;
margin: 0 auto .4em;
}
.ui-datepicker-multi-2 .ui-datepicker-group {
width: 50%;
}
.ui-datepicker-multi-3 .ui-datepicker-group {
width: 33.3%;
}
.ui-datepicker-multi-4 .ui-datepicker-group {
width: 25%;
}
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-
header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-
header {
border-left-width: 0;
}
.ui-datepicker-multi .ui-datepicker-buttonpane {
clear: left;
}
.ui-datepicker-row-break {
clear: both;
width: 100%;
font-size: 0;
}
/* RTL support */
.ui-datepicker-rtl {
direction: rtl;
}

54. .ui-datepicker-rtl .ui-datepicker-prev {
right: 2px;
left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next {
left: 2px;
right: auto;
}
.ui-datepicker-rtl .ui-datepicker-prev:hover {
right: 1px;
left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next:hover {
left: 1px;
right: auto;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane {
clear: right;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button {
float: left;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-
datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group {
float: right;
}
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-
header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-
header {
border-right-width: 0;
border-left-width: 1px;
}
/* Icons */

55. .ui-datepicker .ui-icon {
display: block;
text-indent: -99999px;
overflow: hidden;
background-repeat: no-repeat;
left: .5em;
top: .3em;
}
.ui-dialog {
position: absolute;
top: 0;
left: 0;
padding: .2em;
outline: 0;
}
.ui-dialog .ui-dialog-titlebar {
padding: .4em 1em;
position: relative;
}
.ui-dialog .ui-dialog-title {
float: left;
margin: .1em 0;
white-space: nowrap;
width: 90%;
overflow: hidden;
text-overflow: ellipsis;
}
.ui-dialog .ui-dialog-titlebar-close {
position: absolute;
right: .3em;
top: 50%;
width: 20px;
margin: -10px 0 0 0;
padding: 1px;
height: 20px;
}

56. .ui-dialog .ui-dialog-content {
position: relative;
border: 0;
padding: .5em 1em;
background: none;
overflow: auto;
}
.ui-dialog .ui-dialog-buttonpane {
text-align: left;
border-width: 1px 0 0 0;
background-image: none;
margin-top: .5em;
padding: .3em 1em .5em .4em;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
float: right;
}
.ui-dialog .ui-dialog-buttonpane button {
margin: .5em .4em .5em 0;
cursor: pointer;
}
.ui-dialog .ui-resizable-n {
height: 2px;
top: 0;
}
.ui-dialog .ui-resizable-e {
width: 2px;
right: 0;
}
.ui-dialog .ui-resizable-s {
height: 2px;
bottom: 0;
}
.ui-dialog .ui-resizable-w {
width: 2px;
left: 0;

57. }
.ui-dialog .ui-resizable-se,
.ui-dialog .ui-resizable-sw,
.ui-dialog .ui-resizable-ne,
.ui-dialog .ui-resizable-nw {
width: 7px;
height: 7px;
}
.ui-dialog .ui-resizable-se {
right: 0;
bottom: 0;
}
.ui-dialog .ui-resizable-sw {
left: 0;
bottom: 0;
}
.ui-dialog .ui-resizable-ne {
right: 0;
top: 0;
}
.ui-dialog .ui-resizable-nw {
left: 0;
top: 0;
}
.ui-draggable .ui-dialog-titlebar {
cursor: move;
}
.ui-draggable-handle {
-ms-touch-action: none;
touch-action: none;
}
.ui-resizable {
position: relative;
}
.ui-resizable-handle {
position: absolute;

58. font-size: 0.1px;
display: block;
-ms-touch-action: none;
touch-action: none;
}
.ui-resizable-disabled .ui-resizable-handle,
.ui-resizable-autohide .ui-resizable-handle {
display: none;
}
.ui-resizable-n {
cursor: n-resize;
height: 7px;
width: 100%;
top: -5px;
left: 0;
}
.ui-resizable-s {
cursor: s-resize;
height: 7px;
width: 100%;
bottom: -5px;
left: 0;
}
.ui-resizable-e {
cursor: e-resize;
width: 7px;
right: -5px;
top: 0;
height: 100%;
}
.ui-resizable-w {
cursor: w-resize;
width: 7px;
left: -5px;
top: 0;
height: 100%;

59. }
.ui-resizable-se {
cursor: se-resize;
width: 12px;
height: 12px;
right: 1px;
bottom: 1px;
}
.ui-resizable-sw {
cursor: sw-resize;
width: 9px;
height: 9px;
left: -5px;
bottom: -5px;
}
.ui-resizable-nw {
cursor: nw-resize;
width: 9px;
height: 9px;
left: -5px;
top: -5px;
}
.ui-resizable-ne {
cursor: ne-resize;
width: 9px;
height: 9px;
right: -5px;
top: -5px;
}
.ui-progressbar {
height: 2em;
text-align: left;
overflow: hidden;
}
.ui-progressbar .ui-progressbar-value {
margin: -1px;

60. height: 100%;
}
.ui-progressbar .ui-progressbar-overlay {
background:
url("data:image/gif;base64,R0lGODlhKAAoAIABAAAAAP///y
H/C05FVFNDQVBFMi4wAwEAAAAh+QQJAQABACwAAAA
AKAAoAAACkYwNqXrdC52DS06a7MFZI+4FHBCKoDeWKX
qymPqGqxvJrXZbMx7Ttc+w9XgU2FB3lOyQRWET2IFGiU9m1
frDVpxZZc6bfHwv4c1YXP6k1Vdy292Fb6UkuvFtXpvWSzA+H
ycXJHUXiGYIiMg2R6W459gnWGfHNdjIqDWVqemH2ekpObk
pOlppWUqZiqr6edqqWQAAIfkECQEAAQAsAAAAACgAKAA
AApSMgZnGfaqcg1E2uuzDmmHUBR8Qil95hiPKqWn3aqtLsS1
8y7G1SzNeowWBENtQd+T1JktP05nzPTdJZlR6vUxNWWjV+v
UWhWNkWFwxl9VpZRedYcflIOLafaa28XdsH/ynlcc1uPVDZx
QIR0K25+cICCmoqCe5mGhZOfeYSUh5yJcJyrkZWWpaR8doJ2
o4NYq62lAAACH5BAkBAAEALAAAAAAoACgAAAKVDI4Y
y22ZnINRNqosw0Bv7i1gyHUkFj7oSaWlu3ovC8GxNso5fluz3q
LVhBVeT/Lz7ZTHyxL5dDalQWPVOsQWtRnuwXaFTj9jVVh8p
ma9JjZ4zYSj5ZOyma7uuolffh+IR5aW97cHuBUXKGKXlKjn+D
iHWMcYJah4N0lYCMlJOXipGRr5qdgoSTrqWSq6WFl2ypoaU
AAAIfkECQEAAQAsAAAAACgAKAAAApaEb6HLgd/iO7FN
WtcFWe+ufODGjRfoiJ2akShbueb0wtI50zm02pbvwfWEMWBQ
1zKGlLIhskiEPm9R6vRXxV4ZzWT2yHOGpWMyorblKlNp8Hm
HEb/lCXjcW7bmtXP8Xt229OVWR1fod2eWqNfHuMjXCPkIGN
ileOiImVmCOEmoSfn3yXlJWmoHGhqp6ilYuWYpmTqKUgAAI
fkECQEAAQAsAAAAACgAKAAAApiEH6kb58biQ3FNWtMF
WW3eNVcojuFGfqnZqSebuS06w5V80/X02pKe8zFwP6EFWOT
1lDFk8rGERh1TTNOocQ61Hm4Xm2VexUHpzjymViHrFbiELse
fVrn6XKfnt2Q9G/+Xdie499XHd2g4h7ioOGhXGJboGAnXSBno
BwKYyfioubZJ2Hn0RuRZaflZOil56Zp6iioKSXpUAAAh+QQJA
QABACwAAAAAKAAoAAACkoQRqRvnxuI7kU1a1UU5bd5tn
SeOZXhmn5lWK3qNTWvRdQxP8qvaC+/yaYQzXO7BMvaUEm
JRd3TsiMAgswmNYrSgZdYrTX6tSHGZO73ezuAw2uxuQ+Bbe
ZfMxsexY35+/Qe4J1inV0g4x3WHuMhIl2jXOKT2Q+VU5fgoS
UI52VfZyfkJGkha6jmY+aaYdirq+lQAACH5BAkBAAEALAAA
AAAoACgAAAKWBIKpYe0L3YNKToqswUlvznigd4wiR4KhZr

61. Kt9Upqip61i9E3vMvxRdHlbEFiEXfk9YARYxOZZD6VQ2pUun
BmtRXo1Lf8hMVVcNl8JafV38aM2/Fu5V16Bn63r6xt97j09+M
XSFi4BniGFae3hzbH9+hYBzkpuUh5aZmHuanZOZgIuvbGiNeo
mCnaxxap2upaCZsq+1kAACH5BAkBAAEALAAAAAAoACgA
AAKXjI8By5zf4kOxTVrXNVlv1X0d8IGZGKLnNpYtm8Lr9cqV
euOSvfOW79D9aDHizNhDJidFZhNydEahOaDH6nomtJjp1tutKo
NWkvA6JqfRVLHU/QUfau9l2x7G54d1fl995xcIGAdXqMfBNad
oYrhH+Mg2KBlpVpbluCiXmMnZ2Sh4GBqJ+ckIOqqJ6LmKSll
Zmsoq6wpQAAAh+QQJAQABACwAAAAAKAAoAAAClYx/o
LvoxuJDkU1a1YUZbJ59nSd2ZXhWqbRa2/gF8Gu2DY3iqs7yrq
+xBYEkYvFSM8aSSObE+ZgRl1BHFZNr7pRCavZ5BW2142hY
3AN/zWtsmf12p9XxxFl2lpLn1rseztfXZjdIWIf2s5dItwjYKBgo9
yg5pHgzJXTEeGlZuenpyPmpGQoKOWkYmSpaSnqKileI2FAA
ACH5BAkBAAEALAAAAAAoACgAAAKVjB+gu+jG4kORTVr
VhRlsnn2dJ3ZleFaptFrb+CXmO9OozeL5VfP99HvAWhpiUdcw
kpBH3825AwYdU8xTqlLGhtCosArKMpvfa1mMRae9VvWZfeB
2XfPkeLmm18lUcBj+p5dnN8jXZ3YIGEhYuOUn45aoCDkp16hl
5IjYJvjWKcnoGQpqyPlpOhr3aElaqrq56Bq7VAAAOw==");
height: 100%;
filter: alpha(opacity=25); /* support: IE8 */
opacity: 0.25;
}
.ui-progressbar-indeterminate .ui-progressbar-value {
background-image: none;
}
.ui-selectable {
-ms-touch-action: none;
touch-action: none;
}
.ui-selectable-helper {
position: absolute;
z-index: 100;
border: 1px dotted black;
}
.ui-selectmenu-menu {
padding: 0;

62. margin: 0;
position: absolute;
top: 0;
left: 0;
display: none;
}
.ui-selectmenu-menu .ui-menu {
overflow: auto;
overflow-x: hidden;
padding-bottom: 1px;
}
.ui-selectmenu-menu .ui-menu .ui-selectmenu-optgroup {
font-size: 1em;
font-weight: bold;
line-height: 1.5;
padding: 2px 0.4em;
margin: 0.5em 0 0 0;
height: auto;
border: 0;
}
.ui-selectmenu-open {
display: block;
}
.ui-selectmenu-text {
display: block;
margin-right: 20px;
overflow: hidden;
text-overflow: ellipsis;
}
.ui-selectmenu-button.ui-button {
text-align: left;
white-space: nowrap;
width: 14em;
}
.ui-selectmenu-icon.ui-icon {
float: right;

63. margin-top: 0;
}
.ui-slider {
position: relative;
text-align: left;
}
.ui-slider .ui-slider-handle {
position: absolute;
z-index: 2;
width: 1.2em;
height: 1.2em;
cursor: default;
-ms-touch-action: none;
touch-action: none;
}
.ui-slider .ui-slider-range {
position: absolute;
z-index: 1;
font-size: .7em;
display: block;
border: 0;
background-position: 0 0;
}
/* support: IE8 - See #6727 */
.ui-slider.ui-state-disabled .ui-slider-handle,
.ui-slider.ui-state-disabled .ui-slider-range {
filter: inherit;
}
.ui-slider-horizontal {
height: .8em;
}
.ui-slider-horizontal .ui-slider-handle {
top: -.3em;
margin-left: -.6em;

64. }
.ui-slider-horizontal .ui-slider-range {
top: 0;
height: 100%;
}
.ui-slider-horizontal .ui-slider-range-min {
left: 0;
}
.ui-slider-horizontal .ui-slider-range-max {
right: 0;
}
.ui-slider-vertical {
width: .8em;
height: 100px;
}
.ui-slider-vertical .ui-slider-handle {
left: -.3em;
margin-left: 0;
margin-bottom: -.6em;
}
.ui-slider-vertical .ui-slider-range {
left: 0;
width: 100%;
}
.ui-slider-vertical .ui-slider-range-min {
bottom: 0;
}
.ui-slider-vertical .ui-slider-range-max {
top: 0;
}
.ui-sortable-handle {
-ms-touch-action: none;
touch-action: none;
}
.ui-spinner {

65. position: relative;
display: inline-block;
overflow: hidden;
padding: 0;
vertical-align: middle;
}
.ui-spinner-input {
border: none;
background: none;
color: inherit;
padding: .222em 0;
margin: .2em 0;
vertical-align: middle;
margin-left: .4em;
margin-right: 2em;
}
.ui-spinner-button {
width: 1.6em;
height: 50%;
font-size: .5em;
padding: 0;
margin: 0;
text-align: center;
position: absolute;
cursor: default;
display: block;
overflow: hidden;
right: 0;
}
/* more specificity required here to override default borders */
.ui-spinner a.ui-spinner-button {
border-top-style: none;
border-bottom-style: none;
border-right-style: none;
}
.ui-spinner-up {

66. top: 0;
}
.ui-spinner-down {
bottom: 0;
}
.ui-tabs {
position: relative;/* position: relative prevents IE scroll
bug (element with position: relative inside container with
overflow: auto appear as "fixed") */
padding: .2em;
}
.ui-tabs .ui-tabs-nav {
margin: 0;
padding: .2em .2em 0;
}
.ui-tabs .ui-tabs-nav li {
list-style: none;
float: left;
position: relative;
top: 0;
margin: 1px .2em 0 0;
border-bottom-width: 0;
padding: 0;
white-space: nowrap;
}
.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
float: left;
padding: .5em 1em;
text-decoration: none;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active {
margin-bottom: -1px;
padding-bottom: 1px;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor,
.ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor,

67. .ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor {
cursor: text;
}
.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor
{
cursor: pointer;
}
.ui-tabs .ui-tabs-panel {
display: block;
border-width: 0;
padding: 1em 1.4em;
background: none;
}
.ui-tooltip {
padding: 8px;
position: absolute;
z-index: 9999;
max-width: 300px;
}
body .ui-tooltip {
border-width: 2px;
}
/* Component containers
----------------------------------*/
.ui-widget {
font-family: Arial,Helvetica,sans-serif;
font-size: 1em;
}
.ui-widget .ui-widget {
font-size: 1em;
}
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {

68. font-family: Arial,Helvetica,sans-serif;
font-size: 1em;
}
.ui-widget.ui-widget-content {
border: 1px solid #c5c5c5;
}
.ui-widget-content {
border: 1px solid #dddddd;
background: #ffffff;
color: #333333;
}
.ui-widget-content a {
color: #333333;
}
.ui-widget-header {
border: 1px solid #dddddd;
background: #e9e9e9;
color: #333333;
font-weight: bold;
}
.ui-widget-header a {
color: #333333;
}
/* Interaction states
----------------------------------*/
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
/* We use html here because we need a greater specificity to
make sure disabled
works properly when clicked or hovered */
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {

69. border: 1px solid #c5c5c5;
background: #f6f6f6;
font-weight: normal;
color: #454545;
}
.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited,
a.ui-button,
a:link.ui-button,
a:visited.ui-button,
.ui-button {
color: #454545;
text-decoration: none;
}
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus {
border: 1px solid #cccccc;
background: #ededed;
font-weight: normal;
color: #2b2b2b;
}
.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited,
.ui-state-focus a,
.ui-state-focus a:hover,
.ui-state-focus a:link,
.ui-state-focus a:visited,

70. a.ui-button:hover,
a.ui-button:focus {
color: #2b2b2b;
text-decoration: none;
}
.ui-visual-focus {
box-shadow: 0 0 3px 1px rgb(94, 158, 214);
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
border: 1px solid #003eff;
background: #007fff;
font-weight: normal;
color: #ffffff;
}
.ui-icon-background,
.ui-state-active .ui-icon-background {
border: #003eff;
background-color: #ffffff;
}
.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
color: #ffffff;
text-decoration: none;
}
/* Interaction Cues
----------------------------------*/
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,

71. .ui-widget-header .ui-state-highlight {
border: 1px solid #dad55e;
background: #fffa90;
color: #777620;
}
.ui-state-checked {
border: 1px solid #dad55e;
background: #fffa90;
}
.ui-state-highlight a,
.ui-widget-content .ui-state-highlight a,
.ui-widget-header .ui-state-highlight a {
color: #777620;
}
.ui-state-error,
.ui-widget-content .ui-state-error,
.ui-widget-header .ui-state-error {
border: 1px solid #f1a899;
background: #fddfdf;
color: #5f3f3f;
}
.ui-state-error a,
.ui-widget-content .ui-state-error a,
.ui-widget-header .ui-state-error a {
color: #5f3f3f;
}
.ui-state-error-text,
.ui-widget-content .ui-state-error-text,
.ui-widget-header .ui-state-error-text {
color: #5f3f3f;
}
.ui-priority-primary,
.ui-widget-content .ui-priority-primary,
.ui-widget-header .ui-priority-primary {
font-weight: bold;
}

72. .ui-priority-secondary,
.ui-widget-content .ui-priority-secondary,
.ui-widget-header .ui-priority-secondary {
opacity: .7;
filter:Alpha(Opacity=70); /* support: IE8 */
font-weight: normal;
}
.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled {
opacity: .35;
filter:Alpha(Opacity=35); /* support: IE8 */
background-image: none;
}
.ui-state-disabled .ui-icon {
filter:Alpha(Opacity=35); /* support: IE8 - See #6059 */
}
/* Icons
----------------------------------*/
/* states and images */
.ui-icon {
width: 16px;
height: 16px;
}
.ui-icon,
.ui-widget-content .ui-icon {
background-image: url("images/ui-
icons_444444_256x240.png");
}
.ui-widget-header .ui-icon {
background-image: url("images/ui-
icons_444444_256x240.png");
}
.ui-state-hover .ui-icon,

73. .ui-state-focus .ui-icon,
.ui-button:hover .ui-icon,
.ui-button:focus .ui-icon {
background-image: url("images/ui-
icons_555555_256x240.png");
}
.ui-state-active .ui-icon,
.ui-button:active .ui-icon {
background-image: url("images/ui-
icons_ffffff_256x240.png");
}
.ui-state-highlight .ui-icon,
.ui-button .ui-state-highlight.ui-icon {
background-image: url("images/ui-
icons_777620_256x240.png");
}
.ui-state-error .ui-icon,
.ui-state-error-text .ui-icon {
background-image: url("images/ui-
icons_cc0000_256x240.png");
}
.ui-button .ui-icon {
background-image: url("images/ui-
icons_777777_256x240.png");
}
/* positioning */
.ui-icon-blank { background-position: 16px 16px; }
.ui-icon-caret-1-n { background-position: 0 0; }
.ui-icon-caret-1-ne { background-position: -16px 0; }
.ui-icon-caret-1-e { background-position: -32px 0; }
.ui-icon-caret-1-se { background-position: -48px 0; }
.ui-icon-caret-1-s { background-position: -65px 0; }
.ui-icon-caret-1-sw { background-position: -80px 0; }
.ui-icon-caret-1-w { background-position: -96px 0; }
.ui-icon-caret-1-nw { background-position: -112px 0; }

74. .ui-icon-caret-2-n-s { background-position: -128px 0; }
.ui-icon-caret-2-e-w { background-position: -144px 0; }
.ui-icon-triangle-1-n { background-position: 0 -16px; }
.ui-icon-triangle-1-ne { background-position: -16px -16px; }
.ui-icon-triangle-1-e { background-position: -32px -16px; }
.ui-icon-triangle-1-se { background-position: -48px -16px; }
.ui-icon-triangle-1-s { background-position: -65px -16px; }
.ui-icon-triangle-1-sw { background-position: -80px -16px; }
.ui-icon-triangle-1-w { background-position: -96px -16px; }
.ui-icon-triangle-1-nw { background-position: -112px -16px; }
.ui-icon-triangle-2-n-s { background-position: -128px -16px; }
.ui-icon-triangle-2-e-w { background-position: -144px -16px; }
.ui-icon-arrow-1-n { background-position: 0 -32px; }
.ui-icon-arrow-1-ne { background-position: -16px -32px; }
.ui-icon-arrow-1-e { background-position: -32px -32px; }
.ui-icon-arrow-1-se { background-position: -48px -32px; }
.ui-icon-arrow-1-s { background-position: -65px -32px; }
.ui-icon-arrow-1-sw { background-position: -80px -32px; }
.ui-icon-arrow-1-w { background-position: -96px -32px; }
.ui-icon-arrow-1-nw { background-position: -112px -32px; }
.ui-icon-arrow-2-n-s { background-position: -128px -32px; }
.ui-icon-arrow-2-ne-sw { background-position: -144px -32px; }
.ui-icon-arrow-2-e-w { background-position: -160px -32px; }
.ui-icon-arrow-2-se-nw { background-position: -176px -32px; }
.ui-icon-arrowstop-1-n { background-position: -192px -32px; }
.ui-icon-arrowstop-1-e { background-position: -208px -32px; }
.ui-icon-arrowstop-1-s { background-position: -224px -32px; }
.ui-icon-arrowstop-1-w { background-position: -240px -32px; }
.ui-icon-arrowthick-1-n { background-position: 1px -48px; }
.ui-icon-arrowthick-1-ne { background-position: -16px -48px; }
.ui-icon-arrowthick-1-e { background-position: -32px -48px; }
.ui-icon-arrowthick-1-se { background-position: -48px -48px; }
.ui-icon-arrowthick-1-s { background-position: -64px -48px; }
.ui-icon-arrowthick-1-sw { background-position: -80px -48px; }
.ui-icon-arrowthick-1-w { background-position: -96px -48px; }
.ui-icon-arrowthick-1-nw { background-position: -112px -48px;

75. }
.ui-icon-arrowthick-2-n-s { background-position: -128px -48px;
}
.ui-icon-arrowthick-2-ne-sw { background-position: -144px -
48px; }
.ui-icon-arrowthick-2-e-w { background-position: -160px -48px;
}
.ui-icon-arrowthick-2-se-nw { background-position: -176px -
48px; }
.ui-icon-arrowthickstop-1-n { background-position: -192px -
48px; }
.ui-icon-arrowthickstop-1-e { background-position: -208px -
48px; }
.ui-icon-arrowthickstop-1-s { background-position: -224px -
48px; }
.ui-icon-arrowthickstop-1-w { background-position: -240px -
48px; }
.ui-icon-arrowreturnthick-1-w { background-position: 0 -64px;
}
.ui-icon-arrowreturnthick-1-n { background-position: -16px -
64px; }
.ui-icon-arrowreturnthick-1-e { background-position: -32px -
64px; }
.ui-icon-arrowreturnthick-1-s { background-position: -48px -
64px; }
.ui-icon-arrowreturn-1-w { background-position: -64px -64px; }
.ui-icon-arrowreturn-1-n { background-position: -80px -64px; }
.ui-icon-arrowreturn-1-e { background-position: -96px -64px; }
.ui-icon-arrowreturn-1-s { background-position: -112px -64px;
}
.ui-icon-arrowrefresh-1-w { background-position: -128px -64px;
}
.ui-icon-arrowrefresh-1-n { background-position: -144px -64px;
}
.ui-icon-arrowrefresh-1-e { background-position: -160px -64px;
}

76. .ui-icon-arrowrefresh-1-s { background-position: -176px -64px;
}
.ui-icon-arrow-4 { background-position: 0 -80px; }
.ui-icon-arrow-4-diag { background-position: -16px -80px; }
.ui-icon-extlink { background-position: -32px -80px; }
.ui-icon-newwin { background-position: -48px -80px; }
.ui-icon-refresh { background-position: -64px -80px; }
.ui-icon-shuffle { background-position: -80px -80px; }
.ui-icon-transfer-e-w { background-position: -96px -80px; }
.ui-icon-transferthick-e-w { background-position: -112px -80px;
}
.ui-icon-folder-collapsed { background-position: 0 -96px; }
.ui-icon-folder-open { background-position: -16px -96px; }
.ui-icon-document { background-position: -32px -96px; }
.ui-icon-document-b { background-position: -48px -96px; }
.ui-icon-note { background-position: -64px -96px; }
.ui-icon-mail-closed { background-position: -80px -96px; }
.ui-icon-mail-open { background-position: -96px -96px; }
.ui-icon-suitcase { background-position: -112px -96px; }
.ui-icon-comment { background-position: -128px -96px; }
.ui-icon-person { background-position: -144px -96px; }
.ui-icon-print { background-position: -160px -96px; }
.ui-icon-trash { background-position: -176px -96px; }
.ui-icon-locked { background-position: -192px -96px; }
.ui-icon-unlocked { background-position: -208px -96px; }
.ui-icon-bookmark { background-position: -224px -96px; }
.ui-icon-tag { background-position: -240px -96px; }
.ui-icon-home { background-position: 0 -112px; }
.ui-icon-flag { background-position: -16px -112px; }
.ui-icon-calendar { background-position: -32px -112px; }
.ui-icon-cart { background-position: -48px -112px; }
.ui-icon-pencil { background-position: -64px -112px; }
.ui-icon-clock { background-position: -80px -112px; }
.ui-icon-disk { background-position: -96px -112px; }
.ui-icon-calculator { background-position: -112px -112px; }
.ui-icon-zoomin { background-position: -128px -112px; }

77. .ui-icon-zoomout { background-position: -144px -112px; }
.ui-icon-search { background-position: -160px -112px; }
.ui-icon-wrench { background-position: -176px -112px; }
.ui-icon-gear { background-position: -192px -112px; }
.ui-icon-heart { background-position: -208px -112px; }
.ui-icon-star { background-position: -224px -112px; }
.ui-icon-link { background-position: -240px -112px; }
.ui-icon-cancel { background-position: 0 -128px; }
.ui-icon-plus { background-position: -16px -128px; }
.ui-icon-plusthick { background-position: -32px -128px; }
.ui-icon-minus { background-position: -48px -128px; }
.ui-icon-minusthick { background-position: -64px -128px; }
.ui-icon-close { background-position: -80px -128px; }
.ui-icon-closethick { background-position: -96px -128px; }
.ui-icon-key { background-position: -112px -128px; }
.ui-icon-lightbulb { background-position: -128px -128px; }
.ui-icon-scissors { background-position: -144px -128px; }
.ui-icon-clipboard { background-position: -160px -128px; }
.ui-icon-copy { background-position: -176px -128px; }
.ui-icon-contact { background-position: -192px -128px; }
.ui-icon-image { background-position: -208px -128px; }
.ui-icon-video { background-position: -224px -128px; }
.ui-icon-script { background-position: -240px -128px; }
.ui-icon-alert { background-position: 0 -144px; }
.ui-icon-info { background-position: -16px -144px; }
.ui-icon-notice { background-position: -32px -144px; }
.ui-icon-help { background-position: -48px -144px; }
.ui-icon-check { background-position: -64px -144px; }
.ui-icon-bullet { background-position: -80px -144px; }
.ui-icon-radio-on { background-position: -96px -144px; }
.ui-icon-radio-off { background-position: -112px -144px; }
.ui-icon-pin-w { background-position: -128px -144px; }
.ui-icon-pin-s { background-position: -144px -144px; }
.ui-icon-play { background-position: 0 -160px; }
.ui-icon-pause { background-position: -16px -160px; }
.ui-icon-seek-next { background-position: -32px -160px; }

78. .ui-icon-seek-prev { background-position: -48px -160px; }
.ui-icon-seek-end { background-position: -64px -160px; }
.ui-icon-seek-start { background-position: -80px -160px; }
/* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead
*/
.ui-icon-seek-first { background-position: -80px -160px; }
.ui-icon-stop { background-position: -96px -160px; }
.ui-icon-eject { background-position: -112px -160px; }
.ui-icon-volume-off { background-position: -128px -160px; }
.ui-icon-volume-on { background-position: -144px -160px; }
.ui-icon-power { background-position: 0 -176px; }
.ui-icon-signal-diag { background-position: -16px -176px; }
.ui-icon-signal { background-position: -32px -176px; }
.ui-icon-battery-0 { background-position: -48px -176px; }
.ui-icon-battery-1 { background-position: -64px -176px; }
.ui-icon-battery-2 { background-position: -80px -176px; }
.ui-icon-battery-3 { background-position: -96px -176px; }
.ui-icon-circle-plus { background-position: 0 -192px; }
.ui-icon-circle-minus { background-position: -16px -192px; }
.ui-icon-circle-close { background-position: -32px -192px; }
.ui-icon-circle-triangle-e { background-position: -48px -192px;
}
.ui-icon-circle-triangle-s { background-position: -64px -192px;
}
.ui-icon-circle-triangle-w { background-position: -80px -192px;
}
.ui-icon-circle-triangle-n { background-position: -96px -192px;
}
.ui-icon-circle-arrow-e { background-position: -112px -192px; }
.ui-icon-circle-arrow-s { background-position: -128px -192px; }
.ui-icon-circle-arrow-w { background-position: -144px -192px;
}
.ui-icon-circle-arrow-n { background-position: -160px -192px; }
.ui-icon-circle-zoomin { background-position: -176px -192px; }
.ui-icon-circle-zoomout { background-position: -192px -192px;
}

79. .ui-icon-circle-check { background-position: -208px -192px; }
.ui-icon-circlesmall-plus { background-position: 0 -208px; }
.ui-icon-circlesmall-minus { background-position: -16px -
208px; }
.ui-icon-circlesmall-close { background-position: -32px -208px;
}
.ui-icon-squaresmall-plus { background-position: -48px -208px;
}
.ui-icon-squaresmall-minus { background-position: -64px -
208px; }
.ui-icon-squaresmall-close { background-position: -80px -
208px; }
.ui-icon-grip-dotted-vertical { background-position: 0 -224px; }
.ui-icon-grip-dotted-horizontal { background-position: -16px -
224px; }
.ui-icon-grip-solid-vertical { background-position: -32px -
224px; }
.ui-icon-grip-solid-horizontal { background-position: -48px -
224px; }
.ui-icon-gripsmall-diagonal-se { background-position: -64px -
224px; }
.ui-icon-grip-diagonal-se { background-position: -80px -224px;
}
/* Misc visuals
----------------------------------*/
/* Corner radius */
.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl {
border-top-left-radius: 3px;
}
.ui-corner-all,

80. .ui-corner-top,
.ui-corner-right,
.ui-corner-tr {
border-top-right-radius: 3px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-left,
.ui-corner-bl {
border-bottom-left-radius: 3px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br {
border-bottom-right-radius: 3px;
}
/* Overlays */
.ui-widget-overlay {
background: #aaaaaa;
opacity: .003;
filter: Alpha(Opacity=.3); /* support: IE8 */
}
.ui-widget-shadow {
-webkit-box-shadow: 0px 0px 5px #666666;
box-shadow: 0px 0px 5px #666666;
}
Chapter 6 Template/Week 6/css/normalize.css
/*! normalize.css v2.1.1 | MIT License | git.io/normalize */
/*
===============================================
===========================

81. HTML5 display definitions
===============================================
=========================== */
/**
* Correct `block` display not defined in IE 8/9.
*/
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
display: block;
}
/**
* Correct `inline-block` display not defined in IE 8/9.
*/
audio,
canvas,
video {
display: inline-block;
}
/**
* Prevent modern browsers from displaying `audio` without

82. controls.
* Remove excess height in iOS 5 devices.
*/
audio:not([controls]) {
display: none;
height: 0;
}
/**
* Address styling not present in IE 8/9.
*/
[hidden] {
display: none;
}
/*
===============================================
===========================
Base
===============================================
=========================== */
/**
* 1. Prevent system color scheme's background color being
used in Firefox, IE,
* and Opera.
* 2. Prevent system color scheme's text color being used in
Firefox, IE, and
* Opera.
* 3. Set default font family to sans-serif.
* 4. Prevent iOS text size adjust after orientation change,
without disabling
* user zoom.

83. */
html {
/*background: #fff; */
color: #000; /* 2 */
font-family: sans-serif; /* 3 */
-ms-text-size-adjust: 100%; /* 4 */
-webkit-text-size-adjust: 100%; /* 4 */
}
/**
* Remove default margin.
*/
body {
margin: 0;
}
/*
===============================================
===========================
Links
===============================================
=========================== */
/**
* Address `outline` inconsistency between Chrome and other
browsers.
*/
a:focus {
outline: thin dotted;
}
/**

84. * Improve readability when focused and also mouse hovered in
all browsers.
*/
a:active,
a:hover {
outline: 0;
}
/*
===============================================
===========================
Typography
===============================================
=========================== */
/**
* Address variable `h1` font-size and margin within `section`
and `article`
* contexts in Firefox 4+, Safari 5, and Chrome.
*/
h1 {
font-size: 2em;
margin: 0.67em 0;
}
/**
* Address styling not present in IE 8/9, Safari 5, and Chrome.
*/
abbr[title] {
border-bottom: 1px dotted;
}

85. /**
* Address style set to `bolder` in Firefox 4+, Safari 5, and
Chrome.
*/
b,
strong {
font-weight: bold;
}
/**
* Address styling not present in Safari 5 and Chrome.
*/
dfn {
font-style: italic;
}
/**
* Address differences between Firefox and other browsers.
*/
hr {
-moz-box-sizing: content-box;
box-sizing: content-box;
height: 0;
}
/**
* Address styling not present in IE 8/9.
*/
mark {
background: #ff0;
color: #000;
}

86. /**
* Correct font family set oddly in Safari 5 and Chrome.
*/
code,
kbd,
pre,
samp {
font-family: monospace, serif;
font-size: 1em;
}
/**
* Improve readability of pre-formatted text in all browsers.
*/
pre {
white-space: pre-wrap;
}
/**
* Set consistent quote types.
*/
q {
quotes: "201C" "201D" "2018" "2019";
}
/**
* Address inconsistent and variable font size in all browsers.
*/
small {
font-size: 80%;
}

87. /**
* Prevent `sub` and `sup` affecting `line-height` in all
browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}
/*
===============================================
===========================
Embedded content
===============================================
=========================== */
/**
* Remove border when inside `a` element in IE 8/9.
*/
img {
border: 0;

88. }
/**
* Correct overflow displayed oddly in IE 9.
*/
svg:not(:root) {
overflow: hidden;
}
/*
===============================================
===========================
Figures
===============================================
=========================== */
/**
* Address margin not present in IE 8/9 and Safari 5.
*/
figure {
margin: 0;
}
/*
===============================================
===========================
Forms
===============================================
=========================== */
/**
* Define consistent border, margin, and padding.

89. */
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
}
/**
* 1. Correct `color` not being inherited in IE 8/9.
* 2. Remove padding so people aren't caught out if they zero
out fieldsets.
*/
legend {
border: 0; /* 1 */
padding: 0; /* 2 */
}
/**
* 1. Correct font family not being inherited in all browsers.
* 2. Correct font size not being inherited in all browsers.
* 3. Address margins set differently in Firefox 4+, Safari 5,
and Chrome.
*/
button,
input,
select,
textarea {
font-family: inherit; /* 1 */
font-size: 100%; /* 2 */
margin: 0; /* 3 */
}
/**

90. * Address Firefox 4+ setting `line-height` on `input` using
`!important` in
* the UA stylesheet.
*/
button,
input {
line-height: normal;
}
/**
* Address inconsistent `text-transform` inheritance for `button`
and `select`.
* All other form control elements do not inherit `text-
transform` values.
* Correct `button` style inheritance in Chrome, Safari 5+, and
IE 8+.
* Correct `select` style inheritance in Firefox 4+ and Opera.
*/
button,
select {
text-transform: none;
}
/**
* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys
native `audio`
* and `video` controls.
* 2. Correct inability to style clickable `input` types in iOS.
* 3. Improve usability and consistency of cursor style between
image-type
* `input` and others.
*/
button,

91. html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button; /* 2 */
cursor: pointer; /* 3 */
}
/**
* Re-set default cursor for disabled elements.
*/
button[disabled],
html input[disabled] {
cursor: default;
}
/**
* 1. Address box sizing set to `content-box` in IE 8/9.
* 2. Remove excess padding in IE 8/9.
*/
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}
/**
* 1. Address `appearance` set to `searchfield` in Safari 5 and
Chrome.
* 2. Address `box-sizing` set to `border-box` in Safari 5 and
Chrome
* (include `-moz` to future-proof).
*/
input[type="search"] {

92. -webkit-appearance: textfield; /* 1 */
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box; /* 2 */
box-sizing: content-box;
}
/**
* Remove inner padding and search cancel button in Safari 5
and Chrome
* on OS X.
*/
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* Remove inner padding and border in Firefox 4+.
*/
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
/**
* 1. Remove default vertical scrollbar in IE 8/9.
* 2. Improve readability and alignment in all browsers.
*/
textarea {
overflow: auto; /* 1 */
vertical-align: top; /* 2 */
}

93. /*
===============================================
===========================
Tables
===============================================
=========================== */
/**
* Remove most spacing between table cells.
*/
table {
border-collapse: collapse;
border-spacing: 0;
}
Chapter 6 Template/Week 6/css/slicknav.css
/*
Mobile Menu Core Style
*/
.slicknav_btn {
position: relative;
display: block;
vertical-align: middle;

94. float: right;
padding: 0.438em 0.625em 0.438em 0.625em;
line-height: 1.125em;
cursor: pointer;
}
.slicknav_menu .slicknav_menutxt {
display: block;
line-height: 1.188em;
float: left;
}
.slicknav_menu .slicknav_icon {
float: left;
margin: 0.188em 0 0 0.438em;
}
.slicknav_menu .slicknav_no-text {
margin: 0
}
.slicknav_menu .slicknav_icon-bar {

95. display: block;
width: 1.125em;
height: 0.125em;
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: 1px;
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
}
.slicknav_btn .slicknav_icon-bar + .slicknav_icon-bar {
margin-top: 0.188em
}
.slicknav_nav {
clear: both
}
.slicknav_nav ul, .slicknav_nav li {
display: block

96. }
.slicknav_nav .slicknav_arrow {
font-size: 0.8em;
margin: 0 0 0 0.4em;
}
.slicknav_nav .slicknav_item {
display: block;
cursor: pointer;
}
.slicknav_nav a {
display: block
}
.slicknav_nav .slicknav_item a {
display: inline
}
.slicknav_menu:before, .slicknav_menu:after {
content: " ";
display: table;

97. }
.slicknav_menu:after {
clear: both
}
/* IE6/7 support */
.slicknav_menu {
*zoom: 1
}
/*
User Default Style
Change the following styles to modify the appearance of the
menu.
*/
.slicknav_menu {
font-size: 16px;
}
/* Button */
.slicknav_btn {

98. margin: 5px 5px 6px;
text-decoration: none;
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
background-color: #222222;
}
/* Button Text */
.slicknav_menu .slicknav_menutxt {
color: #FFF;
font-weight: bold;
text-shadow: 0 1px 3px #000;
}
/* Button Lines */
.slicknav_menu .slicknav_icon-bar {
background-color: #f5f5f5;
}

99. .slicknav_menu {
background: #4c4c4c;
padding: 5px;
}
.slicknav_nav {
color: #fff;
margin: 0;
padding: 0;
font-size: 0.875em;
}
.slicknav_nav, .slicknav_nav ul {
list-style: none;
overflow: hidden;
}
.slicknav_nav ul {
padding: 0;
margin: 0 0 0 20px;
}

100. .slicknav_nav .slicknav_item {
padding: 5px 10px;
margin: 2px 5px;
}
.slicknav_nav a {
padding: 5px 10px;
margin: 2px 5px;
text-decoration: none;
color: #fff;
}
.slicknav_nav .slicknav_item a {
padding: 0;
margin: 0;
}
.slicknav_nav .slicknav_item:hover {
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;

101. background: #ccc;
color: #fff;
}
.slicknav_nav a:hover {
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
background: #ccc;
color: #222;
}
.slicknav_nav .slicknav_txtnode {
margin-left: 15px;
}
Chapter 6 Template/Week 6/css/spectrum.css
/***
Spectrum Colorpicker v1.8.0
https://github.com/bgrins/spectrum
Author: Brian Grinstead
License: MIT
***/

102. .sp-container {
position:absolute;
top:0;
left:0;
display:inline-block;
*display: inline;
*zoom: 1;
/* https://github.com/bgrins/spectrum/issues/40 */
z-index: 9999994;
overflow: hidden;
}
.sp-container.sp-flat {
position: relative;
}
/* Fix for * { box-sizing: border-box; } */
.sp-container,
.sp-container * {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
/* http://ansciath.tumblr.com/post/7347495869/css-aspect-ratio
*/
.sp-top {
position:relative;
width: 100%;
display:inline-block;
}
.sp-top-inner {
position:absolute;
top:0;
left:0;
bottom:0;

103. right:0;
}
.sp-color {
position: absolute;
top:0;
left:0;
bottom:0;
right:20%;
}
.sp-hue {
position: absolute;
top:0;
right:0;
bottom:0;
left:84%;
height: 100%;
}
.sp-clear-enabled .sp-hue {
top:33px;
height: 77.5%;
}
.sp-fill {
padding-top: 80%;
}
.sp-sat, .sp-val {
position: absolute;
top:0;
left:0;
right:0;
bottom:0;
}
.sp-alpha-enabled .sp-top {
margin-bottom: 18px;

104. }
.sp-alpha-enabled .sp-alpha {
display: block;
}
.sp-alpha-handle {
position:absolute;
top:-4px;
bottom: -4px;
width: 6px;
left: 50%;
cursor: pointer;
border: 1px solid black;
background: white;
opacity: .8;
}
.sp-alpha {
display: none;
position: absolute;
bottom: -14px;
right: 0;
left: 0;
height: 8px;
}
.sp-alpha-inner {
border: solid 1px #333;
}
.sp-clear {
display: none;
}
.sp-clear.sp-clear-display {
background-position: center;
}
.sp-clear-enabled .sp-clear {

105. display: block;
position:absolute;
top:0px;
right:0;
bottom:0;
left:84%;
height: 28px;
}
/* Don't allow text selection */
.sp-container, .sp-replacer, .sp-preview, .sp-dragger, .sp-slider,
.sp-alpha, .sp-clear, .sp-alpha-handle, .sp-container.sp-dragging
.sp-input, .sp-container button {
-webkit-user-select:none;
-moz-user-select: -moz-none;
-o-user-select:none;
user-select: none;
}
.sp-container.sp-input-disabled .sp-input-container {
display: none;
}
.sp-container.sp-buttons-disabled .sp-button-container {
display: none;
}
.sp-container.sp-palette-buttons-disabled .sp-palette-button-
container {
display: none;
}
.sp-palette-only .sp-picker-container {
display: none;
}
.sp-palette-disabled .sp-palette-container {
display: none;
}

106. .sp-initial-disabled .sp-initial {
display: none;
}
/* Gradients for hue, saturation and value instead of images.
Not pretty... but it works */
.sp-sat {
background-image: -webkit-gradient(linear, 0 0, 100% 0,
from(#FFF), to(rgba(204, 154, 129, 0)));
background-image: -webkit-linear-gradient(left, #FFF,
rgba(204, 154, 129, 0));
background-image: -moz-linear-gradient(left, #fff, rgba(204,
154, 129, 0));
background-image: -o-linear-gradient(left, #fff, rgba(204,
154, 129, 0));
background-image: -ms-linear-gradient(left, #fff, rgba(204,
154, 129, 0));
background-image: linear-gradient(to right, #fff, rgba(204,
154, 129, 0));
-ms-filter:
"progid:DXImageTransform.Microsoft.gradient(GradientType =
1, startColorstr=#FFFFFFFF, endColorstr=#00CC9A81)";
filter :
progid:DXImageTransform.Microsoft.gradient(GradientType =
1, startColorstr='#FFFFFFFF', endColorstr='#00CC9A81');
}
.sp-val {
background-image: -webkit-gradient(linear, 0 100%, 0 0,
from(#000000), to(rgba(204, 154, 129, 0)));
background-image: -webkit-linear-gradient(bottom, #000000,
rgba(204, 154, 129, 0));
background-image: -moz-linear-gradient(bottom, #000,
rgba(204, 154, 129, 0));
background-image: -o-linear-gradient(bottom, #000,
rgba(204, 154, 129, 0));

107. background-image: -ms-linear-gradient(bottom, #000,
rgba(204, 154, 129, 0));
background-image: linear-gradient(to top, #000, rgba(204,
154, 129, 0));
-ms-filter:
"progid:DXImageTransform.Microsoft.gradient(startColorstr=#0
0CC9A81, endColorstr=#FF000000)";
filter :
progid:DXImageTransform.Microsoft.gradient(startColorstr='#0
0CC9A81', endColorstr='#FF000000');
}
.sp-hue {
background: -moz-linear-gradient(top, #ff0000 0%, #ffff00
17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%,
#ff0000 100%);
background: -ms-linear-gradient(top, #ff0000 0%, #ffff00
17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%,
#ff0000 100%);
background: -o-linear-gradient(top, #ff0000 0%, #ffff00
17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%,
#ff0000 100%);
background: -webkit-gradient(linear, left top, left bottom,
from(#ff0000), color-stop(0.17, #ffff00), color-stop(0.33,
#00ff00), color-stop(0.5, #00ffff), color-stop(0.67, #0000ff),
color-stop(0.83, #ff00ff), to(#ff0000));
background: -webkit-linear-gradient(top, #ff0000 0%, #ffff00
17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%,
#ff0000 100%);
background: linear-gradient(to bottom, #ff0000 0%, #ffff00
17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%,
#ff0000 100%);
}
/* IE filters do not support multiple color stops.
Generate 6 divs, line them up, and do two color gradients for

108. each.
Yes, really.
*/
.sp-1 {
height:17%;
filter:
progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff
0000', endColorstr='#ffff00');
}
.sp-2 {
height:16%;
filter:
progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff
ff00', endColorstr='#00ff00');
}
.sp-3 {
height:17%;
filter:
progid:DXImageTransform.Microsoft.gradient(startColorstr='#0
0ff00', endColorstr='#00ffff');
}
.sp-4 {
height:17%;
filter:
progid:DXImageTransform.Microsoft.gradient(startColorstr='#0
0ffff', endColorstr='#0000ff');
}
.sp-5 {
height:16%;
filter:
progid:DXImageTransform.Microsoft.gradient(startColorstr='#0
000ff', endColorstr='#ff00ff');
}
.sp-6 {
height:17%;
filter:

109. progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff
00ff', endColorstr='#ff0000');
}
.sp-hidden {
display: none !important;
}
/* Clearfix hack */
.sp-cf:before, .sp-cf:after { content: ""; display: table; }
.sp-cf:after { clear: both; }
.sp-cf { *zoom: 1; }
/* Mobile devices, make hue slider bigger so it is easier to slide
*/
@media (max-device-width: 480px) {
.sp-color { right: 40%; }
.sp-hue { left: 63%; }
.sp-fill { padding-top: 60%; }
}
.sp-dragger {
border-radius: 5px;
height: 5px;
width: 5px;
border: 1px solid #fff;
background: #000;
cursor: pointer;
position:absolute;
top:0;
left: 0;
}
.sp-slider {
position: absolute;
top:0;
cursor:pointer;
height: 3px;

110. left: -1px;
right: -1px;
border: 1px solid #000;
background: white;
opacity: .8;
}
/*
Theme authors:
Here are the basic themeable display options (colors, fonts,
global widths).
See http://bgrins.github.io/spectrum/themes/ for instructions.
*/
.sp-container {
border-radius: 0;
background-color: #ECECEC;
border: solid 1px #f0c49B;
padding: 0;
}
.sp-container, .sp-container button, .sp-container input, .sp-
color, .sp-hue, .sp-clear {
font: normal 12px "Lucida Grande", "Lucida Sans Unicode",
"Lucida Sans", Geneva, Verdana, sans-serif;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
.sp-top {
margin-bottom: 3px;
}
.sp-color, .sp-hue, .sp-clear {
border: solid 1px #666;
}

111. /* Input */
.sp-input-container {
float:right;
width: 100px;
margin-bottom: 4px;
}
.sp-initial-disabled .sp-input-container {
width: 100%;
}
.sp-input {
font-size: 12px !important;
border: 1px inset;
padding: 4px 5px;
margin: 0;
width: 100%;
background:transparent;
border-radius: 3px;
color: #222;
}
.sp-input:focus {
border: 1px solid orange;
}
.sp-input.sp-validation-error {
border: 1px solid red;
background: #fdd;
}
.sp-picker-container , .sp-palette-container {
float:left;
position: relative;
padding: 10px;
padding-bottom: 300px;
margin-bottom: -290px;
}
.sp-picker-container {
width: 172px;
border-left: solid 1px #fff;

112. }
/* Palettes */
.sp-palette-container {
border-right: solid 1px #ccc;
}
.sp-palette-only .sp-palette-container {
border: 0;
}
.sp-palette .sp-thumb-el {
display: block;
position:relative;
float:left;
width: 24px;
height: 15px;
margin: 3px;
cursor: pointer;
border:solid 2px transparent;
}
.sp-palette .sp-thumb-el:hover, .sp-palette .sp-thumb-el.sp-
thumb-active {
border-color: orange;
}
.sp-thumb-el {
position:relative;
}
/* Initial */
.sp-initial {
float: left;
border: solid 1px #333;
}
.sp-initial span {
width: 30px;

113. height: 25px;
border:none;
display:block;
float:left;
margin:0;
}
.sp-initial .sp-clear-display {
background-position: center;
}
/* Buttons */
.sp-palette-button-container,
.sp-button-container {
float: right;
}
/* Replacer (the little preview div that shows up instead of the
<input>) */
.sp-replacer {
margin:0;
overflow:hidden;
cursor:pointer;
padding: 4px;
display:inline-block;
*zoom: 1;
*display: inline;
border: solid 1px #91765d;
background: #eee;
color: #333;
vertical-align: middle;
}
.sp-replacer:hover, .sp-replacer.sp-active {
border-color: #F0C49B;
color: #111;
}

114. .sp-replacer.sp-disabled {
cursor:default;
border-color: silver;
color: silver;
}
.sp-dd {
padding: 2px 0;
height: 16px;
line-height: 16px;
float:left;
font-size:10px;
}
.sp-preview {
position:relative;
width:25px;
height: 20px;
border: solid 1px #222;
margin-right: 5px;
float:left;
z-index: 0;
}
.sp-palette {
*width: 220px;
max-width: 220px;
}
.sp-palette .sp-thumb-el {
width:16px;
height: 16px;
margin:2px 1px;
border: solid 1px #d0d0d0;
}
.sp-container {
padding-bottom:0;
}

115. /* Buttons: http://hellohappy.org/css3-buttons/ */
.sp-container button {
background-color: #eeeeee;
background-image: -webkit-linear-gradient(top, #eeeeee,
#cccccc);
background-image: -moz-linear-gradient(top, #eeeeee,
#cccccc);
background-image: -ms-linear-gradient(top, #eeeeee, #cccccc);
background-image: -o-linear-gradient(top, #eeeeee, #cccccc);
background-image: linear-gradient(to bottom, #eeeeee,
#cccccc);
border: 1px solid #ccc;
border-bottom: 1px solid #bbb;
border-radius: 3px;
color: #333;
font-size: 14px;
line-height: 1;
padding: 5px 4px;
text-align: center;
text-shadow: 0 1px 0 #eee;
vertical-align: middle;
}
.sp-container button:hover {
background-color: #dddddd;
background-image: -webkit-linear-gradient(top, #dddddd,
#bbbbbb);
background-image: -moz-linear-gradient(top, #dddddd,
#bbbbbb);
background-image: -ms-linear-gradient(top, #dddddd,
#bbbbbb);
background-image: -o-linear-gradient(top, #dddddd,
#bbbbbb);
background-image: linear-gradient(to bottom, #dddddd,
#bbbbbb);

116. border: 1px solid #bbb;
border-bottom: 1px solid #999;
cursor: pointer;
text-shadow: 0 1px 0 #ddd;
}
.sp-container button:active {
border: 1px solid #aaa;
border-bottom: 1px solid #888;
-webkit-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0
#eeeeee;
-moz-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0
#eeeeee;
-ms-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0
#eeeeee;
-o-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0
#eeeeee;
box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
}
.sp-cancel {
font-size: 11px;
color: #d93f3f !important;
margin:0;
padding:2px;
margin-right: 5px;
vertical-align: middle;
text-decoration:none;
}
.sp-cancel:hover {
color: #d93f3f !important;
text-decoration: underline;
}
.sp-palette span:hover, .sp-palette span.sp-thumb-active {
border-color: #000;

117. }
.sp-preview, .sp-alpha, .sp-thumb-el {
position:relative;
background-image:
url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA
AAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+
YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg
==);
}
.sp-preview-inner, .sp-alpha-inner, .sp-thumb-inner {
display:block;
position:absolute;
top:0;left:0;bottom:0;right:0;
}
.sp-palette .sp-thumb-inner {
background-position: 50% 50%;
background-repeat: no-repeat;
}
.sp-palette .sp-thumb-light.sp-thumb-active .sp-thumb-inner {
background-image:
url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA
ABIAAAASCAYAAABWzo5XAAAAGXRFWHRTb2Z0d2FyZQ
BBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIVJREFUeNpiYBhsg
JFMffxAXABlN5JruT4Q3wfi/0DsT64h8UD8HmpIPCWG/KemIf
OJCUB+Aoacx6EGBZyHBqI+WsDCwuQ9mhxeg2A210Ntfo8kl
k9sOMijaURm7yc1UP2RNCMbKE9ODK1HM6iegYLkfx8pligC
9lCD7KmRof0ZhjQACDAAceovrtpVBRkAAAAASUVORK5CY
II=);
}
.sp-palette .sp-thumb-dark.sp-thumb-active .sp-thumb-inner {
background-image:
url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA

118. ABIAAAASCAYAAABWzo5XAAAAAXNSR0IArs4c6QAAAA
RnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvq
GQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41Lj
EwMPRyoQAAAMdJREFUOE+tkgsNwzAMRMugEAahEAahE
AZhEAqlEAZhEAohEAYh81X2dIm8fKpEspLGvudPOsUYpxE2
BIJCroJmEW9qJ+MKaBFhEMNabSy9oIcIPwrB+afvAUFoK4H0
tMaQ3XtlrggDhOVVMuT4E5MMG0FBbCEYzjYT7OxLEvIHQ
LY2zWwQ3D+9luyOQTfKDiFD3iUIfPk8VqrKjgAiSfGFPecrg6
HN6m/iBcwiDAo7WiBeawa+Kwh7tZoSCGLMqwlSAzVDhoK+
6vH4G0P5wdkAAAAASUVORK5CYII=);
}
.sp-clear-display {
background-repeat:no-repeat;
background-position: center;
background-image:
url(data:image/gif;base64,R0lGODlhFAAUAPcAAAAAAJmZm
Z2dnZ6enqKioqOjo6SkpKWlpaampqenp6ioqKmpqaqqqqurq/Hx
8fLy8vT09PX19ff39/j4+Pn5+fr6+vv7+wAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA

119. AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAACH5BAEAAP8ALAAAAAAUABQAAAihAP9FoPCvo
MGDBy08+EdhQAIJCCMybCDAAYUEARBAlFiQQoMABQhK
UJBxY0SPICEYHBnggEmDKAuoPMjS5cGYMxHW3IiT478JJA
8M/CjTZ0GgLRekNGpwAsYABHIypcAgQMsITDtWJYBR6NSq
Mico9cqR6tKfY7GeBCuVwlipDNmefAtTrkSzB1RaIAoXodsAB
iZAEFB06gIBWC1mLVgBa0AAOw==);
}
Chapter 6 Template/Week 6/images/background.jpg
Chapter 6 Template/Week 6/images/background2.jpg
Chapter 6 Template/Week 6/images/favicon_week2-1.ico
Chapter 6 Template/Week 6/images/FinishedImage.JPG
Chapter 6 Template/Week 6/images/image-lg.jpg
Chapter 6 Template/Week 6/images/image-sm.jpg
Chapter 6 Template/Week 6/images/img_avatar2.png
Chapter 6 Template/Week 6/images/jpegat20012quality.jpg
Chapter 6 Template/Week 6/images/Planets2013.svg.png
Chapter 6 Template/Week 6/images/rsImage.jpg

120. Chapter 6 Template/Week 6/images/rsImage02.jpg
Chapter 6 Template/Week 6/images/rummage_sale_week2-1.png
Chapter 6 Template/Week 6/images/submit3.jpg
Chapter 6 Template/Week 6/images/submit3_web.gif
Chapter 6 Template/Week 6/images/Thumbs.db
Chapter 6 Template/Week 6/js/jquery.collapser.min.js
/* jQuery - Collapser - Plugin v2.0 www.aakashweb.com (c)
2014 Aakash Chakravarthy MIT License. */
(function(e,m,p,q){function
l(b,f){this.o=e.extend({},n,f);this.e=e(b);this.init()}var
n={target:"next",mode:"words",speed:"slow",truncate:10,ellipsi
s:"...",effect:"fade",controlBtn:"",showText:"Show
more",hideText:"Hide text",showClass:"show-
class",hideClass:"hide-
class",atStart:"hide",lockHide:!1,dynamic:!1,changeText:!1,bef
oreShow:null,afterShow:null,beforeHide:null,afterHide:null};l.p
rototype={init:function(){var
b=this;b.mode=b.o.mode;b.remaining={};b.ctrlHtml=' <a
href="#" data-ctrl class="'+
(e.isFunction(b.o.controlBtn)?"":b.o.controlBtn)+'"></a>';e(b.e)
.each(function(){e(this).data("oCnt",b.e.html());var
a=e.isFunction(b.o.atStart)?b.o.atStart.call(b.e):b.o.atStart,a="u
ndefined"!==typeof b.e.attr("data-start")?b.e.attr("data-
start"):a;"hide"==a?b.hide(b.e,0):b.show(b.e,0)});var
f;e(m).on("resize",function(){b.o.dynamic&&"lines"==b.mode&
&(clearTimeout(f),f=setTimeout(function(){b.reInit(b.e)},100))
})},show:function(b,f){var a=this,c=e(b);"undefined"===typeof
f&&(f=a.o.speed);var
g=function(){e.isFunction(a.o.afterShow)&&
a.o.afterShow.call(a.e,a)};e.isFunction(a.o.beforeShow)&&a.o.b
eforeShow.call(a.e,a);switch(a.mode){case "chars":case

121. "words":var d=c.height();c.html(c.data("tHTML"));var
h=c.height();c.height(d);c.animate({height:h},f,function(){c.hei
ght("auto");g()}).removeClass(a.o.hideClass).addClass(a.o.show
Class);c.data("tHTML",c.html());break;case
"lines":0==c.children("div").length&&c.wrapInner("<div>");var
k=c.children("div"),d=k.height(),h=k.html(c.data("oCnt")).css("
height","").height();k.css("height",d);
k.animate({height:h},f,function(){k.height("auto");g()});c.remo
veClass(a.o.hideClass).addClass(a.o.showClass);break;case
"block":a.blockMode(c,"show",f,g)}a.status=1;if(!0==a.o.lockH
ide)return c.find("[data-
ctrl]").remove(),"";if("block"==a.mode)c.off("click.coll").on("c
lick.coll",function(b){b.preventDefault();a.hide(c)});else
0!=c.find("[data-
ctrl]").length||e.isFunction(a.o.controlBtn)||c.append(a.ctrlHtml)
,a.ctrlBtn=e.isFunction(a.o.controlBtn)?a.o.controlBtn.call(a.e):
e(c.find("[data-ctrl]")),
a.ctrlBtn.off("click.coll").on("click.coll",function(b){b.prevent
Default();a.hide(c)}).html(a.o.hideText)},hide:function(b,f){var
a=this,c=e(b);"undefined"===typeof f&&(f=a.o.speed);var
g=function(){e.isFunction(a.o.afterHide)&&a.o.afterHide.call(a.
e,a)};e.isFunction(a.o.beforeHide)&&a.o.beforeHide.call(a.e,a);
c.find("[data-ctrl]").remove();switch(a.mode){case "chars":var
d=e.trim(c.text());a.remaining.chars=d.length-
a.o.truncate;d.length>a.o.truncate&&(c.data("tHTML",c.html())
,d=a.pad(d.slice(0,
a.o.truncate),d.slice(a.o.truncate,d.length)),c.html(d).removeCla
ss(a.o.showClass).addClass(a.o.hideClass),g());break;case
"words":d=e.trim(c.text());d=d.split("
");a.remaining.words=d.length-
a.o.truncate;d.length>a.o.truncate&&(c.data("tHTML",c.html())
,d=a.pad(d.slice(0,a.o.truncate).join("
"),d.slice(a.o.truncate,d.length).join("
")),c.html(d).removeClass(a.o.showClass).addClass(a.o.hideCla
ss),g());break;case
"lines":0==c.children("div").length&&c.wrapInner("<div>");d=

122. c.children("div").css("height",
"");d.html(d.text());var h=d.height();"undefined"===typeof
c.data("lHeight")?(temp=d.clone(),lHeight=temp.text("a").insert
After(d).height(),c.data("lHeight",lHeight),d.next().remove()):l
Height=c.data("lHeight");lines=h/lHeight;a.remaining.lines=line
s-
a.o.truncate;0<a.remaining.lines&&(d.css("overflow","hidden"),
d.animate({height:lHeight*a.o.truncate},f).data("tHeight",h),c.r
emoveClass(a.o.showClass).addClass(a.o.hideClass),0!=c.find("
[data-
ctrl]").length||e.isFunction(a.o.controlBtn)||c.append(a.ctrlHtml)
,
g());break;case
"block":a.blockMode(c,"hide",f,g)}a.status=0;"block"==a.mode
?c.unbind("click.coll").bind("click.coll",function(b){b.preventD
efault();a.show(c)}):(a.ctrlBtn=e.isFunction(a.o.controlBtn)?a.o
.controlBtn.call(a.e):e(c.find("[data-
ctrl]")),a.ctrlBtn.off("click.coll").on("click.coll",function(b){b.
preventDefault();a.show(c)}).html(a.o.showText),g=a.o.showTe
xt,d={chars:["character","characters"],words:["word","words"],l
ines:["lines","lines"]},g=g.replace("%s",a.remaining[a.mode]+(
1==a.remaining[a.mode]?
" "+d[a.mode][0]:"
"+d[a.mode][1])),a.ctrlBtn.html(g))},pad:function(b,f){return
b+'<span class="coll-
ellipsis">'+this.o.ellipsis+"</span>"+(e.isFunction(this.o.ctrlBt
n)?"":this.ctrlHtml)+'<span class="coll-hidden"
style="display:none">'+f+"</span>"},blockMode:function(b,f,a,
c){var
g=["fadeOut","slideUp","fadeIn","slideDown"],d="fade"==this.
o.effect?0:1,g="hide"==f?g[d]:g[d+2];if(e.isFunction(this.o.targ
et))this.o.target.call(this.e)[g](a,c);else
if(e.fn[this.o.target])e(b)[this.o.target]()[g](a,
c);"show"==f?(b.removeClass(this.o.showClass).addClass(this.o
.hideClass),this.o.changeText&&b.text(this.o.hideText)):(b.rem
oveClass(this.o.hideClass).addClass(this.o.showClass),this.o.ch

123. angeText&&b.text(this.o.showText))},reInit:function(b){b.find(
"[data-
ctrl]").remove();b.html(this.e.data("oCnt"));0==this.status?this.
hide(b,0):this.show(b,0)}};e.fn.collapser=function(b){return
this.each(function(){e.data(this,"collapser")||e.data(this,"collaps
er",new l(this,b))})}})(jQuery,window,document);
Chapter 6 Template/Week 6/js/jquery.slicknav.min.js
/*!
SlickNav Responsive Mobile Menu
(c) 2013 Josh Cope
licensed under GPL and MIT
*/
(function(e,t,n){var
r={label:"MENU",duplicate:true,duration:200,easingOpen:"swin
g",easingClose:"swing",closedSymbol:"&#9658;",openedSymbo
l:"&#9660;",prependTo:"body",parentTag:"a",closeOnClick:fals
e,allowParentLinks:false},i="slicknav",s="slicknav";e.fn[i]=fun
ction(n){return this.each(function(){function h(e){var
t=e.data("menu");if(!t){t={};t.arrow=e.children("."+s+"_arrow"
);t.ul=e.next("ul");t.parent=e.parent();e.data("menu",t)}if(e.pare
nt().hasClass(s+"_collapsed")){t.arrow.html(o.openedSymbol);t.
parent.removeClass(s+"_collapsed");p(t.ul,true)}else{t.arrow.ht
ml(o.closedSymbol);t.parent.addClass(s+"_collapsed");p(t.ul,tru
e)}}function p(e,t){var n=v(e);var
r=0;if(t)r=o.duration;if(e.hasClass(s+"_hidden")){e.removeClas
s(s+"_hidden");e.slideDown(r,o.easingOpen);e.attr("aria-
hidden","false");n.attr("tabindex","0");d(e,false)}else{e.addClas
s(s+"_hidden");e.slideUp(r,o.easingClose,function(){e.attr("aria
-hidden","true");n.attr("tabindex","-
1");d(e,true);e.hide()})}}function d(t,n){var
r=t.children("li").children("ul").not("."+s+"_hidden");if(!n){r.ea
ch(function(){var t=e(this);t.attr("aria-hidden","false");var
r=v(t);r.attr("tabindex","0");d(t,n)})}else{r.each(function(){var
t=e(this);t.attr("aria-hidden","true");var
r=v(t);r.attr("tabindex","-1");d(t,n)})}}function v(e){var

124. t=e.data("menu");if(!t){t={};var n=e.children("li");var
r=n.children("a");t.links=r.add(n.children("."+s+"_item"));e.dat
a("menu",t)}return t.links}function m(t){if(!t){e("."+s+"_item,
."+s+"_btn").css("outline","none")}else{e("."+s+"_item,
."+s+"_btn").css("outline","")}}var i=e(this);var
o=e.extend({},r,n);if(o.duplicate){var
u=i.clone();u.removeAttr("id");u.find("*").each(function(t,n){e(
n).removeAttr("id")})}else var u=i;var
a=s+"_icon";if(o.label==""){a+=" "+s+"_no-
text"}if(o.parentTag=="a"){o.parentTag='a
href="#"'}u.attr("class",s+"_nav");var f=e('<div
class="'+s+'_menu"></div>');var l=e("<"+o.parentTag+' aria-
haspopup="true" tabindex="0" class="'+s+'_btn"><span
class="'+s+'_menutxt">'+o.label+'</span><span
class="'+a+'"><span class="'+s+'_icon-bar"></span><span
class="'+s+'_icon-bar"></span><span class="'+s+'_icon-
bar"></span></span></a>');e(f).append(l);e(o.prependTo).prepe
nd(f);f.append(u);var c=u.find("li");e(c).each(function(){var
t=e(this);data={};data.children=t.children("ul").attr("role","men
u");t.data("menu",data);if(data.children.length>0){var
n=t.contents();var
r=[];e(n).each(function(){if(!e(this).is("ul")){r.push(this)}else{r
eturn false}});var i=e(r).wrapAll("<"+o.parentTag+'
role="menuitem" aria-haspopup="true" tabindex="-1"
class="'+s+'_item"/>').parent();t.addClass(s+"_collapsed");t.add
Class(s+"_parent");e(r).last().after('<span
class="'+s+'_arrow">'+o.closedSymbol+"</span>")}else
if(t.children().length==0){t.addClass(s+"_txtnode")}t.children("
a").attr("role","menuitem").click(function(){if(o.closeOnClick)e
(l).click()})});e(c).each(function(){var
t=e(this).data("menu");p(t.children,false)});p(u,false);u.attr("rol
e","menu");e(t).mousedown(function(){m(false)});e(t).keyup(fu
nction(){m(true)});e(l).click(function(e){e.preventDefault();p(u
,true)});u.on("click","."+s+"_item",function(t){t.preventDefault
();h(e(this))});e(l).keydown(function(e){var
t=e||event;if(t.keyCode==13){e.preventDefault();p(u,true)}});u.

125. on("keydown","."+s+"_item",function(t){var
n=t||event;if(n.keyCode==13){t.preventDefault();h(e(t.target))}
});if(o.allowParentLinks){e("."+s+"_item
a").click(function(e){e.stopImmediatePropagation()})}})}})(jQ
uery,document,window)
Chapter 6 Template/Week 6/Week8-1.html
Image Puzzle
Drag the blocks to make the complete image in the grid as
shown below:
Check Puzzle
© 2018 Bill