/******** Universal Styles **********/

.clearfix {
  clear:both;
}
.clearfix:after {
  visibility: hidden;
  display: block;
  height: 0;
  clear: both;
}
.clearfix:before,
.clearfix:after {
  content: " "; /* 1 */
  display: table; /* 2 */
}
.clearfix:after {
  clear: both;
}
.clearfix {
  *zoom: 1;
}

html {
  overflow-x: hidden;
  background:#283145;
}
body {
  line-height: 1.4;
  overflow-x: hidden;
  height: 100%;
  -webkit-overflow-scrolling: touch;
	font-family: 'Open Sans', sans-serif;
	padding: 0;
	margin: 0;
  background: linear-gradient(0deg, #283145, #313C5F, #283145);
  font-size:1em;
}
ul, ol {
	list-style: none;
	margin:0;
}

a {
-webkit-transition: all .1s ease-in-out;
  -moz-transition: all .1s ease-in-out;
  -o-transition: all .1s ease-in-out;
  -ms-transition: all .1s ease-in-out;
  transition: all .1s ease-in-out;
}
 a:focus {
	color:rgba(255, 255, 255, 0.4);
  outline: none;
}

h1, h2, h3, h4, h5, span, p, a {
  font-family: 'Work Sans', sans-serif;
}

h1 {
	color:#364266;
	font-size: 48px;
	font-weight: 600;
}
h2 {
	color:#FFF;
  font-size: 32px;
	font-weight: 400;
}
h3 {
  color:#FFF;
  font-size: 22px;
  font-weight: 300;
  font-family: 'Work Sans', sans-serif;
}
h4 {
 color:rgba(255, 255, 255, 1);
 font-weight: 300;
 font-size: 18px;
}
h5 {
  font-size: 16px;
  font-weight: 200;
  color:rgba(255, 255, 255, .5);
}
p {
	color:rgba(255, 255, 255, .5);
  font-size: 13px;
  font-weight: 300;
}
p.italic {
  font-style: italic;
}
.hide {
  display:none !important;
}
.button {
	background: #127EFF;
	border:3px solid #127EFF;
  color: #FFF;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 1px;
	padding:14px 34px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
.button:hover {
  background:#0079FF;
  color: #fff;
}
.button.docs-btn {
	border:2px solid #6fa4da;
	color:#6fa4da;
	border-radius: 2px;
	padding:5px 6px;
	font-size: 14px;
}
.button.docs-btn:hover {
	background:#6fa4da;
	color:#fff;
}
.logo {
	background: url('../img/logo.png') no-repeat;
	height: 22px;
  width: 30px;
  background-size: 46px 22px;
  display: inline-block;
  float: left;
}
.logo .brand {
  background-position:0 0;
}
.logo.back {
  background-position:-32px 0;
}
.logo.forward {
  background-position:-32px 0;
  float: right;
  margin-right: 0;
  margin-left: 2px;
  margin-top: -2px;
  padding-right: 0;
  width: 16px;
  transform: rotate(180deg);
}
.logo-container a:hover .logo.back{
  background: url('../img/logo-hover.png') no-repeat;
  height: 22px;
  width: 30px;
  background-size: 46px 22px;
  background-position:-32px 0;
  transition-delay: .07s;
}
.login-link:hover .logo.forward {
  background: url('../img/logo-hover.png') no-repeat;
  height: 22px;
  width: 16px;
  background-size: 46px 22px;
  background-position:-32px 0;
  transition-delay: .07s;
}
.logo-container:hover {
  cursor: pointer;
}
.logo-container:hover .logo.brand, .logo-container .logo.active {
  background: url('../img/logo-hover.png') no-repeat;
  height: 22px;
  width: 30px;
  background-size: 46px 22px;
  background-position:0 0;
}
.powered-by {
  position: absolute;
  top:-3px;
  left:40px;
  transform: translateX(-5%);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color:rgba(255, 255, 255, 0);
  -webkit-transition: .2s ease-in-out;
  -moz-transition: .2s ease-in-out;
  -o-transition: .2s ease-in-out;
  transition: .2s ease-in-out;
}
.dc-mark {
  position: absolute;
  top:9px;
  left:40px;
  font-size: 11px;
  font-weight: 700;
  transform: translateX(-5%);
  text-transform: uppercase;
  letter-spacing: 2px;
  color:rgba(255, 255, 255, 0);
  -webkit-transition: .2s ease-in-out;
  -moz-transition: .2s ease-in-out;
  -o-transition: .2s ease-in-out;
  transition: .2s ease-in-out;
}
.logo-container:hover .powered-by, .logo-container .active .powered-by {
  color:rgba(255, 255, 255, .4);
  left:40px;
  transform: translateX(0%);
}
.logo-container:hover .dc-mark, .logo-container .active .dc-mark {
  color:rgba(255, 255, 255, 1);
  left:40px;
  transform: translateY(0%);
}
.menu {
  float: right;
}

/*------ Header -----------------------------*/
#header {
  text-align: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.4);
}
#header .content {
  width: 100%;
  padding:14px 70px 9px;
  position: fixed;
  z-index: 1000;
  background: #293248;
  border-right: 1px solid rgba(255, 255, 255, 0.05);
  border-left: 1px solid rgba(255, 255, 255, 0.05);
}
#public-profile #header .content {
  border:none;
  padding-bottom: 12px;
}
.title-container {
  width: 60%;
  text-align: center;
  display: inline-block;
  height: 20px;
}
.page-title {
  color: #fff;
  text-transform: uppercase;
  font-size: 14px;
  letter-spacing: 2px;
  line-height: 27px;
  font-family: 'Work Sans', sans-serif;
}
.menu {
  float: right;
  margin-top: 1px;
}
.menu-item  {
	color:rgba(255, 255, 255, 0.4);
  font-size: 20px;
  vertical-align: top;
  float: right;
  height: 22px;
}
#nav-icon3 span:nth-child(1) {
  top: 0px;
}

#nav-icon3 span:nth-child(2) {
  top: 8px;
}

#nav-icon3 span:nth-child(3) {
  top: 16px;
}
#nav-icon3.open {
}
#nav-icon3.open span:nth-child(1) {
  top: 18px;
  width: 0%;
  left: 50%;
}

#nav-icon3.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

#nav-icon3.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
#nav-icon1, #nav-icon2, #nav-icon3, #nav-icon4 {
  width: 26px;
  height: 20px;
  position: relative;
  float: right;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}

#nav-icon1 span, #nav-icon3 span, #nav-icon4 span {
  display: block;
  position: absolute;
  height: 2px;
  width: 100%;
  background: #7c818e;
  border-radius: 9px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}
#nav-icon3.open span:nth-child(4) {
  top: 18px;
  width: 0%;
  left: 50%;
}
#nav-icon3:hover span {
  background: #fff;
}
.menu-item:hover .nav-icon {
  background: url('../img/nav-icon-hover.png') no-repeat;
  background-size:21px 21px;
  height: 21px;
  width: 21px;
  background-position: 0 0;
}
.menu-item .fa-bell-o {
  font-size: 19px;
}
.data-icon-dark {
    background: url('../img/data-icons-dark.png') no-repeat;
    height: 48px;
    margin:4px auto 8px;
    background-size: 319px 48px;
}
.restriction-icon {
  background: url('../img/restrictions-icons.png') no-repeat;
  height: 48px;
  margin:4px auto 8px;
  background-size: 126px 48px;
}
.anonymous-icon {
background-position: -53px 0;
width: 66px;
}
.calandar-icon {
  background-position: 0px 0;
  width: 60px;
}
.purchase-overview h5 {
  color:rgba(0, 0, 0, .5);
  font-weight: 400;
}
.purchase-modal h3 {
  color:#fff;
  font-family: 'Space Mono', monospace;
  margin:24px 0 0;
  font-size: 50px;
  line-height: 40px;
}
.purchase-modal h3 span {
  display: inline-block;
  font-size: 20px;
  opacity: .5;
}
.purchase-modal .divider {
  width: 100px;
  height: 1px;
  background: rgba(0, 0, 0, 0.1);
  margin:10px auto;
}
.activity-item-notif {
  display: none;
}
.activity-item-notif p {
  font-size: 12px;
}
.activity-item-notif .account-icon-container {
  display: inline-block;
  transform: scale(.7);
  background: #1E2433;
}
.account-button.accept-btn {
  background:#242d42;
  display: block;
  margin: 0 auto;
  margin-top:22px;
  width:178px;
}
.account-button.accept-btn span {
  color:#fff;
}
.account-button.accept-btn.inactive span {
  color:rgba(0, 0, 0, 0.4);
}
.accept-btn:hover {
  background:#283145;
}
.accept-btn.accepted {
  border:2px solid rgba(255, 255, 255, .4);
}
.accept-btn.accepted span  {
  color:rgba(255, 255, 255, .4);
}
.decline-btn {
  font-size: 12px;
  text-transform: uppercase;
  margin-top:14px;
  color: rgba(255, 255, 255, 0.4);
}
.request-timestamp {
  float: left;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color:rgba(0, 0, 0, .4);
}

.large-purchase-circle {
  height: 34px;
  width: 34px;
  border-radius: 50%;
  text-align: center;
  margin: 0 auto 10px;
}
.request-circle {
  background: #FD6969;
}
.interest-circle {
  background: #5478E2;
}
.large-purchase-circle i {
  color: #242d42;
  font-size: 20px;
  line-height: 34px;
  text-align: center;
  margin: 0 !important;
}
.menu-item.active {
  color: #FD6969;
}
.menu i {
  vertical-align: top;
  margin-top:3px;
  margin-left: 15px;
}
.menu .f-dropdown li {
  display: block;
}
.menu .f-dropdown li:hover {
  border-bottom: none;
}
.logo-container {
  width: 20%;
  float: left;
  display: inline-block;
  text-align: left;
  position: relative;
}
.logo {
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.logo-container span {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 2px;
  color:rgba(255, 255, 255, 0.4);
  margin-left: -10px;
  vertical-align: top;
  line-height: 24px;
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;

}
.logo-container a:hover span {
  color:rgba(255, 255, 255, 1);
}
.logo-container a:hover .logo.back {
  margin-right: -2px;
}
.login-link .logo.foward {
transition-delay: .07s;
}
.login-link:hover span {
  margin-right: -2px;
  color:rgba(255, 255, 255, 1);
}

.account-button {
  border-radius: 30px;
  padding: 12px 26px;
  width:auto;
  margin:0 auto;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.account-button:hover {
}
.account-button span {
  font-weight: 600;
  letter-spacing: .09rem;
  font-size: 14px;
  line-height: 19px;
  text-transform: uppercase;
  display: inline-block;
  color: rgba(0, 0, 0, 0.4);
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.account-button:hover span {
}

.attribute {
  display: inline-block;
  padding:8px 12px;
  border-radius: 30px;
  background: #e8ebf2;
  font-size: 10px;
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: 1px;
  margin:0px 6px 10px 0;
  color:rgba(41,50,72,1);
  border: 1px solid rgba(182, 187, 201, 0.3)
}
.attribute i {
  font-size: 16px;
  line-height: 16px;
  vertical-align: bottom;
  color:#313C5F;
  margin-right: 2px;
}
.attribute-list {
  margin-bottom:34px;
}
.attribute-list .attribute-title {
  font-size: 14px;
  display: block;
  border-bottom:1px solid rgba(182, 187, 201, 0.3);
  margin-bottom: 14px;
  color:#313C5F;
}
.attribute-list p {
  font-size:12px;
  line-height: 16px;
  margin: 0px auto 20px;
  font-weight: 300;
  color:#283145;
}
.tile-button {
  background:#313C5F;
  margin: 4px auto;
}
/*------Nav Menu (***needs an id container for this) -----------------------------*/

.pushy .divider {
  background: rgba(255,255,255,.1);
  height: 1px;
  width: 100px;
  margin:20px 30px;
}
.menu-icon {
  background: url('../img/menu-icons.png') no-repeat;
  background-size:103px 16px;
  height: 16px;
  width: 18px;
  display: inline-block;
  vertical-align: top;
  margin:1px 8px 0 0;
}
.public-link .menu-icon {
  background-position: -21px 0;
}
.payout-method .menu-icon {
  background-position: 0 0;
}
.market-settings .menu-icon {
  background-position: -82px 0;
}
.account-settings .menu-icon {
  background-position: -42px 0;
}
.close-nav .menu-icon {
  background-position: -60px 0;
}
.close-nav {
  margin-top:-8px;
}
.pushy-link.share-icons {
  position: relative;
}
.pushy a.share-link {
  opacity: 0;
  position: absolute;
  display: inline-block;
  top:12px;
  width: 20px;
  height: 20px;
  text-align: center;
  line-height: 21px;
  font-size: 12px;
  padding: 0;
  margin: 0;
  border-radius: 50%;
  color:#fff !important;
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  -ms-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;

}
.pushy-link .share-icons:hover a.share-link {
  opacity: 1;
  transform: translateX(0%);
}
.facebook-share {
  background: rgba(59, 89, 152, 1);
  right:85px;
  transform: translateX(10%);
}
.facebook-share:hover {
  background:rgb(51, 71, 116);
}
.twitter-share {
  background: #6cb7f0;
  right:55px;
  transform: translateX(20%);
}
.twitter-share:hover {
  background:#2082c2;
}
.google-share {
  background: #e15f4f;
  right:25px;
  transform: translateX(30%);
}
.google-share:hover {
  background:#a7493d;
}
.small-btn {
  border-radius: 5px;
  background:#eee;
  padding:6px 12px;
  display: inline-block;
  font-size: 12px;
  text-transform: uppercase;
  color:rgba(0, 0, 0, 0.5);
  font-weight: 600;
  margin:4px 6px 4px 0;
}
.small-btn:hover {
  background: #ddd;
  cursor: pointer;
}
.small-btn i {
  margin-right: 6px;
}
.login-link span {
  text-transform: uppercase;
  float: right;
  top:-1px;
  left:14px;
  position: absolute;
  color:rgba(103, 108, 123, 0);
  padding:0px 8px;
}
.login-link:hover span {
  left:16px;
  color:rgba(103, 108, 123, 1);
}
.dark-header .login-link span {
  top:-3px;
}
.login-link span, .login-link .logo {
  -webkit-transition: .2s ease-in-out;
  -moz-transition: .2s ease-in-out;
  -o-transition: .2s ease-in-out;
  transition: .2s ease-in-out;
}
