/* Global Vasarely styles
***********************************************************************************************************/
.puffinstuff {
 width: 330px;
 color: #6d7a4e;
background-color: #6d7a4e;
height: 2px;
 float: left;
}

.left_logo {
    float: left;
}

.right_logo {
    float: right;
}

.huffpo_image {
    height: 118px;
    width: 330px;
    float: left;
     border-style: solid;
    border-color: #6d7a4e;
    border-width:2px;
}

.newstalk_image {
    height: 90px;
    width: 330px;
    float: left;
     border-style: solid;
    border-color: #6d7a4e;
    border-width:2px;
}

.audio_area {
    border-style: solid;
    border-color: #6d7a4e;
    border-width:2px;
     width: 330px;
    height: 30px;
   float: left;
     background-color: #ffffff;
}

.captioned_image_container {
    width: 136px;
    float: left;
    margin-right: 10px;
    border-style: none;
    border-color: blue;
    border-width:1px;
}

.head_image, .book_image {
    margin: 0px;
    padding: -10px;
    border-style: none;
    border-color: red;
    border-width:1px;
    width: 136px;
   float: left;
}

.head_image {
    height: 170px;
}

.book_image {
    border-style: solid;
    border-color: black;
    border-width:1px;
    height: 209px;
}

.the_caption {
    margin: 5px 0px 10px 0px;
    border-style: none;
    border-color: red;
    border-width:1px;
    line-height: 1.0;
    float: left;
}

html {
    background: url(http://payload56.cargocollective.com/1/2/71277/3430415/IMG_6480_sm_o.jpg);
}

body, html {
    margin: 0px;
    padding: 0px;
}

.nav_container br {
    display: none;
}

.view_tag_info {
    bottom: 20px;
    color: black;
    position: fixed;
    width: 200px !important;
}

body {
    background-color: #eef7da;
    background-image: url(http://payload56.cargocollective.com/1/2/71277/3430415/tiki_print_5_back_o.jpg);
    color: #333333;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 14px;
     min-height:600px;
                          height:auto !important;
                          height:600px;                     
    line-height: 1.5;
    margin: 0 auto 80px auto;
    width: 975px;
    -moz-box-shadow: 0px 0px 14px #000;
    -webkit-box-shadow: 0px 0px 14px #000;
    box-shadow: 8px 8px 18px #222;
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
    /* For IE 5.5 - 7 */
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
    -webkit-border-radius: 12px;
    /* Saf3-4, iOS 1-3.2, Android ≤1.6 */
    border-radius: 12px;
    /* Opera 10.5, IE9, Saf5, Chrome, FF4+, iOS 4, Android 2.1+ */
}

.number {
 color: #6d7a4e;
    font-family: 'Slackey', cursive;
    font-size: 24px;  
}

/* Header / Navigation
***********************************************************************************************************/



.header_img {
    /* To fix in place change to "position:fixed;" */
    margin: 0 0 0 0px;
    position: fixed;
    z-index: 11;
    top: 50px;
}

.header_img img {
    margin: 0 0 0 -80px;
}

#tag_menu {
position: absolute;
top: 35px; left: 35px;
}

#tag_menu a { color: #f02; }
#tag_menu a:hover { color: #555; }
#tag_menu a:active { color: #999; }

.nav_container {
    line-height: 165%;
    position: fixed;
    top: 225px;
    margin: 35px;
    width: 180px;
    z-index: 12;
}

.dropshadow {
    /* Fallback for web browsers that doesn't support RGBa */
    /* RGBa with 0.6 opacity */
    background: rgba(255, 255, 255, 0.4);
    /* For IE 5.5 - 7*/
    /* For IE 8*/
    .-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99ffffff, endColorstr=#99ffffff)";
    -moz-box-shadow: 3px 3px 6px #333;
    -webkit-box-shadow: 3px 3px 6px #333;
    box-shadow: 3px 3px 6px #333;
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
    /* For IE 5.5 - 7 */
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
}

.nav_container, .social_container {
    padding: 8px;
    /* Fallback for web browsers that doesn't support RGBa */
    /* RGBa with 0.6 opacity */
    background: rgba(255, 255, 255, 0.4);
    /* For IE 5.5 - 7*/
    /* For IE 8*/
    .-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99ffffff, endColorstr=#99ffffff)";
    -moz-box-shadow: 3px 3px 6px #333;
    -webkit-box-shadow: 3px 3px 6px #333;
    box-shadow: 3px 3px 6px #333;
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
    /* For IE 5.5 - 7 */
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
    -webkit-border-radius: 12px;
    /* Saf3-4, iOS 1-3.2, Android ≤1.6 */
    border-radius: 12px;
    /* Opera 10.5, IE9, Saf5, Chrome, FF4+, iOS 4, Android 2.1+ */
}

.social_container {
   position: fixed;
    top: 500px;
    margin-left: 35px;
     width: 180px;
    z-index: 13;
    opacity: 1;
}

.facebook {
    position: relative;
    width: 85px;
    background: #ffffff;
     float: right;
    margin: 0px;
    padding: 0px;
    margin-right: -5px;
}

.twitter {
    position: relative;
    width: 85px;
    background: #ffffff;
    float: left;
     margin: 0px;
    padding: 0px;
}

.nav_container.horizontal {
    /* Enabled via Display Options */
    position: absolute;
    width: 670px;
    z-index: 25;
    background: #ffffff;
}

.nav_container.horizontal div {
    float: left;
    padding-right: 10px;
}

#nav_loadspin {
    display: none;
    position: fixed;
    top: 220px;
    left: 55px;
    z-index: 100;
}

/* Navigation > Links
    ***************************************************************************************************/

.nav_container a {
    /* Applied to each navigation link */
    font-size: 13px;
    padding: 2px 3px 3px 3px;
    text-decoration: none;
}

.project_link a {
    padding-left: 10px;
    color: #550000;
}

.project_link a:hover {
    background: #7d2222;
    color: #ffffff;
}

.project_link a:active {
    background: #66cc99;
    color: #000000;
}

.page_link a {

    color: #550000;
}

.page_link a:hover {
    background: #7d2222;
    color: #ffffff;
}

.page_link a:active {
    background: #770000;
    color: #000000;
}

.link_link a {
    color: #550000;
    text-decoration: none;
}

.link_link a:hover {
    background: #7d2222;
    color: #ffffff;
}

.link_link a:active {
    color: #666666;
}

.nav_active a {
    background: transparent;
    color: #000000;
}

.nav_active a:active {
    background: transparent;
    color: #000000;
}

.pagination {
    color: #444444;
    font-size: 11px;
    z-index: 11;
}

.pagination a {
    color: #66cc99;
}

.pagination a:hover {
    background: transparent;
    color: #ffffff;
}

.pagination a:active {
    background: #000000;
    color: #000000;
}

.nav_follow {
    color: #444444;
    font-size: 11px;
    z-index: 11;
}

.nav_follow a {
    color: #444444;
    text-decoration: underline;
}

.nav_follow a:hover {
    background: transparent;
    color: #66cc99;
}

.nav_follow a:active {
    background: #000000;
    color: #000000;
}

.view_tag_info {
    color: #999999;
    padding-left: 0;
    font-size: 11px;
}

.view_tag_info a {
    color: #0066ff;
}

.view_tag_info a:hover {
    background: #ffff66;
    color: #000000;
}

.view_tag_info a:active {
    background: #000000;
    color: #ffffff;
}

/* Content
***********************************************************************************************************/

#content_container {
    padding: 12px 0 0 270px;
    margin: 120px 0px 0px 0px;
    position: relative;
    width: 705px;
    z-index: 10;
}

/* Content > Project content
    ***************************************************************************************************/

#maincontainer {
    display: none;
    margin: 0 0 35px 0;
    width: 705px;
}

.bodycopy a {
    color: #770000;
    text-decoration: underline;
}

.bodycopy a:hover {
    background: transparent;
    color: #55aa77;
    text-decoration: underline;
}

.bodycopy a:active {
    background: transparent;
    color: #ffffff;
}

.project_content {
    color: #222222;
    width: 560px;
}

.project_title {
    color: #6d7a4e;
    /*font-family: 'Special Elite', cursive;*/
    font-family: 'Slackey', cursive;
    font-size: 38px;
    padding: 0 0 30px 0;
}

/* Project content > Header
        *******************************************************************************************/

.project_header {
    float: right;
    margin: 0 35px 0 0;
    position: relative;
    z-index: 99;
    background: #ffffff;
}

.project_header div {
    float: right;
}

.project_header a {
    color: #999999;
    float: left;
    font-size: 11px;
    text-decoration: underline;
}

.project_header a:hover {
    background: #ffff66;
    color: #000000;
    text-decoration: none;
}

.project_header a:active {
    color: #ffffff;
    background: #000000;
}

.project_divider {
    color: #555555;
}

/* Styling of default typographic headers and elements */
h1 {
    font-size: 22px;
    line-height: 165%;
}

h2 {
    font-size: 16px;
    line-height: 165%;
}

h3 {
    font-size: 14px;
    line-height: 150%;
}

blockquote {
    color: #666666;
    margin: 0;
}

.project_content img {
    margin: 0px 15px 15px 0px;
}

/* Project content > Slideshows
        *******************************************************************************************/

#slideshow_container {
    margin: 0px 15px 15px 0px;
}

.slideshow_nav {
    clear: both;
    color: #999999;
    padding-bottom: 10px;
    font-size: 11px;
}

.slideshow_nav a {
    color: #666666;
    text-decoration: none;
}

.slideshow_nav a:hover {
    background: none !important;
    color: #999999;
    text-decoration: none;
}

.slideshow_nav a:active {
    color: #ff3300;
}

.slideshow_count {
    color: #999999;
    font-size: 11px;
}

.slideshow_caption {
    clear: both;
    display: block;
    font-size: 11px;
    padding: 5px 0 5px 0;
}

.slideshow_wrapper {
    clear: both;
    margin: 0px 15px 15px 0px;
}

#slideshow_container img {
    margin: 0px;
}

.slideshow_wrapper a, .slideshow_wrapper a:hover, .slideshow_wrapper a:active {
    background: none !important;
}

.slideshow_thumbs {
    padding: 15px 0 15px 0;
}

ul.slideshow_thumbs {
    margin: 0;
    padding: 0;
}

.slideshow_thumb {
    float: left;
    list-style: none;
    padding: 0 15px 15px 0;
}

.slideshow_thumb a {
    background: none !important;
    border: 2px solid #333;
    display: block;
}

.slideshow_thumb a img {
    opacity: 0.5;
}

.slideshow_thumb a:hover {
    background: none !important;
    border: solid #333333;
}

.slideshow_thumb a:hover img {
    opacity: 1.0;
}

.slideshow_thumb a:active, a.activeSlide:active {
    background: none !important;
    border: 2px solid #ffffff;
}

.slideshow_thumb a:active img, a.activeSlide:active img {
    opacity: 1.0;
}

a.activeSlide {
    background: none !important;
    border: 2px solid #ffffff;
}

a.activeSlide:hover {
    border: 2px solid #ffffff !important;
}

a.activeSlide img {
    opacity: 1.0;
}

.slideshow_thumb img {
    border: 0;
    display: block;
    margin: 0;
    height: 40px;
}

/* Project content > Project footer
        *******************************************************************************************/

.project_footer {
    color: #666;
    clear: both;
    font-size: 11px;
    padding: 30px 0px 0px 0px;
}

.footer_title_type {
    color: #0666666;
    font-weight: bold;
}

.project_views {
    color: #666666;
    font-style: italic;
}

/* Project Footer Links */
.project_footer .permalink a {
    color: #666666;
    font-style: italic;
    text-decoration: underline;
}

.project_footer .permalink a:hover {
    background: transparent;
    color: #66cc99;
}

.project_footer .permalink a:active {
    color: #ffffff;
    background: #000000;
}

.tags {
    color: #666666;
}

.tags a {
    color: #999999;
    text-decoration: none;
}

.tags a:hover {
    background: transparent;
    color: #66cc99;
    text-decoration: underline;
}

.tags a:active {
    background: transparent;
    color: #ffffff;
}

.tags a:visited {
}

.project_footer .editlink a {
    color: #0066ff;
    font-style: italic;
}

.project_footer .editlink a:hover {
    background: #ffff00;
    color: #000000;
}

.project_footer .editlink a:active {
    background: #000000;
    color: #ffffff;
}

.project_bottom {
    clear: both;
    border-bottom: 1px solid #333333;
    margin: 15px 0px 15px 0px;
    width: 670px;
    background: #ffffff;
}

/* Content > Thumbnails
    ***************************************************************************************************/

.project_thumb {
    float: left;
    margin: 0 35px 10px 0;
    position: relative;
    text-align: center;
}

.project_thumb .hover {
    cursor: pointer;
    text-decoration: none;
}

.project_thumb .nohover {
    text-decoration: none;
}

.project_thumb .hover .thumb_title span {
    background: #ff3333;
    color: #000000;
}

.project_thumb.active .cardimgcrop {
    border: 3px solid #333333;
}

.project_thumb.active .thumb_title span {
    background: #ff3333;
    color: #000000;
}

.cardimgcrop {
    border: 3px solid transparent;
    margin: -3px -3px 9px -3px;
    position: relative;
    min-width: 200px;
    min-height: 134px;
}

.cardimgcrop.notitle_notag {
    margin-bottom: 22px;
}

.loader_holder {
    display: none;
    position: absolute;
    text-align: center;
    top: 8px;
    left: 8px;
    z-index: 3;
}

.thumb_title {
    overflow: hidden;
    white-space: nowrap;
    text-align: center;
    width: 200px;
}

.thumb_title.notag {
    margin: 0 0 22px 0;
}

.thumb_title .text {
    color: #333333;
    font-size: 11px;
    font-weight: bold;
    line-height: 15px;
    overflow: hidden;
    padding: 2px 3px 2px 3px;
    white-space: nowrap;
    text-align: center;
}

.thumb_tag {
    color: #666666;
    font-family: Georgia, Times, serif;
    height: 3em;
    line-height: 15px;
    margin: 0 0 2px 0;
    overflow: hidden;
    text-align: center;
    width: 200px;
}

.thumb_tag.notitle {
    margin-top: 5px;
}

.thumb_tag a {
    color: #666666;
    font-size: 11px;
    font-style: italic;
    line-height: 1.5em;
    text-align: center;
    text-decoration: none;
}

.thumb_tag a:hover {
    text-decoration: underline;
}

/* Search results
    *******************************************************************************************/

#search_form {
    position: fixed;
    bottom: 20px;
    left: 35px;
    z-index: 999;
}

#search_form #search_term {
    font-size: 11px;
    width: 188px;
}

#search_form_results {
    padding-bottom: 90px;
}

.search_header {
    color: #999999;
    float: left;
    font-size: 14px;
    font-style: normal;
    font-weight: normal;
    margin: 0;
    padding: 4px 0;
    width: 145px;
}

#search_term {
    background: #000000;
    border: 1px solid #333333;
    color: #cccccc;
    float: left;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    margin: 0;
    padding: 5px;
    width: 220px;
}

#search_results {
    float: left;
}

.result {
    clear: both;
    font-size: 14px;
    line-height: 22px;
    margin-bottom: 60px;
}

.search_thumb {
    float: left;
    margin: 4px 25px 35px 0px;
}

.search_thumb img {
    width: 120px;
    height: auto;
}

.search_text {
    width: 500px;
    margin-left: 145px;
}

.search_title a {
    color: #cccccc;
    font-weight: bold;
    text-decoration: underline;
}

.search_title a:hover {
    color: #ffffff;
}

.search_title a:active {
    color: #666666;
}

.search_tags {
    color: #666666;
    font-family: Georgia, times, serif;
    font-size: 11px;
    font-style: italic;
}

.search_tags a {
    color: #666666;
    text-decoration: none;
}

.search_tags a:hover {
    background: none;
    color: #cccccc;
    text-decoration: underline;
}

.search_tags a:active {
    color: #666666;
}

/* Footer
***********************************************************************************************************/

.bottompad {
    clear: both;
    position: relative;
    height: 35px;
    margin: 35px 0 0 0;
    width: 705px;
}

#foot_container {
}

/* Video component
***********************************************************************************************************/

.video_component {
    float: left;
    margin: 0 15px 15px 0;
}

/* Audio component
***********************************************************************************************************/

.audio_component {
    color: #777777;
    font-family: 'Droid Sans Mono', Monaco, Monospace, Arial, san-serif;
    font-size: 10px;
    height: 30px;
    line-height: 26px;
    width: 300px;
}

.audio_component div {
    height: 26px;
}

.audio_component .border {
    border: 2px solid #aaaaaa;
    opacity: 0.5;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
    -khtml-opacity: 0.5;
}

.audio_component .vertical_border {
    background: #aaaaaa;
    opacity: 0.50;
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
    -khtml-opacity: 0.5;
}

.audio_component .controls {
    top: 2px;
    left: 2px;
}

.audio_component .play_pause {
    background: url("/_gfx/playpause.png");
}

.audio_component .spectrum .spectrum_bar {
    background: #666666;
}

.audio_component .loading {
    background: #bbbbbb;
    opacity: 0.25;
    filter: alpha(opacity=25);
    -moz-opacity: 0.25;
    -khtml-opacity: 0.25;
}

.audio_component .progress {
    background: #bbbbbb;
    border-right: 1px dotted #333333;
    opacity: 0.25;
    filter: alpha(opacity=25);
    -moz-opacity: 0.25;
    -khtml-opacity: 0.25;
}

.audio_component .volume_slide.hover {
    background: #bbbbbb;
    opacity: 0.3;
    filter: alpha(opacity=30);
    -moz-opacity: 0.3;
    -khtml-opacity: 0.3;
}

/* Other
***********************************************************************************************************/

.toolset {
    /* Admin and following icons „ only seen by members */
    position: fixed;
    top: 10px;
    right: 10px;
    z-index: 9999;
}

.cargo_link {
    /* "Running on Cargo" */
    display: none;
    color: #333333;
    font-size: 11px;
    line-height: 165%;
    position: fixed;
    right: 35px;
    bottom: 15px;
    z-index: 99;
}

.cargo_link a {
    color: #555555;
    text-decoration: underline;
}

.cargo_link a:hover {
    color: #66cc99;
    text-decoration: underline;
}

.cargo_link a:active {
    background: #000000;
    color: #ffffff;
}



/* Hack Page
***********************************************************************************************************/

.hack_container, .hack_sub_container {
    width: 680px;
    background-color: Transparent;
}

.hack_sub_container {
    padding: 0px;
    float: left;
    margin-bottom: 20px;
}

#left_col, .left_col_reserve {
    background-color: Transparent;
    width: 330px;
    padding: 0px;
    float: left;
    margin-right: 20px;
}

#right_col, .right_col_reserve {
    background-color: Transparent;
    width: 330px;
    padding: 0px;
    float: left;
}

.book, .media {
    background-color: Transparent;
    width: 330px;
    margin: 0px 0px 20px 0px;
    float: left;
}

.photo {
    float: left;
}

.author {
    background-color: Transparent;
    width: 330px;
    margin: 0px 0px 20px 0px;
    float: left;
}

.form, .pre_order, #paypal {
    background: rgba(109, 122, 78, 0.8);
    /* For IE 5.5 - 7*/
    /* For IE 8*/
    .-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#996d7a4e, endColorstr=#996d7a4e)";
    -webkit-border-radius: 12px;
    /* Saf3-4, iOS 1-3.2, Android ≤1.6 */
    border-radius: 12px;
    /* Opera 10.5, IE9, Saf5, Chrome, FF4+, iOS 4, Android 2.1+ */
    overflow: hidden;
}

#right_col_order, #right_col_reserve {
    width: 300px;
    margin-left: 30px;
}

.form, #paypal {
    color: #ffffff;
    width: 280px;
    margin: 0px 0px 0px 0px;
    float: left;
    padding: 10px;
    
    
    font-weight: bold;
}

#paypal .center
{
margin-left:auto;
margin-right:auto;

    width: 165px;
}

#paypal {
height: 170px;
    
}

.form h2, .pre_order h2, .reviews h2, .book h2, .author h2, .video h2, #paypal h2 {
    line-height: 10%;
}

.form h3, .pre_order h3, .reviews h3, .book h3, .author h3, .video h3 {
    line-height: 10%;
}

.video {
    background-color: Transparent;
    width: 330px;
    margin: 0px 0px 20px 0px;
    float: left;
}

.reviews {
    background-color: Transparent;
    width: 330px;
    margin: 0px 0px 20px 0px;
    float: left;
}

.pre_order {
    color: #ffffff;
    width: 330px;
    margin: 0px 0px 20px 0px;
    float: left;
    text-align: center;
    /*padding: 0px 20px 0px 20px;*/
}

.pre_order_all_logos_container {
    width: 270px;
    margin: 0px auto 0px auto;
    padding: 0px;
}

.pre_order_logo_left {

    margin: 0px;
    padding: 0px;
    float: left;
    border-style: none;
    border-color: red;
    border-width:1px;
}

.pre_order_logo_left img, .pre_order_logo_right img {
    margin: 0px;
    padding: 0px;
}

.pre_order_logo_right {

    margin: 0px;
    padding: 0px;
    float: right;
    border-style: none;
    border-color: red;
    border-width:1px;
}

.pre_order a {
    color: #ffffff;
    text-decoration: none;
}

.pre_order a:hover {
    background: transparent;
    color: #000000;
    text-decoration: underline;
}

.pre_order a:active {
    background: transparent;
    color: #ffffff;
}

/* In-browser code editing made "almost bearable" by CodeMirror: http://marijn.haverbeke.nl/codemirror
***********************************************************************************************************/

         

/**
 * Fullscreen button
 */
 
a#fullscreen {
    background-color: #1a1a1a;
    background-image: url(/_gfx/fullscreen_open.png);
    background-repeat: no-repeat;
    background-position: 67px 3px;
    border: 1px solid #1a1a1a;
    color: #bbbbbb;
    display: block;
    font-family: 'Lucida Grande', 'Lucida Sans Unicode', Arial, sans-serif;
    font-size: 11px;
    line-height: 18px;
    height: 19px;
    padding: 0 4px 0 5px;
    text-align: left;
    text-decoration: none;
    width: 74px;
}

a#fullscreen:hover {
    background-color: #fff;
    color: #000;
}

a#fullscreen:active {
    background-color: #fff;
    border: 1px solid #999;
    color: #666;
}
