body 							{ margin: 0; font-family: Roboto, Arial; }

p 								{ font-size: 15px; line-height: 155%; letter-spacing: 0.3px; }

h1 								{ font-weight: 300; font-size: 34px; margin: 0; }
h1 strong						{ font-weight: 400; }
h2								{ font-weight: 300; font-size: 25px; margin: 28px 0 20px; }
h3								{ font-weight: 300; font-size: 21px; margin: 20px 0 12px; }
h4								{ font-weight: 400; font-size: 15px; margin: 15px; }

br.clear 						{ clear: both; }
a								{ color: #2b78c0; }

.heading						{ position: fixed; top: 0; left: 0; width: 100%; border-bottom: 1px solid #eee; height: 80px; background-color: #fff; z-index: 2; }
.heading .inner 				{ display: flex; justify-content: space-between; max-width: 1208px; margin: auto; }
.heading .inner div				{ padding: 21px 30px; }
.heading .inner .burger			{ position: absolute; left: 0; top: 0; color: #3C4651; font-size: 25px; display: none; padding: 22px 5px 20px 30px; cursor: pointer; }
.heading .inner .logo a		 	{ display: flex; justify-content: flex-start; align-items: center; }
.heading .inner .logo a img.log	{ width: 200px; margin-right: 15px; }
.heading .inner .logo a img.plan { height: 35px; position: relative; top: 2px; }
.heading .inner .menu 			{ padding-top: 28px; }
.heading .inner .menu a 		{ margin: 0 5px 0 26px; font-size: 17px; text-decoration: none; }
.heading .inner .menu a strong	{ font-weight: 600; }

.container 						{ padding-top: 80px; min-height: 580px; }

.home 							{ min-height: calc(100vh - 61px); padding: 15px 30px; }
.home .intro 					{ margin: 30px 0; font-size: 20px; }
.home .intro a					{ text-decoration: none; border-bottom: 2px solid #2b78c0; }
.home .inner					{ padding-right: 200px; max-width: 950px; margin: 0 auto; }
.home .markets a 				{ margin: 40px 0; display: flex; justify-content: space-between; align-items: center; color: #000; text-decoration: none; }
.home .markets a .chart 		{ width: 150px; border: 2px solid #fafafa; }
.home .markets a h4				{ width: calc(100% - 280px); font-size: 25px; font-weight: 300; }
.home .markets a h4 span		{ text-align: right; color: #888; font-size: 10px; font-weight: 400; border-radius: 2px; }
.home .markets a h4 span.volume	{  }
.home .markets a h4 span.closed { padding: 0; color: #008040; }
.home .markets a h4 span.closed i { font-size: 19px; position: relative; top: 2px; margin-right: 3px; }
.home .markets a h4 span.recently-closed { padding: 0; color: #008040; }
.home .markets a h4 span.recently-closed i { font-size: 19px; position: relative; top: 2px; margin-right: 3px; }
.home .markets a .top-runners	{ width: 92%; margin: 4px 0 6px 16px; padding: 0 0 15px 0; height: 15px; overflow: hidden; -webkit-mask-image:-webkit-gradient(linear, center top, right top, from(rgba(0,0,0,1)), to(rgba(0,0,0,0))); }
.home .markets a .top-runners div { width: 1500px; }
.home .markets a .top-runners div span { background-color: #f7f7f7; padding: 2px 3px; margin-right: 6px; font-size: 11px; font-weight: 400; border-radius: 2px; }
.home .markets a .top-runners div span.loading { background: transparent; animation: none; position: absolute; text-align: center; display: block; left: 0; right: 0; margin-right: 0; color: #999; }
.home h2 						{ width: 100%; margin: 30px 1.3% 8px; }

.top-runners span { animation: fadein 1.5s; }
@keyframes fadein { from { opacity: 0; } to { opacity: 1; } }

.button2 						{ background-color: #2b78c0; border-radius: 6px; border: 0; color: #fff; text-decoration: none; font-size: 13px; padding: 9px 12px; cursor: pointer; }
.button2:hover					{ background-color: #4086c6; }
.button2.disabled 				{ background-color: #ccc; cursor: not-allowed; }

.welcome 						{ margin: 45px auto; text-align: center; }
.welcome h1 img 				{ height: 40px; margin-left: 5px; position: relative; top: 9px; }
.welcome form 					{ margin: 20px 0; }
.welcome form input[type=text],
.welcome form input[type=email],
.welcome form input[type=password],
.welcome form input[type=submit]		{ width: 250px; border: 1px solid rgba(0,0,0,0.2); background-color: white; margin: 5px 0; box-sizing: border-box; padding: 8px; font-size: 14px; -webkit-appearance: none; box-shadow: none; outline: none; border-radius: 2px; }
.welcome form textarea					{ border: 1px solid rgba(0,0,0,0.2); background-color: white; margin-bottom: 2px; width: 100%; box-sizing: border-box; padding: 8px; font-size: 14px; -webkit-appearance: none; box-shadow: none; outline: none; border-radius: 2px; height: 100px; }
.welcome form input[type=submit]		{ border: 0; background-color: #2b78c0; color: white; cursor: pointer; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
.welcome form input[type=submit]:hover	{ background-color: #538CC1; }
.welcome form input[disabled]			{ background-color: rgba(0,0,0,0.1); }

.register-duplicate 						{ margin: 45px auto; text-align: center; }
.register-duplicate ul 	 					{ width: 245px; margin: 25px auto 35px; padding: 0; text-align: left; list-style-type: none; font-size: 15px; }
.register-duplicate ul li 					{ margin: 5px 0; }
.register-duplicate ul li i					{ color: #127e00; margin-right: 2px; }
.register-duplicate form 					{ width: 295px; margin: 0 auto 30px; padding: 15px 40px; text-align: left; border: 2px solid #2b78c0; border-radius: 3px; }
.register-duplicate form input[type=text],
.register-duplicate form input[type=email],
.register-duplicate form input[type=password],
.register-duplicate form input[type=submit]		{ border: 1px solid rgba(0,0,0,0.2); background-color: white; margin-bottom: 2px; width: 100%; box-sizing: border-box; padding: 8px; font-size: 14px; -webkit-appearance: none; box-shadow: none; outline: none; border-radius: 2px; }
.register-duplicate form input[type=submit]		{ border: 0; background-color: #2b78c0; color: white; cursor: pointer; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
.register-duplicate form input[type=submit]:hover	{ background-color: #538CC1; }
.register-duplicate form input[disabled]			{ background-color: rgba(0,0,0,0.1); }

.account 									{ background-color: #f7f7f7; min-height: 600px; }
.account .inner 							{ padding: 40px; margin: auto; max-width: 1148px; font-size: 13px; display: flex; }
.account .menu 								{ width: 200px; margin-right: 50px; }
.account .menu a 							{ display: block; background-color: rgba(43, 120, 192, 0.12); border-radius: 4px; padding: 20px; margin-bottom: 15px; font-size: 18px; text-decoration: none; }
.account .menu a.cur						{ background-color: rgba(43, 120, 192, 1); color: #fff; }
.account .content 							{ width: 740px; box-shadow: 0 0 3px #bbb; background-color: #fff; border-radius: 4px; padding: 50px 60px; }
.account .content div h2					{ text-align: left; margin: 0; color: #2b78c0; padding: 0; }
.account .content .subscription				{ display: none; }
.account .content .subscription	.info 		{ display: flex; margin: 10px -15px; }
.account .content .subscription	.info div 	{ width: 170px; height: 145px; padding: 25px 20px; background-color: #f7f7f7; margin: 15px; text-align: center; }
.account .content .subscription	.info div img.plan { margin: 7px 0; height: 45px; }
.account .content .subscription	.info div p.name { font-size: 23px; font-weight: 300; margin: 10px 0; }
.account .content .subscription	.info div p.price { font-size: 26px; font-weight: 300; margin: 5px 0; }
.account .content .subscription	.info div p.price .per { font-size: 16px; position: relative; top: -3px; margin-left: 2px; }
.account .content .subscription	.info div p.cancel-sub a { font-size: 20px; font-weight: 500; margin: 8px 0; text-decoration: none; border-bottom: 2px solid #2b78c0; }
.account .content .subscription	.info div p.cancelled { color: #ff0000; }
.account .content .subscription	.info div p.next-payment	{ font-size: 14px; line-height: 140%; margin: 0; }
.account .content .subscription	.info div p.light			{ font-size: 11px; color: #999; font-style: italic; }
.account .content .subscription p.dots				{ font-size: 21px; margin: 0; display: inline-block; vertical-align: middle; margin-right: 6px; position: relative; top: 6px; }
.account .content .subscription p.inline			{ display: inline-block; vertical-align: middle; margin: 0; font-weight: 300; position: relative; top: 6px; }
.account .content .subscription img.payment-card	{ display: inline-block; vertical-align: middle; margin: 2px 8px 2px 0; }
.account .content .subscription p.change-card a { font-size: 17px; font-weight: 500; margin: -15px 0 0; text-decoration: none; border-bottom: 2px solid #2b78c0; }
.account .content .subscription	.grandfather	{ font-size: 14px; color: #666; }
.account .content .details								{ display: none; }
.account .content .details form 						{ width: 280px; }
.account .content .details form input[type=text],
.account .content .details form input[type=password] 	{ border: 1px solid rgba(0,0,0,0.2); background-color: white; width: 100%; box-sizing: border-box; padding: 8px; font-size: 14px; -webkit-appearance: none; box-shadow: none; outline: none; border-radius: 2px; }
.account .content .payments						{ display: none; }
.account .content .payments table 				{ border-collapse: collapse; margin: 15px 0; width: 300px; }
.account .content .payments table td			{ padding: 4px 8px; border: 1px solid #ccc; }
.account .content .payments table td:nth-of-type(2) { text-align: right; }
.account .content .payments table tr.top		{ font-weight: bold; }
.account .content .api-key						{ display: none; }
.account .content .api-key .key 				{ width: 400px; }
.account .content .api-key .key .api			{ padding: 0; margin-left: 0; }
.account .content .api-key .key .api .code		{ margin: 35px 0; }
.account .content .api-key .key .request-count	{ color: #060; font-size: 15px; font-weight: bold; line-height: 18px; }

.change-plan .cancel-sub 	 				{ text-align: center; font-size: 13px; color: #aaa; margin: 10px 0; }

.change-plan-to							{ margin: 45px auto; max-width: 780px; text-align: center; }
.change-plan-to p 		 	 			{ text-align: center; margin: 28px 0; }
.change-plan-to .button2 		 	 	{ font-size: 16px; padding: 12px 20px; margin: 15px 0; }

.cancel 								{ margin: 45px auto; text-align: center; }
.cancel .grandfather 					{ max-width: 700px; margin: 15px auto; color: #ff6600; }

.widget-generator 					{ padding: 17px 22px; font-size: 13px; }
.widget-generator h3 				{ text-align: left; font-size: 30px; margin: 0 0 10px 0; }
.widget-generator p 				{ font-size: 14px; margin-top: 0px; margin-bottom: 0px;  }
.widget-generator p em				{ color: #777; }

.widget-generator .build 	 			{ display: flex; }
.widget-generator .build > div 			{ width: 380px; height: auto; margin-right: 30px; }
.widget-generator .build .options 		{ margin: 20px 0; }
.widget-generator .build .options label	{ display: block; margin: 10px 0; display: flex; }
.widget-generator .build .options label span { font-weight: bold; width: 75px; }
.widget-generator .build .options input[type=number] { width: 40px; }
.widget-generator .build textarea	{ width: 315px; height: 65px; padding: 8px; font-size: 13px; resize: none; margin-top: 2px; border: 1px solid #bbb; }

.historical-odds 						{ padding: 35px; text-align: center; }
.historical-odds .runners 	 			{ margin: 24px 0; text-align: center; }
.historical-odds .runners img 			{ width: 66px; height: 66px; border-radius: 50%; margin: 0 7px; }
.historical-odds .main 					{ margin: 30px; text-align: center; }
.historical-odds .main .buy 				{ margin: 0 35px; }
.historical-odds .main .buy h2 				{ font-size: 26px; margin: 25px 0; line-height: 155%; }
.historical-odds .main .buy h2 strong		{ letter-spacing: 1.3px; }
.historical-odds .main .buy h2 strong:nth-of-type(1) { color: #689f38; }
.historical-odds .main .buy h2 strong:nth-of-type(2) { color: #039be5; }
.historical-odds .main .buy h2 strong:nth-of-type(3) { color: #ed3b3b; }
.historical-odds .main .buy h3 				{ font-size: 20px; margin: 25px 0; line-height: 155%; }
.historical-odds .main .buy .action 		{ font-size: 20px; font-weight: 400; }
.historical-odds .main .chart				{ display: block; width: 500px; height: 310px; margin: 40px auto; max-width: 100%; border: 1px solid #ddd; padding: 20px; border-radius: 3px; }

.historical-odds-index					{ padding: 40px; margin: auto; max-width: 1148px; }
.historical-odds-index .filter 			{ display: inline-block; padding: 20px 25px; border: 1px solid #ccc; border-radius: 4px; font-size: 14px; }
.historical-odds-index .filter select 	{ margin-left: 6px; }
.historical-odds-index table 			{ margin: 24px 0; border-collapse: collapse; }
.historical-odds-index table th,
.historical-odds-index table td 		{ padding: 6px 8px; text-align: left; border: 1px solid #ccc; font-size: 13px; }
.historical-odds-index table td img 	{ width: 130px; }
.historical-odds-index table td span 	{ background-color: #fffdde; font-size: 10px; text-transform: uppercase; padding: 3px 6px; border-radius: 3px; margin-left: 5px; }
.historical-odds-index table tr.top th	{ background-color: #f3f3f3; font-weight: bold; padding-right: 20px; }
.historical-odds-index table tr.top .header 		{ background-image: url(/images/tablesorter/bg.gif); background-repeat: no-repeat; background-position: center right; cursor: pointer; }
.historical-odds-index table tr.top .headerSortUp 	{ background-image: url(/images/tablesorter/asc.gif); }
.historical-odds-index table tr.top .headerSortDown { background-image: url(/images/tablesorter/desc.gif); }

.purchase-complete				{ margin: 45px auto; text-align: center; }

.api 					{ padding: 40px; margin: auto; max-width: 1148px; }
.api .code				{ margin: 20px 0 20px; color: #2f2e2e; letter-spacing: 1px; word-break: break-word;}
.api .code .method 		{ margin-top: 5px; background-color: #2196f3; color: #fff; padding: 3px 4px; border-radius: 2px; font-size: 13px; float: left; }
.api .code .url 		{ font-family: Menlo,Monaco,Consolas,Courier New,monospace; font-size: 17px; display: block; line-height: 1.8; margin-left: 50px; }\
.api .parameters 		{ margin-bottom: 50px; }
.api .parameters h2 	{ margin-top: 10px; }
.api .parameters table 	{ width: 100%; max-width: 400px; margin: 0 20px; }
.api .parameters table * 	{ font-family: Menlo,Monaco,Consolas,Courier New,monospace; }
.api .parameters table strong 	{ font-weight: bold; }
.api .usage-limits 			{ margin: 20px 0;  }
.api .usage-limits table 	{ border-collapse: collapse; }
.api .usage-limits table td 	{ padding: 10px 12px; border: 1px solid #ccc; font-size: 15px; }
.api .usage-limits table td img	{ height: 32px; margin: 0 0 -2px; }
.api .usage-limits table tr.top 	{ font-weight: bold; }

.about 					{ padding: 40px; margin: auto; max-width: 1148px; }
.about p:nth-of-type(1)	{ font-size: 16px; font-weight: bold; }
.about img 				{ float: right; margin: 10px 0 100px 190px; max-width: 60%; }
.about .legal 			{ color: #999; font-size: 14px; margin-top: 28px; }

.major-runner				{ padding: 40px; margin: auto; max-width: 1148px; }
.major-runner .runner-img 	{ float: right; border-radius: 50%; margin: 0 0 80px 80px; }
.major-runner .history > div  { display: flex; margin: 40px 0; }
.major-runner .history > div .chart { border: 3px solid #f4f4f4; margin-right: 32px; }
.major-runner .history > div .chart div { width: 225px; height: 138px; background-size: cover; }
.major-runner .history > div h3 { margin: 0; font-size: 18px; line-height: 145%; }
.major-runner .history > div h3 a { font-weight: bold; }

.pricing 						{ padding: 20px 0 35px; margin: auto; background-color: #f7f7f7; }
.pricing h1 					{ text-align: center; padding: 15px 0 15px; }
.pricing .plans 				{ display: flex; justify-content: center; margin: 25px 0 30px; }
.pricing .plans .inner			{ width: 275px; margin: 0 22px; padding: 22px; background-color: #fff; border: 1px solid #ddd; border-radius: 5px; text-align: center; }
.pricing .plans .inner img		{ height: 38px; }
.pricing .plans .inner .name	{ font-weight: 100; font-size: 40px; margin: 8px 0; }
.pricing .plans .inner .price	{ font-weight: 300; font-size: 40px; margin: 8px 0; }
.pricing .plans .inner .price .cur { font-size: 24px; position: relative; top: -8px; margin-right: 3px; }
.pricing .plans .inner .price .per { font-size: 21px; color: #666; position: relative; top: -6px; margin-left: 4px; }
.pricing .plans .inner .price .ast { font-size: 22px; color: #999; position: relative; top: -3px; }
.pricing .plans .inner .features { margin: 18px 0; height: 125px; }
.pricing .plans .inner .features p { margin: 10px 0; font-size: 14px; }
.pricing .plans .inner .button2 	{ display: inline-block; margin: 15px; font-size: 15px; padding: 8px 20px; }
.pricing .plans .inner.last p.data	{ max-width: 235px; margin: 20px auto; }
.pricing .vat 	 				{ margin: 45px 0; text-align: center; font-size: 15px; color: #666; }
.pricing .currency-msg 			{ text-align: center; color: #888; font-size: 12px; margin: 30px 0 0; }

.purchase 						{ padding: 20px 0 35px; margin: auto; background-color: #f7f7f7; }
.purchase h1 					{ text-align: center; padding: 15px 0 15px; }
.purchase h1 img				{ height: 40px; margin: 0 7px; position: relative; top: 8px; }
.purchase p						{ max-width: 850px; margin: 10px auto; text-align: center; }

.purchase-form .stripe-button-el 				{ width: 150px; outline: none; margin: 4px 0; background: #2b78c0; border: 0; border-radius: 2px; box-sizing: border-box; }
.purchase-form .stripe-button-el span			{ width: 150px; outline: none; background: #2b78c0; border: 0; border-radius: 2px; font-weight: 600; box-sizing: border-box; text-shadow: none; box-shadow: none; font-size: 14px; }
.purchase-form .stripe-button-el span:hover		{ background-color: #538CC1; border: 0; }

.blog 					{ padding: 50px 40px; margin: auto; max-width: 1148px; font-size: 15px; line-height: 23px; }
.blog h1				{ margin-bottom: 35px; }
.blog .post-teaser 		{ border-bottom: 1px solid #ddd; margin-top: 25px; padding: 15px 0 20px; }
.blog .post-teaser:last-child { border-bottom: 0; }
.blog .post-teaser img	{ float: left; width: 200px; margin-right: 35px; }
.blog .post-teaser h2 	{ display: flex; justify-content: space-between; margin: 0; }
.blog .post 			{ display: flex; }
.blog .post .body		{ width: calc(100% - 300px - 80px); }
.blog .post .body h1	{ font-size: 34px; }
.blog .post .body h2	{ font-size: 24px; margin-bottom: 35px; }
.blog .buy-data 		{ border: 1px solid #ccc; border-radius: 6px; padding: 30px; margin: 0 0; }
.blog .buy-data .chart	{ float: left; width: 50%; margin-right: 40px; }
.blog .buy-data h4			{ margin: 0; padding: 0; color: #5593cd; font-size: 17px; line-height: 160%; text-align: center; font-weight: normal; }
.blog .buy-data h4 strong	{ font-weight: bold; }
.blog .buy-data h4 a.button	 		{ background-color: #2b78c0; color: white; cursor: pointer; padding: 5px 8px; font-size: 13px; border-radius: 2px; text-decoration: none; text-align: center; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
.blog .buy-data h4 a.button:hover	{ background-color: #538CC1; }
.blog .post .similar	{ width: 300px; margin-left: 80px; background-color: #f7f7f7; padding: 30px; }
.blog .post .similar h2	{ margin: 0 0 20px; font-size: 22px; }
.blog .post .similar div { margin: 30px 0; }
.blog .post .similar div h3 { margin: 4px 0 0; font-size: 17px; font-weight: bold; line-height: 24px; }
.blog .post .similar div a { text-decoration: none; }
.blog .post img 		{ width: 100%; margin: 10px 0; }

.contact				{ padding: 40px; margin: auto; max-width: 1148px; font-size: 15px; }
.contact a 				{ font-weight: 300; font-size: 23px; }
.contact .map			{ float: right; width: 60%; max-width: 660px; margin-left: 35px; margin-bottom: 18px; }

.reactivate 				{ padding: 20px 0 35px; margin: auto; background-color: #f7f7f7; }
.reactivate h1 				{ text-align: center; }
.reactivate p 				{ max-width: 900px; margin: 20px auto; text-align: center; }

.account-login					{ padding: 40px; margin: auto; max-width: 1148px; font-size: 15px; }
.account-login label			{ display: block; }
.account-login form				{ width: 350px; max-width: 80%; margin: 0 auto; }
.account-login form input[type=text],
.account-login form input[type=email],
.account-login form input[type=password] 		{ border: 1px solid rgba(0,0,0,0.2); background-color: white; width: 100%; box-sizing: border-box; padding: 12px; font-size: 15px; -webkit-appearance: none; box-shadow: none; outline: none; border-radius: 2px; }
.account-login form input:focus			{ border: 1px solid #307abd; }
.account-login .button 					{ display: block; width: 100%; box-shadow: none; border: none; margin: 0; background-color: #2b78c0; color: white; cursor: pointer; box-sizing: border-box; padding: 8px; font-size: 14px; border-radius: 2px; text-decoration: none; text-align: center; outline: none; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
.account-login .button:hover 			{ background-color: #538CC1; }
.account-login .forgot					{ margin: 40px 0 20px; text-align: center; font-size: 13px; }
.account-login .signup					{ margin: 20px 0; text-align: center; font-size: 13px; }

.register									{ padding: 40px; margin: auto; max-width: 1148px; font-size: 15px; }
.register label								{ display: block; }
.register form								{ width: 400px; max-width: 80%; margin: 0 auto; }
.register form input[type=text],
.register form input[type=email],
.register form input[type=password] 		{ border: 1px solid rgba(0,0,0,0.2); background-color: white; width: 100%; box-sizing: border-box; padding: 8px; font-size: 14px; -webkit-appearance: none; box-shadow: none; outline: none; border-radius: 2px; }
.register .button 							{ display: block; width: 100%; box-shadow: none; border: none; margin: 0; background-color: #2b78c0; color: white; cursor: pointer; box-sizing: border-box; padding: 8px; font-size: 14px; border-radius: 2px; text-decoration: none; text-align: center; outline: none; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
.register .button:hover 					{ background-color: #538CC1; }

.reset									{ padding: 40px; margin: auto; max-width: 1148px; font-size: 15px; }
.reset label							{ display: block; }
.reset form								{ width: 400px; max-width: 80%; margin: 0 auto; }
.reset form input[type=text],
.reset form input[type=email],
.reset form input[type=password] 		{ border: 1px solid rgba(0,0,0,0.2); background-color: white; width: 100%; box-sizing: border-box; padding: 8px; font-size: 14px; -webkit-appearance: none; box-shadow: none; outline: none; border-radius: 2px; }
.reset .button 							{ display: block; width: 100%; box-shadow: none; border: none; margin: 0; background-color: #2b78c0; color: white; cursor: pointer; box-sizing: border-box; padding: 8px; font-size: 14px; border-radius: 2px; text-decoration: none; text-align: center; outline: none; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
.reset .button:hover 					{ background-color: #538CC1; }
.reset p.error		 					{ color: #d9534f; }

.purchase-data							{ max-width: 800px; margin: 30px auto; text-align: center; }

.email-preferences 						{ width: 405px; margin: 30px auto; background-color: #fafafa; padding: 25px 30px; }
.email-preferences h3					{ font-weight: 400; text-align: left; }
.email-preferences p.frequency			{ width: 236px; background-color: #f7f7f7; padding: 10px; }
.email-preferences .markets 			{ height: 195px; box-shadow: 0 0 3px #ccc; padding: 6px; overflow: auto; }
.email-preferences label 				{ display: block; padding: 0; margin: 0; font-size: 12px; }
.email-preferences label input[type=text] { width: 240px; padding: 5px; font-size: 14px; }
.email-preferences label .cat			{ width: 12px; margin: 0 4px; position: relative; top: 2px; }
.email-preferences label.first-of-cat	{ margin-top: 3px; }

.error-page 							{ padding: 40px; margin: auto; max-width: 1148px; font-size: 15px; text-align: center; }

.footer 								{ width: 100%; background-color: #222; font-size: 14px; }
.footer .footer-menu 					{ display: flex; justify-content: center; padding: 35px 0 15px; }
.footer .footer-menu a					{ margin: 10px 25px; font-size: 16px; color: rgb(133, 145, 160); text-decoration: none; border-bottom: 1px solid rgba(133, 145, 160, 0.7);}
.footer .network 						{ display: flex; justify-content: center; padding: 15px; color: rgba(133, 145, 160, 0.9); }
.footer .network img.pd					{ width: 165px; margin-left: 8px; position: relative; top: 8px; }
.footer .legal 							{ padding: 20px 0 35px; color: rgba(133, 145, 160, 0.5); text-align: center; font-size: 14px; }

.admin-bar 								{ display: flex; justify-content: center; position: fixed; bottom: 0; right: 0; z-index: 1; }
.admin-bar a							{ display: block; background-color: #2b78c0; color: #fff; opacity: 0.6; padding: 6px 14px 5px; font-size: 12px; margin: 1px 0 0 1px; text-decoration: none; }
.admin-bar a.disabled					{ color: rgba(255, 255, 255, 0.6); text-decoration: line-through; }
.admin-bar a:hover						{ opacity: 0.92; }
.admin-bar a:first-child				{ border-top-left-radius: 5px; }

form.form-in-a-box 							{ width: 295px; margin: 0 auto 30px; padding: 15px 40px; text-align: left; border: 2px solid #2b78c0; border-radius: 3px; }
form.form-in-a-box input[type=text],
form.form-in-a-box input[type=email],
form.form-in-a-box input[type=password],
form.form-in-a-box input[type=submit]		{ border: 1px solid rgba(0,0,0,0.2); background-color: white; margin-bottom: 2px; width: 100%; box-sizing: border-box; padding: 8px; font-size: 14px; -webkit-appearance: none; box-shadow: none; outline: none; border-radius: 2px; }
form.form-in-a-box textarea					{ border: 1px solid rgba(0,0,0,0.2); background-color: white; margin-bottom: 2px; width: 100%; box-sizing: border-box; padding: 8px; font-size: 14px; -webkit-appearance: none; box-shadow: none; outline: none; border-radius: 2px; height: 100px; }
form.form-in-a-box input[type=submit]		{ border: 0; background-color: #2b78c0; color: white; cursor: pointer; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
form.form-in-a-box input[type=submit]:hover	{ background-color: #538CC1; }
form.form-in-a-box input[disabled]			{ background-color: rgba(0,0,0,0.1); }

.invoice 								{ width: 650px; min-height: 720px; box-shadow: 2px 1px 6px #ccc; background-color: #fff; margin: 30px auto; padding: 50px 55px; font-size: 14px; line-height: 140%; }
.invoice .logo							{ width: 190px; }
.invoice p 								{ margin: 25px 0; font-size: 15px; }
.invoice p.info 						{ display: flex; justify-content: space-between; font-size: 18px; }
.invoice p.to 							{ margin: 25px 0; }
.invoice table 							{ width: 100%; border-collapse: collapse; margin: 30px 0; }
.invoice table td 						{ padding: 10px 15px; border: 1px solid #333; }
.invoice table td:nth-of-type(2)		{ width: 70px; text-align: right; }
.invoice table td:nth-of-type(3)		{ width: 70px; text-align: right; }
.invoice table tr.top					{ font-weight: bold; background-color: #eee; }
.invoice table tr.totals td:nth-of-type(1) { border: 0; }
.invoice table tr.totals.grand td		{ font-size: 20px; padding: 15px; }
.invoice table tr.blank td 				{ border: 0; }
.invoice .payment-card 					{ position: relative; top: 4px; margin: 0 5px 0 4px; }
.invoice .dots 							{ font-size: 21px; position: relative; top: 3px; }

.terms 					{ padding: 40px; margin: auto; max-width: 1148px; }
.terms h2				{ font-size: 23px; }
.terms li 				{ margin: 12px 0; font-size: 14px; }

#payment-form 		 			{ width: 328px; padding: 6px 40px 20px; margin: 24px auto; background-color: #fff; border-radius: 4px; position: relative; }
#payment-form label 			{ display: block; margin: 20px 0; position: relative; }
#payment-form label input[type=text],
#payment-form label input[type=email],
#payment-form label input[type=password] { margin-top: 3px; width: 300px; padding: 8px 10px; font-size: 17px; outline: none; border: 1px solid #ccc; }
#payment-form label input:focus { border: 1px solid #2b78c0; }
#payment-form input[name=discount_code] { width: 80px; }
#payment-form label .valid-code { display: none; position: absolute; top: 38px; left: 120px; color: #2b984f; }
#payment-form label .invalid-code { display: none; position: absolute; top: 38px; left: 120px; color: #a94442; }
#payment-form label.add-discount-code { display: none; }
#payment-form label.terms 		{ font-size: 13px; line-height: 150%; position: relative; padding: 0 0 0 24px; text-align: left; }
#payment-form label.terms input	{ position: absolute; top: 0; left: 0; }
#payment-form label.terms.highlight{ background-color: #fffccd; }
#payment-form p.add-code		{ position: absolute; bottom: 22px; right: 44px; }
#payment-form p.add-code a 		{ color: #ccc; font-size: 14px; }
#payment-form .StripeElement 	{ width: 298px; margin-top: 5px; background-color: #fff; padding: 12px 12px; border: 1px solid #ccc; }
#payment-form .StripeElement--focus { border: 1px solid #2b78c0; }
#payment-form .StripeElement--invalid { border-color: #fa755a; }
#payment-form .StripeElement--webkit-autofill { background-color: #fefde5 !important; }
#payment-form .errors  			{ color: #ff0000; }

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

}

@media only screen and (max-width : 992px) {
	.home .inner				{ padding: 0; }

	.heading .inner .logo			{ padding-right: 15px; padding-top: 25px; }
	.heading .inner .logo a.pro img	{ width: 240px; }

	.heading .inner .menu  			{ padding-left: 15px; }
	.heading .inner .menu a 		{ font-size: 16px; margin: 0 8px; }
}

@media only screen and (max-width : 768px) {
	.heading .inner .logo			{ padding-right: 10px; }
	.heading .inner .menu  			{ padding-left: 10px; }
	.heading .inner .menu a 		{ font-size: 14px; margin: 0 6px; }


	.about img 						{ float: none; display: block; margin: 0 auto; max-width: 80%; }

	.historical-odds .features div	{ padding: 12px 6px 17px; margin: 5px; }
}

@media only screen and (max-width : 700px) {
	body							{ width: calc(100% + 210px); overflow-x: hidden; transform: translateX(-210px); -moz-transition: transform 0.2s ease-in; -ms-transition: transform 0.2s ease-in; -o-transition: transform 0.2s ease-in; transition: transform 0.2s ease-in; }
	body.menu-open					{ transform: translateX(0px); overflow: hidden; }

	h1								{ font-size: 28px; }
	.admin-bar 						{ margin-left: 105px; }

	.home, .home, .historical-odds, .account, .historical-odds-index,.contact,
	.heading, .api, .account-login, .welcome, .register, .reset,
	.about, .error-page, .blog, .pro-account		{ margin-left: 210px; }

	.blog img.right					{ float: none; width: 100%; max-width: 100%; margin: 10px auto; }

	.heading .inner 				{ justify-content: center; }
	.heading .inner .burger			{ display: block; }
	.heading .inner .logo			{ display: block; margin-left: -210px; }

	.heading .inner .menu			{ box-sizing: border-box; position: fixed; left: 0; top: 0; display: flex; flex-direction: column; width: 210px; background-color: #333439; height: 100vh;  padding-left: 0; padding-right: 0; }
	.heading .inner .menu a 		{ display: block; outline: none; color: #888; padding: 11px 30px; text-decoration: none; font-size: 15px; margin: 0; }
	.heading .inner .menu a:hover	{ background-color: #2c2d32; color: #ccc; }

	.home .categories a				{ margin: 4px 0; }

	.home							{ padding: 40px 10px; }

	.api .costs 					{ justify-content: space-between; }
	.api .costs div 				{ width: 50%; margin: 0 10px; }
	.api .code .method 				{ font-size: 10px; margin-top: 1px; padding-top: 4px; }
	.api .code .url 				{ font-size: 12px; margin-left: 42px; }

	.historical-odds .features 		{ flex-wrap: wrap; }
	.historical-odds .main .buy 	{ margin: 0 10px; }

	.contact .map					{ float: none; }
	.pro-account .purchase 		 	{ float: none; margin-top: 20px; }

	.historical-odds .main 			{ flex-direction: column; }
	.historical-odds .main .chart 	{ margin-bottom: 20px; }


	.footer 								{ padding-left: 210px; box-sizing: border-box; }
	.footer .inner 							{ flex-wrap: wrap; }
	.footer .inner div 						{ box-sizing: border-box; text-align: center; }
	.footer .inner div:nth-child(1) 		{ flex: 0 0 100%; }
	.footer .inner div:nth-child(1) p 		{ margin-bottom: 0; }
	.footer .inner div:nth-child(2) 		{ flex: 0 0 50%; }
	.footer .inner div:nth-child(2) h4 		{ width: 220%; }
	.footer .inner div:nth-child(3) 		{ flex: 0 0 50%; }
}


@media only screen and (max-width: 550px)
{
	.home .markets .market		{ width: 95.6%; }

	.api .costs 					{ flex-direction: column; }
	.api .costs div 				{ width: 70%; margin: 10px auto; }
}