:root {
	--white: #ffffff;
	--gray: #666666;
	--darkgray: #1c1c1c;
	--gold: #ffd800;
	--green: #00b946;
	--lightGray: #ddd;
}



body {
	font-family: Oswald, san-serif;
	font-weight: 300;
	color: var(--white);
	background-color: var(--darkgray);
}

#navMenu {
	box-shadow:0px 2px 5px #000;
	margin-bottom: 1rem !important;}

/* grid */

@media only screen and (min-width:2561px) {
	.col-xxxl-1 {
		flex: 0 0 auto;
    	width: 8.33333333%;
	}

	.col-xxxl-2 {
		flex: 0 0 auto;
    	width: 16.66666667%;
	}

	.col-xxxl-4 {
		flex: 0 0 auto;
    	width: 33.33333333%;
	}

	.d-xxxl-none {display: none !important;}
	.d-xxxl-block {display: flex !important;}
}

@media only screen and (min-width: 992px) and (max-width: 1399px) {
	#comingSoon .d-lg-block {display: flex !important;}
}

@media only screen and (min-width: 1400px) and (max-width: 2560px) {
#comingSoon .d-xxl-block {display: flex !important;}
}

.sectionTitle {
	margin-left: calc(var(--bs-gutter-x) * .5);
	margin-bottom: 1rem;
	padding: calc(var(--bs-gutter-x) * .5);
	background: rgb(44,44,44);
    background: linear-gradient(90deg, rgba(44,44,44,1) 0%, rgba(29,29,29,1) 50%, rgba(28,28,28,0) 100%);
}

.sectionTitle h2 {
	font-size: 1.5rem;
}


/* video thumbs */

.videoThumb {
	position: relative;
	padding-bottom: 56.125%;
	border: 1px solid var(--gray);
}

.videoThumb.tourComing {
	position: relative;
	padding-bottom: 56.125%;
	border: none;
	margin-bottom: .5rem !important;
}

.portraitThumb {
	position: relative;
	border: 1px solid var(--gray);
}

.videoThumb:hover, .portraitThumb:hover {
	border: 1px solid var(--green);
}

.videoThumb.tourComing:hover {
	border: none;
}

.videoThumb img:nth-child(n) {
    position: absolute;
    top: 0;
    left: 0;
}

.play {
    display: none;
    position: absolute;
    top: 30%;
    width: 20%;
    text-align: center;
    margin: 0 auto;
    left: 0;
    right: 0;
    z-index: 100;
    pointer-events: none;
}

.videoThumb:hover .play {
    display: block;
   }

.trt {
    position: absolute;
    bottom: 1px;
    right: 1px;
    background-color: rgba(0,0,0,0.80);
    padding: 3px 5px;
    color: #ddd;
    border-top: 1px solid #666;
    border-left: 1px solid #666;
    font-size: .8rem;
    z-index: 499;
}

.tourTRT {
	position: absolute;
    right: 0;
    top:0;
    background-color: rgba(0,0,0,.4);
    padding: 4px 5px;
    color: #ddd;
    border-top: none;
    border-left: none;
    font-size: 0rem;
    z-index: 499;
}

/*.icon4K {
    position: absolute;
    top: 3px;
    right: 3px;
    padding: 3px 6px;
    background-color: rgba(0,0,0,.5);
    border-radius: 4px;
    border: 1px solid #ffd800;
    font-size: 1.7em;
    font-weight: 800;
    color: #ffd800;
    text-shadow: 1px 2px 1px #000;
    z-index: 500;
}
*/

p.setTitle, p.date, p.setModel {
	margin-bottom: 0em;
}

.setTitle a, .setTitle.comingsoon {
	text-decoration: none;
	color: var(--gold);
	font-weight: 500;
}

.setTitle a:hover {
	color: var(--green);
}

p.setModel a {
	color: var(--gold);
	text-decoration: none;
	font-size: .85rem;
}

p.setModel a:hover {
	color: var(--green);
	text-decoration: none;
}

.favorite {
	position: absolute;
	top:0px;
	right: 7px;
	z-index:500;
}

.favorite a {
	color: var(--gold);
	text-decoration: none;
}

.date {
	font-size: .85em;
}

.comingsoon {
	color: var(--gold) !important;
}

.tourComing img {
	filter: blur(6px);
  	-webkit-filter: blur(6px);
	image-rendering: pixelated;
}

.coming:hover > .img-fluid {
filter: blur(6px);
  -webkit-filter: blur(6px);
	image-rendering: pixelated;
}

.coming:hover .play, .tourComing:hover .play {
	display: block;
	line-height: 1;
	font-size: 3vh;
	color: #fff;
	width: 100%;
	padding: 0px;
	margin-top: 10px;
	text-shadow: 2px 2px #000;
	font-weight: 900;
}



/* ratings */

.notvoted a {
	color: var(--gray);
}

.voted a, .stars.tour.voted {
	color: var(--gold);
}

.favorite a {
        position: relative;
        display: inline-block;
        width: 16px;
        height: 16px;
    }

    .favorite a svg .heart-fill, .playerTitle a svg .heart-fill {
        fill-opacity: 0;
        transition: fill-opacity 0.2s;
        color: var(--gold);
    }

    .favorite a:hover svg .heart-fill, .playerTitle a:hover svg .heart-fill {
        fill-opacity: 1;
        color: var(--gold);
    }


 footer {
	border-top: 1px solid #333;
	padding-top:1.5rem;
	
}

.footerLinks {
	color: var(--lightGray);
	font-size:.8rem;
	text-align: center;
	line-height: 1.4rem;
}

.footerLinks a {
	color:var(--lightGray);
	text-decoration: none;
}

.footerLinks a:hover {
	text-decoration: none;
	color: var(--green);
}

.logo {max-height: 70px;}

#searchBar {background-color: transparent;}

.btn-outline-light:focus {
	box-shadow: none;
}

.btn-outline-light:hover {
	background-color: var(--gold);
	border: 1px solid var(--gold);
}

.modal {z-index: 6000;}
.modal.left .modal-dialog,
	.modal.right .modal-dialog {
		position: fixed;
		margin: auto;
		width: 320px;
		height: 100%;
		-webkit-transform: translate3d(0%, 0, 0);
		    -ms-transform: translate3d(0%, 0, 0);
		     -o-transform: translate3d(0%, 0, 0);
		        transform: translate3d(0%, 0, 0);
	}

	.modal.left .modal-content,
	.modal.right .modal-content {
		height: 100%;
		overflow-y: auto;
	}

	.modal.left .modal-body,
	.modal.right .modal-body {
		padding: 15px 15px 80px;
	}

.mainMenu {
	background-color: #333;
}

.modal.right.fade .modal-dialog {
		right: -320px;
		-webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
		   -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
		     -o-transition: opacity 0.3s linear, right 0.3s ease-out;
		        transition: opacity 0.3s linear, right 0.3s ease-out;
	}

	.modal.right.fade.show .modal-dialog {
		right: 0;
	}

	#menu .list-group-item, #categoryList .list-group-item {
		background-color: transparent;
		color: var(--white);
	}

	#menu .list-group-item:hover, #categoryList .list-group-item:hover {
		background-color: transparent;
		color: var(--green);
	}

	#menu3 .list-group-item.child, #menu5 .list-group-item.child {text-indent: 3rem;}

	.fixed {
		    background-color: var(--darkgray);
    		position: fixed;
    		z-index: 5000;
    		box-shadow: 0px 2px 5px #000000;
    		width:100%;
    		top:0;
	}

.btn-warning {background-color: var(--gold);}
.btn-warning:hover {background-color: var(--green);border: 1px solid var(--green);}
.btn-warning:focus {box-shadow:none;}

.page-link {
	color: var(--gold);
	background-color: transparent;
	border: 1px solid var(--gold);
}

.page-link:hover {
	color: var(--green);
	background-color: transparent;
	border: 1px solid var(--green);
}

#searchBar .btn-outline-warning {
	border: 1px solid var(--gold);
	color: var(--gold);
}

#searchBar .btn-outline-warning:hover {
	border: 1px solid var(--green);
	color: var(--green);
	background-color: transparent;
}

/*    faq     */

.card {
	background-color: transparent;
}

.btn-link {
	color: var(--gold);
	text-decoration: none;
}

.btn-link:hover {
	color: var(--green);
	text-decoration: none;
}

.btn-link[aria-expanded="true"] {
	color: var(--green);
	text-decoration: none;
}

.card-body a {
	color: var(--gold);
	text-decoration: none;
}

.card-body a:hover {
	color: var(--green);
}

.nav-pills .nav-link {
	color: var(--gold);
}

.nav-pills .nav-link:hover {
	color: #000000;
	background-color: var(--gold);
}

.nav-pills .nav-link.active {
	background-color: var(--gold);
	color: #000000;
}

.playerTitle {
	font-size: 1.5rem;
	margin-bottom: 0rem;
}

.playerModel {margin-bottom: 0rem;}

.playerModel a {
	color: var(--gold);
	text-decoration: none;
	
}

.playerModel a:hover {
	color: var(--green);
}

.modalLink {color: var(--gold);text-decoration: none;}
.modalLink:hover {color: var(--green);}
.text-bg-primary {background-color: var(--gray);font-weight:300; font-size: .85rem;text-decoration: none;}
.text-bg-primary:hover {background-color: var(--green);color: #000000;}

.report a {
	color: var(--gold);
	text-decoration: none;
}

.report a:hover {
	color: var(--green);
} 

.btn-download {color: var(--gold);border: 1px solid var(--gold);}
.btn-download:hover, .btn-download:active, .btn-download:focus {color: var(--green);border: 1px solid var(--green);box-shadow: none;}

#videoStory .modal-content {background-color: var(--darkgray);box-shadow: 0px 0px 9px #cccccc;}
#videoStory .modal-body {padding: 2rem 3rem;}
.btn-primary {color: #000;background-color: var(--gold);border: none;}
.btn-primary:hover {color: #000;background-color: var(--green);border: none;}

.dropdown-menu {background-color: var(--darkgray); border: 1px solid var(--green);padding: 1rem;}
.dropdown-menu>li>a {color: var(--gold);text-decoration: none;padding: .5rem;}
.dropdown-menu>li>a:hover {color: var(--green);text-decoration: none;padding: .5rem;}


.thumbRatio {
    width: 100%;
    position: relative;
    padding-bottom: 130%;
    height: 0;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: cover !important;
}

.litUp {background-color: var(--gold);color: #000000;}
.litUp:hover {background-color: var(--green);color: #000000;}



/*  login  */

#loginForm label, #loginForm button {text-transform: uppercase;}
#loginForm a {color: var(--gold);text-decoration: none;}
#loginForm a:hover {color: var(--green);}
#loginForm .btn-outline-warning {color: var(--gold);border-color: var(--gold);}
#loginForm .btn-outline-warning:hover {color: var(--green);border-color: var(--green);background-color: transparent;}
#loginForm .btn-outline-warning:focus, #loginForm .btn-outline-warning:active {box-shadow:none;}
#loginForm .btn-outline-secondary {color: #999;border-color: #999;background-color: transparent;}
#loginForm .btn-outline-secondary:hover {color: var(--green);border-color: var(--green);background-color: transparent;}
#loginForm .btn-outline-secondary:focus {box-shadow:none;}
.alert-warning {color: white;
    background-color: transparent;
    border-color: red;}

.hide {visibility:hidden !important;}

.joinBar {
	background-color: var(--gold);
    text-align: center;
    text-decoration: none;
    color: #000;
    padding: 1rem;
    border-radius: 10px;
    margin-bottom: 3rem;
    max-width:calc(100vw - 30px);
}

.joinBar:hover {
	background-color: var(--green);
    text-align: center;
    text-decoration: none;
    color: var(--white);
    padding: 1rem;
    border-radius: 10px;
}

.joinBar h3, .footerJoin h3 {font-size: 3rem;}
.joinBar p, .footerJoin p {font-size: 2rem;margin-bottom: 0rem;}

@media only screen and (max-width:767px) {
	.joinBar h3, .footerJoin h3 {font-size: 2rem;}
	.joinBar p, .footerJoin p {font-size: 1.3rem;margin-bottom: 0rem;}
	#navMenu .navbar {height: 50px;}
#navMenu .navbar,#navMenu .navbar-brand {padding-top: 0rem; padding-bottom:0rem;margin-right:0px;}
.logo {max-height:30px;}
.btn.main-menu {padding: 0px;border:none;}
button.no-highlight:active, button.no-highlight:focus, button.no-highlight:hover {color: #fff; background-color: transparent !important;}

}

#tour .videoThumb img, #tour .portraitThumb img {width:100%;}

.footerJoin {
	text-align: center;
    text-decoration: none;
    margin-bottom: 2rem;
    color: var(--gold);
}

.footerJoin:hover {color: var(--green);}

.footerJoin .gray {color: #999;}
.footerJoin p {color: #fff;}

#tour a.nav-link {color: var(--white);}
#tour a.nav-link.joinLink {color: var(--gold);}
#tour a.nav-link:hover {color: var(--green);}
#tour a.nav-link.active {color: var(--green);}

@media only screen and (max-width:991px) {

	#tour a.navbar-brand {max-width:70%;}

}

.navbar-toggler {border: 1px solid var(--white);padding: .5rem .75rem;}

  #myVideo {
  display: block;
  margin: 0 auto;
           
   }

      .font-thin {
         font-weight: 300 !important;
      }

      .container-video 
      {
         position: relative;
         top: 0;
         left: 0;
         right: 0;
         bottom: 0;
         display: flex;
         align-items: center;
         
      }

      .mtv-0 {
         margin-top: 0px !important;
      }

      .font-video {
         font-size: 2rem !important;
         margin-top: 40px;
         display: block;
         text-align: center;
      }

      .shadow-text {
         text-shadow: 1px 1px 2px rgba(46,91,173,0.6);   
      }

      .container-text{
         z-index: 1000;
         margin-left: 3%;
         padding: 20px;
         position: absolute;
         color: #fff;
         font-family: 'Oswald', sans-serif;
         line-height: 1;
         background-color: rgba(0, 0, 0, .25);              
      }

      
      .ts-button-member-main {
         background-color: #ecc101;
         color: #000;
         padding-left: 10px;
         padding-right: 10px;
         padding-top: 5px;
         padding-bottom: 5px;
         text-decoration: none;
         font-weight: 500;
         letter-spacing: 1px;
         font-size: .9rem;
}

      .h1v {
         display: block;
         font-size: 2em;
         margin-block-start: 0.67em;
         margin-block-end: 0.67em;
         margin-inline-start: 0px;
         margin-inline-end: 0px;
         font-weight: bold;
      }

      @media screen and (max-width: 1500px) {
        .h1v{
         font-size: 1.5rem !important;
        }
      }

      @media screen and (max-width: 1000px) {
        .h1v{
         font-size: 1.0rem !important;
        }
      }

      @media screen and (max-width: 750px) {
        .container-text{
         display: none;
        }
      }