:root {
	
  --maxed-content-width: 1400px;
  --maxed-filter-width: 1000px;
  --bg-main: #191919;
  --bg-popup: #f6f6f6;
  --bg-side: #232323;
  --bg-footer: #272727;
  --bg-tag-button: #f0f0f0;
  --bg-list-dark: #cacaca;
  --bg-seek-bar: #aaaaaa;
  --bg-green: #52b737;
  --bg-red: #cf1f1a;

  --text-main: #fffefe;
  --text-h6: #c8c8c8;
  --text-side: #eee;
  --text-owner: #ddd;
  --text-video-dropdown: #d9d9d9;
  --text-popup: #9f9f9f;
  --text-summary: #9a9a9a;
  --text-input: #fffefe;
  --text-darker: #afafaf;
  
  --border-popup: #aaaaaa;
  --border-side: #a5a5a5;
  

  /* Black */
  --bg-black: #000;
  --text-black: #000;
  --border-black: #000;
  
  /* White */
  --bg-white: #fff;
  --text-white: #fff;
  --border-white: #fff;

  /* Tabs */
  --bg-tab: #141414;
  --bg-tab-active: #212121;
  --text-tab: #fefefe;
  --border-tab: #323232;
  --bg-white-tab: #373737;
  --bg-white-tab-active: var(--bg-white); 
  --text-white-tab: var(--text-black);
  --border-white-tab: #373737;
 
  /* Packeges */
  --bg-pack: #d9d9d9;
  --text-pack: #fefefe;
  --bg-pricing: #c9302c;
  --bg-pricing-selected: #4ab131;
  --text-add-info: #4ab131;
  --text-add-info2: #111111;

  /* Navbar */
  --bg-dropdown: #252525;
  --bg-dropdown-hover: #323232;
  --text-navbar: #fff;
  --text-dropdown: #fff;
  --border-dropdown-menu: #373737;
  --border-dropdown-item: #2c2c2c;
 
  /* Dark black button */
  --bg-dark-black-button: #191919;
  --bg-dark-black-start: #181818;
  --bg-dark-black-stop: #252525;  
  --border-dark-black: #343434; 
  --bg-dark-black-button-hover: #242424;
  --bg-dark-black-start-hover: #232323;
  --bg-dark-black-stop-hover: #2c2c2c;
  
  /* Black button */
  --bg-black-button: #323232;
  --bg-black-start: #313131;
  --bg-black-stop: #3c3c3c;
  --border-black-button: #3c3c3c;

  /* Green buttons as join, upgrade */
  --bg-green-button: #4bb032;
  --bg-green-start: #2a9512;
  --bg-green-stop: #5cc042;
  --bg-green-button-hover: #48bd2b;
  --bg-green-start-hover: #4eb335;
  --bg-green-stop-hover: #7de060;

  /* Red buttons as cancel membership, quit */
  --bg-red-button: #c33a27;
  --bg-red-start: #b3b3b3;
  --bg-red-stop: #e1e1e1;
  --bg-red-start-hover: #888888;
  --bg-red-middle-hover: #db401b;
  --bg-red-stop-hover: #e8381d;
  
  /* Lightblue buttons - VR */
	--bg-lightblue: #1070b5;
    --bg-lightblue-start: #1070b5;
    --bg-lightblue-stop: #49a3e2;

  /* Sitefilter slider */
  --bg-slider: #505050;
  --border-slider: #505050;
  --border-slider-button: #383838;
  --bg-slider-button: #383838;
  --text-slider-button: #fff;
  --border-slider-button-active: #fff;
  --bg-slider-button-active: #fff;
  --text-slider-button-active: #000;
  
  /* Card */
  --border-card: #383838;
  --bg-card: #272727;
  --text-card-date: #969696;
  
  /* Pager */
	--text-pager-dark: #323232;
    --bg-pager: #e0e0e0;
    --bg-pager-start: rgba(100, 100, 100, 0.04);
    --bg-pager-stop: rgba(255, 255, 255, 0.04);
	--bg-pager-disabled: #787878;
	--bg-pager-disabled-start: rgba(100, 100, 100, 0.04);
	--bg-pager-disabled-stop: rgba(255, 255, 255, 0.04);
    
}
.side-bg {
	background-color: var(--bg-side);
}
.sitespec-text {
	color: var(--text-site-main);
}

.main-shadow-bg {
    background-color: var(--bg-main);
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.25);
}

.btn.focus, .btn:focus {
    box-shadow: 0 0 0 0.2rem rgba(125,125,125,.25);
}

.btn-login {
	font-size: 1.3rem;
	font-weight: 500;
    height: 3rem;
    margin: 1.5rem 0 2rem;
}
.btn-send-review{
	font-weight: 500;
}

.btn-pager-goto {
	width: 2.2rem;
    height: 2.2rem;
	color: var(--text-white);
	border: none;
	background-color: var(--bg-site-main-button);
    background-image: -webkit-linear-gradient(bottom, var(--bg-site-main-start) 0%, var(--bg-site-main-stop) 100%);
    background-image: linear-gradient(to top, var(--bg-site-main-start) 0%, var(--bg-site-main-stop) 100%);
}
.btn-pager-goto:before {
	background: url(//hwnds.ddfstatic.com/resources/images/responsive/go_to-arrow.png) no-repeat 50%;
    content: '';
    width: 100%;
    height: 100%;
    display: block;
}

.btn-dark-black {
	color: var(--text-tab);
	border: 1px solid var(--border-dark-black);
	background-color: var(--bg-dark-black-button);
    background-image: -webkit-linear-gradient(bottom, var(--bg-dark-black-start) 0%, var(--bg-dark-black-stop) 100%);
    background-image: linear-gradient(to top, var(--bg-dark-black-start) 0%, var(--bg-dark-black-stop) 100%);
}
.btn-dark-black:hover {
	background-color: var(--bg-dark-black-button-hover);
    background-image: -webkit-linear-gradient(bottom, var(--bg-dark-black-stoart-hover) 0%, var(--bg-dark-black-stop-hover) 100%);
    background-image: linear-gradient(to top, var(--bg-dark-black-start-hover) 0%, var(--bg-dark-black-stop-hover) 100%);
}
.btn-dark-black:active {
    background-image: -webkit-linear-gradient(bottom, var(--bg-dark-black-stop) 0%,  var(--bg-dark-black-start) 100%);
    background-image: linear-gradient(to top, var(--bg-dark-black-stop) 0%,  var(--bg-dark-black-start) 100%);
}

.btn-controls {
	color: var(--text-main);
	border: 1px solid var(--border-black-button);
	border-radius: .25rem;
	border-top-right-radius: .25rem;
    border-bottom-right-radius: .25rem;
	background-color: var(--bg-black-button);
    /*
    background-image: -webkit-linear-gradient(bottom, var(--bg-black-start) 0%, var(--bg-black-stop) 100%);
    background-image: linear-gradient(to top, var(--bg-black-start) 0%, var(--bg-black-stop) 100%);
     */
}
.btn-controls:hover {
    color: var(--text-main);
    background-color: #5f5f5f;
    border-color: #7b7b7b;
}
.video-controls .btn-controls:hover {
    background-color: var(--bg-green-button-hover);
    /*
    background-image: -webkit-linear-gradient(bottom, var(--bg-green-start-hover) 0%, var(--bg-green-start-hover) 0%, var(--bg-green-stop-hover) 100%);
    background-image: linear-gradient(to top, var(--bg-green-start-hover) 0%, var(--bg-green-start-hover) 0%, var(--bg-green-stop-hover) 100%);
     */
}

.btn-controls.added {
	background-color: var(--bg-added-green-button);
    background-image: -webkit-linear-gradient(bottom, var(--bg-added-green-start) 0%, var(--bg-added-green-stop) 100%);
    background-image: linear-gradient(to top, var(--bg-added-green-start) 0%, var(--bg-added-green-stop) 100%);
	-webkit-transition: background-image .4s !important;
    transition: background-image .4s !important;
}

.btn-site-main {
	color: var(--text-white);
	background-color: var(--bg-site-main-button);
    background-image: -webkit-linear-gradient(bottom, var(--bg-site-main-start) 0%, var(--bg-site-main-stop) 100%);
    background-image: linear-gradient(to top, var(--bg-site-main-start) 0%, var(--bg-site-main-stop) 100%);
}
.btn-site-main:hover,
.video-title .btn-dark-black:hover{
	background-color: var(--bg-site-main-button-hover);
    background-image: -webkit-linear-gradient(bottom, var(--bg-site-main-start-hover) 0%, var(--bg-site-main-stop-hover) 100%);
    background-image: linear-gradient(to top, var(--bg-site-main-start-hover) 0%, var(--bg-site-main-stop-hover) 100%);
}

.btn-dark {
    color: var(--text-main);
	background-color: var(--bg-black-button);
}
.btn-dark:hover {
    color: var(--text-site-main);
}

.btn-group.show .btn-filter-dark{
	background-color: var(--bg-dark-black-stop);
    background-image: -webkit-linear-gradient(bottom, rgba(255, 255, 255, 0.02) 0%, rgba(100, 100, 100, 0.02) 100%);
    background-image: linear-gradient(to top, rgba(255, 255, 255, 0.02) 0%, rgba(100, 100, 100, 0.02) 100%);
    box-shadow: inset 0 4px 8px rgba(28, 28, 28, 0.35);
    border-bottom: 1px solid transparent;
}

.btn-dropdown {
	width: 100%;
	color: var(--text-site-main);
	border: 1px solid var(--border-tab);
	border-radius: 0rem;
	background-color: var(--bg-tab);
}
.btn.btn-dropdown.collapsed{
    color: var(--text-main);
}

ul.tags li a.btn.btn-light-tag {
	font-size: 0.9rem;
    background-color: var(--bg-tag-button);
    display: inline-block;
    text-decoration: none;
    color: var(--text-black);
	padding: .15rem .5rem;
}
ul.tags li a.btn.btn-light-tag:hover {
    color: var(text-white);
    background-color: var(--text-site-main);
    background-image: -webkit-linear-gradient(bottom, rgba(100, 100, 100, 0.06) 0%, rgba(255, 255, 255, 0.06) 100%);
    background-image: linear-gradient(to top, rgba(100, 100, 100, 0.06) 0%, rgba(255, 255, 255, 0.06) 100%);
}

.btn-green,
.btn-controls.like.added,
.btn-controls.favorite.added,
.download-button.btn-controls:not(.collapsed),
.skip-box-button.btn-controls:not(.collapsed){
	color: var(--text-main);
	border: none;
	background-color: var(--bg-green-button);
    background-image: -webkit-linear-gradient(bottom, var(--bg-green-start) 0%, var(--bg-green-stop) 100%);
    background-image: linear-gradient(to top, var(--bg-green-start) 0%, var(--bg-green-stop) 100%);
	-webkit-transition: background-image .4s !important;
    transition: background-image .4s !important;
}

.btn-green:hover,
a.btn-green:hover,
.btn-controls.like.added:hover,
.btn-controls.favorite.added:hover,
.download-button.btn-controls:not(.collapsed),
.skip-box-button.btn-controls:not(.collapsed){
	background-color: var(--bg-green-button);
    background-image: -webkit-linear-gradient(bottom, var(--bg-green-start-hover) 0%, var(--bg-green-start-hover) 100%);
    background-image: linear-gradient(to top, var(--bg-green-start-hover) 0%, var(--bg-green-start-hover) 100%);
}
.member-events .btn-controls.like.added,
.member-events .btn-controls.like.added:hover,
.member-events .btn-controls.favorite.added,
.member-events .btn-controls.favorite.added:hover,
.member-events .download-button.btn-controls:not(.collapsed),
.member-events .skip-box-button.btn-controls:not(.collapsed){
    border: 1px solid var(--border-black-button);
}

.btn-red {
	color: var(--text-main);
    background-color: var(--bg-red-button);
    background-image: -webkit-linear-gradient(bottom, rgba(179, 179, 179, 0.03) 0%, rgba(136, 136, 136, 0.03) 0%, rgba(225, 225, 225, 0.03) 100%);
    background-image: linear-gradient(to top, rgba(179, 179, 179, 0.03) 0%, rgba(136, 136, 136, 0.03) 0%, rgba(225, 225, 225, 0.03) 100%);
}
.btn-red:hover {
    background-image: -webkit-linear-gradient(bottom, var(--bg-red-start-hover) 0%, var(--bg-red-middle-hover) 0%, var(--bg-red-stop-hover) 100%);
    background-image: linear-gradient(to top, var(--bg-red-start-hover) 0%, var(--bg-red-middle-hover) 0%, var(--bg-red-stop-hover) 100%);
}

/*.video-title .btn-dark-black.vr_switch:hover, */
.btn-lightblue{
	text-decoration: none;
	color: var(--text-white) !important;
    background-color: var(--bg-lightblue);
    background-image: -webkit-linear-gradient(bottom, var(--bg-lightblue-start) 0%, var(--bg-lightblue-stop) 100%);
    background-image: linear-gradient(to top, var(--bg-lightblue-start) 0%, var(--bg-lightblue-stop) 100%);
}
/*
.btn-lightblue.vr_switch.disabled,
.btn-site-main.standard_switch.disabled{
	opacity: 1;
}
*/
.logout img {
	padding: 1rem;
	border-radius: .25rem;
	color: var(--text-main);
	border: 1px solid var(--bg-red-button);
	background-color: var(--bg-red-button);
    background-image: -webkit-linear-gradient(bottom, rgba(179, 179, 179, 0.03) 0%, rgba(136, 136, 136, 0.03) 0%, rgba(225, 225, 225, 0.03) 100%);
    background-image: linear-gradient(to top, rgba(179, 179, 179, 0.03) 0%, rgba(136, 136, 136, 0.03) 0%, rgba(225, 225, 225, 0.03) 100%);
}

.btn.btn-get-offer {
	color: var(--text-white);
	background-color: var(--bg-red);
	font-size: 1.3rem;
}

.btn-error {
	font-size: 1.3rem;
	font-weight: 500;
    height: 3rem;
	color: var(--text-white);
	text-transform: uppercase;
	border: 1px solid var(--border-white);
	background-color: var(--bg-red);
}

.btn-footer {
	min-width: 100px !important;
	font-size: 0.9rem;
	line-height: 1.8rem;
    color: var(--text-side);
    background-color: var(--bg-footer);
    border-color: var(--border-side);
	background-image: none;
	border-radius: 0;
}

.card .btn-watch {
    width: 19px;
    height: 19px;
    padding: 0;
    border: none;
	cursor: pointer;
}

#vr-modal>div {
    position: absolute;
	top:10%;
    background-size: contain;
}
#vr-modal {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0, 0.85);
    z-index: 999;
    top: 0;
    left: 0;
}
#vr-info {
	background: transparent url(//hwnds.ddfstatic.com/resources/images/vr_info_popup_new_mobil.png) center 0 no-repeat;
	width: 100%;
	height: 80%;
}

/* Vendor changes */
.fstChoiceItem {
	background-color: var(--bg-fstChoiseItem);
}
.fstResultItem.fstSelected,
.fstResultItem.fstFocused{
    color: var(--text-fstResultItem-selected);
}
.fstMultipleMode.fstActive .fstControls {
	border: 1px solid var(--border-fstMultipleMode-fstControls);
	box-shadow: inset 0 0 10px var(--shadow-fstMultipleMode-fstControls);
}

.width-33 {
	width: 33.33%;
}
.width-20 {
	width: 20%;
}
