/* SET UP */
.video-wrapper {position: relative; padding-bottom: 56.25%; /* 16:9 */  padding-top: 25px;}
.video-wrapper iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

section {overflow-x: hidden;}
section a, section a:visited {color: rgba(192,26,45,1);}
body {font-family: 'Josefin Sans', sans-serif; font-weight: 300; font-size: 1.3rem; line-height: 1.2; background: #f1f1f1; color: #000;}

.logo {width: 260px; filter: drop-shadow(0px 0px 5px rgb(0 0 0 / 0.5)); transition: 0.4s; position: absolute; top: 30px;}
.our-teamPage .logo {filter: none;}

#logoMobile {width: 250px; filter: drop-shadow(0px 0px 5px rgb(0 0 0 / 0.5));}

#logoMobileKilt {width: 150px; filter: drop-shadow(0px 0px 5px rgb(0 0 0 / 0.5));}

#logoR, #logoRMobile {display: none; width: 195px; position: absolute; top: 18px;}
#logoRMobile {left: 20px;}
h2 {font-size: 1.5rem; font-weight: 400;}

.textShadow {text-shadow: 0px 0px 5px rgba(0,0,0,0.5);}

#campForm label {display: block; min-width: 140px;}
#campForm select {min-width: 100px; border-radius: 15px; border: 1px solid #aaa; padding: 5px; font-weight: 300}
#campForm input {border-radius: 15px; border: 1px solid #aaa; padding: 5px 10px; font-weight: 300}
.childrenDetails {display: none;}
#mce-success-response {font-size: 1.5rem; background: #008000; padding: 15px 10px 13px 10px; color: #fff;}

.redBg {background: rgba(192,26,45,1);}
.redText {color: rgba(192,26,45,1);}
.blackBg {background: rgba(0,0,0,1);}
.blackText {color: rgba(0,0,0,1); text-decoration: none;}
.whiteBg {background: rgba(255,255,255,1);}
.greenText {color: #1ac03d;}

.greyBg {background: rgba(240,240, 243,1);}

.paddingBottom90 {padding-bottom: 45px;}
.paddingTop90 {padding-top: 45px;}
.paddingTop45 {padding-top: 45px;}
.paddingBottom45 {padding-bottom: 45px;}

.noMargin {margin: 0 !important;}
.marginBottom0 {margin-bottom: 0 !important;}
.marginBottom10 {margin-bottom: 10px;}

.maxWidthText {max-width: 800px; margin: 0 auto;}
.maxWidthText1200 {max-width: 1600px; margin: 0 auto;}

.buttonHolder {position: relative; max-width: 320px; margin: 0 auto;}

.buttons {
    border-radius: 20px;
    padding: 13px 40px 10px 40px;
    display: inline-block;
    width: 100%;
	font-weight: 400;
	transition: 250ms cubic-bezier(0.42, 0.83, 0.49, 1.35);
	position: relative;
	top: 0;
	z-index: 2;
	text-align: center;
}

.buttonShadow {position: relative; margin: 0 auto; top: -5px; z-index: 1; width: 90%; height: 4px; background: rgba(0,0,0,0.5); filter: blur(4px); transition: 250ms cubic-bezier(0.42, 0.83, 0.49, 1.35); opacity: 0; border-radius: 20px;}

.smallTitle {font-size: 1rem;}
.socialIcons a, #mobileSocial a, #footerSocials a {text-decoration: none;}


/* NAVIGATION */

#mobileNav {position: fixed; z-index: 7; width: 100%;}
#mobileNav .navbar-brand {margin-left: 15px;}
#mobileNav #logoM {width: 195px; top: 18px; left: 20px;}

#mobileNavLinks {display: none; position: absolute; top: 80px; padding: 20px; width: 100%; height: calc(100% - 160px); overflow-y: auto;}
#mobileNavLinks ul {padding: 0; margin: 0; position: relative; z-index: 3;}
#mobileNavLinks li {list-style: none; margin-bottom: 20px; margin-left: -120%; transition: 250ms cubic-bezier(0.42, 0.83, 0.49, 1.35);}
#mobileNavLinks li a {text-decoration: none; font-size: 1.6rem;}
.navPush {margin-left: 0 !important;}
.dropdownSub-menu {display: none; margin-top: 10px;}
.dropdownSub-item {margin-bottom: 10px; display: block; font-size: 1.3rem !important; transition: 250ms cubic-bezier(0.42, 0.83, 0.49, 1.35); color: #000 !important;}

.dropdownSub-toggle::after {
    display: inline-block;
    margin-left: 0.255em;
    vertical-align: 0.1em;
    content: "";
    border-top: 0.3em solid;
    border-right: 0.3em solid transparent;
    border-bottom: 0;
    border-left: 0.3em solid transparent;
}


#mobileSocial {position: fixed; bottom: 20px; overflow: hidden; z-index: 2;}
#mobileSocial a {bottom: -50px; position: relative; transition: 250ms cubic-bezier(0.42, 0.83, 0.49, 1.35);}
#mobileSocial a img {width: 30px;}
.mobileSocialPush {bottom: 0 !important;}

#footballRotate {
	opacity: 0.05;
	position: fixed;
	top: 80px;
	width: 220%;
	z-index: 1;
	left: -60px;
	height: calc(100% - 160px);
	
	/* animation: rotateBall 2s linear infinite;*/
}

@keyframes rotateBall {
	60% {transform: translateY(250px); }
	70% {transform: translateY(250px) scale(1.1, 0.95); }
	100% {transform: rotate(360deg);}
}

.navToggle {position: absolute;	width: 45px; right: 20px; top: 9px;}

.navToggle:before,
.navToggle:after,
.navToggle div {
  background: #fff;
  content: "";
  display: block;
  height: 4px;
  border-radius: 3px;
  margin: 9px 0;
  transition: 0.5s;
}
.navToggled:before {transform: translateY(12px) rotate(135deg);}
.navToggled:after {transform: translateY(-13px) rotate(-135deg);}
.navToggled div {transform: scale(0);}

.navToggleScroll:before,
.navToggleScroll:after,
.navToggleScroll div {
  background: rgba(192,26,45,1);
}

.our-teamPage .nav-item .text-white {color: #000 !important; text-shadow: none;}

.navOpen {height: 100% !important; top: 0 !important}

.navbar-toggler {border: none; color: #fff;}
.navbar-toggler-icon {background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")}

#navPanel {width: 100%; position: fixed; height: 66px; background: rgba(255,255,255,0.9); z-index: 6; top: -66px; transition: .4s cubic-bezier(0.4, 0.01, 0.165, 0.99); -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.15); box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.15); -webkit-backdrop-filter: blur(8px);  backdrop-filter: blur(8px);}
.navPanelActive {top: 0px !important;}
.nav-item {margin-top: 40px;}
nav {font-size: 1.2rem; font-weight: 400; }
.linksActive { text-shadow: none; margin-top: 5px;}
.linksActive a {color: rgba(192,26,45,1) !important; transition: .4s;}
.dropdown-item:hover {background: rgba(192,26,45,1) !important; color: #fff !important; transform: scale(1.1);}

.dropdown-menu {background: none; border: none;}
.dropdown-item {background: #fff; color: rgba(192,26,45,1); text-shadow: none; margin-top: 10px; padding: 14px 20px 10px 20px; border-radius: 4px; transform: scale(0); transition: 250ms cubic-bezier(0.42, 0.83, 0.49, 1.35); -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.15); box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.15);}
.dropdown-toggle::after {vertical-align: 0.1em;}

.dropdown-itemScale {transform: scale(1);}

/* HEADER */

.headerText, .headerCover, .headerImage {position: absolute; width: 100%; height: 100%; top: 0;}
.header {position: relative; width: 100%; height: 730px; transform: skewY(-3deg); z-index: 5; top: -20px; overflow-y: hidden;}
.headerInner {width: 100%; height: 100%; position: relative; transform: skewY(3deg); z-index: 4;}
.headerText {z-index: 3;}
.headerTextInner {position: relative; top: 45%; width: 92%; left: 50%; transform: translate(-50%,-50%);}
.headerCover {background: rgba(0,0,0,0.2); z-index: 2; top: -45px;}
.headerImage {z-index: 1; top: -45px;}
.headerImage img {width: 100%; height: 100%; object-fit: cover;}
.headerImage2 img {object-position: 64%;}

.swiper {
	width: 100%;
	height: 850px;
}

.swiperPartners {
	width: 100%;
	height: 200px;
	overflow: hidden;
}

.swiperPartners img {max-width: 100%;}


.swiperButtonNext, .swiperButtonPrev {color: #fff;}
.swiper-pagination-bullet {width: 10px; height: 10px;}
.swiper-pagination-bullet-active {background: rgba(192,26,45,1);}

.swiperButtonNext, .swiperButtonPrev {
    position: absolute;
    width: 50px;
    height: 50px;
    z-index: 10;
	
}

.swiperButtonNext img, .swiperButtonPrev img {width: 100%; height: auto;}
.swiperButtonPrev {left: 20px; top: 88%;}
.swiperButtonNext {right: 20px; top: 90%;}


.formLeft {width: 150px;}
.formInput, textarea {width: 100%; border: 1px solid #bbb; padding: 10px; border-radius: 15px;}
textarea {height: 300px;}

.g-recaptcha div {left: 50%; transform: translateX(-50%); position: relative;} 
#formIsNotValid, #formSent {display: none;}

/* BALL BOUNCE */

.ballHolder {position: absolute; bottom: 40px; z-index: 3; width: 100%; height: 150px;}
.HomePage .ballHolder {bottom: 120px;}
.ballLoader {margin: 0 auto; width: 80px; height: 150px; position: relative;}
.ballLoader .shadow {
    position: absolute;
    width: 100%;
    height: 10px;
    background-color: black;
    bottom: 0;
    border-radius: 100%;
    transform: scaleX(0.3);
    opacity: 0.3;
    animation: shadowScale 1s linear infinite;
    filter: blur(2px)
}

.gravity {width: 80px;  height: 80px;  animation: bounce 1s cubic-bezier(0.68, 0.35, 0.29, 0.54) infinite;}
.ball {width: 80px; height: 80px; animation: roll 2s linear infinite;}
.ball img {width: 100%; height: 100%;}

@keyframes roll {
  50% {transform: rotate(30deg);}
}

@keyframes bounce {
	60% {transform: translateY(80px); }
	70% {transform: translateY(80px) scale(1.1, 0.95); }
}

@keyframes shadowScale {
  50% {transform: scaleX(0.5); opacity: 0.4;}
}

/* CONTENT */

form {width: 100%; margin: 0 auto}
label {display: inline; width: 100%;}

#givingTreeForm {width: 100%; margin: 0 auto;}
#givingTreeForm input {width: 100%; border-radius: 15px; background: #ac1729; border: 1px solid #700e1a; padding: 13px 10px 9px 10px; color: #fff; }
#submitGiving {width: 200px !important; background: #700e1a !important; color: #fff; padding: 12px 10px 9px 10px !important; transition: all .4s;}
#submitGiving:hover {background:#000 !important; margin-top: -5px; }

.sportsIcons {background-image:url('../images/icons/sport-icons.svg'); background-size: 100%; background-attachment: fixed;}
.sportsIconsGrey {background-image:url('../images/icons/sport-icons-grey.svg?4'); background-size: 100%; background-attachment: fixed;}
#newsLetter {background-image:url('../images/icons/mail.svg'); background-size: 100%; background-attachment: fixed;}
.angledIntro {padding: 145px 0px 100px 0px; position: relative; margin-top: -90px; z-index: 3;}

.programmeBlock {position: relative; width: 100%; height: 300px; }
.programmeBlockImage, .programmeBlockText {width: 100%; height: 100%; position: absolute; border-radius: 20px;}
.programmeBlockText {z-index: 3; height: auto; top: 50%; transform: translateY(-50%); opacity: 1; transition: 250ms cubic-bezier(0.42, 0.83, 0.49, 1.35);}
.programmeBlockImage {z-index: 1; transform: scale(0.9); transition: 250ms cubic-bezier(0.42, 0.83, 0.49, 1.35);}
.programmeBlockImage img {object-fit: cover; width: 100%; height: 100%; border-radius: 20px; }
.programmeBlock .imageCover {transform: scale(0.9);}
.panelBg {background-size: cover;}
#teamPush {width: 100%; height: 50px;}
.newsImage {border-radius: 20px 20px 0px 0px;}
.newsImage img {transition: 250ms cubic-bezier(0.42, 0.83, 0.49, 1.35);}

.blockImages img {border-radius: 20px; -webkit-box-shadow: 8px 8px 15px -5px rgba(0,0,0,0.3); box-shadow: 8px 8px 15px -5px rgba(0,0,0,0.3); max-width: 100%; width:100%;}

.newsContent {-webkit-box-shadow: 8px 8px 15px -5px rgba(0,0,0,0.3); box-shadow: 8px 8px 15px -5px rgba(0,0,0,0.3); border-radius: 20px;}
.newsImage img {width: 100%; object-fit: cover; height: 300px; border-radius: 20px 20px 0px 0px;}
.newsText {padding: 20px; text-decoration: none; color: #000; min-height: 170px;}

.impactIcon img {max-height: 100px;}
.imageCoverRadius {border-radius: 20px;}
.imageCover {position: absolute; z-index: 2; width: 100%; height: 100%; background: rgba(0,0,0,0.5); transition: 250ms cubic-bezier(0.42, 0.83, 0.49, 1.35); opacity: 1;}
.imagePanel {position: relative; width: 100%; height: 400px;}
.imagePanelText, .imagePanelImage {position: absolute; }
.imagePanelText {width: 80%; transform: translate(-50%,-50%); top: 50%; left: 50%; z-index: 3;}
.imagePanelImage {z-index: 1; width: 100%; height: 100%;}
.imagePanelImage img {object-fit: cover; width: 100%; height: 100%;}

.newsletterInput {border-radius: 15px; width: 100%; max-width: 460px; margin-bottom: 20px; padding: 13px 10px 8px 10px; border: none;}

.pageList {margin: 0; padding-left: 15px;}
.pageList li {margin-bottom: 10px;}

#wfLogo {width: 300px; margin: 0 auto;}

/* Customize the label (the container) */
.containerInput {
  position: relative;
  padding-left: 35px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.containerInput input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
	position: absolute;
	top: -2px;
	left: 0;
	height: 25px;
	width: 25px;
	border-radius: 50%;
	border: 2px solid #fff;
	background-color: none;
}


/* When the checkbox is checked, add a blue background */
.containerInput input:checked ~ .checkmark {

}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.containerInput input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.containerInput .checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

/* THE FOOTER */
#theFooter {font-size: 1rem; font-weight: 400;}

.aos-fix[data-aos][data-aos].aos-animate {
    transform: initial;
}

.footerLogos img {width: 112px;}

/* MEDIA QUERIES */



@media (min-width: 768px) {
	
	h2 {font-size: 2.2rem; line-height: 1;}
	
	.headerTextInner {width: 80%;}
	.ballHolder {bottom: 120px;}
	.header {height: 850px; top: -30px;}
	
	.angledIntro {padding: 160px 0px 100px 0px; top: -105px;}

	.sportsIcons, .sportsIconsGrey, #newsLetter {background-size: 50%;}
	#footballRotate {width: 180%; left: 3%;}
	.swiperButtonPrev {top: 40%;}
	.swiperButtonNext {top: 50%;}
	
	.px-lg-2 {padding-left: 0 !important; padding-right: 0 !important;}
	#teamPush {height: 130px;}
	.footerLogos img {width: 94px;}

}

@media (width: 430px) {
	
	.col {flex: auto;}
	
}

@media (min-width: 1024px) {
	#footballRotate {width: 120%; left: 30%;}
	.sportsIcons, .sportsIconsGrey, #newsLetter {background-size: 40%;}
	
	
}

@media (min-width: 1196px) {
	
	.header {top: -50px;}
	
	.buttonHolder:hover .buttons {top: -5px; cursor: pointer;}
	.buttonHolder:hover .buttonShadow {opacity: 1;}

	.buttonHolder:hover .redBg {background: #000; color: rgba(192,26,45,1);}
	.buttonHolder:hover .blackBg {background: #fff; color: rgba(192,26,45,1) !important;}
	.buttonHolder:hover .blackOnWhite {background: rgba(192,26,45,1); color: #fff !important;}
	.buttonHolder:hover .redOnBlack {background: #fff; color: rgba(192,26,45,1) !important;}

	.programmeBlock:hover {cursor: pointer;}
	.programmeBlock:hover .programmeBlockText {opacity: 0;}
	.programmeBlock:hover .imageCover {opacity: 0; transform: scale(1);}
	.programmeBlock:hover .programmeBlockImage {transform: scale(1); border-radius: 50%;}
	.newsImage {overflow: hidden;}
	.newsHolder:hover .newsImage img {transform: scale(1.1);}
	
	.paddingBottom90 {padding-bottom: 90px;}
	.paddingTop90 {padding-top: 90px;}
	
	#teamPush {height: 100px;}
	.footerLogos img {width: 112px;}

}

@media (min-width: 1264px) {
	.container-xl, .container {max-width: 100%;}
	
	.angledIntro {padding: 160px 0px 100px 0px; top: -130px;}
}

@media (min-width: 1400px) {
	.container-xl, .container {max-width: 1320px;}
	.px-lg-2 {padding-right: 0.5rem!important; padding-left: 0.5rem!important;}
	form {width: 50%;}
	label {display: inline;}
	.footerLogos img {width:112px;}
}

@media (min-width: 1600px) {
	.container-xl, .container {max-width: 1520px;}
}

@media (min-width: 1800px) {
	.container-xl, .container {max-width: 1720px;}
	
}

@media (min-width: 1900px) {
	.container-xl, .container {max-width: 1820px;}
	.angledIntro {padding: 160px 0px 100px 0px; position: relative; top: 0px; margin-top: -150px; margin-bottom: 90px;}
	.headerCover, .headerImage {top: -50px;}

}