page 06 // harmonia

<!DOCTYPE html>
<head>

 <!-- THEME BY @VENUSTHMS
                           do not remove the credit

-------------------------------------------------------------------------

  - terms of use: venusthms.tumblr.com/terms

  - message me if you got any problems or questions about the code

  - you'll find instructions about customization through out the code

  - the grid/filter effect was created with the tutorial by @cyantists

  - art credit goes to @polydeuce

---------------------------------------------------------------------->

<title>members</title><link rel="shortcut icon" href="{Favicon}"> <!-- change (tab) title here -->

<!---- SCRIPT - DO NOT TOUCH ---->

<link href="https://fonts.googleapis.com/css?family=Arapey|Karla|Lora|PT+Serif|Playfair+Display|Quicksand" rel="stylesheet"><link rel="stylesheet" type="text/css" href="//venusthms.github.io/pages/harmonia/style.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script><script src="//venusthms.github.io/pages/harmonia/filter.js"></script>
<script src="https://static.tumblr.com/xd6ujov/9Rpouml9f/imagesloaded.pkgd.min.js"></script><script src="//venusthms.github.io/pages/harmonia/masonry.js"></script>

<link href="https://static.tumblr.com/4gatuv1/X8Poxwvz8/style-my-tooltips.css" rel="stylesheet" type="text/css" />
<script src="https://static.tumblr.com/4gatuv1/Aneoxwvz8/jquery.style-my-tooltips.js"></script>
<script>
!function(t){t(document).ready(function(){t("a[title]").style_my_tooltips({tip_follows_cursor:!0,tip_delay_time:200,tip_fade_speed:300})})}(jQuery);
</script>


<style type="text/css">

/* tooltips */

#s-m-t-tooltip {
  max-width: 250px;
  margin:24px 14px 7px 12px;
  padding:5px 8px;
  background: #fff;
  border-radius:2px;
  font-family: 'karla';
  letter-spacing: 1px;
  font-size:10px;
  color:#000;
  box-shadow: none;
}

/* scrollbar */

::-webkit-scrollbar {
   width:5px;
   height:17px;
   background-color: #fff;
}
::-webkit-scrollbar-track {
   background-color: #fff;
}
::-webkit-scrollbar-thumb {
   background-color: rgba(252, 201, 201, .4);
   min-height:24px;
   min-width:24px;
}

/* selection */

::-moz-selection { background:#eee;color:#000; }
::selection { background:#eee;color:#000; }

/* general */

body {
background: #fff; /* page background */
font-family: 'lora'; /* font */
cursor: default;
overflow-x:hidden;
}

/* accent color */

h1, .button:hover,.button.selected, .content a {
    background: rgba(252, 201, 201, .3);
}

a:hover, .item a:hover {
    color: #C39B9B; /* links hover colour */
}

/* header */

.header {
    background: inherit;
}

h1 { /* title */
    font-family: 'quicksand';
    font-size: 16px;
    letter-spacing: 2px;
    color: #444;
}

.links, .desc, .filters { /* other text */
    font-size: 11px;
}

/* members */

.item, .item a {
    color: #444; /* text color*/
}

h2 { /*title*/
    font-size: 13px;
}

.content { /*description*/
    font-size: 12px;
    text-align: left;
}

.content a:hover { /* link hover background*/
    background: none;
}

</style>
</head>

<body>

<!--- header ---->
<div class="header">
<div class="headercontent">
    <h1>members</h1> <!--- here goes your title ---->
    <div class="links">
        <a href="/">back</a>
        <a href="/ask">ask</a>
        <a href="/">join</a>
        <a href="/">link</a>
        <!--- copy & paste as needed ---->
    </div>

<!--- if you don't want filters: delte from here ---->
    <div class="filters">
      <div class="button selected" filter="item">everything</div>
      <div class="button" filter="filter1">filter one</div>
      <div class="button" filter="filter2">filter two</div>
      <!--- copy & paste as needed ---->
</div>
<!--- until here ---->

    <p class="desc">here goes your description. make sure that you don't make it too long.</p>
    </div></div>


<!--- members section starts
- replace filter1/filter2/etc (after 'item') with the filter names you set above(<div class="button" filter="THISISYOURFILTERNAME">filter one</div>)
- IMPORTANT: do not delete 'item' !

layout:

<div class="item here goes your filters">
    <img src="IMAGEURL"></img>
    <h2>Title</h2>
    <p class="content">description <a href="/link">blogtitle/name</a></p>
    </div>

---->
<div class="grid">


    <div class="item filter1">
    <img src="https://78.media.tumblr.com/12407d6b680ca2cedb63f8a888dc122f/tumblr_p7izt5ZHZA1vvb2yko3_1280.png"></img>
    <h2>title here</h2>
    <p class="content">put some text here. <a href="blogurl">name</a></p>
    </div>

   <div class="item filter2">
    <img src="https://78.media.tumblr.com/47f44de4a429cb70258197652086e363/tumblr_p6t82ooE7V1vvb2yko2_1280.png"></img>
    <h2>title here</h2>
    <p class="content">put some text here. <a href="blogurl">name</a></p>
    </div>

<!----- DO NOT EDIT AFTER THIS LINE ---->
</div>
<div class="vt"><a href="https://venusthms.tumblr.com/" title="venusthms"><img src="https://i.imgur.com/PxFLRpM.png"></img></a></div>


</body>
</html>