@charset "utf-8";

body { background-image:url('https://razorchat-assets.nyc3.digitaloceanspaces.com/img/bg-site.jpg'); color:#222; font-size:0px; }

#site h1 { margin:0px; line-height:1.5; font-size:65px; }
#site h2 { margin:0px; line-height:1.5; font-size:48px; }
section h2 { font-weight:500; }

@media all and (max-width:1024px) {
#site h1 { font-size:55px; }
#site h2 { font-size:44px; }
}
@media all and (max-width:768px) {
#site h1 { font-size:45px; }
#site h2 { font-size:40px; }
}

.wrapper { max-width:1200px; width:100%; margin:0px auto; box-sizing:border-box; padding-right:65px; padding-left:65px; text-align:center; }

@media all and (max-width:768px) {
.wrapper { padding-right:15px; padding-left:15px; }
}

.content { padding-top:75px; padding-bottom:90px; }
@media all and (max-width:768px) {
.content { padding-top:50px; padding-bottom:65px; }
}

.parallax { background-attachment:fixed; background-position:center; background-size:cover; background-repeat:no-repeat; }

@media all and (max-width:1024px) {
.parallax { background-attachment:local; }
}

.green-button { border:1px solid #2b9d00; border-radius:50px; padding:15px 30px; background:#2b9d00; font-family:'Ubuntu Sans', sans-serif; color:#fff; font-weight:500; }
.ghost-button { border:1px solid #fff; border-radius:50px; padding:15px 30px; background:none; font-family:'Ubuntu Sans', sans-serif; color:#fff; font-weight:500; }

.skip-link {
	position:relative;
	display:block;
	width:100%;
	margin-top:-42px;
	outline:none;
	box-sizing:border-box;
	padding:8px;
	background:#2b9d00;
	color:#fff;
	font-weight:600;
	text-align:center;
	transform:translateY(-100%);
	transition:transform 0.2s ease;
}
.skip-link:focus { margin-top:0px; transform:translateY(0); }

/* Header */
.mobile-header,
#toggle_mobile_nav,
.mobile-nav { display:none; }

.header { position:absolute; height:60px; left:0px; right:0px; z-index:999; padding:0px 30px; background:rgba(255,255,255, .95); }
.header-logo-box { float:left; padding-top:16px; }
.header-logo { display:inline-block; width:144px; height:28px; background:url(https://razorchat-assets.nyc3.digitaloceanspaces.com/img/logo.svg) no-repeat; }
.header-nav { float:left; padding-top:20px; }
.header-nav a,
.header-nav a:visited { color:#3e4d55; font-size:13px; font-weight:500; }
.header-buttons { float:right; padding-top:20px; }
.header-buttons .green-button { border:1px solid #2b9d00; padding:4px 10px; background:#2b9d00; font-size:13px; }
.header-buttons .ghost-button { border:1px solid #3e4d55; padding:4px 10px; color:#3e4d55; font-size:13px; }

	.rtl .header-logo-box,
	.rtl .header-nav { float:right; }
	.rtl .header-buttons { float:left; }

@media all and (max-width:1024px) {
.header { display:none; }
.mobile-header { display:block; width:100%; height:61px; box-sizing:border-box; border-bottom:1px solid rgba(0,0,0, .1); padding-left:15px; padding-right:15px; line-height:1; }
.mobile-header-logo-box { float:left; padding-top:16px; }
.mobile-header-logo { display:inline-block; width:164px; height:32px; background:url(https://razorchat-assets.nyc3.digitaloceanspaces.com/img/logo.svg) no-repeat; }
.open-mobile-nav-icon { display:inline; float:right; opacity:1; margin-top:24px; box-sizing:border-box; color:#ccc; font-size:24px; cursor:pointer; } /* Mobile menu icon */
.mobile-nav-icon-bar { display:block; width:22px; height:3px; background-color:#999; -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s; }
	#mobile_nav_icon_top,
	#mobile_nav_icon_middle { margin-bottom:4px; }
/* If the checkbox is checked, expand the menu and change the icon into an X */
#toggle_mobile_nav:checked ~ .mobile-nav { max-height:1000px; }
#toggle_mobile_nav:checked ~ .mobile-header #mobile_nav_icon_top { transform:rotate(45deg); transform-origin:0% 60%; -webkit-transition:transform 0.3s; -moz-transition:transform 0.3s; transition:transform 0.3s; }
#toggle_mobile_nav:checked ~ .mobile-header #mobile_nav_icon_middle { opacity:0; -webkit-transition:opacity 0.3s; -moz-transition:opacity 0.3s; transition:opacity 0.3s; }
#toggle_mobile_nav:checked ~ .mobile-header #mobile_nav_icon_bottom { transform:rotate(-45deg); transform-origin:8% 60%; -webkit-transition:transform 0.3s; -moz-transition:transform 0.3s; transition:transform 0.3s; }
.mobile-nav { display:block; top:0; left:0; z-index:1000000; width:100%; max-height:0px; overflow:hidden; background-color:#1c1c1c; text-align:left; transition:.5s; }
.mobile-nav-links a { display:block; border-top:1px dotted rgba(255,255,255, .05); padding:15px 5px 15px 20px; color:#aaa; font-size:16px; font-weight:500; transition:0.3s; }
.mobile-nav-links a:hover { background:rgba(255,255,255, .03); color:#ccc; }
	.rtl .mobile-header-logo-box { float:right; }
	.rtl .open-mobile-nav-icon { float:left; }
	.rtl .mobile-nav { text-align:right; }
	.rtl .mobile-nav-links a { padding:15px 20px 15px 5px; }
}

/* Hero */
#hero { padding:260px 100px 240px 100px; background-image:url('https://razorchat-assets.nyc3.digitaloceanspaces.com/img/bg-hero.jpg'); color:#fff; text-align:center; }
#hero h1 { font-weight:200; }
.hero-text { max-width:800px; margin:0px auto 35px auto; font-weight:300; }

@media all and (max-width:1024px) {
#hero { padding:180px 60px 220px 60px; background-size:auto 750px; }
}
@media all and (max-width:480px) {
#hero h1 { font-weight:300; }
#hero { padding:120px 20px 160px 20px; background-size:auto 650px; }
#hero .hero-button-spacer,
#hero .ghost-button { display:none; }
}

/* Steps */
#steps { background:#f7f7f7; }
.steps-box { display:inline-block; width:30%; vertical-align:top; }
.steps-spacer { display:inline-block; width:5%; }
.steps-icon { display:block; margin:25px auto 15px auto; transition:all .5s; }
@media all and (max-width:1024px) {
.steps-box { display:block; width:100%; }
.steps-spacer { display:block; height:10px; }
}

/* Features */
#features { background:#fefefe; }
.feature-box { display:table; table-layout:fixed; width:100%; }
.feature-box-spacer { table-layout:fixed; height:15px; }
.feature-content { display:table-cell; box-sizing:border-box; border:1px solid #f4f4f4; padding:60px; background:#f7f7f7; vertical-align:top; transition:all .5s; }
.feature-content:hover { background:rgba(58,172,27, .13); }
.feature-content-spacer { display:table-cell; width:15px; }
.feature-content .icon { display:inline-block; line-height:1; font-size:42px; }
.feature-content .et-scope { font-size:48px; transform:translateY(-3px); } /* Enlarge the scope icon since it's a bit small */
.feature-content .et-scope + * { transform:translateY(-6px); } /* Move the text below it upwards since it gets pushed down */

@media all and (max-width:768px) {
.feature-box { display:block; }
.feature-box-spacer { display:block; height:25px; }
.feature-content { display:block; padding:30px; }
.feature-content-spacer { display:block; width:100%; height:25px; }
.feature-content .icon { font-size:38px; }
.feature-content .et-scope { font-size:44px; }
}

/* Callout */
#callout { padding:150px 20px 160px 20px; background-image:url('https://razorchat-assets.nyc3.digitaloceanspaces.com/img/bg-quotes.jpg'); color:#fff; text-align:center; }

@media all and (max-width:480px) {
#callout { padding:100px 20px 110px 20px; background-size:auto 1000px; }
}

/* Plans */
#plans { background:#f7f7f7; }
.plans-outer { display:table; width:100%; }
.plans-inner { display:table-cell; }
.plans-box { display:inline-block; width:37%; box-sizing:border-box; padding:30px 45px 40px 45px; background:#fff; vertical-align:middle; }
.plans-spacer { display:inline-block; width:6%; }

@media all and (max-width:1024px) {
.plans-box { display:block; width:100%; }
.plans-spacer { display:block; width:100%; height:25px; }
}

/* FAQ */
.faq-box { max-width:600px; margin:0px auto; text-align:left; }

	.rtl .faq-box { text-align:right; }

.faq-item { border-bottom:1px solid rgba(0,0,0, .1); padding:10px 0px; cursor:pointer; }

.question-box { display:table-row; user-select:none; cursor:pointer; }

.faq-icon { display:table-cell; width:19px; height:19px; padding:0px 10px 0px 0px; font-size:22px; text-align:center; }

	.rtl .faq-icon { padding:0px 0px 0px 10px; }

.faq-icon .icon { bottom:-2px; }
.i-minus-circle { display:none; }
.faq-question { display:table-cell; line-height:1.5; font-size:22px; font-weight:500; }
.faq-answer { display:none; padding:10px 0px 0px 30px; font-weight:400; }

	.rtl .faq-answer { padding:10px 30px 0px 0px; }

.question-box.is-open .i-minus-circle { display:inline-block; color:#2b9d00; }
.question-box.is-open .faq-question { color:#2b9d00; }
.question-box.is-open .i-plus-circle { display:none; }
.question-box.is-open + .faq-answer { display:block; }

/* Contact */
#contact { background:#f7f7f7; }
.contact-form { display:block; max-width:650px; margin:0px auto; }
#last_name_field { display:none !important; }

/* Footer */
footer { padding-top:80px; padding-bottom:50px; background:#111; text-align:center; }
.footer-link-box { margin:0px auto 50px auto; }
.footer-link-box a,
.footer-link-box a:visited { display:inline-block; font-weight:500; }
.footer-logo { display:block; width:143px; height:28px; margin:20px auto 40px auto; background:url(https://razorchat-assets.nyc3.digitaloceanspaces.com/img/logo-white.svg) no-repeat; }

@media all and (max-width:768px) {
footer { padding-top:50px; padding-bottom:30px; }
.footer-link-box a,
.footer-link-box a:visited { margin:10px 15px; text-decoration:underline; }
.footer-link-box span { display:none; }
}

/* Partner program */
#partner_program { text-align:left; }
#partner_program h1 { margin:0px; line-height:1.5; font-size:32px; }
#partner_program h2 { margin:0px; line-height:1.5; font-size:22px; font-weight:600; }

	.rtl #partner_program { text-align:right; }

/* Legal */
#legal h1 { margin:0px; line-height:1.5; font-size:26px; }
#legal h2 { margin:0px; line-height:1.5; font-size:20px; font-weight:600; }
	.legal-links-h2 { line-height:1.5 !important; }

.legal-text { margin-bottom:20px; }
.legal-text .list-td1,
.legal-text .list-td2 { padding-top:5px; }
.legal-text a,
.legal-text a:visited { text-decoration:underline; }