/* globals */

:root {
  --gold: #dfb649;
  --blue: #637dff;
  --darkgray: #111111;
  --lightgray: #666666;
  --white: #ffffff;
  --buttongray: #dddddd;
  --purple: #aa00ff;
  --darkpurple: #280837;
}

body {
  /* background: url("https://ladyboypussy.com/preview/img/lpbg.jpg"); */
  background-color: #111111;
  background-repeat: repeat;
  color: var(--white);
  font-family: 'Roboto', sans-serif;

}

h1 {
  font-size: 2rem;
  text-transform: uppercase;
  font-family: 'Oswald', sans-serif;
}

strong {
  font-weight: 900;
}

/* iframes */

iframe#video, iframe#models, iframe#joinCount, iframe#whatsInside {
  width:100%;
}

iframe#video, iframe#models {
  background-color: var(--darkgray);
  height: 48px;
}

iframe#joinCount {
  height: 2em;
}

iframe#whatsInside {
  height:265px;
}

@media (min-width: 992px) and (max-width:1346px){
  iframe#whatsInside {
    height:340px;
  }
}

@media (max-width: 991px){
  iframe#whatsInside {
    height:600px;
  }
}

@media (max-width:600px) {
  iframe#joinCount {
    height: 3em;
  }
}


.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
  padding-right: 5px;
  padding-left: 5px;
}

/* review */

#review h1{color: var(--gold);}
#review div {text-align:center;}
#review p {margin-bottom:0px;}
#review img {max-height: 120px; padding:10px;}

/* trailer */

.count {
  text-align:center;
  background: linear-gradient(135deg, rgba(80,80,80,1) 0%, rgba(42,42,42,1) 50%, rgba(28,28,28,1) 100%);
  border: 1px solid var(--purple);
  padding: 46px 20px;
  margin-bottom: 10px;
}

.num {
  color: var(--gold);
  font-size: 4rem;
  font-weight:900;
  text-shadow:2px 2px 2px #000;
  margin-bottom: 0px;
}

.desc {
  text-transform:uppercase;
  font-size: .8rem;
}


/* navbar */

#goldTop {
  height:200px;
  margin-top:60px;
  background: var(--gold);
}

.navbar {background: var(--darkpurple);box-shadow: 2px 5px 5px #000;}

.navbar-light .navbar-nav .nav-link {
    color: var(--white);
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    font-size: 1.2rem;
}

.navbar-light .navbar-nav .nav-link:hover {
    color: var(--gold);
}

.navbar-light .navbar-nav .active>.nav-link {color: var(--white);}
.navbar-light .navbar-nav .active>.nav-link:hover {color: var(--gold);}

.navbar-light .navbar-nav .nav-link:focus {
    color: var(--white);
}

.navbar-light .navbar-nav .nav-link.gold:hover {
    color: #000 !important;
    background: var(--gold);
}

.logo {
  position: absolute;
  z-index: 10000;
  top: 0px;
  padding-left:10px;
  max-width:500px;
}

.navbar-light .navbar-toggler {
  background-color: var(--gold);
}

li.nav-item {
  text-align: right;
}

.navbar-brand {
  padding-top: 0px;
  padding-bottom: 0px;
}

a.navbar-brand {
  max-width: 75%;
}

a.navbar-brand>img {
  max-height:50px;
}

/* sections */

.mt-6 {
  margin-top:4rem;
}

#slideshow {margin-top:6rem;}

.carousel-caption {
    background-color: rgba(0,0,0,0.5);
    padding-left:20px;
    padding-right:20px;
}

.carousel-caption h5 {
  font-size: 1.1rem;
  color: var(--gold);
  text-transform: uppercase;
  font-family: 'Oswald',sans-serif;
  margin-bottom: 5px;
}

.carousel-caption h6 {
  font-size: .9rem;
  color: var(--purple);
  font-weight: 300;
  margin-bottom: 10px;
  text-transform: uppercase;
}

.carousel-caption p {
  font-size: .7rem;
}

.sectionHeading {
  padding: .8rem;
  background-color: var(--darkgray);
  border: 1px solid var(--purple);
  box-shadow: inset 0px 2px 5px #000;
  margin:30px 0px;
}

.sectionHeading h1 {
  font-size: 1.5rem;
  margin-bottom:0px;
}

.sectionHeading p {margin-bottom: 0px;}

.sectionHeading a {color: var(--purple);}
.sectionHeading a:hover {color: var(--gold);text-decoration: none;}

/* update boxes */

.update {
  padding: .6rem;
  background-color: var(--darkgray);
  margin-bottom: 30px;
  box-shadow: 2px 2px 5px #000;
}

.title-and-model h2, .show_video h2 {
  font-size: 1.1rem;
  color: var(--purple);
  text-transform: uppercase;
  font-family: 'Oswald', sans-serif;
  margin-bottom:5px;
}

.title-and-model h2 a, .show_video h2 a {
  color: var(--purple);
}

.title-and-model h2 a:hover, .show_video h2 a:hover {
  color: var(--gold);
  text-decoration: none;
}

.title-and-model h3, .show_video h3 {
  font-size: .9rem;
  color: var(--gold);
  font-weight: 300;
  margin-bottom: 0px;
  text-transform: uppercase;
}

.rating-and-time {
  min-width:6rem;
}

.rating-and-time p {
  color: var(--lightgray);
  font-size: .8rem;
  float:right;
}

.photoCount {
  color: var(--lightgray);
  font-size: .8rem;
}

.setDescription p {font-size: .8rem;}

.date {
    position: absolute;
    top: 1rem;
    left: 1rem;
    text-transform: uppercase;
    text-align: center;
    width: 50px;
    z-index: 500;
}

.month {
    background: var(--purple);
    padding: 3px;
    width: 100%;
}

.day {
    background: var(--white);
    padding: 3px;
    font-size: 1.8rem;
    color:  var(--darkgray);
}

.icon4K {
  color: var(--gold);
font-size: 2rem;
font-weight: 900;
text-shadow: 2px 2px 2px #000;
margin-bottom: 0px;
position: absolute;
z-index: 501;
right: 17px;
top: 11px;
background: rgba(30,30,30,0.8);
padding: 3px 12px;
border: 1px solid var(--gold);
}

.tags {font-size: .7rem;line-height:1.7rem;}

.tags a {
  background-color: #666;
  padding: 5px 8px;
  border-radius: 13px;
  color: #fff;
  margin: 0px 2px;
  font-size: .7rem;
}

#latestPhotos .update img, #networkSites .update img, #latestModels .update img {
  border: 1px solid var(--lightgray);
  margin-bottom: 8px;
}

#latestPhotos .update img:hover, #networkSites .update img:hover, #latestModels .update img:hover {
  border: 1px solid var(--gold);
}

.seeMore {
  text-align: center;
  padding: 30px 300px;
  font-size: 1rem;
}

.seeMore a {color: var(--purple);}
.seeMore a:hover {
  color: var(--gold);
  text-decoration: none;
}

.seeMore h2 {
  font-family: 'Oswald', sans-serif;
  text-transform: uppercase;
  margin-bottom: 2rem;
}

.gold {color: var(--gold) !important;}

/* rollover images */

.imageRollover {
  position:relative;
  padding-bottom:56%;
  border: 1px solid var(--lightgray);
  margin-bottom:8px;
}

.imageRollover:hover {
  border: 1px solid var(--gold);
}

.imageRollover img:nth-child(n) {
    position: absolute;
    top: 0;
    left: 0;
  }

/* pagination */

.pagination>li>a {
    position: relative;
    float: left;
    padding: 6px 12px;
    line-height: 1.42857143;
    text-decoration: none;
    color: var(--white);
    background-color: transparent;
    border: 1px solid var(--lightgray);
    margin-left: -1px;
}

.pagination>li>a:hover {
    background-color: var(--gold);
    border: 1px solid var(--lightgray);
    color: var(--darkgray);
}

/* rating stars */

.stars ul {
    list-style: none;
    padding-inline-start: 0px !important;
    padding-left: 0px;
    line-height: 1.1rem;
    margin-bottom:5px;
}

.stars ul li {
    display: inline-block;
    color: #ffd800;
    font-size: .8rem;
}

#latestVideos .stars ul {
    float:right;
}

/* join boxes */

.joinBox {
  background: var(--darkpurple);
  padding: 30px 15px;
  text-align:center;
  box-shadow: inset 0px 2px 5px #000;
}

.joinBox h1{
  font-family: 'Oswald', sans-serif;
  font-size: 2.5rem;
  text-transform: uppercase;
  color: var(--white);
}

.joinBox p {
  font-weight:300;
  color: var(--white);
}

.joinBox button {
  background: var(--darkgray);
  border: 1px solid var(--white);
  color: var(--white);
  font-weight: 100;
  text-transform: uppercase;
  font-size: 2rem;
  padding: 10px 40px;
  box-shadow: 0px 2px 4px #000;
  font-family: 'Oswald', sans-serif;
}

.btn:hover {
    color: var(--darkgray);
    background: var(--gold);
    text-decoration: none;
    box-shadow: inset 0px 2px 4px #1c1c1c;
}


#whatsInside .joinBox {
  background: var(--darkpurple);
  padding: 30px 60px;
  text-align:center;
}

#whatsInside ul {
  margin-bottom:0px;
  list-style: none;
  padding-inline-start: 0px !important;
  line-height: 3rem;
  color: var(--white);
  text-align: left;
  font-size: .9rem;
}

.sectionBox {
  margin-top: 6rem;
  text-align: center;
  background: var(--darkgray);
  padding: 2rem;
  box-shadow: inset 0px 2px 10px #000;
  text-shadow: 2px 2px 5px #000;
}

.sectionBox strong {
  color: var(--gold);
}

::-webkit-input-placeholder {
  font-family: 'Oswald', sans-serif;
  text-transform:uppercase;
  font-size: .8rem;
}
::-moz-placeholder {
  font-family: 'Oswald', sans-serif;
  text-transform:uppercase;
  font-size: .8rem;
}
:-ms-input-placeholder {
  font-family: 'Oswald', sans-serif;
  text-transform:uppercase;
  font-size: .8rem;
}
::placeholder {
  font-family: 'Oswald', sans-serif;
  text-transform:uppercase;
  font-size: .8rem;
}

/* support */

.panel-title a {
  color: var(--gold);
  font-size: 1.2rem;
}

.panel-title a:hover {
  color: var(--white);
  text-decoration:none;
}

.panel-body {
  font-size: .9rem;
}

.panel-body a {
  color: var(--gold);
}
.panel-body a:hover {
  color: var(--purple);
  text-decoration: none;
}


/* footer */

footer {margin:30px 0px;font-size: .8rem;padding-top:20px;border-top:1px solid var(--lightgray);text-align:center;}
footer a {color: var(--white);}
footer a:hover {color: var(--gold);text-decoration:none;}


/*  join  */

.epoch {
  text-align:center;
  margin-top: 4rem;
}

.joinStep {padding:20px;}

h1.step {
  font-family: 'Oswald', sans-serif;
  text-transform: uppercase;
  font-size: 1.2rem;
  margin-bottom: 2rem;
  color: var(--gold);
}

.form-text {
  color: #999;
  font-weight: 300;
}

.form-error {color: purple !important;}

.form-text a, .blocked a {
  color: var(--gold);
}

.form-text a:hover, .blocked a:hover {
  color: var(--purple);
  text-decoration:none;
}

.btn-outline-warning {
    color: var(--gold);
    border-color: var(--gold);
    margin-bottom: .8rem;
    font-size: 1rem !important;
    padding:20px 4rem;
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
}

#loginJoin .btn-outline-secondary, #upsell .btn-outline-secondary, #blockedBtn .btn-outline-secondary {
    color: var(--buttongray);
    border-color: var(--buttongray);
    margin-bottom: .8rem;
    font-size: 1rem !important;
    padding:1rem 4rem;
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
}

.btn-outline-warning:hover {
  color: var(--darkgray) !important;
  background-color: var(--gold) !important;
  border-color: white;
  box-shadow: inset 0px 2px 4px #1c1c1c;
}

.btn-outline-secondary:hover {
    color: var(--darkgray) !important;
    background-color: var(--gold) !important;
    border-color: var(--gold);
}

.btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .show>.btn-outline-secondary.dropdown-toggle:focus, .btn-outline-secondary.focus, .btn-outline-secondary:focus {
    box-shadow: none;
}

#loginJoin .btn-outline-secondary:hover {
  color: var(--darkgray) !important;
  background-color: var(--gold) !important;
  border-color: white;
  box-shadow: inset 0px 2px 4px #1c1c1c;
}

#step2 {
  border-left: 1px solid var(--gold);
  border-right: 1px solid var(--gold);
}

.joinStep .joinOptions {
  text-align: center;
}

.form-check {

    padding: 30px;
    background: lightgray;
    border-radius: 8px;
    margin-bottom: .5rem;
    color: var(--darkgray);
    border: 1px solid white;
    box-shadow: inset 0px 2px 3px #1c1c1c;
    text-align: center;
}

.tpl7 .form-check {
    padding: 20px !important;
}

.form-check:hover {
  background: -webkit-linear-gradient(top left, rgba(255,216,109,1) 0%, rgba(223,182,72,1) 100%);
  background: -o-linear-gradient(top left, rgba(255,216,109,1) 0%, rgba(223,182,72,1) 100%);
  background: linear-gradient(to bottom right, rgba(255,216,109,1) 0%, rgba(223,182,72,1) 100%);
}

.form-check label,.form-group label {
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
}

.selected {
  background: var(--gold);
  color: var(--darkgray);
  background: -webkit-linear-gradient(top left, rgba(255,216,109,1) 0%, rgba(223,182,72,1) 100%) !important;
  background: -o-linear-gradient(top left, rgba(255,216,109,1) 0%, rgba(223,182,72,1) 100%) !important;
  background: linear-gradient(to bottom right, rgba(255,216,109,1) 0%, rgba(223,182,72,1) 100%) !important;
}

.input-group-text {
  background-color: #fff;
  color: #ddd;
}

/* join  */

.joinLogo {
  max-width: 300px;
  margin: 0px auto 30px auto;
}

.ip {
  font-weight: bold;
  color: var(--gold);
}

.alert-warning {
    color: var(--purple);
    background-color: transparent;
    border-color: var(--purple);
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
}

#loginForm {padding:10px;}

.blocked {
  font-size: .9rem;
  text-align:center;
}

.modal-content {
    background-color: var(--darkgray);
    border: 1px solid var(--gold);
    box-shadow: 0px 0px 50px #000;
}

.modal-header {
    border-bottom: none;
  }

.modal-title {
  font-family: 'Oswald', sans-serif;
  text-transform: uppercase;
  color: var(--gold);
}

.modal-body {
    font-size: .9rem;
}

.modal-body a {
    color: var(--gold);
}

.modal-body a: hover{
    color: var(--purple);
    text-decoration:none;
}

.modal-footer {
    border-top: none;
  }

.close {
    color: #fff;
    text-shadow: none;
    opacity: 1;
}

.btn-outline-success {
  font-family: 'Oswald', sans-serif;
  text-transform: uppercase;
  font-size: 1rem;
}

.btn-outline-success:hover {
  color: #28a745;
  background-color: transparent;
  border-color: #28a745;
}

.tpl7 input.form-control {
  width:93% !important;
  display: inline !important;
}

.tpl7 .input-group {
  width:93% !important;
  display: inline-flex !important;
}

.tpl7 i.far {
  margin-left:5px;
}

.tpl7 a[data-toggle="tooltip"] {
  color: #666;
}

.tpl7 a[data-toggle="tooltip"]:hover {
  color: var(--gold);
}


/*  media breaks  */

@media (max-width: 1799px) {
  .count {
    padding: 32px 20px;
  }
}

@media (max-width: 1599px) {
  .count {
    padding: 19px 20px;
  }
}

@media (max-width: 1399px) {
  .count {
    padding: 4px 20px;
  }
}

@media (min-width:1200px) {
  .container {max-width:1800px;}
}

@media (max-width:1199px) {
  .col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
    padding-right: 5px;
    padding-left: 5px;
  }

  .logo {
    max-width:300px;
  }

  .seeMore {
    padding: 30px 100px;
  }

  .date {
    left: .9rem;
  }

  .update {
    margin-bottom: 10px;
  }

  .icon4K {
    right: 18px;
  }

  #step2 {
    border-right: none;
  }

}

@media (min-width: 992px) and (max-width: 1199px) {
  .count {
    padding: 10px 20px;
    margin-bottom: 10px;
  }

  .num {
    font-size: 2.5rem;
  }

  .desc {
    font-size: .6rem;
  }

  #goldTop {
    height:115px;
    margin-top:60px;
  }

}

@media (max-width: 991px) {
  .count {
    padding: 10px 20px;
    margin-bottom: 10px;
  }

  #counts {margin-top:30px;}

  .seeMore {
    padding: 30px 10px;
  }

  .icon4K {
    font-size: 1.5rem;
  }

  .joinBox h1 {
    font-size: 2rem;
  }

  .joinBox button {
    margin-top: 1rem;
  }

  #whatsInside ul {
    line-height: 2rem;
    font-size: .8rem;
  }

  .logo {
    z-index: 10000;
    top: 73px;
    padding-left: 0px;
    max-width: 250px;
    text-align: center;
    position: fixed;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-4deg);
  }

  #slideshow {margin-top: 5rem;}

  #goldTop {
    height:100px;
    margin-top:60px;
  }

}


@media (min-width: 768px) and (max-width: 1199px) {
  #step3 {
    border-top: 1px solid var(--gold);
  }
}

@media (max-width: 767px){
  h1, .joinBox h1, .seeMore h2, .joinBox button {font-size: 1.5rem;}
  .joinBox p {font-size: .8rem;}

  .logo {
    top: 50px;
    max-width: 170px;
  }

  #networkSites h2 {
    font-size: 1.1rem;
  }

  .sectionHeading h1 {
    font-size: 1.2rem;
  }

  .sectionHeading p {
    font-size: .8rem;
  }

  .num {
    font-size: 2rem;
    text-shadow: 1px 1px 2px #000;
  }

  .desc {
    font-size: 7px;
  }

  #step2 {
    border-left: none;
    border-right: none;
  }

}
