/*
* HTML5 Boilerplate
*
* What follows is the result of much research on cross-browser styling.
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
* Kroc Camen, and the H5BP dev community and team.
*/
/* ==========================================================================
Base styles: opinionated defaults
========================================================================== */
html,
button,
input,
select,
textarea {
color: #222;
}
body {
font-size: 1em;
line-height: 1.4;
}
/*
* Remove text-shadow in selection highlight: h5bp.com/i
* These selection declarations have to be separate.
* Customize the background color to match your design.
*/
::-moz-selection {
background: #b3d4fc;
text-shadow: none;
}
::selection {
background: #b3d4fc;
text-shadow: none;
}
/*
* A better looking default horizontal rule
*/
hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #ccc;
margin: 1em 0;
padding: 0;
}
/*
* Remove the gap between images and the bottom of their containers: h5bp.com/i/440
*/
img {
vertical-align: middle;
}
/*
* Remove default fieldset styles.
*/
fieldset {
border: 0;
margin: 0;
padding: 0;
}
/*
* Allow only vertical resizing of textareas.
*/
textarea {
resize: vertical;
}
/* ==========================================================================
Chrome Frame prompt
========================================================================== */
.chromeframe {
margin: 0.2em 0;
background: #ccc;
color: #000;
padding: 0.2em 0;
}
/* ==========================================================================
General
========================================================================== */
html { background: #FFF; }
body { font-family: 'Lato', sans-serif; }
a { color: #000; text-decoration: none; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
h1 { margin: 0; }
.lobster { font-family: 'Lobster', sans-serif; font-weight: normal; }
.lato { font-family: 'Lato', sans-serif; }
.loading {
display:none;
position:absolute;
left:50%;
margin-left:-138px;
margin-top:25px
}
/* ==========================================================================
Header
========================================================================== */
.header{ background: #1f1f1f url('http://static.tumblr.com/y4luwm0/dYqmc6gdq/tvh-bg2.jpg'); padding: 40px 40px 0; z-index: 10 !important; }
#logo { text-align: center; color: #FFF }
#logo img { max-width: 525px; width: 100%; top: 10px; z-index: 15; position: relative; height: auto; }
.vintage-hue { height: 7px; width: 100%; position: absolute; /*-webkit-box-shadow: 0px -6px 9px #191919;*/ }
/* ==========================================================================
Main Content
========================================================================== */
#container { width: 100%; padding: 0; margin: 30px 0 0; background: #FFF; }
.content { margin: 0 auto; height: 100%; }
.post, .post-ma { width: 300px; margin: 0 10px 20px ; float: left; height: auto; display: inline; }
.post img, .post-ma img { max-width: 100%; width: 500px; height: auto; display: block; }
.post img:hover {}
.photo img:hover {}
/* Audio */
.audio_player {}
.audio_player embed {}
.ib-container{}
.ib-container:before, .ib-container:after { content:""; display:table; }
.ib-container:after { clear:both; }
.ib-container article{
cursor: pointer;
z-index: 1;
-webkit-backface-visibility: hidden;
-webkit-transition:
opacity 0.4s linear,
-webkit-transform 0.4s ease-in-out,
box-shadow 0.4s ease-in-out;
-moz-transition:
opacity 0.4s linear,
-moz-transform 0.4s ease-in-out,
box-shadow 0.4s ease-in-out;
-o-transition:
opacity 0.4s linear,
-o-transform 0.4s ease-in-out,
box-shadow 0.4s ease-in-out;
-ms-transition:
opacity 0.4s linear,
-ms-transform 0.4s ease-in-out,
box-shadow 0.4s ease-in-out;
transition:
opacity 0.4s linear,
transform 0.4s ease-in-out,
box-shadow 0.4s ease-in-out;
}
.ib-container article.blur { opacity: 0.65;
filter: grayscale(80%);
-webkit-filter: grayscale(80%);
-moz-filter: grayscale(80%);
-ms-filter: grayscale(80%);
-o-filter: grayscale(80%);
}
.ib-container article.active{ z-index: 100; opacity: 1; }
.fb-like-box {
position: relative;
top: -153px;
background: #FFF;
width: 234px;
left: 34px;
}
/* ==========================================================================
Mini Panel
========================================================================== */
article .mini-panel { top: 0; display: none; position: absolute; left: 300px; z-index: 15; background: black; padding: 5px 10px 4px; }
article:hover .mini-panel { display: none; }
.minicons { font-family: 'minicons'; color: #FFF; font-size: 1.4em; }
p.minicons { margin: 0; -moz-transition: all 0.2s ease-out; -webkit-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; }
p.minicons:hover { }
.reblog-btn { }
.reblog-btn p.minicons { font-size: 1.3em;}
.reblog-btn:hover p.minicons:hover { color: #ef683b; cursor:pointer;-webkit-transform:rotate(-90deg);-moz-transform:rotate(-90deg);transform:rotate(-90deg); }
.icon-heart { margin: 0 0 3px 0; position: relative; top:4px; left: 0px; font-size: 1.3em; cursor:pointer; display:inline-block; color: #FFF; -moz-transition: all 0.2s ease-out; -webkit-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; }
.icon-heart:hover { color: #FFF; -moz-transform: scale(1.1); -webkit-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); -moz-transition: all 0.2s ease-out; -webkit-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; }
.icon-heart-2 { position: relative; top: 2px; font-size: 1.4em; cursor:pointer; display:inline-block; color: #d0333c; -moz-transition: all 0.2s ease-out; -webkit-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; }
.permalink-btn { display: none; }
.permalink-btn:hover p.minicons:hover { color: #efca46; -moz-transform: scale(1.0); -webkit-transform: scale(1.0); -ms-transform: scale(1.0); -o-transform: scale(1.0); }
@font-face {
font-family: 'minicons';
src:url('http://www.bernasovskiy.com/thevintagehue/fonts/minicons.eot');
}
@font-face {
font-family: 'minicons';
src: url(data:font/svg;charset=utf-8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/Pgo8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiID4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8bWV0YWRhdGE+ClRoaXMgaXMgYSBjdXN0b20gU1ZHIGZvbnQgZ2VuZXJhdGVkIGJ5IEljb01vb24uCjIKPC9tZXRhZGF0YT4KPGRlZnM+Cjxmb250IGlkPSJtaW5pY29ucyIgaG9yaXotYWR2LXg9IjUxMiIgPgo8Zm9udC1mYWNlIHVuaXRzLXBlci1lbT0iNTEyIiBhc2NlbnQ9IjQ4MCIgZGVzY2VudD0iLTMyIiAvPgo8bWlzc2luZy1nbHlwaCBob3Jpei1hZHYteD0iNTEyIiAvPgo8Z2x5cGggdW5pY29kZT0iJiN4MjQ7IiBkPSJNIDUxMi4wMCwzODIuNzkxYy0xOC44MzgtOC4zNTQtMzkuMDgyLTE0LjAwMS02MC4zMy0xNi41NGMgMjEuNjg2LDEzLjAwLCAzOC4zNDMsMzMuNTg1LCA0Ni4xODYsNTguMTE1CgljLTIwLjI5OC0xMi4wMzktNDIuNzc4LTIwLjc4LTY2LjcwNS0yNS40OWMtMTkuMTYsMjAuNDE1LTQ2LjQ2MSwzMy4xNy03Ni42NzMsMzMuMTdjLTU4LjAxMSwwLjAwLTEwNS4wNDQtNDcuMDI5LTEwNS4wNDQtMTA1LjAzOQoJYzAuMDAtOC4yMzMsIDAuOTI5LTE2LjI1LCAyLjcyLTIzLjkzOWMtODcuMzAsNC4zODItMTY0LjcwMSw0Ni4yMC0yMTYuNTA5LDEwOS43NTNjLTkuMDQyLTE1LjUxNC0xNC4yMjMtMzMuNTU4LTE0LjIyMy01Mi44MDkKCWMwLjAwLTM2LjQ0NCwgMTguNTQ0LTY4LjU5NiwgNDYuNzMtODcuNDMzYy0xNy4yMTksMC41NDYtMzMuNDE2LDUuMjcxLTQ3LjU3NywxMy4xMzljLTAuMDEtMC40MzgtMC4wMS0wLjg3OC0wLjAxLTEuMzIxCgljMC4wMC01MC44OTQsIDM2LjIwOS05My4zNDgsIDg0LjI2MS0xMDMuMDBjLTguODEzLTIuNDAtMTguMDk0LTMuNjg2LTI3LjY3NC0zLjY4NmMtNi43NjksMC4wMC0xMy4zNDksMC42Ni0xOS43NjQsMS44ODYKCWMgMTMuMzY4LTQxLjczLCA1Mi4xNi03Mi4xMDMsIDk4LjEyNi03Mi45NDhjLTM1Ljk1LTI4LjE3NS04MS4yNDMtNDQuOTY3LTEzMC40NTgtNDQuOTY3Yy04LjQ3OSwwLjAwLTE2Ljg0LDAuNDk3LTI1LjA1OCwxLjQ3CgljIDQ2LjQ4Ni0yOS44MDUsIDEwMS43MDEtNDcuMTk3LCAxNjEuMDIxLTQ3LjE5N2MgMTkzLjIxMSwwLjAwLCAyOTguODY4LDE2MC4wNjIsIDI5OC44NjgsMjk4Ljg3MmMwLjAwLDQuNTU0LTAuMTAzLDkuMDg0LTAuMzA1LDEzLjU5CglDIDQ4MC4xMSwzNDMuMjI3LCA0OTcuOTE4LDM2MS43MjcsIDUxMi4wMCwzODIuNzkxeiIgLz4KPGdseXBoIHVuaWNvZGU9IiYjeDI1OyIgZD0iTSAyODcuOTM1LTMyLjAwTCAxOTIuMDAtMzIuMDAgTCAxOTIuMDAsMjI0LjAwIGwtNjQuMDAsMC4wMCBsMC4wMCw4OC4yMjUgbCA2NC4wMCwwLjAyOWwtMC4xMDQsNTEuOTc2QyAxOTEuODk2LDQzNi4yMDYsIDIxMS40MTMsNDgwLjAwLCAyOTYuMTk1LDQ4MC4wMGwgNzAuNTg4LDAuMDAgbDAuMDAtODguMjQyIGwtNDQuMTE1LDAuMDAgCgljLTMzLjAxNiwwLjAwLTM0LjYwMy0xMi4zMjgtMzQuNjAzLTM1LjM0MmwtMC4xMzEtNDQuMTYybCA3OS4zNDUsMC4wMCBsLTkuMzUyLTg4LjIyNUwgMjg4LjAwLDIyNC4wMEwgMjg3LjkzNS0zMi4wMHoiIC8+CjxnbHlwaCB1bmljb2RlPSImI3gyMTsiIGQ9Ik0gMzIwLjAwLDIyNC4wMGwwLjAwLTY0LjAwIGwgNzUuODA4LDAuMDAgbC04NS45MzYtODUuOTM2Yy01NC4yMjQtNTQuMzM2LTE0OC45NDQtNTQuMzM2LTIwMy4yMTYsMC4wMGwtNDUuMjgtNDUuMTg0CgkJQyAxMDAuNTkyLTEwLjM4NCwgMTUyLjgxNi0zMi4wMCwgMjA4LjMyLTMyLjAwYyA1NS41MzYsMC4wMCwgMTA3LjYzMiwyMS42MzIsIDE0Ni44MCw2MC44OGwgOTIuODgsOTIuODBMIDQ0OC4wMCwzMi4wMCBsIDY0LjAwLDAuMDAgTCA1MTIuMDAsMjI0LjAwIEwgMzIwLjAwLDIyNC4wMCB6TSAxOTIuMDAsMjg4LjAwTCAxMTYuMTkyLDI4OC4wMCBsIDg1LjkzNiw4NS45MzZjIDU0LjIyNCw1NC4zMzYsIDE0OC45NDQsNTQuMzM2LCAyMDMuMjE2LDAuMDBsIDQ1LjI4LDQ1LjE4NEMgNDExLjQwOCw0NTguMzY4LCAzNTkuMTg0LDQ4MC4wMCwgMzAzLjY2NCw0ODAuMDAKCQljLTU1LjUzNiwwLjAwLTEwNy42MzItMjEuNjMyLTE0Ni44MC02MC44OEwgNjQuMDAsMzI2LjMyTCA2NC4wMCw0MTYuMDAgTDAuMDAsNDE2LjAwIGwwLjAwLTE5Mi4wMCBsIDE5Mi4wMCwwLjAwIEwgMTkyLjAwLDI4OC4wMCB6IiAvPgo8Z2x5cGggdW5pY29kZT0iJiN4MjI7IiBkPSJNIDUxMi4wMCw0ODAuMDBMIDEyOC4wMCwyMjQuMDBMIDIyNC4wMCwxNjAuMDBMMC4wMC0zMi4wMEwgMzg0LjAwLDE2MC4wMEwgMjg4LjAwLDIyNC4wMCAJeiIgLz4KPGdseXBoIHVuaWNvZGU9IiYjeDIzOyIgZD0iTSA0MjYuNjc1LDQ4MC4wMEwgODUuMzI0LDQ4MC4wMCBDIDM4LjE5OSw0ODAuMDAsMC4wMCw0NDEuNzksMC4wMCwzOTQuNjU3bDAuMDAtMzQxLjMxNSBDMC4wMCw2LjIwOSwgMzguMTk5LTMyLjAwLCA4NS4zMjQtMzIuMDBsIDM0MS4zNTEsMC4wMCAKCUMgNDczLjgwLTMyLjAwLCA1MTIuMDAsNi4yMDksIDUxMi4wMCw1My4zNDJMIDUxMi4wMCwzOTQuNjU3IEMgNTEyLjAwLDQ0MS43OSwgNDczLjgwLDQ4MC4wMCwgNDI2LjY3NSw0ODAuMDB6IE0gMjgwLjgyMiwxMzcuOTQxCgljLTIzLjI2LDEuODA3LTMzLjAyMSwxMy4zMjgtNTEuMjUyLDI0LjQwNGMtMTAuMDMtNTIuNTg5LTIyLjI4MS0xMDMuMDA5LTU4LjU2OS0xMjkuMzQ0CgljLTExLjIwMiw3OS40ODQsIDE2LjQ0NywxMzkuMTgyLCAyOS4yODUsMjAyLjU1N2MtMjEuODkzLDM2Ljg1MywgMi42MzUsMTExLjAxNywgNDguODEsOTIuNzM3CgljIDU2LjgxMy0yMi40NzQtNDkuMjAtMTM3LjAwNCwgMjEuOTY2LTE1MS4zMDhjIDc0LjMxLTE0LjkzNCwgMTA0LjY0NCwxMjguOTI5LCA1OC41NzEsMTc1LjcxMgoJYy02Ni41NzksNjcuNTUzLTE5My43OTksMS41NC0xNzguMTU1LTk1LjE3OGMgMy44MDctMjMuNjQ2LCAyOC4yMzYtMzAuODE5LCA5Ljc2Mi02My40NTFjLTQyLjYxLDkuNDQ2LTU1LjMyNSw0My4wNTEtNTMuNjg4LDg3Ljg1NgoJYyAyLjYzNCw3My4zMzcsIDY1Ljg5MiwxMjQuNjgyLCAxMjkuMzQzLDEzMS43ODNjIDgwLjI0Miw4Ljk4MiwgMTU1LjU1My0yOS40NTQsIDE2NS45NTMtMTA0LjkzOAoJQyA0MTQuNTUzLDIyMy41NzcsIDM2Ni42MjMsMTMxLjMwNywgMjgwLjgyMiwxMzcuOTQxeiIgLz4KPGdseXBoIHVuaWNvZGU9IiYjeDI4OyIgZD0iTTAuMDAsMjI0LjAwYzAuMDAtMTQxLjM3NiwgMTE0LjYyNC0yNTYuMDAsIDI1Ni4wMC0yNTYuMDBjIDE0MS4zOTIsMC4wMCwgMjU2LjAwLDExNC42MjQsIDI1Ni4wMCwyNTYuMDBjMC4wMCwxNDEuMzkyLTExNC42MDgsMjU2LjAwLTI1Ni4wMCwyNTYuMDBDIDExNC42MjQsNDgwLjAwLDAuMDAsMzY1LjM5MiwwLjAwLDIyNC4wMHogTSAzODQuMDAsMjI0LjAwCglsLTEyOC4wMC0xMjguMDBsMC4wMCw5Ni4wMCBMIDEyOC4wMCwxOTIuMDAgbDAuMDAsNjQuMDAgbCAxMjguMDAsMC4wMCBMIDI1Ni4wMCwzNTIuMDAgTCAzODQuMDAsMjI0LjAweiIgLz4KPGdseXBoIHVuaWNvZGU9IiYjeDI2OyIgZD0iTSAzNzcuNTk0LDQ0OC4wMGMtNTMuODE1LDAuMDAtMTAwLjEyOS00My43NzctMTIxLjU4Mi04OS41MEMgMjM0LjU0Myw0MDQuMjIyLCAxODguMjIzLDQ0OC4wMCwgMTM0LjQwNCw0NDguMDBDIDYwLjIxMyw0NDguMDAsMC4wMCwzODcuNzgsMC4wMCwzMTMuNTg0CgljMC4wMC0xNTAuOTIzLCAxNTIuMjUtMTkwLjQ5NywgMjU2LjAxMS0zMzkuNzA5QyAzNTQuMDg4LDEyMi4xNjMsIDUxMi4wMCwxNjcuNDc4LCA1MTIuMDAsMzEzLjU4NEMgNTEyLjAwLDM4Ny43OCwgNDUxLjc4NSw0NDguMDAsIDM3Ny41OTQsNDQ4LjAweiIgLz4KPGdseXBoIHVuaWNvZGU9IiYjeDI3OyIgZD0iTSAzNzcuNTk0LDQxNi4wMEMgNDM0LjA2MSw0MTYuMDAsIDQ4MC4wMCwzNzAuMDU2LCA0ODAuMDAsMzEzLjU4NGMwLjAwLTE3LjY4OS0yLjcwOS0zMy44NzctOC4yOC00OS40OTIKCWMtNS4xMDctMTQuMzEyLTEyLjY1OC0yOC4yMDUtMjMuMDg1LTQyLjQ3MmMtMjAuOTU5LTI4LjY4NC01MS40MDktNTUuNjc3LTgzLjY0Ny04NC4yNTUKCWMtMzUuMzMzLTMxLjMyMy03NC40Mi02NS45NzUtMTA5LjUwNC0xMDkuOTM4Yy0zNS4yNTIsNDIuNjg4LTczLjMzNiw3Ni4wNTItMTA3Ljc3MiwxMDYuMjIxCgljLTMzLjk2OSwyOS43Ni02My4zMDUsNTUuNDYtODQuMjU1LDg0LjM4MWMtMTAuNDI3LDE0LjM5NS0xNy45ODEsMjguNTczLTIzLjA5Niw0My4zNDhDIDM0LjczNSwyNzcuNjMsIDMyLjAwLDI5NC43MDcsIDMyLjAwLDMxMy41ODQKCUMgMzIuMDAsMzcwLjA1NiwgNzcuOTM4LDQxNi4wMCwgMTM0LjQwNCw0MTYuMDBjIDQwLjcxMywwLjAwLCA3Ni41NjMtMzYuODU2LCA5Mi42NDMtNzEuMTAxbCAyOC45NzctNjEuNzExbCAyOC45NTksNjEuNzIKCUMgMzAxLjA0NywzNzkuMTQ4LCAzMzYuODgxLDQxNi4wMCwgMzc3LjU5NCw0MTYuMDAgTSAzNzcuNTk0LDQ0OC4wMGMtNTMuODE1LDAuMDAtMTAwLjEyOS00My43NzctMTIxLjU4Mi04OS41MEMgMjM0LjU0Myw0MDQuMjIyLCAxODguMjIzLDQ0OC4wMCwgMTM0LjQwNCw0NDguMDAKCUMgNjAuMjEzLDQ0OC4wMCwwLjAwLDM4Ny43OCwwLjAwLDMxMy41ODRjMC4wMC0xNTAuOTIzLCAxNTIuMjUtMTkwLjQ5NywgMjU2LjAxMS0zMzkuNzA5QyAzNTQuMDg4LDEyMi4xNjMsIDUxMi4wMCwxNjcuNDc4LCA1MTIuMDAsMzEzLjU4NAoJQyA1MTIuMDAsMzg3Ljc4LCA0NTEuNzg1LDQ0OC4wMCwgMzc3LjU5NCw0NDguMDBMIDM3Ny41OTQsNDQ4LjAweiIgLz4KPGdseXBoIGNsYXNzPSJoaWRkZW4iIHVuaWNvZGU9IiYjeGYwMDA7IiBkPSJNMCw0ODBMIDUxMiAtMzJMMCAtMzIgeiIgaG9yaXotYWR2LXg9IjAiIC8+CjwvZm9udD48L2RlZnM+PC9zdmc+) format('svg'),
url(data:font/ttf;charset=utf-8;base64,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) format('truetype');
font-weight: normal;
font-style: normal;
}
/* Use the following CSS code if you want to use data attributes for inserting your icons */
[data-icon]:before {
font-family: 'minicons';
content: attr(data-icon);
speak: none;
font-weight: normal;
-webkit-font-smoothing: antialiased;
}
/* Use the following CSS code if you want to have a class per icon */
[class^="icon-"]:before, [class*=" icon-"]:before {
font-family: 'minicons';
font-style: normal;
speak: none;
font-weight: normal;
-webkit-font-smoothing: antialiased;
}
.icon-twitter:before {
content: "\24";
}
.icon-facebook:before {
content: "\25";
}
.icon-loop:before {
content: "\21";
}
.icon-bolt:before {
content: "\22";
}
.icon-pinterest:before {
content: "\23";
}
.icon-arrow-right-alt1:before {
content: "\28";
}
.icon-heart:before {
content: "\26";
}
.icon-heart-2:before {
content: "\26";
}
/* ==========================================================================
Permalink Page
========================================================================== */
.permalink-page .post { margin: 0 10px 10px }
.permalink-page .puba { text-transform: uppercase; font-size: 12px; padding: 0 0 10px; text-align: center; float: left; width: 300px; }
.permalink-page article .photo .puba { display: none; }
.permalink-page .mini-panel { width: 90%; text-align: center; float: right; border-top: 2px dotted black; border-bottom: 2px dotted black; padding: 10px 0; margin: 0 ; position: relative; left: -16px; }
.permalink-page .mini-panel .icon {display: inline-block; padding: 0 10px; margin: 0 }
.permalink-page article:hover .mini-panel { display: none !important }
.permalink-page article:hover .mini-panel .reblog-btn { color: #1f1f1f }
.permalink-page article:hover .mini-panel .icon-heart {}
.permalink-page .icon-heart { color: #1f1f1f ; top: 0; padding: 0 10px; }
.permalink-page .icon-heart:hover { left: 1px; }
.permalink-page .icon-heart-2 { top: 0; font-size: 1.4em; padding: 0 10px; }
.permalink-page article:hover .mini-panel .permalink-btn { color: #1f1f1f }
.permalink-page p.minicons { color: #1f1f1f}
.twitter-btn p.minicons:hover { color: #00a0b1; -moz-transform: scale(1.1); -webkit-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); }
.permalink-page .fb-btn {padding: 0 5px !important;}
.fb-btn p.minicons:hover { color: #3b5998; -moz-transform: scale(1.1); -webkit-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); }
.pin-btn p.minicons:hover { color: #cf323b; -webkit-transform:rotate(-10deg);-moz-transform:rotate(-10deg);transform:rotate(-10deg); }
.icon-heart span, .icon-heart-2 span {
height: auto;
padding: 0;
left: 50%;
width: 34px;
margin-left: -18px;
font-size: 12px;
color: #FFF;
text-align: center;
border: 0px solid #000;
background: rgba(0,0,0,1);
text-indent: 0px;
border-radius: 5px;
position: absolute;
pointer-events: none;
opacity: 0;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.icon-heart:hover span, .icon-heart-2:hover span { opacity: 0.9; bottom: 30px; }
.trendsetters {
margin: 8px 0 0;
float: right;
width: 90%;
border-bottom: 2px dotted black;
padding: 0 0 15px;
position: relative;
left: -16px;
}
.trendsetters h3 { font-size: 1.7em; text-align: center; margin: 0 0 5px; font-weight: normal; }
ol.notes { margin: 0; padding: 0; overflow: hidden; max-height: 60px; text-align: center; }
li.note { list-style-type: none; display: inline-block; margin: 0 0 4px; }
li.note img { max-width: 28px;}
.note.tumblelog_thevintagehue { display: none; }
li.note blockquote { display: none; }
span.action { display: none; }
.original-source { text-align: center; border-bottom: 2px dotted black; width: 90%; float: right; position: relative; left: -16px; }
.original-source h3 { margin: 5px 0 }
.original-source h3 a {color: #000; }
.original-source h3 a:hover {color: #00A0B1; }
/* Photosets */
#ib-container .photoset a:nth-of-type(2), #ib-container .photoset a:nth-of-type(3) { display: none; }
.permalink-page .photoset a:nth-of-type(2), .permalink-page .photoset a:nth-of-type(3) { width: 100%; float: left; margin: 10px 0 0 }
.permalink-page .photoset a:nth-of-type(3) { margin: 10px 0 0; }
/* Caption */
.caption { float: left; width: 300px; text-align: center; font-size: 14px; }
.caption a { color: #000; font-weight: bold; display: block; }
.caption a:hover { color: #00A0B1; }
/* ==========================================================================
Custom Pages
========================================================================== */
body#page {}
body#page a {color: #333; }
body#page .content { width: 820px !important }
article.page { width: 820px; margin: 0 auto 20px ; float: left; height: auto; display: inline; }
/* ==========================================================================
Footer
========================================================================== */
footer {}
.footer { background: #1f1f1f; text-align: center; width: 100%; float: left; margin: 30px 0; }
.footer p { color: #FFF; font-size: 12px; padding: 0 20px; margin: 20px 0 20px; }
.footer a { text-decoration: underline; color: #FFF }
.social-bottom { margin: 20px 0 0; display: none; }
.social-bottom h3 { color: #666; margin: 0; }
.social-bottom a p.minicons { color: #666; display: inline-block; margin: 0; font-size: 1.5em; padding: 0; position: relative; }
.social-bottom a p.minicons.twitter {}
.social-bottom a p.minicons.twitter:hover { color: #009fb1 }
.social-bottom a p.minicons.twitter:active { top: 1px; }
.social-bottom a p.minicons.facebook { font-size: 1.4em; position: relative; top: -1px; -moz-transform: scale(1); -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); }
.social-bottom a p.minicons.facebook:hover { color: #3b5998; }
.social-bottom a p.minicons.facebook:active { top: 1px; }
.pagination { float: none; background: #1f1f1f; display: inline; font-size: 25px; text-decoration: none;}
.pagination a { text-decoration: none; }
.prev { background: #00a0b1; padding: 10px; }
.prev:hover { background: #0092a2; }
.prev:active, .next:active { position: relative; top: 1px;}
.current-page { color: #FFF; background: #d0333c; padding: 10px; }
.jump-page { display: none; }
.next { background: #ef683b; padding: 10px; }
.next:hover { background: #e05b2d }
.side-nav a { text-decoration: none; }
/* ==========================================================================
Fresco is dope!
========================================================================== */
/* Overlay */
/* Overlay */
.fr-overlay {
z-index: 99999;
position: fixed;
top: 0;
left: 0;
height: 100%;
width: 100%;
zoom: 1;
overlay: hidden;
}
.fr-overlay-background {
background: #000;
filter: alpha(opacity=90);
opacity: .9;
float: left;
width: 100%;
height: 100%;
position: relative;
}
/* Window */
.fr-window {
z-index: 100000;
position: fixed;
top:0;
left: 0;
width: 100%;
height: 100%;
min-height: 100%;
}
/* z-index */
.fr-ui-outside .fr-info { z-index: 100001; }
/* Loading icon */
.fr-loading {
z-index: 100001;
position: fixed;
top: 50%;
left: 50%;
width: 52px;
height: 52px;
margin-top: -26px;
margin-left: -26px;
overflow: visible;
}
.fr-loading-offset {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.fr-loading-background, .fr-loading-icon {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.fr-loading-background {
background: #0d0d0d url('http://thevintagehue.s3.amazonaws.com/css/fresco/skins/loading.gif') 50% 50% no-repeat;
opacity: .8;
-webkit-border-radius: 3px;
border-radius: 3px;
position: relative;
float: left;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border: 1px solid rgba(80,80,80,.2);
}
.fr-loading-icon { display: none; }
/* Bubble (holds everything) */
.fr-bubble {
float: left;
width: 100%;
height: 100%;
position: relative;
}
/* Fonts */
.fr-ui,
.fr-info {
font: normal 13px/21px "Lucida Sans Unicode", "Lucida Sans", "Lucida Grande", Verdana, Arial, sans-serif;
}
/* Frames / UI */
.fr-frames {
height: 100%;
width: 100%;
position: absolute;
display:inline;
top: 0;
left: 0;
overflow: hidden;
}
.fr-frames-move {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
}
.fr-frame, .fr-ui {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
}
.fr-frame-touch {
position: relative;
float: left;
top: auto;
left: auto;
width: 100%;
}
.fr-window *:not(.fr-caption)::selection,
.fr-window *:not(.fr-caption)::-moz-selection,
.fr-window *:not(.fr-caption)::-webkit-selection {
background: transparent;
}
.fr-mobile-touch-enabled .fr-frame .fr-box {
overflow: scroll !important;
-webkit-overflow-scrolling: touch;
overflow-scrolling: touch;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.fr-frame-touch .fr-box {
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.fr-mobile-touch-enabled .fr-ui,
.fr-mobile-touch-enabled .fr-ui-spacer,
.fr-mobile-touch-enabled .fr-ui-wrapper,
.fr-mobile-touch-enabled .fr-ui-padder,
.fr-mobile-touch-enabled .fr-ui-toggle,
.fr-mobile-touch-enabled .fr-ui-outer-border,
.fr-mobile-touch-enabled .fr-side { pointer-events: none; }
/* Content */
.fr-box { position: absolute; top: 0; left: 0; height: 100%; width: 100%; }
.fr-box-has-ui-outside { overflow: hidden; }
.fr-box-spacer, .fr-ui-spacer {
position: absolute;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.fr-box-wrapper, .fr-ui-wrapper {
position: relative;
background: url('http://thevintagehue.s3.amazonaws.com/css/fresco/skins/blank.gif');
overflow: hidden;
}
.fr-box-padder, .fr-ui-padder {
position: absolute;
top: 0;
left: 0;
zoom: 1;
border-color: transparent;
border-style: solid;
border-width: 0;
background: url('http://thevintagehue.s3.amazonaws.com/css/fresco/skins/blank.gif');
}
.fr-box-padder, .fr-ui-padder {
position: absolute;
top: 0;
left: 0;
}
.fr-ui-padder { zoom: 1; }
.fr-box-wrapper, .fr-ui-wrapper, .fr-ui-toggle {
position: relative;
float: left;
display: inline;
zoom: 1;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.fr-box-wrapper { background: #101010; }
.fr-ui-wrapper-outside {
float: left;
height: 100%;
width: 100%;
}
/* outer-border */
.fr-box-outer-border,
.fr-ui-outer-border {
position: relative;
float: left;
display: inline;
height: 100%;
width: 100%;
zoom: 1;
}
/* IE < 8 has a bug where dimensions are ignored without a border */
.fr-ltIE9 .fr-box-outer-border,
.fr-ltIE9 .fr-ui-outer-border { border: 0px solid transparent; }
.fr-content {
height: 100%;
width: 100%;
zoom:1;
*display:inline;
margin: 0;
padding: 0;
}
.fr-content-image {
position: absolute;
top: 0;
left: 0;
image-rendering: optimizeQuality;
max-width: none;
}
.fr-content-image-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
pointer-events: none;
}
.fr-download-image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
filter: alpha(opacity=0);
opacity: 0;
-webkit-user-drag: element;
user-drag: element;
-webkit-user-select: none;
user-select: none;
pointer-events: auto;
}
/* onClick inside ui-outside */
.fr-onclick-side {
position: absolute;
top: 0;
width: 50%;
height: 100%;
background: url(skins/blank.gif);
overflow: hidden;
cursor: pointer;
z-index: 1;
}
.fr-onclick-side img { cursor: pointer; }
.fr-onclick-previous { left: 0; }
.fr-onclick-next { right: 0; }
.fr-side {
position: absolute;
top: 0;
height: 100%;
cursor: pointer;
overflow: hidden;
background: url('http://thevintagehue.s3.amazonaws.com/css/fresco/skins/blank.gif') 0 0 repeat;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
zoom: 1;
}
.fr-side-disabled { cursor: default; }
.fr-side-button {
position: absolute;
top: 50%;
width: 54px;
height: 72px;
margin: 0 9px;
margin-top: -36px;
pointer-events: auto;
}
.fr-side-button-icon {
float: left;
position: relative;
height: 100%;
width: 100%;
zoom: 1;
}
.fr-side-previous { left: 0; width: 50%; }
.fr-side-next { right: 0; width: 50%;}
.fr-side-previous .fr-side-button { left: 0; }
.fr-side-next .fr-side-button { right: 0; }
/* sides (UI outside), smaller area */
.fr-ui-outside .fr-side {
width: 72px;
height: 72px;
top: 50%;
margin-top: -36px;
}
.fr-ui-outside .fr-side-button { margin-top: 0; top: 0; }
/*
* Info
*/
.fr-info {
position: absolute;
bottom: 0px;
left: 0px;
width: 100%;
color: #efefef;
pointer-events: auto;
}
.fr-info-background {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
background: #000;
line-height: 1%;
filter: alpha(opacity=80);
opacity: .8;
zoom: 1;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
background: #000;
}
.fr-info-outside .fr-info-background { background: #0d0d0d; filter: none; opacity: 1; }
.fr-info-padder {
padding: 12px;
display: block;
filter: alpha(opacity=99);
overflow: hidden;
width: auto;
position: relative;
}
.fr-caption {
position: relative;
filter: alpha(opacity=99);
opacity: .99;
width: auto;
word-wrap: no-wrap;
}
.fr-position-text { position: relative; }
/* UI inside */
.fr-has-position .fr-info-inside .fr-caption { margin-right: 75px; }
.fr-info-inside .fr-position {
filter: alpha(opacity=99);
opacity: .99;
position: relative;
text-align: right;
word-wrap: no-wrap;
line-height: 21px;
color: #b3b3b3;
float: right;
width: 75px;
}
.fr-no-caption .fr-info-inside .fr-position {
width: auto;
margin: 0 1px 1px 0;
color: #b9b9b9;
filter: alpha(opacity=99);
}
.fr-info-inside .fr-position-background {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.fr-no-caption .fr-info-inside .fr-position-background {
border-radius: 12px;
background: #101010;
filter: alpha(opacity=80);
opacity: .8;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.fr-info-inside .fr-position-text { position: relative; }
.fr-no-caption .fr-info-inside .fr-position-text {
float: left;
height: 13px;
line-height: 13px;
padding: 6px 10px;
text-shadow: 0 1px 1px rgba(0,0,0,.3);
}
/* hide the position on small screens */
@media all and (max-width: 568px) and (max-height: 320px),
all and (max-width: 320px) and (max-height: 568px) {
.fr-has-position .fr-info-inside .fr-caption { margin-right: 0; }
.fr-position { display: none !important; }
/* smaller side buttons */
.fr-ui-outside .fr-side {
width: 54px;
height: 50px;
margin-top: -25px;
}
.fr-side-button {
width: 40px;
height: 50px;
margin: 0 6px;
margin-top: -25px;
}
}
/* UI outside */
.fr-ui-outside .fr-position {
position: absolute;
bottom: 15px;
right: 15px;
display: inline;
width: auto;
margin: 0 1px 1px 0;
color: #b9b9b9;
}
.fr-ui-outside .fr-position-background {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 12px;
filter: alpha(opacity=80);
opacity: .8;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
background: #1e1e1e;
border: 1px solid rgba(180,180,180,.2);
}
.fr-ui-outside .fr-position-text {
position: relative;
float: left;
width: auto;
text-align: right;
word-wrap: no-wrap;
color: #b3b3b3;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
word-wrap: no-wrap;
padding: 6px 10px;
height: 13px;
line-height: 13px;
}
.fr-ui-outside .fr-position-background {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/* Info without caption */
.fr-no-caption .fr-info-outside { display: none; }
.fr-no-caption .fr-info-padder { pointer-events: none; }
.fr-no-caption .fr-info-background { pointer-events: none; opacity: 0; filter: none; display: none;}
/* 1/5 */
.fr-no-caption .fr-position-text,
.fr-ui-outside .fr-position-text {
text-shadow: 0 1px 1px rgba(0,0,0,.3);
}
/* outside position */
.fr-ui-outside .fr-position {
float: none;
position: absolute;
bottom: 0;
right: 0;
margin: 15px;
}
/* IE 7 */
.fr-ltIE8 .fr-info * { zoom: 1; filter: alpha(opacity=99); }
.fr-ltIE8 .fr-box * { zoom: 1; filter: alpha(opacity=99); }
/* Info (UI outside) */
.fr-info-outside { bottom: auto; }
.fr-no-caption .fr-info-outside .fr-info-padder { padding: 10px 5px; }
.fr-ui-outside .fr-no-caption .fr-position { margin: 0; }
/* X */
.fr-close {
position: absolute;
top: 0px;
right: 0px;
padding: 12px;
width: 23px;
height: 23px;
cursor: pointer;
pointer-events: auto;
}
.fr-close-background {
position: absolute;
top: 12px;
left: 12px;
height: 23px;
width: 23px;
filter: alpha(opacity=80);
opacity: .8;
-moz-transition: background-color .2s ease-in;
-webkit-transition: background-color .2s ease-in;
transition: background-color .2s ease-in;
background-color: #282828;
cursor: pointer;
}
.fr-close:hover .fr-close-background { background-color: #333; }
.fr-ui-outside .fr-close-background { background-color: #363636; }
.fr-ui-outside .fr-close:hover .fr-close-background { background-color: #434343; }
.fr-close-icon {
position: relative;
float: left;
width: 100%;
height: 100%;
}
/*
* Thumbnails
*/
.fr-thumbnails {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 9%;
min-height: 40px;
max-height: 120px;
height: 9%;
padding: 20px 0;
-webkit-tap-highlight-color: rgba(0,0,0,0);
zoom: 1;
}
.fr-thumbnails,
.fr-thumbnails * {
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.fr-thumbnails-slider {
position: relative;
width: 100%;
height: 100%;
float: left;
zoom: 1;
}
.fr-thumbnails-slider-slide {
position: absolute;
top: 0;
left: 0;
height: 100%;
}
.fr-thumbnails-wrapper {
position: absolute;
top: 0;
left: 50%;
height: 100%;
padding: 20px 0;
}
.fr-thumbnails-thumbs {
float: left;
height: 100%;
overflow-x: hidden;
position: relative;
top: 0;
left: 0;
}
.fr-ltIE9 .fr-thumbnails-thumbs {
overflow: hidden;
}
.fr-thumbnails-slide {
position: absolute;
top: 0;
height: 100%;
width: 100%;
}
.fr-thumbnail {
position: relative;
width: 30px;
height: 100%;
float: left;
margin: 0 10px;
display: inline;
zoom: 1;
cursor: pointer;
}
.fr-ltIE9 .fr-thumbnail * {
overflow: hidden; /* IE6 */
z-index: 1;
zoom: 1;
}
.fr-thumbnail-wrapper {
position: relative;
background: #161616;
width: 100%;
height: 100%;
float: left;
overflow: hidden;
display: inline; /* IE6 */
z-index: 0; /* IE8 */
}
.lv_thumbnail_icon {
width: 36px;
height: 36px;
position: absolute;
top: 50%;
left: 50%;
margin-left: -18px;
margin-top: -18px;
background-position: 99px 99px;
background-repeat: no-repeat;
display: block !important;
}
.fr-thumbnail-overlay { cursor: pointer; }
.fr-thumbnail-active .fr-thumbnail-overlay { cursor: default; }
.fr-thumbnail-overlay,
.fr-thumbnail-overlay-background,
.fr-thumbnail-overlay-border {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.fr-thumbnail-overlay-border {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border-width: 0;
overflow: hidden;
border-style: solid;
border-color: transparent;
}
.fr-thumbnail img {
position: absolute;
filter: alpha(opacity=85);
opacity: .85;
max-width: none;
}
.fr-thumbnail:hover img,
.fr-thumbnail-active:hover img {
filter: alpha(opacity=99);
opacity: .99;
}
.fr-thumbnail-active img,
.fr-thumbnail-active:hover img {
filter: alpha(opacity=35);
opacity: .35;
}
.fr-thumbnail-active { cursor: default; }
/* Thumbnails loading */
.fr-thumbnail-loading,
.fr-thumbnail-loading-background,
.fr-thumbnail-loading-icon {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.fr-thumbnail-loading-background {
background-color: #101010;
background-image: url('http://thevintagehue.s3.amazonaws.com/css/fresco/skins/loading.gif');
background-position: 50% 50%;
background-repeat: no-repeat;
opacity: .8;
position: relative;
float: left;
}
/* this element is there as an alternative to putting the loading image on the background */
.fr-thumbnail-loading-icon { display: none; }
/* Thumbnail < > */
.fr-thumbnails-side {
float: left;
height: 100%;
width: 28px;
margin: 0 10px;
position: relative;
overflow: hidden;
}
.fr-thumbnails-side-previous { margin-left: 20px; }
.fr-thumbnails-side-next { margin-right: 20px; }
.fr-thumbnails-side-button {
position: absolute;
top: 50%;
left: 0;
margin-top: -15px;
width: 28px;
height: 28px;
cursor: pointer;
}
.fr-thumbnails-side-button-background {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
filter: alpha(opacity=80);
opacity: .8;
-moz-transition: background-color .2s ease-in;
-webkit-transition: background-color .2s ease-in;
transition: background-color .2s ease-in;
background-color: #333;
cursor: pointer;
border-radius: 4px;
}
.fr-thumbnails-side-button:hover .fr-thumbnails-side-button-background { background-color: #3b3b3b; }
.fr-thumbnails-side-button-disabled * { cursor: default; }
.fr-thumbnails-side-button-disabled:hover .fr-thumbnails-side-button-background { background-color: #333; }
.fr-thumbnails-side-button-icon {
height: 42px;
width: 42px;
position: absolute;
top: -7px;
left: -7px;
width: 100%;
height: 100%;
}
/* Touch Captions */
.fr-touch {
position: absolute;
width: 100%;
top: 100%;
left: 0;
margin-top: -43px;
}
.fr-touch-wrapper {
float: left;
width: 100%;
height: 100%;
position: relative;
}
.fr-touch-overflow-scroll {
overflow-x: hidden;
overflow-y: scroll !important;
-webkit-overflow-scrolling: touch;
overflow-scrolling: touch;
}
.fr-touch-background {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
background: #000;
line-height: 1%;
filter: alpha(opacity=80);
opacity: .8;
zoom: 1;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
background: #000;
}
.fr-touch-info {
float: left;
position: relative;
clear: both;
padding-right: 71px;
color: #efefef;
}
.fr-touch-info-padder {
float: left;
padding: 11px;
display: block;
filter: alpha(opacity=99);
overflow: hidden;
width: auto;
position: relative;
}
.fr-touch-caption-wrapper {
float: left;
clear: both;
font-weight: normal;
font-family: "Lucida Sans Unicode", "Lucida Sans", "Lucida Grande", Verdana, Arial, sans-serif;
font-size: 13px;
line-height: 21px;
height: 21px; /* same as line-height */
width: 100%;
overflow: hidden;
}
.fr-touch-caption {
float: left;
}
.fr-touch-overflow .fr-touch-caption-wrapper {
overflow: visible;
height: auto;
}
/* buttons */
.fr-touch-button {
padding: 10px 4px;
width: 23px;
height: 23px;
position: relative;
cursor: pointer;
}
.fr-touch-button .fr-touch-button-background {
position: absolute;
top: 10px;
left: 4px;
height: 23px;
width: 23px;
}
.fr-touch-button .fr-touch-button-background { background-color: #303030; }
.fr-touch-button:hover .fr-touch-button-background { background-color: #404040; }
.fr-touch-button-icon {
float: left;
position: relative;
width: 23px;
height: 23px;
}
/* x */
.fr-touch-close {
position: absolute;
top: 0;
right: 0;
padding-right: 11px;
}
/* ... */
.fr-touch-more {
position: absolute;
top: 0;
right: 38px;
display: none;
}
.fr-touch-padded .fr-touch-more {
display: block;
}
/* we can improve things on browsers that support media queries */
@media all and (min-height: 0px) {
.fr-thumbnails,
.fr-thumbnails-wrapper { padding: 10px 0; }
.fr-thumbnail,
.fr-thumbnails-side { margin: 0 4px; }
.fr-thumbnails-side-previous { margin-left: 8px; }
.fr-thumbnails-side-next { margin-right: 8px; }
.fr-thumbnail-loading-background { background-image: url('http://thevintagehue.s3.amazonaws.com/css/fresco/skins/loading-small.gif'); }
}
@media all and (min-height: 200px) {
.fr-thumbnails,
.fr-thumbnails-wrapper { padding: 12px 0; }
.fr-thumbnail,
.fr-thumbnails-side { margin: 0 6px; }
.fr-thumbnails-side-previous { margin-left: 12px; }
.fr-thumbnails-side-next { margin-right: 12px; }
}
@media all and (min-height: 350px) {
.fr-thumbnail-loading-background { background-image: url('http://thevintagehue.s3.amazonaws.com/css/fresco/skins/loading-medium.gif'); }
}
@media all and (min-height: 500px) {
.fr-thumbnails,
.fr-thumbnails-wrapper { padding: 14px 0; }
.fr-thumbnail,
.fr-thumbnails-side { margin: 0 7px; }
.fr-thumbnails-side-previous { margin-left: 14px; }
.fr-thumbnails-side-next { margin-right: 14px; }
}
@media all and (min-height: 700px) {
.fr-thumbnails,
.fr-thumbnails-wrapper { padding: 20px 0; }
.fr-thumbnail,
.fr-thumbnails-side { margin: 0 10px; }
.fr-thumbnails-side-previous { margin-left: 20px; }
.fr-thumbnails-side-next { margin-right: 20px; }
.fr-thumbnail-loading-background { background-image: url('http://thevintagehue.s3.amazonaws.com/css/fresco/skins/loading.gif'); }
}
/* IE specific resets */
.fr-ltIE8 * { zoom: 1; z-index: 1;}
.fr-ltIE9 .fr-content-image-overlay,
.fr-ltIE9 .fr-has-caption .fr-info-outside .fr-info-background { border: 0; }
/*
* ===== Skin: Fresco =====
*/
/* Sprite */
.fr-window-fresco .fr-side-button-icon,
.fr-window-fresco .fr-close-icon,
.fr-window-fresco .fr-touch-close .fr-touch-button-icon,
.fr-window-fresco .fr-touch-more .fr-touch-button-icon,
.fr-window-fresco .fr-thumbnails-side-button-icon {
background-image: url('http://thevintagehue.s3.amazonaws.com/css/fresco/skins/fresco/sprite.png');
}
/* High-res sprite */
@media only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-pixel-ratio: 2) {
.fr-window-fresco .fr-side-button-icon,
.fr-window-fresco .fr-close-icon,
.fr-window-fresco .fr-touch-close .fr-touch-button-icon,
.fr-window-fresco .fr-touch-more .fr-touch-button-icon,
.fr-window-fresco .fr-side-button-icon {
background-image: url('http://thevintagehue.s3.amazonaws.com/css/fresco/skins/fresco/sprite@x2.png');
background-size: 500px 500px; /* downscaled 50%, size of original sprite */
}
}
.fr-window-fresco .fr-box-outer-border { box-shadow: 0 0 5px rgba(0,0,0,.4); }
/* outer-border instead of inner-border example (box and ui px should be the same) */
/*
.fr-window-fresco .fr-box-outer-border { border: 10px solid #fff; }
.fr-window-fresco .fr-ui-outer-border { padding: 10px; }
.fr-window-fresco .fr-content-image-overlay { border-width: 0; }
*/
.fr-window-fresco .fr-box-wrapper {
background: #101010;
border-color: transparent;
border-style: solid;
border-width: 0;
}
.fr-window-fresco .fr-content-image-overlay {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border-width: 1px;
border-style: solid;
border-color: transparent;
border-color: rgba(255, 255, 255, .08);
}
/* remove bottom border if the image has a caption, or add it when it has a caption */
.fr-window-fresco .fr-has-caption .fr-box-has-ui-outside .fr-content-image-overlay { border-bottom-width: 0px; }
.fr-window-fresco .fr-no-caption .fr-box-has-ui-outside .fr-content-image-overlay { border-bottom-width: 1px; }
.fr-window-fresco .fr-ui-outside .fr-position-text {
text-shadow: 0 1px 1px rgba(0,0,0,.3);
}
.fr-window-fresco .fr-no-caption .fr-info-inside .fr-position-background {
border: 1px solid rgba(180,180,180,.15);
}
.fr-window-fresco .fr-has-caption .fr-info-inside .fr-info-background {
border: 1px solid rgba(68,68,68,.1);
border-top-width: 0;
}
.fr-window-fresco .fr-has-caption .fr-info-outside .fr-info-background {
border: 1px solid rgba(80,80,80,.25);
border-top-width: 0;
}
.fr-window-fresco .fr-thumbnail-wrapper { box-shadow: 0 0 3px rgba(0, 0, 0, .3); }
.fr-window-fresco .fr-thumbnail-active .fr-thumbnail-wrapper { box-shadow: 0 0 1px rgba(0, 0, 0, .1); }
/* < > */
.fr-window-fresco .fr-side-previous .fr-side-button .fr-side-button-icon { background-position: -13px -14px; }
.fr-window-fresco .fr-side-next .fr-side-button .fr-side-button-icon { background-position: -93px -14px; }
.fr-window-fresco .fr-side-previous:hover .fr-side-button .fr-side-button-icon { background-position: -13px -114px; }
.fr-window-fresco .fr-side-next:hover .fr-side-button .fr-side-button-icon { background-position: -93px -114px; }
/* disabled state (IE < 9) */
.fr-window-fresco .fr-side-previous .fr-side-button-disabled .fr-side-button-icon,
.fr-window-fresco .fr-side-previous:hover .fr-side-button-disabled .fr-side-button-icon { background-position: -13px -214px; }
.fr-window-fresco .fr-side-next .fr-side-button-disabled .fr-side-button-icon,
.fr-window-fresco .fr-side-next:hover .fr-side-button-disabled .fr-side-button-icon { background-position: -93px -214px; }
/* < > transition */
.fr-window-fresco:not(.fr-ltIE9) .fr-side-previous .fr-side-button .fr-side-button-icon { background-position: -13px -114px; }
.fr-window-fresco:not(.fr-ltIE9) .fr-side-next .fr-side-button .fr-side-button-icon { background-position: -93px -114px; }
.fr-window-fresco:not(.fr-ltIE9) .fr-side .fr-side-button .fr-side-button-icon {
-moz-transition: opacity .2s ease-in;
-webkit-transition: opacity .2s ease-in;
transition: opacity .2s ease-in;
opacity: .5;
}
.fr-window-fresco .fr-side:hover .fr-side-button .fr-side-button-icon,
.fr-window-fresco .fr-frame .fr-side .fr-side-button-active .fr-side-button-icon {
opacity: 1;
}
/* < > transition (IE < 9) */
.fr-ltIE9 .fr-frame .fr-side-previous .fr-side-button-active .fr-side-button-icon { background-position: -13px -114px; }
.fr-ltIE9 .fr-frame .fr-side-next .fr-side-button-active .fr-side-button-icon { background-position: -93px -114px; }
/* disabled side */
.fr-window-fresco:not(.fr-ltIE9) .fr-ui-outside .fr-side .fr-side-button-disabled .fr-side-button-icon,
.fr-window-fresco:not(.fr-ltIE9) .fr-ui-outside .fr-side .fr-side-button-disabled:hover .fr-side-button-icon { opacity: .2; }
/* on the inside we hide disabled sides */
.fr-window-fresco .fr-ui-inside .fr-side-button-disabled .fr-side-button-icon { background-image: none; }
/* responsive < > */
@media all and (max-width: 568px) and (max-height: 320px),
all and (max-width: 320px) and (max-height: 568px) {
.fr-window-fresco .fr-side-previous .fr-side-button .fr-side-button-icon { background-position: 0px -300px; }
.fr-window-fresco .fr-side-next .fr-side-button .fr-side-button-icon { background-position: -40px -300px; }
.fr-window-fresco .fr-side-previous:hover .fr-side-button .fr-side-button-icon { background-position: 0px -350px; }
.fr-window-fresco .fr-side-next:hover .fr-side-button .fr-side-button-icon { background-position: -40px -350px; }
.fr-window-fresco:not(.fr-ltIE9) .fr-side-previous .fr-side-button .fr-side-button-icon { background-position: 0px -350px; }
.fr-window-fresco:not(.fr-ltIE9) .fr-side-next .fr-side-button .fr-side-button-icon { background-position: -40px -350px; }
}
/* X */
.fr-window-fresco .fr-close .fr-close-icon { background-position: -169px -9px;}
.fr-window-fresco .fr-close:hover .fr-close-icon { background-position: -210px -9px; }
/* X transition */
.fr-window-fresco:not(.fr-ltIE9) .fr-close .fr-close-icon {
background-position: -210px -9px;
-moz-transition: opacity .2s ease-in;
-webkit-transition: opacity .2s ease-in;
transition: opacity .2s ease-in;
opacity: .8;
}
.fr-window-fresco .fr-close:hover .fr-close-icon { opacity: 1; }
/* Thumbnails */
.fr-window-fresco .fr-thumbnail-wrapper {
border-color: transparent;
border-style: solid;
border-width: 0;
}
.fr-window-fresco .fr-thumbnail-wrapper { box-shadow: 0 0 3px rgba(0, 0, 0, .3); }
.fr-window-fresco .fr-thumbnail-active .fr-thumbnail-wrapper { box-shadow: 0 0 1px rgba(0, 0, 0, .1); }
.fr-window-fresco .fr-thumbnail-wrapper {
box-shadow: 0 -1px 4px rgba(0, 0, 0, .3);
}
.fr-window-fresco .fr-thumbnail-overlay-border {
border-width: 1px;
border-color: rgba(255, 255, 255, .08); /* should remain rgba */
}
/* no inner border on active thumbnail */
.fr-thumbnail-active .fr-thumbnail-overlay-border,
.fr-thumbnail-active:hover .fr-thumbnail-overlay-border { border: 0px; }
/* Thumbnails < > */
.fr-window-fresco .fr-thumbnails-side-previous .fr-thumbnails-side-button-icon { background-position: -160px -41px;}
.fr-window-fresco .fr-thumbnails-side-previous:hover .fr-thumbnails-side-button-icon { background-position: -202px -41px; }
.fr-window-fresco .fr-thumbnails-side-next .fr-thumbnails-side-button-icon { background-position: -160px -83px;}
.fr-window-fresco .fr-thumbnails-side-next:hover .fr-thumbnails-side-button-icon { background-position: -202px -83px; }
/* Thumbnails < > transition */
.fr-window-fresco:not(.fr-ltIE9) .fr-thumbnails-side .fr-thumbnails-side-button-icon {
-moz-transition: opacity .2s ease-in;
-webkit-transition: opacity .2s ease-in;
transition: opacity .2s ease-in;
opacity: .8;
}
.fr-window-fresco:not(.fr-ltIE9) .fr-thumbnails-side-previous .fr-thumbnails-side-button-icon,
.fr-window-fresco:not(.fr-ltIE9) .fr-thumbnails-side-previous .fr-thumbnails-side-button-disabled { background-position: -160px -41px; }
.fr-window-fresco:not(.fr-ltIE9) .fr-thumbnails-side-next .fr-thumbnails-side-button-icon,
.fr-window-fresco:not(.fr-ltIE9) .fr-thumbnails-side-next .fr-thumbnails-side-button-disabled { background-position: -202px -83px; }
.fr-window-fresco:not(.fr-ltIE9) .fr-thumbnails-side:hover .fr-thumbnails-side-button-icon { opacity: 1; }
/* lower opacity on disabled states */
.fr-window-fresco:not(.fr-ltIE9) .fr-thumbnails-side .fr-thumbnails-side-button-disabled,
.fr-window-fresco:not(.fr-ltIE9) .fr-thumbnails-side:hover .fr-thumbnails-side-button-disabled { opacity: .5; }
/* lower opacity IE < 9 using images */
.fr-window-fresco.fr-ltIE9 .fr-thumbnails-side-previous .fr-thumbnails-side-button-disabled .fr-thumbnails-side-button-icon,
.fr-window-fresco.fr-ltIE9 .fr-thumbnails-side-previous:hover .fr-thumbnails-side-button-disabled .fr-thumbnails-side-button-icon {
background-position: -244px -41px;
}
.fr-window-fresco.fr-ltIE9 .fr-thumbnails-side-next .fr-thumbnails-side-button-disabled .fr-thumbnails-side-button-icon,
.fr-window-fresco.fr-ltIE9 .fr-thumbnails-side-next:hover .fr-thumbnails-side-button-disabled .fr-thumbnails-side-button-icon {
background-position: -244px -83px;
}
.fr-window-fresco.fr-ltIE9 .fr-thumbnails-side .fr-thumbnails-side-button-disabled .fr-thumbnails-side-button-background,
.fr-window-fresco.fr-ltIE9 .fr-thumbnails-side:hover .fr-thumbnails-side-button-disabled .fr-thumbnails-side-button-background {
filter: alpha(opacity=50);
}
/* Touch caption */
/* background */
.fr-window-fresco .fr-touch-background {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border: 0;
border-top-width: 1px;
border-style: solid;
border-color: transparent;
border-color: rgba(255, 255, 255, .12);
box-shadow: 0 -1px 3px rgba(0,0,0, .3);
}
/* smaller text on mobile devices */
@media all and (max-width: 568px) and (max-height: 320px),
all and (max-width: 320px) and (max-height: 568px) {
.fr-window-fresco .fr-touch-caption-wrapper { font-size: 12px; }
}
/* x */
.fr-window-fresco .fr-touch-close .fr-touch-button-icon { background-position: -169px -9px; }
.fr-window-fresco .fr-touch-close:hover .fr-touch-button-icon { background-position: -210px -9px; }
/* x transition */
.fr-window-fresco:not(.fr-ltIE9) .fr-touch-close .fr-touch-button-icon {
background-position: -210px -9px;
-moz-transition: opacity .2s ease-in;
-webkit-transition: opacity .2s ease-in;
transition: opacity .2s ease-in;
opacity: .8;
}
.fr-window-fresco .fr-touch-close .fr-touch-button-icon { opacity: 1; }
/* ... */
.fr-window-fresco .fr-touch-more .fr-touch-button-icon { background-position: -169px -134px; }
.fr-window-fresco .fr-touch-more:hover .fr-touch-button-icon { background-position: -210px -134px; }
/* ... transition */
.fr-window-fresco:not(.fr-ltIE9) .fr-touch-more .fr-touch-button-icon {
background-position: -210px -134px;
-moz-transition: opacity .2s ease-in;
-webkit-transition: opacity .2s ease-in;
transition: opacity .2s ease-in;
opacity: .8;
}
.fr-window-fresco .fr-touch-more .fr-touch-button-icon { opacity: 1; }
/* ... \/ */
.fr-window-fresco .fr-touch-less .fr-touch-button-icon { background-position: -169px -175px; }
.fr-window-fresco .fr-touch-less:hover .fr-touch-button-icon { background-position: -210px -175px; }
/* ... \/ transition */
.fr-window-fresco:not(.fr-ltIE9) .fr-touch-less .fr-touch-button-icon {
background-position: -210px -175px;
-moz-transition: opacity .2s ease-in;
-webkit-transition: opacity .2s ease-in;
transition: opacity .2s ease-in;
opacity: .8;
}
.fr-window-fresco .fr-touch-less .fr-touch-button-icon { opacity: 1; }
/*
* ===== Skin: IE6 (always used there as a fallback) =====
*/
.fr-window-IE6 * { zoom: 1; }
/* Sprite */
.fr-window-IE6 .fr-side-button-icon,
.fr-window-IE6 .fr-close-icon,
.fr-window-IE6 .fr-thumbnails-side-button-icon {
background-image: url('skins/IE6/sprite.png');
}
/* < > */
.fr-window-IE6 .fr-side-previous .fr-side-button .fr-side-button-icon { background-position: -13px -114px; }
.fr-window-IE6 .fr-side-next .fr-side-button .fr-side-button-icon { background-position: -93px -114px; }
/* disabled */
.fr-window-IE6 .fr-side-previous .fr-side-button-disabled .fr-side-button-icon,
.fr-window-IE6 .fr-side-previous:hover .fr-side-button-disabled .fr-side-button-icon { background-position: -13px -214px; }
.fr-window-IE6 .fr-side-next .fr-side-button-disabled .fr-side-button-icon,
.fr-window-IE6 .fr-side-next:hover .fr-side-button-disabled .fr-side-button-icon { background-position: -93px -214px; }
.fr-window-IE6 .fr-ui-inside .fr-side-button-disabled .fr-side-button-icon { display: none; }
/* responsive < > */
@media all and (max-width: 568px) and (max-height: 320px),
all and (max-width: 320px) and (max-height: 568px) {
.fr-window-IE6 .fr-side-previous .fr-side-button .fr-side-button-icon { background-position: 0px -350px; }
.fr-window-IE6 .fr-side-next .fr-side-button .fr-side-button-icon { background-position: -40px -350px; }
.fr-window-IE6 .fr-side-previous .fr-side-button-disabled .fr-side-button-icon,
.fr-window-IE6 .fr-side-previous:hover .fr-side-button-disabled .fr-side-button-icon { background-position: 0px -400px; }
.fr-window-IE6 .fr-side-next .fr-side-button-disabled .fr-side-button-icon,
.fr-window-IE6 .fr-side-next:hover .fr-side-button-disabled .fr-side-button-icon { background-position: -40px -400px; }
}
/* X */
.fr-window-IE6 .fr-close .fr-close-icon { background-position: -169px -9px;}
.fr-window-IE6 .fr-close:hover .fr-close-icon { background-position: -210px -9px; }
.fr-window-IE6 .fr-info { filter: alpha(opacity=99); }
.fr-window-IE6 .fr-ui-outside .fr-info { background: #000; }
.fr-window-IE6 .fr-close-icon { background-color: #232323; }
.fr-window-IE6 .fr-close .fr-close-background { display: none; }
.fr-window-IE6 .fr-info-background { display: none; }
.fr-window-IE6 .fr-has-caption .fr-ui-inside .fr-info,
.fr-window-IE6 .fr-info-outside { background: #0d0d0d; }
.fr-window-IE6 .fr-position { background: #101010; }
.fr-window-IE6 .fr-has-caption .fr-ui-inside .fr-position { background: none; }
.fr-window-IE6 .fr-position .fr-position-background { display: none; }
/* ==========================================================================
A2H
========================================================================== */
#addToHomeScreen {
z-index:9999;
-webkit-user-select:none;
-webkit-box-sizing:border-box;
width:240px;
font-size:15px;
padding:12px 14px;
text-align:left;
font-family:helvetica;
background-image:-webkit-gradient(linear,0 0,0 100%,color-stop(0,#fff),color-stop(0.02,#eee),color-stop(0.98,#ccc),color-stop(1,#a3a3a3));
border:1px solid #505050;
-webkit-border-radius:8px;
-webkit-background-clip:padding-box;
color:#333;
text-shadow:0 1px 0 rgba(255,255,255,0.75);
line-height:130%;
-webkit-box-shadow:0 0 4px rgba(0,0,0,0.5);
}
#addToHomeScreen.addToHomeIpad {
width:268px;
font-size:18px;
padding:14px;
}
/**
*
* The 'wide' class is added when the popup contains the touch icon
*
*/
#addToHomeScreen.addToHomeWide {
width:296px;
}
#addToHomeScreen.addToHomeIpad.addToHomeWide {
width:320px;
font-size:18px;
padding:14px;
}
/**
*
* The balloon arrow
*
*/
#addToHomeScreen .addToHomeArrow {
position:absolute;
background-image:-webkit-gradient(linear,0 0,100% 100%,color-stop(0,rgba(204,204,204,0)),color-stop(0.4,rgba(204,204,204,0)),color-stop(0.4,#ccc));
border-width:0 1px 1px 0;
border-style:solid;
border-color:#505050;
width:16px; height:16px;
-webkit-transform:rotateZ(45deg);
bottom:-9px; left:50%;
margin-left:-8px;
-webkit-box-shadow:inset -1px -1px 0 #a9a9a9;
-webkit-border-bottom-right-radius:2px;
}
/**
*
* The balloon arrow for iPad
*
*/
#addToHomeScreen.addToHomeIpad .addToHomeArrow {
-webkit-transform:rotateZ(-135deg);
background-image:-webkit-gradient(linear,0 0,100% 100%,color-stop(0,rgba(238,238,238,0)),color-stop(0.4,rgba(238,238,238,0)),color-stop(0.4,#eee));
-webkit-box-shadow:inset -1px -1px 0 #fff;
top:-9px; bottom:auto; left:50%;
}
/**
*
* Close button
*
*/
#addToHomeScreen .addToHomeClose {
-webkit-box-sizing:border-box;
position:absolute;
right:4px;
top:4px;
width:18px;
height:18px; line-height:14px;
text-align:center;
text-indent:1px;
-webkit-border-radius:9px;
background:rgba(0,0,0,0.12);
color:#707070;
-webkit-box-shadow:0 1px 0 #fff;
font-size:16px;
}
/**
*
* The '+' icon, displayed only on iOS < 4.2
*
*/
#addToHomeScreen .addToHomePlus {
font-weight:bold;
font-size:1.3em;
}
/**
*
* The 'share' icon, displayed only on iOS >= 4.2
*
*/
#addToHomeScreen .addToHomeShare {
display:inline-block;
width:18px;
height:15px;
background-repeat:no-repeat;
background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAQAAABDj1eZAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAUdJREFUKFNtkLtLw1AYxS/qJLhXVKr2ZRulUNtiqgSb3CziICI6ucTFVYcOnaQOFRwUnNTRwUWXgpP/QdHNUEQUHGxofYBTlRs83iZNjKTncOGe7/vx3QchXUWn6FL3jhfKUdCCr5zuifV5oDiHQM+c+CIhiiCSWNu08iq9oHXKLAiqrgR4UXqlOEYZt++ExEL0wW7+OW0G10muLv9gmqfe5FAWKmTMYQYiFL7PYwyLOD8lSjNh2gdnPzMII4QUBxc4OothbAF7GCBKQ0YbSWyPQsIhqvetS+y0ygGMo/KFZfviDvR4AhwgZU9dGYnA0J/6ndc15i3ouYIMcVVUcEXIoOxCeRCfwP8sXBSdjtpUv/1QW+K16kCCIUC4id9Fa0JtkluwVkSfqPL6RwfSDA0aNlx7k/bWgViB7bMS2/1vk5sdsZLN/ALSuL3tylO4RAAAAABJRU5ErkJggg==);
background-size:18px 15px;
text-indent:-9999em;
overflow:hidden;
}
/**
*
* The touch icon (if available)
*
*/
#addToHomeScreen .addToHomeTouchIcon {
display:block;
float:left;
-webkit-border-radius:6px;
-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.5),
inset 0 0 2px rgba(255,255,255,0.9);
background-repeat:no-repeat;
width:57px; height:57px;
-webkit-background-size:57px 57px;
margin:0 12px 0 0;
border:1px solid #333;
-webkit-background-clip:padding-box;
}
/**
*
* The 'share' icon for retina display
*
*/
@media all and (-webkit-min-device-pixel-ratio: 2) {
#addToHomeScreen .addToHomeShare {
background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAeCAQAAADu6HTYAAADPElEQVR4Xq3TX2gcRRzA8e/M7mVv2+TSNpc/TZtrY6jUGqgaSAmEChKLrYK0YH0RFC2CSCkEfCghiKU04J8qNigq6os+iQV98MHWFwVBrQQRWs21lBw5cw3NNb1/udu72RGG5Y77IzXW77D7sAwf5scyYoL6BGXSDKFZwaGpLvIUaeoCkvX1MmsM0Ny6oRSQYOLuIS+YZOpfQdqslpUxcZrzTVAz4qPwW2O3CeIwC/RSzeY6Ow1QhUrkr+YOWfEKDkEP8Rij7CHKJmrFSDHBdwGEE5wiGChPN+PnT8VdRtEIl1d4gRj/1EVe5ZSBKGh8iqQpo/Fo5+3C/gz0MYg4zgwbqday1/Q4B8BGQ45d/Hi54lakCrU5obOcidJpu1+Lg9whjabyaOYLnrIBFFaRD+xe2ybMDWY66GmP/WA9cGfGp0CWhy0wkMN8inepFiH2rV1j0NQSNQbFLRQnS8/8YSDBBpadfv4CYDub2fmeHDNAsL1MBWUel0iA+Xik6eHcyvD3vAMSU1TGuA/YRS+dD7ovCQN43GKRFCU20Kd3V/avDVVyAZ5niTEuLA5/zBGWg9EEEhfJKN200Tat8CmRAQb9+wv7soPlHt2tQorsz1uPbr0HTY4sJwrH47zJZwABBAKLMBoQXepwgTwdHCo+fXMkQ4lrxEmQ5AaXipPqDY9V2vn09tgvTPI71EEGYxM+/uMJLJ4svpgaWGKOi/xKgmqLSUGSUd5f2vIVJ/CgBaTIUsZ7ZBsn0+NzfMOXLFCXQyTcybN6ep5ZZgUOHn7jpfUpsZshdugPGf+E5zjbyHTSRyQ8xfRPPM/s63RHeuknSoT22mjmmnAOIMkUZ6D1xSfPPAfd1WFKM3sO2CMaHx8M1NjnXKHaAGGkOW0C02WeYHUz4qMtx+w5gUDS8NckYe5lHsMYwCZEPyEEmjLDZFmAS7CDviMdxyTkMNVBKEmYLvbiQQBIBBbCQG04bGQvFWz6CfsCQLWCigILFwcfkGYBiOpbYuOizTAyYyDdCtrGaRG1LCkIgMYEFhI0WqQZoSlbGRyHKe4qOx7iv2bVQW9dp4dlM/x6kmwnWQcd/Q3FCqwTEiT5s+6D5v/pb0SSHyg7uhMWAAAAAElFTkSuQmCC);
}
}
/* ==========================================================================
Neglected Stepchildren
========================================================================== */
#nav, #search, .permalink { display: none}
/* ==========================================================================
Helper classes
========================================================================== */
/*
* Image replacement
*/
.ir {
background-color: transparent;
border: 0;
overflow: hidden;
/* IE 6/7 fallback */
*text-indent: -9999px;
}
.ir:before {
content: "";
display: block;
width: 0;
height: 100%;
}
/*
* Hide from both screenreaders and browsers: h5bp.com/u
*/
.hidden {
display: none !important;
visibility: hidden;
}
/*
* Hide only visually, but have it available for screenreaders: h5bp.com/v
*/
.visuallyhidden {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
/*
* Extends the .visuallyhidden class to allow the element to be focusable
* when navigated to via the keyboard: h5bp.com/p
*/
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
clip: auto;
height: auto;
margin: 0;
overflow: visible;
position: static;
width: auto;
}
/*
* Hide visually and from screenreaders, but maintain layout
*/
.invisible {
visibility: hidden;
}
/*
* Clearfix: contain floats
*
* For modern browsers
* 1. The space content is one way to avoid an Opera bug when the
* `contenteditable` attribute is included anywhere else in the document.
* Otherwise it causes space to appear at the top and bottom of elements
* that receive the `clearfix` class.
* 2. The use of `table` rather than `block` is only necessary if using
* `:before` to contain the top-margins of child elements.
*/
.clearfix:before,
.clearfix:after {
content: " "; /* 1 */
display: table; /* 2 */
}
.clearfix:after {
clear: both;
}
/*
* For IE 6/7 only
* Include this rule to trigger hasLayout and contain floats.
*/
.clearfix {
*zoom: 1;
}
/* ==========================================================================
Media Queries
========================================================================== */
@media only screen and (min-width: 468px) {
}
@media only screen and (min-width: 765px) {
.header { background: #1f1f1f; }
article:hover .mini-panel { display: none; }
/* ==========================================================================
Permalink Page
========================================================================== */
.permalink-page { width: 820px !important; overflow: inherit !important; }
.permalink-page article.post { width: 400px; margin: 0 10px 35px; }
.permalink-page article .photo { background: #1f1f1f; }
.permalink-page article .photo img { margin: 0 auto; }
.permalink-page .mini-panel { width: 300px; left: 0; float: left; }
.original-source { text-align: center; border-bottom: 2px dotted black; width: 300px; float: left; left: 0; }
.original-source h3 { margin: 5px 0 }
.original-source h3 a {color: #000; }
.original-source h3 a:hover {color: #00A0B1; }
.trendsetters { float: left; width: 300px; left: 0; }
/* Photosets */
#ib-container .photoset a:nth-of-type(2), #ib-container .photoset a:nth-of-type(3) { display: none; }
.permalink-page .photoset a:nth-of-type(2), .permalink-page .photoset a:nth-of-type(3) { width: 243px; float: left; margin: 10px 0 0 }
.permalink-page .photoset a:nth-of-type(3) { margin: 10px 0 0 10px; }
/* ==========================================================================
FOOTER
========================================================================== */
.footer { margin: 0; }
}
@media only screen and (min-width: 1030px) {
article:hover .mini-panel { display: inline ; }
.permalink-page article.post { width: 498px; }
}
@media only screen and (min-width: 35em) {
/* Style adjustments for viewports that meet the condition */
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 144dpi) {
/* Style adjustments for high resolution devices */
}
/* ==========================================================================
Print styles.
Inlined to avoid required HTTP connection: h5bp.com/r
========================================================================== */
@media print {
* {
background: transparent !important;
color: #000 !important; /* Black prints faster: h5bp.com/s */
box-shadow:none !important;
text-shadow: none !important;
}
a,
a:visited {
text-decoration: underline;
}
a[href]:after {
content: " (" attr(href) ")";
}
abbr[title]:after {
content: " (" attr(title) ")";
}
/*
* Don't show links for images, or javascript/internal links
*/
.ir a:after,
a[href^="javascript:"]:after,
a[href^="#"]:after {
content: "";
}
pre,
blockquote {
border: 1px solid #999;
page-break-inside: avoid;
}
thead {
display: table-header-group; /* h5bp.com/t */
}
tr,
img {
page-break-inside: avoid;
}
img {
max-width: 100% !important;
}
@page {
margin: 0.5cm;
}
p,
h2,
h3 {
orphans: 3;
widows: 3;
}
h2,
h3 {
page-break-after: avoid;
}
}