/* HOPE Toronto 2026 */

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
@import url("https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@7.1.0/css/all.min.css");

:root{
	--font-family:"Roboto", sans-serif;
	--font-size:1.1rem;
	--base-weight:400;
    --fs-body: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);

    --transition:all .7s cubic-bezier(.25,.8,.25,1);

    --primary-color:rgba(02,91,158,1.0);

      --fs-h1: clamp(2rem, 1.6rem + 2vw, 2.3rem);
  --fs-h2: clamp(1.5rem, 1.25rem + 1.2vw, 1.8rem);
  --fs-h3: clamp(1.25rem, 1.1rem + 0.8vw, 1.5rem);

}

html,
body{
	font-family: var(--font-family);
	font-size: var(--fs-body);	
	font-weight:400;
}

body{
	background: url(https://mycs-cdn.myconferencesuite.com/other/Project/2360/d7/5e/beach-volleyball-6483796_1920.jpg) no-repeat top center / cover;
    background-attachment: fixed;
}
h2 {
    font-size: 1.5rem;
    margin: 0.5rem 0;
    padding: 0.5rem 0;
    border-bottom: 1px solid rgba(02,91,158,0.2);
	color:var(--primary-color);
}
p{
	margin:15px;
	
}
.form-layout legend {
    font-size: 1rem;
    line-height: 1.7rem;
    padding: 0;
    font-weight: normal;
    color: inherit;
    padding-right: 1rem;
	margin: 8px 0px;
}
.form-layout label{
	color: inherit;
    font-size: 1rem;
    line-height: 1.7rem;
    font-weight: normal;
    display: block;
	margin: 8px 0px;
}

.col-span-6.flex.items-center label{
	margin: 0px 4px;
}


button[type="submit"]{
	float: right;
    display: block;
    clear: both;
    margin: 15px 0px;
	background: var(--primary-color);
    font-size: 1.1rem;
    line-height: normal;
    padding: 11px 17px;
    letter-spacing: 1px;

    transition: var(--transition) !important;
	box-shadow: 0px 0px 0px rgba(00, 00, 00, 0.0) !important;
	transform: scale(1) translateY(0px) !important;


}
button[type="submit"]:hover,
button[type="submit"]:focus{
	background: var(--primary-color);
    transform: scale(1) translateY(-2px) !important;
    box-shadow: 0px 4px 10px rgba(00, 00, 00, 0.1) !important;
}

/*2024-03-26: Hiding the Donate to Team tab on the public donation page at the request of Marcia -greg*/
ul#donationTab a#tab-2 {
	display:none;
}


/*********************************
	2026
*********************************/
.-mt-32 {
    margin: 1.5rem 0;
}
#lp-banner{
    padding:0px;
}
nav#lp-nav {
    display: none;
}
.tailwind-layout .lp-wrapper{
    box-shadow: 0px 3px 13px 2px rgb(00, 00, 00, 0.3);
    position: sticky;
    top: 0;
    padding: 0;
    height: auto;
    box-shadow: 0px 1px 4px 2px rgb(00,00,00,0.3);
    z-index: 9;
}
header #inner-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.3rem 2rem;
}
.max-w-7xl {
    max-width: 90%;
}
.lp-main-card.shadow {
    background: rgba(255, 255, 255, 0.75);
    backdrop-filter: blur(34px);
    border-radius: 25px;
    box-shadow: 0px 4px 15px rgba(00, 00, 00, 0.5);
}
.field{
	opacity: 0;
	transform: scale(1.05) translateY(-2px);
	transition: opacity 0.5s ease, transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.primary-button{
    transition: var(--transition) !important;
	box-shadow: 0px 0px 0px rgba(00, 00, 00, 0.0) !important;
	transform: scale(1) translateY(0px) !important;
    background:var(--primary-color);
}

.primary-button:hover{
    transition:var(--transition) !important;
	box-shadow: 0px 5px 18px rgba(00, 00, 00, 0.1) !important;
	transform: scale(1.05) translateY(-2px) !important;
}

h1 { font-size: var(--fs-h1); }
h2 { font-size: var(--fs-h2); }
h3 { font-size: var(--fs-h3); }

.site-title h1,
.site-title h2{
    color:#ffffff;
    border:none;
    line-height: normal;
}