@font-face{
	font-family: 'Raleway Black';
	src: url(fonts/Raleway-Black.ttf);
	font-feature-settings: 'pnum' on, 'lnum' on;
    font-display: swap;
    font-weight: 900;
}
@font-face{
	font-family: 'Raleway XBold';
	src: url(fonts/Raleway-ExtraBold.ttf);
	font-feature-settings: 'pnum' on, 'lnum' on;
    font-display: swap;
    font-weight: 800;
}
@font-face{
	font-family: 'Raleway Bold';
	src: url(fonts/Raleway-Bold.ttf);
	font-feature-settings: 'pnum' on, 'lnum' on;
    font-display: swap;
    font-weight: 700;
}
@font-face{
	font-family: 'Raleway SemiBold';
	src: url(fonts/Raleway-SemiBold.ttf);
	font-feature-settings: 'pnum' on, 'lnum' on;
    font-display: swap;
    font-weight: 600;
}
@font-face {
	font-family: 'Raleway Medium';
	src: url("fonts/Raleway-Medium.ttf");
	font-feature-settings: 'pnum' on, 'lnum' on;
    font-display: swap;
    font-weight: 500;
}

	
:root{
	--Background:#3A3F44;
	--Menu:#222222;
	--Text:#fff;
	--Hover:#2D5AE180;
	--Free:#626262;
	--Standard:#0084DD;
	--Pro:#A000C0;
	--Ultra:#D10000;
}

body{
	font-family:"Raleway Bold", Tahoma, sans-serif;
	color:var(--Text);
	background:url(images/Background.svg) no-repeat;
	background-color:var(--Background);
	background-size: 100% 150%;
	margin:0;
	font-feature-settings: 'lnum';
}
.background{
	height:2440px;
	width:100%;
	background:url(images/Background.svg);
	background-size:cover;
	background-color:var(--Background);
	display:block;
	position:absolute;
	top:0;
	left:0}
.review-stars{
    width:70px!important;
}

/*Header*/
.Logo{
	width:64px;
	height:40px;
	background:var(--Menu);
	margin-right:25px;
	list-style:none;
	border-radius:15px;
	position:relative;
	padding:0;
	margin-top: 0px;
	float:left}
.LogoIcon{
	background:url(https://ropro.io/images/ropro_logo.svg);
	display:block;
	width:50px;
	height:30px;
	background-size:contain;
	filter: drop-shadow(0px 2px 5px rgba(0, 0, 0, 0.25));
	margin:5px}
.top-header{
	z-index:100;
	top:20px;
	right:20px;
	left:20px;
	height:40px;
	position: fixed}
	
.MenuItem:hover{background:var(--Hover);transition:.4s;border-radius:15px;margin:auto}
.MenuItem:hover a{color:#C7E0F4!important}

.top-header .headeritems .MenuItem .HeaderLinks {
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	text-decoration: none;
}
.morebtnhover {
    padding:10px;
}
.morebtn {
    padding:5px;
}
.morebtnhover, .MenuItem#MoreBtnMobile {
    display: none;
    backdrop-filter: blur(10px);
}
.MenuItem#MoreBtnMobile:hover .morebtnhover,
.MenuItem#MoreBtnMobile:focus-within .morebtnhover{
	line-height: 1em;
	left:-120px}
.MenuItem#MoreBtnMobile{line-height: 40px;}
.MenuItem#MoreBtn:hover .morebtnhover,
.MenuItem#MoreBtn:focus-within .morebtnhover,
.MenuItem#MoreBtnMobile:hover .morebtnhover,
.MenuItem#MoreBtnMobile:focus-within .morebtnhover{
    -webkit-box-sizing: initial;
    box-sizing: initial;
	display: block;
	position: absolute;
	bottom: -155px;
	z-index: 125;
	width: 150px;
	height: 140px;
	background: var(--Hover);
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	text-align: left;
	list-style: none;
	padding: 0;
	padding-left: 15px;
	padding-top: 15px;
	flex-flow: wrap;
}
.MenuItem#MoreBtn:hover .morebtnhover a,
.MenuItem#MoreBtn:focus-within .morebtnhover a,
.MenuItem#MoreBtnMobile:hover .morebtnhover a,
.MenuItem#MoreBtnMobile:focus-within .morebtnhover a{
	text-decoration: none}


.FeaturePurchaseSubscription{
	display:flex;justify-content:center;padding:0;pointer-events:none;position:relative;top:20px
}

.MenuItem[selected="true"]{background:var(--Standard)!important;border-radius:10px;margin:auto;height:30px;margin-left:5px;margin-right:5px}
.MenuItem[selected="true"]:hover a{color:var(--Text)!important}

.headeritems{
	height:40px;
	margin-top: 0px;
	background:var(--Menu);
	border-radius:15px;
	display:flex;
	width:calc(100% - 356px);
	position:relative;
	float:left;
	padding:0}
.HeaderLinks{
	display:inline-block;
	color:var(--Text);
	text-decoration:none;
	padding: 0 15px 0 15px;
	font-family: Raleway XBold, Tahoma, sans-serif;
	font-style: normal;
	font-size: 16px;
	line-height: 100%}
	
.IconItems{
	height:40px;
	display:flex;
	position:relative;
	padding:0px;
	margin-top:0}
.IconItem{
	width:40px;
	height:40px;
	background:var(--Menu);
	border-radius:10px;
	list-style:none;
	margin-left:5%;
	transition: .2s}
.IconItem a{width:40px;height:40px;display:block}

.MenuItem{
	margin:0;
	padding:0;
	left:0;
	list-style:none;
	background:transparent;
	height:40px;
	text-align:center;
	flex-grow: 1;
	display:flex;
	align-items:center;
	position:relative;
	justify-content: center;
	transition:.4s;
    text-decoration: none;
    cursor: pointer;
}
	
.IconItem{width:40px;height:40px}
.IconItem[id="RobloxGroup"]{
	background:url(images/RobloxGroup.svg)}
.IconItem[id="Support"]{
	background:url(images/Support.svg)}
.IconItem[id="Discord"]{
	background:url(images/Discord.svg)}
.IconItem[id="Twitter"]{
	background:url(images/Twitter.svg)}
.IconItem[id="TikTok"]{
	background:url(images/TikTok.svg)}
.IconItem[id="Youtube"]{
	background:url(images/youtube_logo.png);
    background-size:100%;
}

	
	/*Showcase*/
.container{
	position:relative;
	top:60px;
	width:100%;
	height:600px}

.MainExtShowcase1{
	position:relative;
	max-width: 1500px;
	margin:auto;
	height:600px}

.ShowcaseCaption{width:100%;left:0;position:relative;overflow:hidden}
h1#Container{
	font-family:Raleway Black, Tahoma, sans-serif;
	font-size:144px;
	margin:0;
	top:70px;
	left:10%;
	position:relative;}
h2#Container{
	font-family:Raleway Black, Tahoma, sans-serif;
	font-size:48px;
	margin:0;
	top:40px;
	left:11%;
	position:relative;}
.description p{
	font-family:Raleway Bold, Tahoma, sans-serif;
	font-size:30px;
	position:relative;
	left:11%;
	top:30px;}
.description div{
	font-family:Raleway Bold, Tahoma, sans-serif;
	font-size:30px;
	position:relative;
	left:11%;
	top:5px;}

.BuyButtons{
	position:relative;
	top:5%;
	left:11%;
	width:85%;
	overflow:visible;}
	
.BuyButtons h3{font-family:"Raleway Medium", Tahoma, sans-serif}
	
.StoreContainerButtons a{
	display:inline-block;
	width:168px;
	height:50px;
	position:relative;
	background:#000;
	background-size:cover!important;
	color:transparent}
	
	.StoreContainerButtons .Chrome{background:url(images/cws_icon.png)}
	.StoreContainerButtons .Firefox{background:url(images/firefox_icon.png)}
	.ShowcaseBackground{width:45%;height:430px;background:url(images/LogoTilt.png) no-repeat;position:absolute;right:50px;top:20%;background-size:contain}
	





/*TIERS*/
.container#ShowcaseTiers{display:flex;margin-top:150px;justify-content:center}

.PurchaseFeaturesCont{margin-left:25px;margin-right:25px;top:-30px;position:absolute;display:flex;width:95%;justify-content: space-between;flex-wrap: wrap;}
.ultratext p{margin:0;margin-bottom:15px}
.FeatureBig{background:var(--Menu);padding:15px;border-radius:15px;display:flex;flex-direction:row;margin-bottom:25px}
.TierFeaturesContainer[id="Ultra"] .FeaturesGridContainer ul{margin-top:25px}
.ultratext a:link, .ultratext a:visited{color:var(--Pro);text-decoration:none}

.TierSelector{
	width:23%;
	height:35px;
	background:#000;
	position:absolute;
	border-radius: 10px;
	margin-right: 1%;
	margin-left:1%;
	left:0;
	margin-top:5px;
	margin-bottom:5px;
	box-shadow: inset 0px 0px 10px rgba(0, 0, 0, 0.3);
	background:var(--Free);
	transition:.5s}

	
	.TierSelector.activeFree{background:var(--Free)!important;left:0!important;}
	.TierSelector.activeStandard{background:var(--Standard)!important;left:25%!important;}
	.TierSelector.activePro{background:var(--Pro)!important;left:50%!important;}
	.TierSelector.activeUltra{background:var(--Ultra)!important;left:75%!important;}

.subscribebutton{box-shadow: 0 0 0 2px #21BA45}
#managementLogin,.helpbutton{box-shadow: 0 0 0 2px var(--Standard);border:none}
#standardTierMonthlyPurchase{box-shadow: 0 0 0 2px var(--Standard);border:none}
#proTierMonthlyPurchase{box-shadow: 0 0 0 2px var(--Pro);border:none}
#ultraTierMonthlyPurchase{box-shadow: 0 0 0 2px var(--Ultra);border:none}

.TierBody{
	border-radius:25px;
	width:95%;
	height:100%;
	background: var(--Menu);
	box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.5);
	overflow:hidden;
	margin-left:5px;
	position:relative;
	z-index:1}
	

.container#ShowcaseTiers{flex-wrap: wrap}
.Tier{max-height:600px;min-height:600px;transition:.3s}
	
.TierTitle {
	width: 100%;
	text-align: center;
	display: block;
	padding-top: 25px;
	padding-bottom: 25px;
	font-family:"Raleway Black", Tahoma, sans-serif;
	font-size:28px;
	position:relative;
	z-index:4}
	
.TierPrice{
	width: 100%;
	text-align: center;
	display: block;
	font-family:"Raleway XBold", Tahoma, sans-serif;
	font-size:18px;
	position:relative;
	z-index:4;
	top:-15px}

.TierImgContainer{
	position:absolute;
	top:0;
	opacity:.25;
	border-radius:25px;
	overflow:hidden;
	width:125px;
	height:125px;
	pointer-events:none;
}
	
.TierImgContainer img{
	width: 150px;
	height: 150px;
	left: -45px;
	position: relative;
	top: -30px}
	.TierImgContainer#Free img{background: url(images/Tiers/free.png);}
	

.TierFeatures#Free{
	border-radius:25px;
	width:90%;
	height:80%;
	background:var(--Background);
	display:block;
	position:relative;
	z-index:3;
	margin-right:3.5%;
	margin-left:3.5%;
	border:3px solid var(--Free)}
	
.TierFeatures{
	max-width:300px;
	border-radius:25px;
	width:90%;
	height:75%;
	background:var(--Background);
	display:block;
	position:relative;
	z-index:3;
	margin-right:3.5%;
	margin-left:3.5%}
	.TierFeatures#Standard{border:3px solid var(--Standard)}
	.TierFeatures#Pro{border:3px solid var(--Pro)}
	.TierFeatures#Ultra{border:3px solid var(--Ultra)}
	
.TierFeaturesTitle{
	font-family:"Raleway Bold", Tahoma, sans-serif;
	font-size:16px;
	text-align:center;
	width:100%;
	display:block;
	padding-top:15px;}
.TierFeaturesSubTitle{
	font-family:"Raleway Medium", Tahoma, sans-serif;
	font-size:12px;
	text-align:center;
	width:100%;
	display:block;}
.Tierdivider{
	margin:5%;
	width:90%;
	background:var(--Menu);
	height:3px;
	display:block;
	border-radius:5px}
.Featuresgiven{
	font-size:14px;
	width:85%;
	margin:7.5%;
	display:block;
	line-height:.2em}
.Featuresgiven p{line-height:1.3em;text-align:center}
.MoreFeaturesRedirect{width:95%;margin-left:2.5%;margin-right:2.5%;text-align:center}
.MoreFeaturesLink#Free{color:var(--Free);text-decoration:none}
.MoreFeaturesLink#Standard{color:var(--Standard);text-decoration:none}
.MoreFeaturesLink#Pro{color:var(--Pro);text-decoration:none}
.MoreFeaturesLink#Ultra{color:var(--Ultra);text-decoration:none}

.DealsNotif{margin-left:15px}
.DealsNotifier .Featuresgiven,
.DealsPage .Featuresgiven{
	font-size:10px;
	font-family:"Raleway Medium", Tahoma, sans-serif;
	line-height:0em;
	margin-top:0px}
.DealsNotifier .Featuresgiven p,
.DealsPage .Featuresgiven p{
	line-height:1.3em;
	text-align:left;
	margin-top:0px}

.PurchaseTierButton#Free{
	width: 100%;
	height: 35px;
	background: var(--Free);
	position: absolute;
	bottom: -1px;
	text-align: center;
	border-radius: 0 0 22px 22px;
	font-family:"Raleway Bold", Tahoma, sans-serif;
	padding-top:15px;
	font-size:16px;
	padding-bottom:0}
	
	.PurchaseTierButton{
	width: 100%;
	height: 35px;
	position: absolute;
	bottom: 0px;
	text-align: center;
	border-radius: 0 0 15px 15px;
	font-family:"Raleway Bold", Tahoma, sans-serif;
	padding-top:15px;
	font-size:16px;
	color:var(--Text);
	border:none;
	padding-bottom:30px;
	cursor:pointer}
	.PurchaseTierButton#standardTierMonthlyPurchase{background:var(--Standard)}
	.PurchaseTierButton#proTierMonthlyPurchase{background:var(--Pro)}
	.PurchaseTierButton#ultraTierMonthlyPurchase{background:var(--Ultra)}
.PurchaseCheckbox{
	position:absolute;
	bottom:-33px;
	margin:auto}
	
/*Compatible Addons Section*/

.container#ShowcaseCompatible .TagLine{
	font-family:"Raleway Black", Tahoma, sans-serif;
	font-size:86px;
	text-align:left;
	position:relative;
	right:40px;
	margin-left:40px}

.container#ShowcaseCompatible{
	max-width: 1500px;
	display:flex;
	flex-direction:row;
	align-items:center;
	position:relative;
	margin:auto;
	height:600px;
	margin-top:180px;}

.addons{
	width:50%;
	max-width:95%;
	height:500px;
	position:relative;
	left:5%;
	background-size:contain!important;
	background:url(images/Addons.svg) no-repeat
}

	
.footercontainer{
	z-index:5;
	position:relative;
	width:100%;
	height:300px;
	background:var(--Menu);
	overflow:hidden}
.navfooter ul li{list-style:none}
.FooterNotice p{line-height:1em}
.logofooter{width:20%;height:120px;background:url(images/footerresized.png) no-repeat;position:absolute;left:25px;top:30%;background-size:contain;margin-right:5px;}
.FooterNotice{line-height:0em;width:30%;position:absolute;left:25%;top:10%}
.DiceSystemsPolicy{position:absolute;left:60%}
.FooterSocial{position:absolute;left:85%}
.DiceSystemsPolicy,.FooterSocial{width:25%;line-height:2em;top:40px}
.footerdivider{height:3px;border-radius:5px;width:90%;background:var(--Background);margin:auto;top:15px;position:relative}
.FooterSocial a,.DiceSystemsPolicy a{color:var(--Text);text-decoration:none}


/*Features*/
.FeaturesTitle{grid-column: 1 / -1}

.FeatureBreakup{
	display:grid;
	margin-right:10px;
	margin-left:10px;
	grid-template-columns: [first] 25% [line2] 25% [line3] 25% [line4] 25%}
.FeatureBreakup li{list-style:none;margin-left:1%;margin-right:1%;height:50px}

.TiersChooseContainer{
	top:60px;
	position:relative}
.TierFeaturesContainer{
	top:150px;
	position:relative}

.TierChooseMenu{
	margin-right:2%;
	margin-left:2%;
	width:96%;
	height:45px;
	position:absolute;
	display:flex;
	justify-content:center;
	background:var(--Menu);
	border-radius:15px;}
.TiersChooseContainer button{
	margin-right:1%;
	margin-left:1%;
	width:25%;
	height:44px;
	position:relative;
	z-index:1;
	cursor:pointer;
	background:transparent;
	font-family:"Raleway Bold", Tahoma, sans-serif;
	font-size:16px;
	color:var(--Text);
	border:none;
	border-radius:15px}
	
	

.FeaturesGridContainer{padding:0}
.hidden{display:none}
.PreviewFeatureContainer{
	width:90%;
	height:auto;
	position:fixed;
	padding:15px;
	border-radius:15px;
	top:50%;
	left:-1000px;
    transform: translate(-50%, -50%);
	transform-origin: center;
	background:var(--Menu);
	z-index:111;
	opacity:0;
	display:none;
	transition:.4s;}
	
[id^=FreeFeature]:target,[id^=StandardFeature]:target,[id^=ProFeature]:target{opacity:1;transition:.4s;left:50%;display:block}

[id^=FreeFeature]{border:3px solid var(--Free)}
[id^=StandardFeature]{border:3px solid var(--Standard)}
[id^=ProFeature]{border:3px solid var(--Pro)}

.PreviewFeatureContainer::before{
	content:"";
	pointer-events:none;
	width:10000px;
	height:10000px;
	position:absolute;
	top:-500px;
	left:-1000px;
	background:#000000ad;
	z-index:-1
}

.PreviewFeatureContainer a{
	font-size:36px;
	margin-bottom:15px;
	line-height:1em;
	font-family:"Raleway Black", Tahoma, sans-serif;
	display:block;
	max-width:95%}
.PreviewFeatureContainer{
	line-height:.0em;
	max-width:560px}
.PreviewFeatureContainer p{margin-top:20px;margin-bottom:5px;line-height:1em}
.PreviewFeatureContainer p::before{
	content:"•"}
.FeatureIMG{
	height:400px;
	max-width:100%;
	background-size: contain;
	background-repeat:no-repeat}
.CloseIcon{
	width:20px;
	height:20px;
	background:url(images/icons/Close.svg) no-repeat;
	background-size:contain;
	display:block;
	position:absolute;
	top:15px;
	right:15px}
	
.PreviewFeature{width:100%;height:45px;display:block;background:var(--Menu);border-radius:15px;border:2px solid var(--Text)}
.FeatureText{margin-left:15px;position:absolute;font-family:"Raleway SemiBold", Tahoma, sans-serif;margin-top:16px;font-size:12px;pointer-events:none}
.FeatureNotClick .FeatureText{font-family:"Raleway Bold", Tahoma, sans-serif;font-size:14px}
.Feature::after{content:"";background:url(images/icons/glass.svg)no-repeat; width:25px;height:26px;display:block;position:relative;float:right;right:10px;bottom:35px;pointer-events:none}

.FeaturesTitle{font-size:18px;top:-10px;position:relative}

.FeatureBreakup{margin-top:10px;padding:0}



/*My Subscription*/

.footercontainer{bottom:-460px}
.SubscriptionDetailsContainer{
	margin-left:5%;
	margin-right:5%;
	top:150px;
	position:relative}

.SubsriptionDetails a{font-size:48px;position:relative}
	
.SubEmail img, .SubKey img{position:relative;height:30px}
.SubEmail{margin-top:50px;margin-left:3%;display:flex}
.SubKey{margin-top:10px;margin-left:3%;display:flex}
.SubEmail p, .SubKey p{margin-top:5px;margin-left:5px;width:50%}

.SubEmail input, .SubKey input{height:30px;border-radius:0 10px 10px 0;border:none;width:50%;padding:0;padding-left:10px}

.subscribebutton,
.helpbutton,
#managementLogin,
.buttonMonthlyPurchase{
	font-family: "Raleway Bold", Tahoma, sans-serif;
	font-size:14px;
	transition:.2s;
	height:30px;
	position:relative;
	background:var(--Menu);
	padding:10px;
	border-radius:8px;
	text-align:center;
	margin-left:5px;
	margin-right:5px;
	margin-bottom:10px;
	color:var(--Text);
	text-decoration:none;
	display:flex;
	align-items: center;
	justify-content: center;
	cursor:pointer}
	

	
.subscriptionbuttons{
	margin-left:2.5%;
	margin-top:20px;
	width:55%;
	display:block;
	grid-template-columns: [first] 33% [line2] 33%}

.SubscriptionLogo{
	background:url(images/footerresized.png)no-repeat;
	width:201px;
	height:120px;
	background-size:cover;
	position:absolute;
	right:20px;
	top:25%}



/*Support*/
.SupportWidget{width:65%;height:850px;margin:auto;border:none}
#launcher{z-index:10!important}

/*TermsPrivacy*/
.PrivacyPolicy{display:flex;margin:auto;align-items: center;top:130px;position:relative;flex-flow: column;width:75%;background:var(--Menu);border:3px solid var(--Background);border-radius:15px}
.Summary{margin:auto;margin-top:50px;margin-bottom:10px}
.SummaryTitle{margin:auto;width:80%;height:60px;background-color:#0084DD;color:white;font-size:30px;text-align:left;padding-left:40px;padding-top:20px;border-top-left-radius:10px;border-top-right-radius:10px;margin-bottom:0px}
.SummaryText li{margin-top:20px}
.SummaryText li:nth-last-of-type{margin-bottom:30px}
.SummaryBody{margin:auto;width:80%;background-color:#fff;color:black!important;text-align:left;padding:20px;border-radius:0 0 10px 10px}
.EntirePolicy p{font-family:"Raleway Medium", Tahoma, sans-serif; font-size:14px}
.EntirePolicy h3{font-family:"Raleway-SemiBold", Tahoma, sans-serif}
.EntirePolicy h2{font-family:"Raleway ExtraBold", Tahoma, sans-serif}

/*Hovers*/
.Tier:hover{
	z-index: 2;
	transform: scale(1.05);
	transition: .3s}
	
.IconItem:hover{
	transform: scale(1.2);
	transition: .3s ease}
.subscribebutton:hover{
	background:#21BA45;transition:.2s}
.helpbutton:hover,#managementLogin:hover,.buttonMonthlyPurchase:hover{
	background:var(--Standard);transition:.2s}
#proTierMonthlyPurchase:hover{background:var(--Pro)}
#ultraTierMonthlyPurchase:hover{background:var(--Ultra)}
	
	
/*Stats*/
.container#ShowcaseStats{display:flex;max-width: 1500px;margin:auto}
.OvStatCont{display:flex;flex-direction:row;width:95%;margin-left:2%;margin-right:2%;margin-top:150px}
.StatContainer{
	width:30%;
	background:url(images/Stats/back.svg);
	background-size: cover;
	height:483px;
	border-radius:10px;
	margin:auto}

.IconStat{
	width:185px;
	max-width:70%;
	height:20%;
	max-height:200px;
	background-size:contain!important;
	background-repeat:no-repeat!important;
	margin:auto;
	margin-top:75px;
	margin-bottom:50px}
	
.IconStat#Stars{background:url(images/Stats/Stars.svg);width:305px}
.IconStat#Users{background:url(images/Stats/Users.svg)}
.IconStat#ActiveMembers{background:url(images/Stats/Subscribers.svg)}

.StatDescription{
	display:flex;
	flex-direction:column!important;
	text-align:center;
	font-family:"Raleway Black", Tahoma, sans-serif;
	font-size:48px;
	line-height:.9em}
.StatDescription p{margin:0;bottom:-50px;position:relative}

.counter::after{content:"+"}

/*Installed*/
#ThankYouInstallContainer{
	text-align: center;
	padding-top:100px;
	height:400px;}
#ThankYouInstallContainer div{flex-direction: row;}
#ThankYouInstallContainer:first-of-type(div){height:400px;}
#ThankYouInstallContainer h2{font-size: 20px;font-family: "Raleway Medium", Tahoma, sans-serif;}
#ThankYouInstallContainer h1{font-size: 50px;padding-bottom: 15px;}
.ThxBtn{
	width:50%;
	height:100%;
	background:var(--Menu);
	display: block;
	margin-left:2%;
	margin-right:2%;
	font-size: 20px;
	color:var(--Text);
	text-decoration: none;
	border-radius: 10px;
	transition: .3s;
	line-height: 75px;}
.ThxBtn:hover{
	color:#C7E0F4;
	background:var(--Hover)}
.ThxImg{
	background-image: url(images/thxback.png);
	width:565px;
	height:500px;
	display:block}

/*Deals*/
.Deals{
	margin-left:10px;
	margin-right: 10px;
	margin-top: 25px;
	display: grid;
	grid-template-columns: [first] 24.5% [line2] 24.5% [line3] 24.5% [line4] 24.5%;
	grid-template-rows: auto;
	gap:10px;}
.DealItem{
		width:100%;
		height: auto;
		border-radius:10px}
.DealCont{background:var(--Menu);width:100%;height: auto;border-radius:10px}
.Deal{display:flex}
.DealImg{padding:15px;}
.DealImg, .DealImg img{
	width:110px;
	height:110px}
.DealsInfoCont{
	width:100%;
	font-size:14px;
	padding: 15px;}
.DealTitle{font-size:16px;font-family: "Raleway Black", Tahoma, sans-serif;}
.DealTime{font-size:12px}
.PurchaseDealPrice::before{content:"R$ "}
.PurchaseDealPrice{background:var(--Free);height:30px;display:block;border-radius: 0 0 10px 10px;padding:5px;text-align: center;font-size: 12px;line-height: 30px;}
.PurchaseDealPrice#d20{background: #00aa4c!important;}
.PurchaseDealPrice#d30{background:var(--Standard)}
.PurchaseDealPrice#d40{background:#AC00E6}
.PurchaseDealPrice#d50{background:#DB9E1C}

.ImgDesc{
	margin-top: 100px;
	display:flex;justify-content: center;margin-left:25px;margin-right:25px;}

.DealsSubs{
	display:flex;
	justify-content: center;
	flex-direction: column;
	margin-top: 15px;
	text-align: center;
	margin-left: 5px;
	margin-right: 5px;
}
.DealSubBtn{
	margin-top: 15px;
	display: flex;
	flex-direction: row;
	justify-content: center;
}


/*SubModal*/
.SubscriptionModal{display: block;width:850px;height:550px;}
.Subheader{text-align:center;color:white!important;background-color:#2A2D31;padding: 1.25rem 1.5rem;}
#subscriptionKeyImage{width:30px;margin:-8px;margin-right:5px;}
#subscriptionKeyHeader{text-transform:capitalize;flex-direction: row;}
.image.content{background-color:#3A3F44; display: flex;padding: 1.5rem;}
.ui.huge.image img{filter: drop-shadow(2px 2px 4px #000000);width:400px;flex: 0 1 auto;max-width: 100%}
.Subscribedescription a{color:var(--Standard);text-decoration: none;}
.Subscribedescription{margin-top:20px;width:100%;padding-left:12px}
#subscriptionKeyValue{margin-top:15px;
	filter: drop-shadow(0px 0px 8px #000000);color:white!important;font-size:40px;background-color:#2A2D31;padding:10px;text-align:center;border-radius:20px}
	.ui.dimmer {
		display: none;
		position: absolute;
		top: 0 !important;
		left: 0 !important;
		width: 100%;
		height: 100%;
		vertical-align: middle;
		padding: 1em;
		background-color: rgba(0,0,0,.85);
		opacity: 0;
		-webkit-animation-fill-mode: both;
		animation-fill-mode: both;
		-webkit-animation-duration: .5s;
		animation-duration: .5s;
		-webkit-transition: background-color .5s linear;
		transition: background-color .5s linear;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		will-change: opacity;
		z-index: 1000;
	}
	.ui.modal > .close {
		cursor: pointer;
		position: absolute;
		top: -2.5rem;
		right: -2.5rem;
		z-index: 1;
		opacity: .8;
		font-size: 1.25em;
		color: #fff;
		width: 2.25rem;
		height: 2.25rem;
		padding: .625rem 0 0 0;
	}


/*Promocodes*/
#PromocodesInfo,
#PromocodesCards,
#PromocodesExpired{
	width:80%;
	margin:auto;
	top:100px;
	position: relative;
	margin-bottom: 30px;}

#PromocodesInfo,
.GameInfoCont,
.CodeFilter,
.GameDropdown,
.AvUnlock,
.GaUnlock,
.PromCard,
.PFavorites,
.PDetInteractive,
.PCode{display:flex;flex-direction:row}

.GameSelect,
.GameInfo,
.PPreview,
#PromocodesCards{display:flex;flex-direction:column}

.GameInfoCont{height: 90px;width:60%}
.GameSelect{height:90px;width:40%}

.GameInfo{justify-content:space-between;}
.GameInfoCont p,.PFavoritesCount{margin: 0;}
.GameIcon{border-radius: 8px;width: 90px;height: 90px;margin-right:15px}
.GameInfoHeader{font-family:"Raleway XBold";font-size:36px}
.PDetItemName{font-family:"Raleway SemiBold";font-size:36px}
.GameInfoDesc,.PDetItemDesc{font-family:"Raleway SemiBold";font-size:20px}
.LastUpdated{font-family: "Raleway SemiBold";font-size:12px}
.LastUpdated::before{content:"Curated By RoPro Staff • Updated on "}

.GameDropdown{width:100%;background:var(--Menu);border-radius:8px;justify-content: right;margin-top:5px}
.GameDropdown p{margin:8px}
.GameSelect{justify-content: space-between;}
.DropDownIcon{margin-right: 10px;}
.ChosenGameIMG,.DropDownIcon{width:20px;height:20px;margin:auto;margin-left:15px;margin-right:15px}

.CodeFilter{height:45px}
.AvUnlock img{width:30px}
.GaUnlock img{width:25px}
.AvUnlock,.GaUnlock{width:47.5%;background:var(--Menu);border-radius:8px;justify-content:space-evenly;font-size:14px}
.AvUnlock p,.GaUnlock p{margin:auto;margin-left:0;margin-right:0}
.AvUnlock{margin-right:5%;background:#ED9600;color:#FFE3B9}
.GaUnlock{background:#27AE60;color:#ACFFCF}

	/*Cards*/
	.PromCard{width:100%;height:280px;margin:auto;margin-top:15px;max-width:840px}
	.PPreview{width:30%;height:280px;background:rgba(0, 0, 0, 0.2);border-radius:16px 0 0 16px;justify-content: space-between}
	.PDetails{width:70%;position:relative}
	.PFlag{position:absolute;top:0;right:0;width:20px;height:20px;background:url(images/PromoImgs/Flag.svg);margin:15px;cursor:pointer}
	.PreviewImg{max-width: 280px;position:absolute;width:30%;height:280px;z-index: -3; border-radius: 16px 0 0 16px;object-fit: contain;}
	.PCategory,.PCategory#GA{width:140px;height:140px;z-index: 2;}
	.PCategory{background:url(images/PromoImgs/AVUnlockBack.png)}
	.PCategory#GA{background:url(images/PromoImgs/GAUnlockBack.png)!important}
	.PFavorites {position: relative;margin:5px;margin-left:8px}
	.PFavorites img{width:20px;height:20px;position: relative;top:-3px}
	.PFavoritesCount{margin-left:5px}
	.PDetDescription{height:70%;background:var(--Menu);border-radius:0 16px 0 0;}
	.PDetDescription p{margin:0}
	.PDetInteractive{height:30%}
	.PCode,.PCodeRedeem{width:50%}
	.PCode{background:#fff;color:black;cursor: pointer;display:flex;align-items: center;justify-content: center;font-size:24px;position:relative}
	.PCodeCopy{width:20px;height:20px;margin:5px;top:0;right:0;position:absolute}
	.PCodeRedeem{background:var(--Standard);border-radius:0 0 16px 0;cursor: pointer;display:flex;align-items: center;justify-content: center;font-size:24px}
	.PDetItemName{width:95%;height:30%;left:15px;position: relative;top:15px}
	.PDetItemDesc{width:95%;height:65%;left:15px;position: relative}

	.PromCard#QR .PDetails,
	.PQRCode,
	.PromCard#QR .PPreview,
	.PromCard#QR .PDetItemName{width:75%}
	.PromCard#QR .PreviewImg{width:33.33%}
	.PromCard#QR .PCodeRedeem{width:100%;height:30%}
	.PQRCode{background:url(/images/PromoImgs/qr.png);border: none;background-size:contain!important;background-repeat: no-repeat;background-color: white;}

	/*Expired*/
	.LetUsKnowBtn{background:var(--Standard);width:100%;height:70px;border-radius: 16px;cursor:pointer}
	.LetUsKnowBtn p{text-align: center;margin:0;position: relative;top:15px;margin-top:15px;}
	.ExpiredCodes{background:#222222;border-radius:16px;padding:15px;position: relative;top:15px}
	.ExpiredCodes .Title{font-size: 24px!important;margin-top:0;color:white}
	.ExpiredCodes p{color:#909090}


@media only screen and (max-width: 500px){
	.FooterNotice{font-size:10px}
}
@media only screen and (max-width: 1240px){
	.Deals{grid-template-columns: [first] 32.5% [line2] 32.5% [line3] 32.5%;}
.FeatureBreakup {
	display: grid;
	grid-template-columns: [first] 33% [line2] 33% [line3] 33%;
}
}
@media only screen and (max-width: 950px){
.FeatureBreakup {
	display: grid;
	grid-template-columns: [first] 50% [line2] 50%;
}
}
@media only screen and (max-width: 630px){
.FeatureBreakup {
	display: grid;
	grid-template-columns: [first] 100%;
}
}
@media only screen and (max-width: 910px){
.top-header .headeritems .MenuItem .HeaderLinks,#moreicon{font-size:12px!important;padding:0}
.top-header .headeritems {width: calc(100% - 100px);}
.top-header .IconItems {width:100%}
.top-header .IconItems .IconItem{margin-left:0px;margin:auto}
.backblur{height:125px!important}
.TiersChooseContainer{top:110px!important}
.TierFeaturesContainer{top:190px!important}
.StatDescription p{font-size:28px}
.Deals{grid-template-columns: [first] 50% [line2] 50%}
.DealsSect{margin-top:150px}
}
@media only screen and (max-width: 420px){
.top-header .headeritems .MenuItem .HeaderLinks{
	font-size:12px!important}
.top-header .headeritems{width:calc(100% - 70px);border-radius:0 15px 15px 0}
.logofooter{display:none}
.Logo{margin-right:0px;border-radius:15px 0 0 15px}
.container#ShowcaseCompatible .TagLine{font-size:44px!important}
.FooterNotice{left:5%!important}
.DiceSystemsPolicy{left:40%!important}
.FooterSocial{left:75%!important}
.FooterNotice{top:40px!important}
.container#ShowcaseCompatible{overflow-y:visible;overflow-x:clip}
.FeaturePurchaseSubscription{top:110px}
.FeaturePurchaseSubscription#Free{top:20px!important}
.PurchaseFeaturesCont {
	top:-20px!important;
	margin:0!important;
	margin-left:3%!important;
	margin-right:3%!important;
	width:94%!important;
	margin-bottom:10px;
	position: relative!important;
	display: flex;
	justify-content: space-between;
	font-size: 10px}
.subtiername{margin:auto;margin-bottom:5px}
.subtiername a{font-size:18px}
.subbuttons{position:relative;top:5px;width:100%;display:flex;flex-direction:column!important}
.TierFeaturesContainer{top:170px!important}
.buttonMonthlyPurchase{margin-bottom:5px}
.MenuItem#MoreBtn{display:none}
.MenuItem#MoreBtnMobile{display:block}
.DealSubBtn .buttonMonthlyPurchase,.DealSubBtn .crypto-button,.DealSubBtn .DealsActSub{font-size: 9px !important;}
.DealTime,.DealsInfoCont{font-size:10px}
.DealTitle{font-size:14px}
.Deals{margin-top:35px};
.SubscriptionModal{width:85%}}

@media only screen and (max-width: 800px){
.MainExtShowcase1{overflow:hidden}
.ShowcaseBackground{opacity:.3;width:75%;height:70%;background:url(images/LogoTilt.png) no-repeat;position:absolute;right:-100px;top:20%;background-size:contain}

}
@media only screen and (max-width: 500px){
h1#Container{font-size:96px!important}
h2#Container{font-size:20px!important;top:60px!important}
.description p{font-size:18px!important;top:60px!important}
.description div{font-size:18px!important;top:45px!important}
.ShowcaseCaption{overflow:visible!important}
.Deals{grid-template-columns: [first] 100%}
}
@media only screen and (max-width: 1270px){
.container#ShowcaseTiers{height:1300px}
.container#ShowcaseCompatible{flex-direction:column!important;height:1000px}
.container#ShowcaseCompatible .TagLine{font-size:44px!important;padding:5%!important;width:90%!important;left:0px}
.addons{width:95%!important;left:auto!important;height:300px}
}
@media only screen and (max-width: 660px){
.container#ShowcaseTiers{
    height:1950px;
    margin-top:-50px!important;
}
.OvStatCont{flex-direction:column}
.StatDescription{line-height:.8em}
.StatContainer{width:95%;margin-bottom:55px}
.IconStat{height:100px;margin-bottom:0}
.container#ShowcaseStats{height:1600px}
.StatContainer{min-height: 450px;}
.container#ShowcaseCompatible{height:900px}
}
@media only screen and (max-width: 660px){
.subscriptionbuttons{
	margin-left:3%;
	margin-right:3%;
	display:grid;
	margin-top:20px;
	width:100%;
	grid-template-columns: [first] 100%}
.SubKey,.SubEmail{margin-right:3.5%;margin-left:3.5%}
.SubsriptionDetails a{margin-right:3.5%;font-size:24px;width:75%;display:block}
.SubKey input, .SubEmail input{width:100%}
.SubscriptionLogo{background:url(images/logoemblem.png)no-repeat!important;top:0;width:50px;height:50px;background-size:contain!important}
body{background:var(--Background)!important}
.SupportWidget{width:95%!important}
.FeatureBig{flex-direction:column!important}
.ultratext {width:100%!important}
.FeatureBig img{width:100%}
#ThankYouInstallContainer div{flex-direction: column!important}
.ThxImg{display:none}
.ThxBtn{width:90%;margin:auto;margin-bottom:35px}
}