.awwcanvas {
    font-size:62.5%;
    font-family:Arial, Helvetica, sans-serif;
    color:#666;
    text-align:center;
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    line-height: 1;
    color: black;
    overflow: hidden;
}

.awwcanvas div, .awwcanvas span, .awwcanvas applet, .awwcanvas object, .awwcanvas iframe, .awwcanvas h1, .awwcanvas h2, .awwcanvas h3, .awwcanvas h4, .awwcanvas h5, .awwcanvas h6, .awwcanvas p, .awwcanvas blockquote, .awwcanvas pre, .awwcanvas a, .awwcanvas abbr, .awwcanvas acronym, .awwcanvas address, .awwcanvas big, .awwcanvas cite, .awwcanvas code, .awwcanvas del, .awwcanvas dfn, .awwcanvas em, .awwcanvas font, .awwcanvas img, .awwcanvas ins, .awwcanvas kbd, .awwcanvas q, .awwcanvas s, .awwcanvas samp, .awwcanvas small, .awwcanvas strike, .awwcanvas strong, .awwcanvas sub, .awwcanvas sup, .awwcanvas tt, .awwcanvas var, .awwcanvas dl, .awwcanvas dt, .awwcanvas dd, .awwcanvas ol, .awwcanvas ul, .awwcanvas li, .awwcanvas fieldset, .awwcanvas form, .awwcanvas label, .awwcanvas legend,
.awwcanvas table, .awwcanvas caption, .awwcanvas tbody, .awwcanvas tfoot, .awwcanvas thead, .awwcanvas tr, .awwcanvas th, .awwcanvas td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;
}

.awwcanvas :focus {
    outline: 0;
}
.awwcanvas ol, ul {
    list-style: none;
}

.awwcanvas div.toolbar {
    position: absolute;
    left: 0;
    top: 0;
    background: #444 url(toolbar.png) repeat left top;
    z-index: 20;
}

.awwcanvas div.whiteboard {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: url(aww-logo.png) no-repeat bottom right;
    z-index: 10;
}

.aww-landscape div.toolbar {
    width: 70px;
    bottom: 0;
}
.aww-landscape div.whiteboard {
    left: 70px;
}
.aww-portrait div.toolbar {
    height: 80px;
    right: 0;
}
.aww-portrait div.whiteboard {
    top: 80px;
}

.aww-landscape.smallcanvas div.toolbar {
    width: 56px;
}
.aww-landscape.smallcanvas div.whiteboard {
    left: 56px;
}
.aww-portrait.smallcanvas div.toolbar {
    height: 60px;
    right: 0;
}
.aww-portrait.smallcanvas div.whiteboard {
    top: 60px;
}

.aww-notoolbar div.toolbar {
    display: none;
}

.aww-notoolbar div.whiteboard {
    left: 0;
    top: 0;
}

.awwcanvas canvas {
    cursor: crosshair;
}

.awwcanvas ul.navigation { padding:5px; }
.awwcanvas ul.navigation li {
    display:block;
    position:relative;
    float:left;
}

.awwcanvas ul.navigation li a, .awwcanvas ul.navigation li.selected ul li a  {
    display:block;
    width:60px;
    height:70px;
    background:url(transparent.png) no-repeat 0 0;
    text-decoration:none;
    font-size:14px;
    font-weight:bold;
    line-height:20px;
    font-family:Arial, Helvetica, sans-serif;
    color:#555;
    text-shadow:0 1px 0 #ddd;
}

.awwcanvas ul.navigation li a span {
    display:block;
    height:45px;
}
.awwcanvas ul.navigation li a:hover, .awwcanvas ul.navigation li.selected ul li a:hover  {
    background-position:-60px 0;
    color:#000;
    text-shadow:0 1px 0 #aaa;
}
.awwcanvas ul.navigation li.selected a, .awwcanvas ul.navigation li ul li.selected a {
    background-position:-120px 0;
    color:#fff;
    text-shadow:0 -1px 0 #000;
}

.awwcanvas ul.navigation li a, .awwcanvas ul.navigation li a {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.awwcanvas ul.navigation li ul {
    position:absolute;
}

.aww-landscape ul.navigation li ul {
    height:70px;
    top:0;
    left:60px;
    width:500px;
}
.aww-portrait ul.navigation li ul li { margin-left:0; }

.aww-portrait  ul.navigation li ul {
    height:500px;
    top:70px;
    left:0;
}

.aww-landscape ul.navigation li { margin-bottom:5px; }
.aww-portrait ul.navigation li { margin-left:5px; }
.aww-portrait ul.navigation li:first-child { margin-left:0; }


.awwcanvas ul.navigation li.showsubmenu ul { display:block; }
.awwcanvas ul.navigation li ul { display:none; }

/* */
.awwcanvas ul.navigation li a span { background:url(transparent.png) no-repeat 0 -100px; }

.awwcanvas ul.navigation li.pencil > a span            { background-position:0 -100px; }
.awwcanvas ul.navigation li.eraser a span            { background-position:-60px -100px; }
.awwcanvas ul.navigation li.new a span               { background-position:-120px -100px; }
.awwcanvas ul.navigation li.share a span             { background-position:-180px -100px; }
.awwcanvas ul.navigation li.save a span              { background-position:-240px -100px; }

.awwcanvas ul.navigation li.link a span              { background-position:-300px -100px; }
.awwcanvas ul.navigation li.email a span             { background-position:-360px -100px; }
.awwcanvas ul.navigation li.color > a span             { background-position:-420px -100px; }


.awwcanvas ul.navigation li.thin a span              { background-position:0 -150px; }
.awwcanvas ul.navigation li.medium a span            { background-position:-60px -150px; }
.awwcanvas ul.navigation li.thick a span             { background-position:-120px -150px; }

.awwcanvas ul.navigation li.red a span               { background-position:-180px -150px; }
.awwcanvas ul.navigation li.green a span             { background-position:-240px -150px; }
.awwcanvas ul.navigation li.blue a span              { background-position:-300px -150px; }
.awwcanvas ul.navigation li.yellow a span            { background-position:-360px -150px; }
.awwcanvas ul.navigation li.black a span             { background-position:-420px -150px; }
.awwcanvas ul.navigation li.brown a span             { background-position:0 -200px; }
.awwcanvas ul.navigation li.purple a span            { background-position:-60px -200px; }
.awwcanvas ul.navigation li.menu > a span              { background-position:0 -250px; }
.awwcanvas ul.navigation li.message a span           { background-position:-60px -250px; }
.awwcanvas ul.navigation li.text a span              { background-position:-120px -250px; }
.awwcanvas ul.navigation li.menu2 > a span             { background-position:-180px -250px; }

.awwcanvas.smallcanvas ul.navigation li a, .awwcanvas.smallcanvas ul.navigation li.selected ul li a  {
    width:46px;
    height:46px;
    background:url(transparent.png) no-repeat 0 0;
    font-size:12px;
    font-weight:bold;
    line-height:16px;
    text-indent:-9999px;
    font-size:0; /* no text, only icons */
}
.awwcanvas.smallcanvas ul.navigation li a:hover, .awwcanvas.smallcanvas ul.navigation li.selected ul li a:hover  { background-position:-60px 0; }
.awwcanvas.smallcanvas ul.navigation li.selected a, .awwcanvas.smallcanvas ul.navigation li ul li.selected a { background-position:-120px 0; }

.awwcanvas.smallcanvas ul.navigation li a span {
    height:46px;
}

.aww-landscape.smallcanvas ul.navigation li ul {
    left:46px;
    top:0;
    width: 350px;
}
.aww-portrait.smallcanvas ul.navigation li ul {
    top:46px;
    left:0;
    height: 350px;
}

.awwcanvas.smallcanvas ul.navigation li.pencil > a span            { background-position:-7px -103px; }
.awwcanvas.smallcanvas ul.navigation li.eraser a span            { background-position:-67px -103px; }
.awwcanvas.smallcanvas ul.navigation li.new a span               { background-position:-127px -103px; }
.awwcanvas.smallcanvas ul.navigation li.share a span             { background-position:-187px -103px; }
.awwcanvas.smallcanvas ul.navigation li.save a span              { background-position:-247px -103px; }

.awwcanvas.smallcanvas ul.navigation li.link a span              { background-position:-307px -103px; }
.awwcanvas.smallcanvas ul.navigation li.email a span             { background-position:-367px -103px; }
.awwcanvas.smallcanvas ul.navigation li.color > a span             { background-position:-427px -103px; }


.awwcanvas.smallcanvas ul.navigation li.thin a span              { background-position:-7px -153px; }
.awwcanvas.smallcanvas ul.navigation li.medium a span            { background-position:-67px -153px; }
.awwcanvas.smallcanvas ul.navigation li.thick a span             { background-position:-127px -153px; }

.awwcanvas.smallcanvas ul.navigation li.red a span               { background-position:-187px -153px; }
.awwcanvas.smallcanvas ul.navigation li.green a span             { background-position:-247px -153px; }
.awwcanvas.smallcanvas ul.navigation li.blue a span              { background-position:-307px -153px; }
.awwcanvas.smallcanvas ul.navigation li.yellow a span            { background-position:-367px -153px; }
.awwcanvas.smallcanvas ul.navigation li.black a span             { background-position:-427px -153px; }
.awwcanvas.smallcanvas ul.navigation li.brown a span             { background-position:-7px -203px; }
.awwcanvas.smallcanvas ul.navigation li.purple a span            { background-position:-67px -203px; }
.awwcanvas.smallcanvas ul.navigation li.menu > a span              { background-position:-7px -253px; }
.awwcanvas.smallcanvas ul.navigation li.message a span           { background-position:-67px -253px; }
.awwcanvas.smallcanvas ul.navigation li.text a span              { background-position:-127px -253px; }
.awwcanvas.smallcanvas ul.navigation li.menu2 > a span             { background-position:-187px -253px; }

/* Submenu border radius */
.aww-landscape ul.navigation li.showsubmenu a {
    -webkit-border-radius: 5px;
    -webkit-border-top-right-radius: 0px;
    -webkit-border-bottom-right-radius: 0px;
    -moz-border-radius: 5px;
    -moz-border-radius-topright: 0px;
    -moz-border-radius-bottomright: 0px;
    border-radius: 5px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

.aww-landscape ul.navigation li.submenu ul li:last-child a {
    -webkit-border-radius: 0px;
    -webkit-border-top-right-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -moz-border-radius: 0px;
    -moz-border-radius-topright: 5px;
    -moz-border-radius-bottomright: 5px;
    border-radius: 0px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}
.aww-landscape ul.navigation li.submenu ul a {
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
}

.aww-portrait ul.navigation li.showsubmenu a {
    -webkit-border-radius: 5px;
    -webkit-border-bottom-right-radius: 0px;
    -webkit-border-bottom-left-radius: 0px;
    -moz-border-radius: 5px;
    -moz-border-radius-bottomright: 0px;
    -moz-border-radius-bottomleft: 0px;
    border-radius: 5px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
}
.aww-portrait ul.navigation li.submenu ul li:last-child a {
    -webkit-border-radius: 0px;
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius: 0px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-radius: 0px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}

.aww-portrait ul.navigation li.submenu ul a {
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
}

/* IOS Safari specific */
.awwcanvas * {
       -webkit-touch-callout: none;
       -webkit-tap-highlight-color: rgba(0,0,0,0);
       -webkit-text-size-adjust: none;
       -webkit-user-select: none;
}