/*
Theme Name: BetJets Partners
Theme URI: https://betjetspartners.co.za
Description: BetJets theme, a child theme of GeneratePress
Author: BetJets
Author URI: https://betjetspartners.co.za
Template: generatepress
Version: 1.1.1
*/
@import url("../generatepress/style.css");



body {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

body, button, input, select, textarea {
    font-family: 'Montserrat', sans-serif;
}


.hero-section {
	top: 82px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	/* height: 87vh; */
	background: url('https://betjetspartners.co.za/wp-content/uploads/2024/06/betjets-pattern-background.png') no-repeat center center/cover;
}

.hero-section.small {
	height: 300px;

}

.text-section {
	flex: 1;
	padding: 40px 25px;
}

.image-section {
	flex: 1;
	padding: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
}

h1 {
	font-size: 3em;
	margin-bottom: 20px;
}

h2 {
	font-size: 2em;
	margin-bottom: 30px;
}

.cta-button {
	padding: 15px 25px;
	background-color: #fff;
	border: none;
	border-radius: 5px;
	font-size: 1em;
	cursor: pointer;
	transition: background-color 0.3s;
}

.cta-button:hover {
	background-color: #f0f0f0;
}

.image-section img {
	max-width: 100%;
	height: auto;
	border-radius: 10px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.header {
	height: 85px;
	display: flex;
	position: sticky;
	top: 0;
	z-index: 999;
	justify-content: space-between;
	align-items: center;
	background: linear-gradient(45deg, #081238 0%, #012068 99%, #012068 100%);
	color: #fff;
	padding: 10px 20px;
}

.logo {
	font-size: 0px;
}

.navbar .nav-button {
	padding: 8px 16px;
	background-color: #007bff;
	color: #fff;
	border: none;
	cursor: pointer;
	border-radius: 4px;
	transition: background-color 0.3s;
}

.navbar .nav-button:hover {
	background-color: #0056b3;
}

/* Default styling for smaller screens */
.lp-large-text {
	font-size: 58px;
	line-height: 70px;
}

.loginbtn {
	color: white;
	margin-right: 40px;
	text-decoration: none;
	font-weight: 900;
}

.loginbtn:hover {
	color: #f2d230;
}

.contained {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0px 20px;
}

h2 {
	font-weight: 900;
}



@media (min-width: 768px) {
	.lp-large-text {
		font-size: 70px;
		line-height: 90px;
	}

	.text-section {
		padding: 80px 50px;
        max-width: 1200px;
        margin: 0 auto;
	}
}

@media (min-width: 1024px) {
	.lp-large-text {
		font-size: 90px;
        line-height: 100px;
	}
}

.main-navigation .main-nav ul li[class*="current-menu-"] > a {
    color: var(--betjets-yellow);
}

.main-navigation .main-nav ul li a {
	line-height: 40px;
	font-weight: 900;
}


.main-navigation .main-nav ul li > a:hover {
    color: var(--betjets-yellow) !;
}

.yellow-hover:hover, .yellow-hover a:hover {
	color: var(--betjets-yellow) !important;
}



/* Style the BetJets CTA button */

.oval-border-button:hover, .oval-border-button:focus {
    background-color: transparent;
    color: var(--betjets-yellow);
}
.oval-border-button:hover::before, .oval-border-button:hover::after{
    border: 2px solid var(--betjets-yellow);
    
   /* Yellow border */
}
.oval-border-button {
    position: relative;
    padding: 12px 15px;
   /* Adjust the padding as needed */
    background-color: transparent;
    color: var(--betjets-yellow);
    border: none;
    font-size: 16px;
    cursor: pointer;
    outline: none;
    text-transform: uppercase;
    font-weight: bold;
   /* margin: 50px;
    To provide space for the ovals */
    font-family: sans-serif;
    letter-spacing: 1px;
    overflow: visible;
   /* Change from hidden to visible so ovals are not cropped */
}

.oval-border-button.large {
    padding: 16px 33px;
}


.oval-border-button:before, .oval-border-button:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: calc(100% + 20px);
   /* Decrease the additional width to reduce oval length */
    height: calc(100% - 10px);
   /* Adjust height to ensure ovals fit within the button */
    background-color: transparent;
    border: 2px solid white;
   /* Yellow border */
    border-radius: 100px / 25px;
   /* Adjust radii to perfect the oval shape */
    transform-origin: center;
}
.oval-border-button:before {
    transform: translate(-50%, -50%) rotate(-2deg);
   /* Adjust rotation angle if needed */
}
.oval-border-button:after {
    transform: translate(-50%, -50%) rotate(3deg);
   /* Adjust rotation angle if needed */
}

.oval-border-button a {
    padding: 16px 33px;
	background-color: transparent !important;

}

.oval-border-button.cta {
	padding: 10px 24px !important;
	background-color: transparent !important;
}

.oval-border-button.cta:before, .oval-border-button.cta:after {
    border: 2px solid var(--betjets-yellow);;
}

.callouts {
	padding: 20px;
}

:root .has-betjets-yellow-background-color {
	background-color: var(--betjets-yellow);
    margin: 0 auto;
}

.disclaimericon {
	padding: 20px;
    width: 90px;
}

.disclaimerfooter {
	font-size: x-small; 
	max-width: 1200px; 
	margin: 0 auto; 
	padding: 0px 20px 0px 20px; 
	color: grey;
}


/* Media query for screens wider than 768px */ 
@media (min-width: 768px) { 
	.oval-border-button {padding: 19px 43px;} 

	.login-btn {
		background-color: var(--betjets-red);
		border-radius: 6px;
		margin: 0px 15px;
	}

	.register-btn {
		background-color: var(--betjets-red);
		background-color: var(--betjets-yellow);
		border-radius: 6px;
	}
		
	.login-btn a {
		color: white !important;
	}

	.callouts {
        max-width: 1200px;
        margin: 0px auto;
		padding: 20px;
	}


}