* { margin: 0; -webkit-text-size-adjust: none; } html { border-bottom: 1px solid transparent; -webkit-font-smoothing: antialiased; } html, body { height: 100%; width: 100%; background-color: #FFFFFF; } body { position: relative; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; color: #636363; border-bottom: 1px solid transparent; } body * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } body.menu-open { overflow-x: hidden; overflow-y: scroll !important; position: fixed; } .clear { clear: both; } ul{ margin: 0; padding: 0; padding-left: 1em; } li{ margin: 0; padding: 0; padding-left: 1em; } a, a:visited { outline: 0; text-decoration: none; color: inherit; } a img { border: 0px; outline: 0; } /* HEADER */ #header_outer { position: fixed; top: 0px; width: 100%; z-index: 225; background-color: #272a2b; } #header_inner { position: relative; margin: 0 auto; max-width: 1280px; border: 0px solid green; font-size: 0; line-height: 0px; vertical-align: top; padding: 12px 0px 11px; } #header_logo { position: relative; display: inline-block; width: 26.25%; color: #525558; font-size: 30px; line-height: 30px; vertical-align: top; padding: 4px 16px 0px; } #header_logo a { height: 33px; overflow: hidden; position: relative; display: block; width: 100%; } #header_logo img { position: relative; display: block; width: 220px; } #header_logo:hover img { margin-top: -33px; } #menu_outer { display: inline-block; font-size: 0; position: relative; text-align: justify; -ms-text-justify: distribute-all-lines; text-justify: distribute-all-lines; z-index: 225; width: 61.75%; vertical-align: top; border: 0px solid red; } .menu_item { display: inline-block; *display: inline; color: #FFFFFF; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 100; font-size: 24px; line-height: 24px; position: relative; text-transform: lowercase; padding-top: 7px; } .menu_item:hover { color: #525559; } .menu_stretch { display: inline-block; font-size: 0; line-height: 0; width: 100%; } /* MOBILE MENU ICON */ #mobile_menu_icon_outer { width: 30px; position: fixed; right: 16px; top: 15px; display: none; z-index: 400; border: 0px solid red; } #mobile_menu_icon { display: block; width: 100%; cursor: pointer; } #mobile_menu_icon:hover .mm_fill { fill: #FFFFFF; } /* MOBILE MENU */ #mob_menu_bg_outer { position: fixed; top: 0px; left: 0px; height: 100%; width: 100%; z-index: 190; visibility: hidden; opacity: 0; transition: visibility 0s linear 0.5s,opacity 0.5s linear; } #mob_menu_bg_outer.active { visibility:visible; opacity:1; transition-delay: 0s; } #mob_menu_bg { position: absolute; top: 0px; left: 0px; height: 100%; width: 100%; z-index: 100; background-color: #272a2b; } #mob_menu_outer { position: fixed; padding: 60px 16px 140px; top: 0px; left: 0px; height: 100%; width: 100%; z-index: 210; visibility: hidden; opacity: 0; transition: visibility 0s linear 0.5s,opacity 0.5s linear; } #mob_menu_outer.active { visibility:visible; opacity:1; transition-delay: 0s; } #mob_menu_t { position: relative; display: table; width: 100%; height: 100%; z-index: 210; } #mob_menu_tr { display: table-row; } #mob_menu_td { display: table-cell; vertical-align: middle; text-align: center; } #mob_menu_td a { color: #FFFFFF; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 100; font-size: 24px; line-height: 24px; text-transform: lowercase; } #mob_menu_td a:hover { color: #b7b7b7; } .mob_menu_item { padding: 0px 10px; } /* HAMBURGER */ .c-hamburger { display: block; position: relative; overflow: hidden; margin: 0; padding: 0; margin-top: 0px; width: 26px; height: 26px; font-size: 0; text-indent: -9999px; box-shadow: none; border-radius: none; border: none; cursor: pointer; border: 0px; } .c-hamburger:focus { outline: none; } .c-hamburger span { display: block; position: absolute; top: 10px; left: 0px; right: 0px; height: 2px; background-color: #b7b7b7; border-radius: 2px; } .c-hamburger span:before, .c-hamburger span:after { position: absolute; display: block; left: 0; width: 100%; height: 2px; background-color: #b7b7b7; content: ""; border-radius: 2px; } .c-hamburger span:before { top: -6px; } .c-hamburger:hover span:before, .c-hamburger:hover span, .c-hamburger:hover span:after { background-color: #FFFFFF; } .c-hamburger span:after { bottom: -6px; } .c-hamburger--htx { background-color: transparent } .c-hamburger--htx span:before, .c-hamburger--htx span:after { transition-duration: 0.3s, 0.3s, 0.3s; transition-delay: 0.3s, 0.3s, 0s; } .c-hamburger--htx span:before { transition-property: height, top, transform; } .c-hamburger--htx span:after { transition-property: height, bottom, transform; } .c-hamburger--htx.is-active span { background: none; } .c-hamburger--htx.is-active span::before { height: 2px; top: 0px; transform: rotate(45deg); } .c-hamburger--htx.is-active span::after { height: 2px; bottom: 0px; transform: rotate(-45deg); } .c-hamburger--htx.is-active span::before, .c-hamburger--htx.is-active span::after { transition-delay: 0s, 0s, 0.3s; } #social_media_icons { position: relative; display: inline-block; width: 12%; font-size: 30px; line-height: 30px; vertical-align: top; border: 0px solid blue; text-align: right; padding: 11px 16px 0px 0px; } #social_media_icons a { position: relative; display: inline-block; vertical-align: top; width: 20px; margin-left: 16px; } #social_media_icons a img { position: relative; display: block; width: 100%; } /* MAIN BACKGROUND */ #main_bg_outer { position: fixed; top: 0px; width: 100%; height: 100%; background-color: #272a2b; font-size: 0px; line-height: 0px; z-index: 10; } #main_bg_left { position: fixed; top: 0px; left: 0px; display: block; width: 50%; height: 100%; background-color: #525559; z-index: 10; } #main_bg_right { position: fixed; top: 0px; right: 0px; display: block; width: 50%; height: 100%; background-color: #FFFFFF; z-index: 10; } #main_bg_inner { position: relative; display: block; margin: 0 auto; max-width: 1280px; height: 100%; z-index: 11; border: 0px solid red; } #inner_bg_left { position: relative; display: inline-block; width: 26.25%; height: 100%; background-color: #525559; z-index: 11; } #inner_bg_right { position: relative; display: inline-block; width: 73.75%; height: 100%; background-color: #FFFFFF; z-index: 11; } /* CONTENT */ .content_outer { display: block; width: 100%; position: relative; min-height: 100%; height: 100%; z-index: 100; padding-top: 60px; } .content_inner { position: relative; margin: 0 auto; max-width: 1280px; z-index: 200; font-size: 0px; line-height: 0; text-align: left; border: 0px solid red; } .right_column { position: relative; display: inline-block; margin-left: 26.25%; width: 73.75%; border: 0px solid red; vertical-align: top; } .cols_3, .cols_2, .cols_1, .cols_Half { position: relative; display: inline-block; padding: 0px 16px; border: 0px solid red; vertical-align: top; text-align: left; } .cols_3 { width: 100%; } .cols_2 { width: 66.66%; } .cols_1 { width: 33.33%; } .text_outer { position: relative; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; font-size: 14px; line-height: 30px; color: #636363; padding: 32px 32px; } .text_outer a, .text_outer a:visited { text-decoration: none; color: #b7b7b7; } .text_outer a:hover { color: #636363; } .text_outer p { padding: 0px; margin: 0px 0px 30px; } .text_outer .title { font-weight: 400; color: #525559; font-size: 24px; line-height: 24px; } .image_outer { position: relative; padding: 0px 32px; } .image_outer img { position: relative; display: block; width: 100%; } .image_caption { position: relative; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; font-size: 12px; line-height: 24px; color: #636363; padding-top: 10px; } /* BOOK CONTENT SECTION */ .book_outer { padding: 0px 16px 64px; position: relative; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; font-size: 14px; line-height: 30px; color: #636363; } .book_image_outer { position: relative; display: inline-block; vertical-align: top; padding: 0px 16px; width: 32%; } .book_image_outer a, .book_image_outer img { position: relative; display: block; width: 100%; } .book_right_outer { position: relative; display: inline-block; vertical-align: top; padding: 0px 16px 0px; width: 68%; } .book_title { position: relative; color: #000000; font-size: 14px; margin-top: -5px; line-height: 24px; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 500; } .book_title a:hover { color: #b7b7b7; } .book_description { position: relative; padding-top: 12px; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; font-size: 14px; line-height: 30px; color: #636363; } .book_description a:hover { color: #b7b7b7; } /* ENQUIRY FORM */ .enquiry_outer { padding: 0px 16px 64px; position: relative; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; font-size: 14px; line-height: 30px; color: #636363; } #enquiry_form_outer { position: relative; width: 100%; padding: 0px 16px; } .form_input_each { position: relative; display: block; width: 100%; padding: 0px 0px 32px; } .enquiry_form label { position: relative; display: block; width: 100%; } .enquiry_form label.invalid { position: relative; display: block; width: 100%; color: red; } .enquiry_form input[type='text'] { position: relative; display: block; width: 34%; border: 1px solid #525559; font-size: 14px; line-height: 20px; padding: 4px; font-weight: 300; color: #636363; } .enquiry_form textarea { position: relative; display: block; width: 68%; border: 1px solid #525559; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; font-size: 14px; line-height: 20px; padding: 4px; font-weight: 300; color: #636363; resize: vertical; height: 210px; } #ef_submit { color: #000000; cursor: pointer; position: relative; display: inline-block; width: auto; border: 0px; background: none; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 100; font-size: 24px; line-height: 24px; text-align: left; padding: 0px 0px; } #ef_submit:hover { color: #b7b7b7; } #ef_thank_you { padding: 0px 16px 64px; position: relative; display: none; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; font-size: 14px; line-height: 30px; color: #636363; } /* COPYWRITE */ .copywrite { position: relative; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; font-size: 14px; line-height: 18px; color: #636363; padding: 40px 32px; } .copywrite a, .copywrite a:visited { color: #272a2b; } .copywrite a:hover { color: #b7b7b7; } #left_column .copywrite { display: none; color: #FFFFFF; padding: 40px 16px; font-size: 12px; line-height: 14px; } /* LATEST SLIDESHOW */ .slideshow_outer { position: relative; height: calc(74vh - 51px); border: 0px solid red; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 400; padding: 0px 0px; } .slideshow_inner { position: relative; height: 100%; width: 100%; } .ss_image { position: absolute; top: 0px; left: 0px; display: none; height: 100%; width: 100%; background-size: cover; background-position: 50% 0% center; z-index: 20; } .ss_image.displayed { display: block; } .ss_caption { position: absolute; bottom: 0px; left: 0px; width: 100%; height: 84px; z-index: 21; } .ss_caption_bg { position: absolute; bottom: 0px; left: 0px; width: 100%; height: 100%; background-color: black; z-index: 21; opacity: 0.4; } .caption_inner { position: relative; z-index: 22; display: block; width: 100%; height: 100%; padding: 16px; opacity: 0; transition: opacity 1s ease-in-out; } .displayed .caption_inner { opacity: 1; } .active .caption_inner { opacity: 1; transition: opacity 0s; } .ss_article_title { position: relative; display: block; color: #FFFFFF; font-size: 24px; line-height: 24px; font-weight: 500; } .ss_article_title:hover { color: #b7b7b7; } .ss_lower { position: relative; display: block; font-size: 14px; line-height: 24px; color: #b7b7b7; padding-top: 5px; } .ss_lower a, .ss_lower a:visited { color: #FFFFFF; } .ss_lower a:hover { color: #b7b7b7; } .ss_pub_date, .ss_publication, .ss_credit { position: relative; display: inline-block; } /* PAGER */ .pager { position: absolute; right: 16px; bottom: 16px; font-size: 0px; line-height: 0px; text-align: center; z-index: 23; } .pager a { position: relative; padding: 2px; display: inline-block; height: 24px; width: 24px; vertical-align: top; } .pager a svg { display: block; width: 100%; height: 100%; } .pager a svg circle { fill: #FFFFFF; opacity: 0.2; } .pager a.activeSlide svg circle { fill: #FFFFFF; opacity: 1; } .pager a:focus { outline: none; } /* ARTICLE GRID */ .ag_outer { position: relative; display: inline-block; padding: 16px 16px; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 400; } .article_grid_each { position: relative; display: inline-block; border: 0px solid red; width: 50%; padding: 16px; vertical-align: top; } .article_grid_each_inner { position: relative; display: block; } .article_grid_each.wider { width: 100%; } .ag_image_outer { position: relative; display: block; width: 100%; padding-bottom: 60%; z-index: 30; } .ag_image { position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; background-size: cover; background-position: 50% center; z-index: 20; } .ag_caption { position: relative; display: block; width: 100%; height: 112px; z-index: 31; } .wider .ag_caption { position: absolute; bottom: 0px; left: 0px; width: 100%; height: auto; } .ag_caption_bg { position: absolute; bottom: 0px; left: 0px; width: 100%; height: 100%; background-color: #383c3e; z-index: 31; } .wider .ag_caption_bg { background-color: #000000; opacity: 0.4; } .ag_caption_inner { position: relative; z-index: 32; display: block; width: 100%; height: 100%; padding: 14px 14px; } .ag_article_title { position: relative; display: block; color: #FFFFFF; font-size: 14px; line-height: 18px; height: 54px; } .ag_article_title:hover { color: #b7b7b7; } .wider .ag_article_title { font-size: 18px; line-height: 24px; height: auto; } .ag_lower { position: relative; display: block; font-size: 12px; line-height: 16px; color: #b7b7b7; padding-top: 0px; } .ag_lower a, .ag_lower a:visited { color: #FFFFFF; } .ag_lower a:hover { color: #b7b7b7; } .ag_pub_date, .ag_publication, .ag_credit { position: relative; display: block; } #show_more_link { position: relative; display: block; width: 100%; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 100; font-size: 24px; line-height: 24px; margin-bottom: 4px; padding: 30px 16px; } /* LEFT COLUMN */ #left_column_outer { position: fixed; top: 0px; left: 0px; width: 100%; height: 0px; z-index: 200; } #left_column_inner { position: relative; margin: 0 auto; max-width: 1280px; height: 0px; } #left_column { position: relative; display: inline-block; width: 26.25%; height: 100vh; vertical-align: top; border: 0px solid red; padding-top: 60px; } /* GARY PORTRAIT */ #gary_portrait_outer { position: fixed; bottom: 0px; left: 0px; width: 100%; height: 0px; z-index: 400; } #gary_portrait_inner { position: relative; margin: 0 auto; max-width: 1280px; height: 0px; } #gary_portrait_outer img { position:absolute; display: block; bottom: 0px; left: 0px; width: 320px; } /* LATEST BOOK */ .latest_book_outer { width: 100%; position: relative; display: block; padding: 8px; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 400; } .lb_left { position: relative; display: inline-block; width: 50%; padding: 8px; vertical-align: top; } .lb_left a { position: relative; display: block; width: 100%; } .lb_left img { position: relative; display: block; width: 100%; } .lb_right { position: relative; display: inline-block; width: 50%; padding: 8px; vertical-align: top; color: #b7b7b7; font-size: 14px; line-height: 18px; } .lb_s_title { position: relative; display: block; font-weight: 100; font-size: 24px; line-height: 24px; } .lb_title { position: relative; display: block; font-weight: 600; padding-top: 12px; color: #FFFFFF; } .lb_title a:hover { color: #b7b7b7; } .lb_quote { position: relative; display: block; font-weight: 400; } .lb_buy { position: relative; display: block; font-weight: 600; color: #FFFFFF; } .lb_buy a:hover { color: #b7b7b7; } /* TWITTER */ #twitter_outer { width: 100%; position: relative; display: block; padding: 16px; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 400; color: #b7b7b7; font-size: 14px; line-height: 18px; } #twitter_outer a, #twitter_outer a:visited { color: #FFFFFF; } #twitter_outer a:hover { color: #b7b7b7; } #twitter_section_title { position: relative; display: block; font-weight: 100; font-size: 24px; line-height: 24px; } #twitter_section_title img { position: relative; display: inline-block; width: 20px; top: 1px; } #latest_tweets { position: relative; display: block; font-weight: 400; } .tweet_each { position: relative; display: block; padding-top: 16px; } /* MODAL WINDOW */ #modal_window_outer { display: none; background: rgba(0, 0, 0, 0.75) none repeat scroll 0 0; bottom: 0; cursor: pointer; left: 0; position: fixed; right: 0; text-align: center; top: 0; white-space: nowrap; z-index: 4001; } #modal_window_inner { border: 0px solid white; margin: 0 auto; width: 100%; max-width: 1280px; position: relative; display: inline-block; z-index: 4001; height: 100%; } #modal_window_content { display: inline-block; width: 100%; position: relative; text-align: center; vertical-align: middle; white-space: normal; border: 0px solid red; height: 100%; } #search_term { position: relative; top: 50%; left: 50%; margin-top: -30px; margin-left: -22.5%; width: 45%; display: block; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 100; border: 0px; background-color: #FFFFFF; color: #525559; font-size: 24px; line-height: 33px; padding: 16px 32px; } /* SEARCH RESULTS */ .search_results_outer { position: relative; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; font-size: 14px; line-height: 30px; color: #636363; padding: 32px 32px; } .article_each_outer { position: relative; display: block; margin-bottom: 64px; } .article_image_outer { position: relative; display: block; margin-bottom: 32px; } .article_image { position: relative; display: block; width: 100%; } .article_title { position: relative; display: block; width: 100%; font-weight: 500; color: #525559; font-size: 24px; line-height: 24px; margin-bottom: 3px; } .article_info { position: relative; display: block; width: 100%; color: #525559; font-size: 12px; line-height: 24px; margin-bottom: 18px; } .art_pub_date { position: relative; display: inline-block; vertical-align: top; } .art_publication { position: relative; display: inline-block; vertical-align: top; } .art_publication a, .art_publication a:visited { color: #1f1b1c; } .art_publication a:hover { color: #b7b7b7; } .art_credit { position: relative; display: inline-block; vertical-align: top; } .sr_first_para { position: relative; display: block; width: 100%; margin-bottom: 18px; } .read_full_link { position: relative; display: block; width: 100%; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 100; font-size: 24px; line-height: 24px; margin-bottom: 4px; } .read_full_link a:hover { color: #b7b7b7; } .share_link { position: relative; display: block; width: 100%; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 100; font-size: 24px; line-height: 24px; } .share_linkk a:hover { color: #b7b7b7; } /* FULL ARTICLE */ .full_article_outer { position: relative; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; font-size: 14px; line-height: 30px; color: #636363; padding: 32px 32px; } .article_body { position: relative; display: block; width: 100%; margin-bottom: 18px; } .article_body a, .article_body a:visited { text-decoration: none; color: #b7b7b7; } .article_body a:hover { color: #636363; } .article_body p { padding: 0px; margin: 0px 0px 30px; } /* ARCHIVE */ .archive_outer { position: relative; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; font-size: 14px; line-height: 18px; color: #636363; padding: 0px 32px 32px; } .cols_3 .archive_column { position: relative; display: inline-block; vertical-align: top; width: 33.33%; } .archive_year_outer { position: relative; display: block; padding-bottom: 12px; } .year_title { position: relative; display: block; cursor: pointer; } .months_outer { position: relative; display: none; } .month_title { position: relative; display: block; font-size: 14px; line-height: 18px; color: #000000; } /* SHORT ARCHIVE */ .short_archive_and_calendar_outer { position: relative; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; font-size: 14px; line-height: 18px; color: #636363; padding: 32px 16px 32px 0px; } .short_archive_outer { position: relative; display: block; width: 100%; } .short_archive_title { position: relative; display: block; width: 100%; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 100; font-size: 24px; line-height: 24px; margin-bottom: 8px; color: #1f1b1c; } .sarch_month_title { position: relative; display: block; font-size: 14px; line-height: 24px; color: #000000; font-weight: 400; } /* CALENDAR */ .calendar_outer { position: relative; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; font-size: 14px; line-height: 18px; color: #636363; padding: 0px 16px 32px 0px; } .calendar_title { position: relative; display: block; width: 100%; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 100; font-size: 24px; line-height: 24px; margin-bottom: 8px; color: #1f1b1c; } .calendar_each { position: relative; display: block; width: 100%; margin-bottom: 12px; } .cal_event_date { position: relative; display: block; width: 100%; font-style: italic; } .cal_desc { position: relative; display: block; width: 100%; } .cal_desc strong { color: #000000; } .cal_desc a:hover strong { color: #b7b7b7; } .cal_desc a:hover { color: #b7b7b7; } /* BODY CALENDAR */ .body_calendar_outer { position: relative; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; font-size: 14px; line-height: 30px; color: #636363; padding: 32px 32px; } .body_calendar_outer .calendar_title { display: none; } /* SHARE */ .reveal_share_links { width: auto; position: relative; display: inline-block; opacity: 1; transition: opacity 1s ease-in-out; } .reveal_share_links.hidden { opacity: 0; width: 0px; } .hidden_shares { position: relative; display: inline-block; opacity: 0; transition: opacity 1s ease-in-out; } .hidden_shares.displayed { opacity: 1; } .hidden_shares a { margin-left: 20px; } /* VIDEO */ .embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } @media only screen and (max-width: 500px) { /* LEFT COLUMN */ #left_column_outer { position:relative; top: auto; left: auto; height: auto; background-color: #525559; } #left_column_inner { height: auto; } #left_column { width: 100%; height: auto; padding-top: 32px; } #left_column .copywrite { color: #b7b7b7; } .copywrite a, .copywrite a:visited { color: #FFFFFF; } .copywrite a:hover { color: #b7b7b7; } .lb_left { width: 40%; padding: 8px 0px 8px 8px; } .lb_right { width: 60%; padding: 8px 8px 8px 16px; } #gary_portrait_outer { display: none; } #gary_portrait_outer img { width: 190px; opacity: 0; transition: opacity 1s ease-in-out; } #gary_portrait_inner.scrolled img { opacity: 0; } #gary_portrait_inner.hidden img { height: 0px; } /* BACKGROUNDS */ #main_bg_outer { display: none; } /* MAIN CONTENT */ .content_outer { width: 100%; height: auto; padding-top: 50px; } .content_outer.home { padding-top: 50px; } .right_column { margin-left: 0%; width: 100%; } .slideshow_outer { width: 100% !important; height: calc(50vh - 50px); } .cols_2, .cols_1 { width: 100%; } .text_outer { line-height: 21px; padding: 8px 16px; } .search_results_outer { line-height: 21px; padding: 8px 16px; } .image_outer { padding: 0px 16px; } .full_article_outer { padding: 0px 0px 16px 0px; } .full_article_outer .article_title, .full_article_outer .article_info, .full_article_outer .article_body, .full_article_outer .share_link { padding: 0px 16px; } .article_title { font-size: 14px; line-height: 18px; margin-bottom: 1.5px; } .article_image_outer { margin-bottom: 16px; } .full_article_outer .article_info, .full_article_outer .article_body { margin-bottom: 9px; } .full_article_outer .article_body p { margin: 0px 0px 15px; } .article_info { font-size: 10px; line-height: 12px; padding-top: 3px; } /* ARTILCE GRID */ .ag_outer { padding: 8px 16px; } .article_grid_each { width: 100%; padding: 8px 0px; } .short_archive_and_calendar_outer { padding: 8px 16px 8px 16px; } #show_more_link { padding: 8px 0px; } .wider .ag_article_title { font-size: 14px; line-height: 18px; height: 54px; } .wider .ag_caption_bg { background-color: #383c3e; opacity: 1; } .wider .ag_caption { position: relative; bottom: auto; left: auto; width: 100%; height: 112px; } /* SLIDESHOW */ .pager { display: none; } .ss_caption { height: 72px; } .caption_inner { padding: 8px 16px; } .ss_article_title { font-size: 14px; line-height: 18px; } .ss_lower { font-size: 10px; line-height: 12px; padding-top: 3px; } .ss_credit { display: none; } .right_column .copywrite { display: none; } #left_column .copywrite { display: block; } /* ARCHIVE */ .archive_outer { padding: 8px 32px; } .cols_3 .archive_column { width: 100%; } /* BOOKS */ .book_outer { line-height: 21px; padding: 8px 16px; } .book_image_outer { padding: 0px 0px 8px ; width: 30%; } .book_right_outer { padding: 8px 0px 8px 16px; width: 70%; } .book_description { line-height: 21px; } /* CONTACT FORM */ #enquiry_form_outer { padding: 0px 0px; } .form_input_each { padding: 0px 0px 16px; } .enquiry_form input[type="text"], .enquiry_form textarea { width: 100%; } .enquiry_form input[type="text"] { max-width: 300px; } /* MOBILE MENU */ #menu_outer { display: none; } #mobile_menu_icon_outer { display: block; } #social_media_icons { display: none; } #header_logo { width: 31.25%; padding: 3px 16px 0px; } #menu_outer { width: 56.75%; } #header_logo a { height: 24px; min-width: 160px; } #header_logo img { width: 160px; } #header_logo:hover img { margin-top: -24px; } #ef_thank_you { padding: 0px 0px; } } @media only screen and (min-width: 501px) and (max-width: 767px) { /* LEFT COLUMN */ #left_column_outer { position:relative; top: auto; left: auto; height: auto; background-color: #525559; } #left_column_inner { height: auto; } #left_column { width: 100%; height: auto; padding-top: 32px; padding-left: 8px; padding-right: 8px; } #left_column .copywrite { color: #b7b7b7; } .copywrite a, .copywrite a:visited { color: #FFFFFF; } .copywrite a:hover { color: #b7b7b7; } .latest_book_outer { width: 40%; display: inline-block; vertical-align: top; } #twitter_outer { width: 60%; display: inline-block; padding: 16px; vertical-align: top; } #gary_portrait_outer { display: none; } #gary_portrait_outer img { width: 190px; opacity: 0; transition: opacity 1s ease-in-out; } #gary_portrait_inner.scrolled img { opacity: 0; } #gary_portrait_inner.hidden img { height: 0px; } /* BACKGROUNDS */ #main_bg_outer { display: none; } /* MAIN CONTENT */ .content_outer { width: 100%; height: auto; padding-top: 50px; } .content_outer.home { padding-top: 50px; } .right_column { margin-left: 0%; width: 100%; } .slideshow_outer { width: 100% !important; height: calc(100vh - 50px); } .cols_2, .cols_1 { width: 100%; } .text_outer { line-height: 24px; padding: 8px 16px; } .search_results_outer { line-height: 21px; padding: 8px 16px; } .image_outer { padding: 0px 16px; } .full_article_outer { padding: 0px 0px 16px 0px; } .full_article_outer .article_title, .full_article_outer .article_info, .full_article_outer .article_body, .full_article_outer .share_link { padding: 0px 16px; } .article_title { font-size: 14px; line-height: 18px; margin-bottom: 1.5px; } .article_image_outer { margin-bottom: 16px; } .full_article_outer .article_info, .full_article_outer .article_body { margin-bottom: 9px; } .full_article_outer .article_body p { margin: 0px 0px 15px; } .article_info { font-size: 10px; line-height: 12px; padding-top: 3px; } /* ARTILCE GRID */ .ag_outer { padding: 8px 16px; } .article_grid_each { width: 50%; padding: 8px 8px; } .short_archive_and_calendar_outer { padding: 8px 24px 8px 24px; } #show_more_link { padding: 8px 8px; } /* SLIDESHOW */ .pager { display: none; } .ss_caption { height: 72px; } .caption_inner { padding: 8px 16px; } .ss_article_title { font-size: 14px; line-height: 18px; } .ss_lower { font-size: 10px; line-height: 12px; padding-top: 3px; } .ss_credit { display: none; } .right_column .copywrite { display: none; } #left_column .copywrite { display: block; } /* ARCHIVE */ .archive_outer { padding: 8px 32px; } /* BOOKS */ .book_outer { line-height: 21px; padding: 8px 16px; } .book_image_outer { padding: 0px 0px 8px ; width: 40%; } .book_right_outer { padding: 8px 0px 8px 16px; width: 60%; } .book_description { line-height: 21px; } /* CONTACT FORM */ #enquiry_form_outer { padding: 0px 0px; } .form_input_each { padding: 0px 0px 16px; } .enquiry_form input[type="text"], .enquiry_form textarea { width: 100%; } .enquiry_form input[type="text"] { max-width: 300px; } /* MOBILE MENU */ #menu_outer { display: none; } #mobile_menu_icon_outer { display: block; } #social_media_icons { display: none; } #header_logo { width: 31.25%; padding: 3px 16px 0px; } #menu_outer { width: 56.75%; } #header_logo a { height: 24px; min-width: 160px; } #header_logo img { width: 160px; } #header_logo:hover img { margin-top: -24px; } #mob_menu_outer { padding: 60px 16px 80px; } } @media only screen and (min-width: 501px) and (max-width: 660px) { .latest_book_outer { width: 100%; display: inline-block; vertical-align: top; } #twitter_outer { width: 100%; display: inline-block; padding: 16px; vertical-align: top; } .lb_left { width: 25%; padding: 8px 0px 8px 8px; } .lb_right { width: 75%; padding: 8px 8px 8px 16px; } } @media only screen and (min-width: 768px) and (max-width: 1047px) { /* LEFT COLUMN */ #left_column_outer { position:relative; top: auto; left: auto; height: auto; background-color: #525559; } #left_column_inner { height: auto; } #left_column { width: 100%; height: auto; padding-top: 32px; } #left_column .copywrite { color: #b7b7b7; } .copywrite a, .copywrite a:visited { color: #FFFFFF; } .copywrite a:hover { color: #b7b7b7; } #gary_portrait_outer { display: none; } #gary_portrait_outer img { width: 320px; opacity: 0; transition: opacity 1s ease-in-out; } #gary_portrait_inner.scrolled img { opacity: 0; } #gary_portrait_inner.hidden img { height: 0px; } .latest_book_outer { width: 40%; display: inline-block; vertical-align: top; } #twitter_outer { width: 60%; display: inline-block; padding: 16px; vertical-align: top; } /* BACKGROUNDS */ #main_bg_outer { display: none; } /* MAIN CONTENT */ .content_outer { width: 100%; height: auto; padding-top: 50px; } .content_outer.home { padding-top: 50px; } .right_column .copywrite { display: none; } #left_column .copywrite { display: block; text-align: right; } .right_column { margin-left: 0%; width: 100%; } .slideshow_outer { width: 100% !important; height: calc(50vh - 50px); } .ss_caption { height: 72px; } .caption_inner { padding: 8px 16px 8px 16px; } .ss_article_title { font-size: 16px; line-height: 18px; } .ss_lower { font-size: 12px; line-height: 14px; padding-top: 3px; } .pager a { height: 16px; width: 16px; } .full_article_outer { padding: 0px 0px 32px 0px; } .full_article_outer .article_title, .full_article_outer .article_info, .full_article_outer .article_body, .full_article_outer .share_link { padding: 0px 32px; } .article_title { font-size: 16px; line-height: 18px; } .article_info { font-size: 12px; line-height: 14px; padding-top: 3px; } .full_article_outer .article_image_outer { margin-bottom: 32px; } .full_article_outer .article_info, .full_article_outer .article_body { margin-bottom: 18px; } .full_article_outer .article_body p { margin: 0px 0px 30px; } #show_more_link { padding: 30px 8px; } /* ARTILCE GRID */ .ag_outer { padding: 8px 8px; } .article_grid_each { padding: 8px 8px; } .short_archive_and_calendar_outer { padding: 16px 8px 8px 0px; } #header_logo { width: 31.25%; padding: 3px 16px 0px; } #menu_outer { width: 53.75%; } #header_logo a { height: 24px; } #header_logo img { width: 160px; } #header_logo:hover img { margin-top: -24px; } .menu_item { font-size: 18px; line-height: 18px; padding-top: 6px; } #social_media_icons { font-size: 18px; line-height: 18px; padding: 6px 16px 0px 0px; width: 15%; } #social_media_icons a { margin-left: 8px; } /* CONTACT FORM */ .form_input_each { padding: 0px 0px 16px; } } @media only screen and (min-width: 1048px) and (max-width: 1320px) { .ss_article_title { font-size: 18px; line-height: 21px; } } @media only screen and (min-width: 1320px) { #gary_portrait_inner { max-width: 1775px; } #gary_portrait_inner img { width: 320px; } } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { }