@font-face { font-family: 'MyriadProLight'; src: url('https://ohcomely.co.uk/public/fonts/myriadpro-light-webfont.eot'); src: url('https://ohcomely.co.uk/public/fonts/myriadpro-light-webfont.eot?#iefix') format('embedded-opentype'), url('https://ohcomely.co.uk/public/fonts/myriadpro-light-webfont.woff') format('woff'), url('https://ohcomely.co.uk/public/fonts/myriadpro-light-webfont.ttf') format('truetype'), url('https://ohcomely.co.uk/public/fonts/myriadpro-light-webfont.svg#MyriadProLight') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'MyriadProLight'; src: url('https://ohcomely.co.uk/public/fonts/myriadpro-lightit-webfont.eot'); src: url('https://ohcomely.co.uk/public/fonts/myriadpro-lightit-webfont.eot?#iefix') format('embedded-opentype'), url('https://ohcomely.co.uk/public/fonts/myriadpro-lightit-webfont.woff') format('woff'), url('https://ohcomely.co.uk/public/fonts/myriadpro-lightit-webfont.ttf') format('truetype'), url('https://ohcomely.co.uk/public/fonts/myriadpro-lightit-webfont.svg#MyriadProLight') format('svg'); font-weight: normal; font-style: italic; } @font-face { font-family: 'MyriadProLight'; src: url('https://ohcomely.co.uk/public/fonts/myriadpro-semibold-webfont.eot'); src: url('https://ohcomely.co.uk/public/fonts/myriadpro-semibold-webfont.eot?#iefix') format('embedded-opentype'), url('https://ohcomely.co.uk/public/fonts/myriadpro-semibold-webfont.woff') format('woff'), url('https://ohcomely.co.uk/public/fonts/myriadpro-semibold-webfont.ttf') format('truetype'), url('https://ohcomely.co.uk/public/fonts/myriadpro-semibold-webfont.svg#MyriadProLight') format('svg'); font-weight: bold; font-style: normal; } @font-face { font-family: 'MyriadProLight'; src: url('https://ohcomely.co.uk/public/fonts/myriadpro-semiboldit-webfont.eot'); src: url('https://ohcomely.co.uk/public/fonts/myriadpro-semiboldit-webfont.eot?#iefix') format('embedded-opentype'), url('https://ohcomely.co.uk/public/fonts/myriadpro-semiboldit-webfont.woff') format('woff'), url('https://ohcomely.co.uk/public/fonts/myriadpro-semiboldit-webfont.ttf') format('truetype'), url('https://ohcomely.co.uk/public/fonts/myriadpro-semiboldit-webfont.svg#MyriadProLight') format('svg'); font-weight: bold; font-style: italic; } @font-face { font-family: 'BrandonGrotesque'; src: url('https://ohcomely.co.uk/public/fonts/brandon_reg-webfont.eot'); src: url('https://ohcomely.co.uk/public/fonts/brandon_reg-webfont.eot?#iefix') format('embedded-opentype'), url('https://ohcomely.co.uk/public/fonts/brandon_reg-webfont.woff') format('woff'), url('https://ohcomely.co.uk/public/fonts/brandon_reg-webfont.ttf') format('truetype'), url('https://ohcomely.co.uk/public/fonts/brandon_reg-webfont.svg#BrandonGrotesque') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'BrandonGrotesque'; src: url('https://ohcomely.co.uk/public/fonts/brandon_reg_it-webfont.eot'); src: url('https://ohcomely.co.uk/public/fonts/brandon_reg_it-webfont.eot?#iefix') format('embedded-opentype'), url('https://ohcomely.co.uk/public/fonts/brandon_reg_it-webfont.woff') format('woff'), url('https://ohcomely.co.uk/public/fonts/brandon_reg_it-webfont.ttf') format('truetype'), url('https://ohcomely.co.uk/public/fonts/brandon_reg_it-webfont.svg#BrandonGrotesque') format('svg'); font-weight: normal; font-style: italic; } @font-face { font-family: 'BrandonGrotesque'; src: url('https://ohcomely.co.uk/public/fonts/brandon_bld-webfont.eot'); src: url('https://ohcomely.co.uk/public/fonts/brandon_bld-webfont.eot?#iefix') format('embedded-opentype'), url('https://ohcomely.co.uk/public/fonts/brandon_bld-webfont.woff') format('woff'), url('https://ohcomely.co.uk/public/fonts/brandon_bld-webfont.ttf') format('truetype'), url('https://ohcomely.co.uk/public/fonts/brandon_bld-webfont.svg#BrandonGrotesque') format('svg'); font-weight: bold; font-style: normal; } @font-face { font-family: 'BrandonGrotesque'; src: url('https://ohcomely.co.uk/public/fonts/brandon_bld_it-webfont.eot'); src: url('https://ohcomely.co.uk/public/fonts/brandon_bld_it-webfont.eot?#iefix') format('embedded-opentype'), url('https://ohcomely.co.uk/public/fonts/brandon_bld_it-webfont.woff') format('woff'), url('https://ohcomely.co.uk/public/fonts/brandon_bld_it-webfont.ttf') format('truetype'), url('https://ohcomely.co.uk/public/fonts/brandon_bld_it-webfont.svg#BrandonGrotesque') format('svg'); font-weight: bold; font-style: italic; } @font-face { font-family: 'Rabiohead'; src: url('https://ohcomely.co.uk/public/fonts/rabiohead-webfont.eot'); src: url('https://ohcomely.co.uk/public/fonts/rabiohead-webfont.eot?#iefix') format('embedded-opentype'), url('https://ohcomely.co.uk/public/fonts/rabiohead-webfont.woff') format('woff'), url('https://ohcomely.co.uk/public/fonts/rabiohead-webfont.ttf') format('truetype'), url('https://ohcomely.co.uk/public/fonts/rabiohead-webfont.svg#Rabiohead') format('svg'); font-weight: normal; font-style: normal; } html.busy, html.busy * { cursor:wait !important; } * { padding:0; margin:0; } html, body { height:100%; font-family: 'BrandonGrotesque','HelveticaNeue','Helvetica','Verdana',sans-serif; } h2 { margin:20px 0px; font-size:15px; font-weight:normal; text-align:center; text-transform:uppercase; letter-spacing:0.2em; } h3 { margin:10px 0px; font-size:22px; font-weight:normal; color:#67A0D5; } h4 { margin:10px 0px; font-size:15px; font-weight:normal; color:#67A0D5; } h1.first, h2.first, h3.first, h4.first { margin-top:0px; } p { margin:14px 0px; font-size:17px; line-height:135%; } a { text-decoration:none; color:#67A0D5; } input, textarea { padding:4px 8px; border:0px; background-color:#eee; color:#333; font:inherit; font-size:16px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; border-radius: 6px 6px 6px 6px; -moz-border-radius: 6px 6px 6px 6px; -webkit-border-radius: 6px 6px 6px 6px; outline:0px; -webkit-appearance:none; } input[type='checkbox'] { padding:4px 8px; border:0px; background-color:#eee; color:#333; font:inherit; font-size:16px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; border-radius: 6px 6px 6px 6px; -moz-border-radius: 6px 6px 6px 6px; -webkit-border-radius: 6px 6px 6px 6px; outline:0px; -webkit-appearance:checkbox; } input[type='radio'] { padding:4px 8px; border:0px; background-color:#eee; color:#333; font:inherit; font-size:16px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; border-radius: 6px 6px 6px 6px; -moz-border-radius: 6px 6px 6px 6px; -webkit-border-radius: 6px 6px 6px 6px; outline:0px; -webkit-appearance:radio; } select { padding:4px 8px; border:0px; background-color:#eee; color:#333; font:inherit; font-size:16px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; border-radius: 6px 6px 6px 6px; -moz-border-radius: 6px 6px 6px 6px; -webkit-border-radius: 6px 6px 6px 6px; outline:0px; } button { padding:4px 8px; border:0px; background-color:#67A0D5; color:#fff; font:inherit; font-size:14px; border-radius: 8px 8px 8px 8px; -moz-border-radius: 8px 8px 8px 8px; -webkit-border-radius: 8px 8px 8px 8px; outline:0px; -webkit-appearance:none; transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; } button:hover { background-color:; cursor:pointer; } div.primary-container { width:100%; height:100%; min-width:300px; min-height:300px; position:relative; } div.secondary-container { width:100%; min-width:300px; min-height:300px; position:relative; } div.minor-container { width:100%; min-width:300px; min-height:100px; position:relative; padding:10px 0px; } div.single-column { width:90%; max-width:550px; margin:50px auto; } div#menu-bar { position:fixed; height:100%; width:26px; padding:0px 4px; background-color:transparent; background-image: url('https://ohcomely.co.uk/public/images/site/temp/fff060.png'); background-repeat:repeat; z-index:10; transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; } div#menu-bar-h { position:fixed; width:100%; background-color:rgba(255,255,255,0.6); /*background-color:transparent; background-image: url('https://ohcomely.co.uk/public/images/site/temp/fff060.png'); background-repeat:repeat; */ text-align:center; z-index:10; transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; } div#menu-bar-h span, div#menu-bar-bottom span { display:inline-block; padding:3px 8px; font-size:14px; text-transform:capitalize; /*font-family: 'Rabiohead'; font-size:21px; text-transform:lowercase;*/ letter-spacing:0.1em; color:#555;} div#menu-bar-bottom { width:100%; background-color:#fff; text-align:center; z-index:10; transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; } #menu-current span { background-color:rgba(0,128,256,0.1); } div.arrow-text-below { position:absolute; bottom:10px; left:50%; font-weight:bold; color:#aaa; } div.home-navigator a { color:#fff; } div.home-navigator { width:92%; max-width:360px; margin:0px auto; color:white; background-color:rgba(96,96,96,0.5); border:2px solid white; text-align:center; font-size:12px; letter-spacing:1px; text-transform:uppercase;} div.home-navigator.caption { padding:0px 10px; text-transform:none; text-align:left; font-size:13px; } div.home-navigator.caption p { font-size:12px; } div.home-navigator.caption p a { color:#eee; font-size:11px; } div.info-container { width:100%; margin:0px auto; overflow:hidden; } div.info-column-left { display:inline-block; width:450px; height:450px; vertical-align:top; } div.info-column-right { display:inline-block; width:450px; vertical-align:top; } .info-text-padding-box { height:55%; border-right:3px solid #ddd; padding-right:22px; } @media(max-width:700px) { div.info-column-left, div.info-column-right { width:100%; min-width:300px; max-width:450px; } div.info-column-right > img { width:100%; max-width:450px; margin:0px auto; } .info-text { padding:0px 20px; } } @media(max-width:330px) { .info-text-padding-box { border-right:0px; } } div.issue-panel { position:relative; display:block; width:180px; margin:0px auto; background-color:#fff; } div.issue-panel .issue-overlay { position:absolute; width:100%; height:100%; top:0px; background-color:#999; opacity:0; transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; } div.issue-panel:hover .issue-overlay { opacity:0.5; } div.issue-panel .issue-title { position:absolute; width:100%; height:100%; top:0px; opacity:0; transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; } div.issue-panel:hover .issue-title { opacity:1; } .collapsible-head { cursor:pointer; } div#shop-container { width:100%; background-color:#fff; } div.shop-item-description { text-align:center; margin:0px auto; padding:4px 0px 0px; } div.shop-item-description p { margin:4px 0px; font-size:12px; text-transform:uppercase; letter-spacing:1px; color:#555; } label.shop-item { cursor:pointer; } label#shipping-label { padding:10px 0px; } label#shipping-label select { cursor:pointer; } #dialog-shop-item p { font-size:15px; } #dialog-shop-item p.dialog-shop-item-headline { margin:10px 0px; font-size:18px; color:#999; } #dialog-shop-item p.dialog-shop-item-price { color:#aaa; } .shop-info-box { margin:0px 0px 12px; padding:8px; background-color:#fff; text-align:center; border:5px solid #eee;} .shop-info-box td { font-size:15px; } .rounded { border-radius: 8px 8px 8px 8px; -moz-border-radius: 8px 8px 8px 8px; -webkit-border-radius: 8px 8px 8px 8px; } .circle { border-radius:50%; -moz-border-radius:50%; -webkit-border-radius:50%; } div.rounded-inputs label { display:block; margin:8px 0px; } div.rounded-inputs label span { color:#777; } div.rounded-inputs input, div.rounded-inputs select { width:100%; } #shop-submit { color:#fff; background-color:#67A0D5; cursor:pointer;} #issue-buy-this { color:#67A0D5; background-color:#fff; border:1px dashed #67A0D5; cursor:pointer;} #shop-form table tbody { color:#666; font-size:small; } #subscribe-main-column { display:inline-block; width:62%; max-width:480px; margin:20px 15px 20px 8px; vertical-align:top; } #subscribe-main-column label { display:block; margin:4px 0px; } #subscribe-side-column { display:inline-block; width:30%; max-width:280px; margin:20px 8px 20px 15px; vertical-align:top; text-align:left; } div.subs-panel-head { font-size:14px; padding:4px; background-color:#f5fbff; text-transform:uppercase; letter-spacing:0.1em; } div.subs-panel-body { display:block; text-align:left; } div.subs-panel-address { display:block; text-align:left; } div.subs-panel-body label { font-size:16px; } div.subs-panel-address p { font-size:16px; } div.subs-panel-address span { font-size:14px; color:#777; } div.subs-panel-address input, div.subs-panel-address select { width:100%; } div.subs-store-product { margin:10px; background:#fff; border:6px solid #eee; text-align:center; } div.subs-store-product > div { padding:12px 0px 8px; } div.subs-store-product td { color:#555; } div.subs-panel-issues label .issue-overlay { position:absolute; width:100%; height:100%; top:0px; left:0px; background-color:#999; opacity:0; transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; } div.subs-panel-issues label:hover .issue-overlay { opacity:0.3; } div.subs-panel-issues label .border-color-blue.issue-overlay { opacity:0.8; } div.subs-panel-issues label .issue-overlay-text { position:absolute; width:100%; height:100%; top:0px; left:0px; color:#fff; opacity:0; transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; } div.subs-panel-issues label:hover .issue-overlay-text, div.subs-panel-issues label .border-color-blue.issue-overlay-text { opacity:1; } div.subs-info-text p { font-size:15px; color:#555; text-align:left; } .issue-overlay-text table { width:100%; height:100%; font-size:16px; } .issue-overlay-text table td { text-align:center; text-transform:uppercase; letter-spacing:0.1em; } .issue-overlay-text table td div { width:44px; margin:0px auto; padding:3px; border:1px solid #fff; font-size:11px; } .sidebar-total { width:100%; padding:9px; border:1px solid #eee; background-color:#fafafa; } .sidebar-total .table-total td { font-size:21px; color:#aaa; } .sidebar-total .table-body-dynamic td { font-size:14px; color:#333; } #blog-container img { width:100%; max-width:600px; } #blog-container > div { width:100%; max-width:600px; margin:50px auto; padding:20px 0px; background-color:#fff; } #blog-container > div > div { width:90%; max-width:500px; margin:0px auto; } #no-template-pager > div { display:inline-block; height:35px; overflow:hidden; transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -webkit-transition: all 0.1s ease-in-out; } #no-template-pager > div > div { padding-top:8px; transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -webkit-transition: all 0.1s ease-in-out; } #no-template-pager > div.cycle-pager-active > div { padding-top:0px; } #no-template-pager > div > div > div { background-color:#ccc; } #no-template-pager img { width:60px; opacity:0.25; transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -webkit-transition: all 0.1s ease-in-out; } #no-template-pager .cycle-pager-active img { opacity:1.0; } .wide-panel { width:90%; min-width:290px; margin:0px auto; } .stockist-panel { margin-bottom:10px; padding-bottom:10px; text-align:left; border-bottom: 2px solid #f1f1f1; } .stockist-panel a { color:#aaa; } .blog-head-cell { width:30%; float:left; } .blog-body-cell { width:70%; float:left; } .blog-body-cell-padding { margin:0px 10px; } .stockist-headline { color:#777; font-size:24px; line-height:95%; margin:0px 0px 0px 0px; } .stockist-body { color:#555; font-size:14px; line-height:130%; } .staff-panel { position:relative; float:left; width:109px; height:115px; margin:2px; overflow:hidden; text-align:left; } .staffbox-panel { margin-bottom:10px; padding-bottom:10px; text-align:left; } .staffbox-headline { color:#999; font-size:21px; line-height:95%; margin:0px 0px 0px 0px;} .staffbox-body { color:#555; font-size:14px; line-height:120%;} .info-navigator a { color:#aaa; } .info-text p.info-headline { font-size:13px; margin:0px 0px 15px; text-transform:uppercase; letter-spacing:0.2em; } .info-text { text-align:left; padding:0px 35px 0px 25px; width:64%; } .info-text a { color:#aaa; } .info-text p { font-size:15px; } .info-text.issue-text p { font-size:13px; line-height:130%; } .info-caption { margin:2px 0px; text-align:right; font-size:12px; color:#333; } .info-caption a { color:#999; } .info-address { font-size:13px; color:#999; } .left-column {float:left; width:41%;} .right-column {float:left; width:58%;} @media (max-width:700px) { .left-column, .right-column { width:100%; min-width:300px; } .left-column > div, .right-column > div { padding:36px; } } .transition { transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; } .transition-slow { transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; } .social-buttons { list-style: none; list-style-type: none;} .social-buttons-vertical { margin:8px 0px 0px 0px; padding:10px 0px; text-align:left;} .social-buttons-vertical li { text-align:left; list-style: none; list-style-type: none;} .social-buttons-horizontal { margin:0; padding:3px 0px 22px;} .required, #shop-form span.required, #subscribe-main-column span.required { color:#67A0D5; } .grey { color:#888; } .beige-bg { background-color:#fbf9f3; }