@import url("https://use.typekit.net/zkf1qbv.css");

:root {
	--primary-color: #FDDC32;
}

.hidden {
	display: none;
}

.wrap {
	margin-top: -56px;
}

.navbar.sticky-top {
	position: fixed;
	position: sticky;
    top: 0;
    left: 0;
    z-index: 100;
}

.navbar-brand {
	background-image: url('../img/logo.zebraweb-2.png');
}

.navbar.scrolled,
.single-post .navbar {
	background: #000;
}

.item-login a {
	border: 1px solid var(--primary-color);
	padding-left: 15px !important;
	padding-right: 15px !important;
}

.item-login a:hover {
	background: var(--primary-color);
	color: #000 !important;
}

.dropdown-menu {
	border-radius: 0;
	box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.3);
}

.dropdown-menu a.dropdown-item {
	font-weight: 700 !important;
	font-size: .75em !important;
	padding-top: 8px !important;
	padding-bottom: 8px !important;

}

.dropdown-item.active {
	background: var(--primary-color);
}

.dropdown-item:hover,
.dropdown-item:focus {
	background: rgba(253, 220, 50, 0.3);
}

.homepage-ribbon--hero {
	background-image: url('../img/graphic.coach_-scaled.jpg');
	background-size: cover;
}

.homepage-ribbon--hero h2:before,
.homepage-ribbon--hero h3:before {
	content: none;
}

.homepage-ribbon--hero .btn-outline-container {
	margin-top: 80px !important;
}

.hero--overlay {
	border: none;
	background: transparent;
	padding: 25px;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
}

.main-header {
	font-family: franklin-gothic-urw-comp, sans-serif;
	margin-bottom: 0;
	padding-bottom: 0;
	font-size: 5vw;
	margin-bottom: 0 !important;

}

.main-header--sub {
	font-size: 2vw;
	margin-bottom: 0 !important;
	font-family: montserrat, sans-serif;
	font-weight: 700;

}

#menu-primary-navigation .menu-item {
	border-left: none;
	text-transform: capitalize;

}

.dropdown-menu .menu-item {
	color: #000 !important;
	font-weight: 500 !important;
	padding: 5px 12px !important;
	font-size: 14px !important;
}

.block {
	display: block !important;
}

a.light {
	color: var(--primary-color);
}

.h1,
.h2,
.h3,
.h4,
.h5,
h1,
h2,
h3,
h4,
h5,
h6 {
	color: #000;
	font-family: franklin-gothic-urw-comp, sans-serif;
	position: relative;
	display: inline-block;
}

h2,
h3,
h4 {
	margin-bottom: 50px !important;
	font-family: montserrat, sans-serif;
	font-weight: 700;
}

h2:before,
h3:before,
h4:before {
	content: '';
	position: absolute;
	left: -50px;
	right: -50px;
	bottom: -20px;
	height: 2px;
	background: var(--primary-color);
}

h5 {
	color: #000;
	text-transform: uppercase;
}

.visually-hidden {
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
	clip: rect(1px 1px 1px 1px);
	/* IE6, IE7 */
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
	/* added line */
}

.no-underline:before {
	content: none;
}

.text-dark {
	color: #000 !important;
}

p,
ul,
li {
	font-family: montserrat, sans-serif;
}


.bg-color-dark {
	background: #000;
}

.bg-color-white {
	background: #F2F2F2;
}

/*************
*
* Buttons
*
*************/

.btn {
	border-radius: 0 !important;
}


.btn-primary {
	background-color: var(--primary-color);
	border-color: var(--primary-color);
}

.btn-outline-light {
	border: var(--primary-color) 1px solid;
	color: #fff;

}

.btn-outline-container {
	position: relative;
}

.btn-outline-container:before {
	content: '';
	width: calc(50% - 120px);
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	height: 1px;
	position: absolute;
}

.btn-outline-container:after {
	content: '';
	width: calc(50% - 120px);
	top: 50%;
	transform: translateY(-50%);
	left: initial;
	right: 0;
	height: 1px;
	position: absolute;
}


.btn-outline-container--light:before,
.btn-outline-container--light:after {
	background: var(--primary-color);
}

.btn-outline-primary {
	border: 1px solid #000;
	color: #000;
}

.btn-outline-primary:hover {
	border: 1px solid #000;
	background: #000;
	color: var(--primary-color);
}


.btn-outline-container--primary:before,
.btn-outline-container--primary:after {
	background: #000;
}

.footer {
	background: #000;
}

.footer-brand {
	background-image: url('../img/logo.zebraweb-2.png');
	background-size: 200px auto;

}

.branding {
	background: url('../img/logo.zebraweb-2.png') no-repeat center center;
	background-size: contain;
	width: 100%;
	height: 60px;
	display: inline-block;
	overflow: hidden;
	text-indent: -1000px;

}


.login-page {

	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	background: #fff url('../img/graphic.coach_-scaled.jpg') no-repeat top center;
	background-size: cover;
	z-index: 100;
}


/******************************************************************** 
** Mautic Forms
********************************************************************/
    
    .mauticform_wrapper{ 
        max-width: 100% !important;		
    }
    
    mauticform_wrapper_zebrawebleadform{
     text-align: left; 
    }
    
    .mauticform-button-wrapper .mauticform-button.btn-default, .mauticform-pagebreak-wrapper .mauticform-pagebreak.btn-default{
        margin-top: 1em;
        background-color: transparent !important;
        color: #fff !important;
        font-size: 16px !important;
        border-radius: 0 !important;
        border: 1px solid #FFDE31;
        padding: 8px 20px !important;
        font-family: canada-type-gibson, sans-serif !important;
        font-weight: 700 !important;
        color: #fff!important;
        width: 100%;
        }
    
    
        .mauticform-button-wrapper .mauticform-button.btn-default:hover, .mauticform-pagebreak-wrapper .mauticform-pagebreak.btn-default:hover, 
        .mauticform-button-wrapper .mauticform-button.btn-default:focus, .mauticform-pagebreak-wrapper .mauticform-pagebreak.btn-default:focus{
            background-color: #FFDE31 !important;
            font-size: 16px !important;
            border-radius: 0 !important;
            border: 1px solid #FFDE31;
            padding: 8px 20px !important;
            font-family: canada-type-gibson, sans-serif !important;
            font-weight: 700 !important;
            color: #000!important;
            width: 100%;
        }
    
    .mauticform-label {
        font-size: 19px;
        color: #fff;
    }
    
    .mauticform-helpmessage{
    font-size: 9px;
    font-weight: 400;
    font-style: normal;
    line-height: 9px;
    color: #fff;
    margin-bottom: 1em !important;
    }
    
    .mauticform-selectbox, .mauticform-input{
        height: 39px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        padding: 7px !important;
        font-size: 13px;
        font-weight: 400;
        font-style: normal;
        line-height: 13px;
        color: #455560;
        font-family: 'Source Sans Pro', global_font_string;
    }
    
    .mauticform-selectbox, .mauticform-input, .mauticform-textarea{
        font-family: 'Source Sans Pro', global_font_string;
            border-radius: 0px !important; 
            border-color: #000 !important;
            padding: 7px !important;
    }
    
    .mauticform-textarea{
      height: 90px;
    }
    .mauticform-message:empty{
    display: none;
    }
    
    .mauticform-message{
        padding: 1em;
        border: 1px solid #006b00;
        border-radius: 8px;
        background: #fbfffb;
    }
    
    #mauticform_santolubescorpmarketingpageleadgen_submit{
        text-align: center;
    }
    
    #mauticform_santolubescorpmarketingpageleadgen_product_of_interest{
      display: none;
    }
    
    .product-description-container {
      background: #fff;
      min-height: 250px;
    }
    
    h2.dark-underline:before, h3.dark-underline:before, h4.dark-underline:before{
        background: #000;
    }

    #menu-primary-navigation .menu-item{
		padding: 0 12px;
	  }

    .menu-item--book-a-demo{
      border: 1px solid #3290fd !important;
    }

    .menu-item--book-a-demo:hover, .menu-item--book-a-demo:focus{
      background: #3290fd;
      color: #fff;
    }

   @media screen and (max-width: 1200px) {
			#menu-primary-navigation .menu-item {
				padding: 0 3px;
				font-size: 11px;
			}
		 
		 .item-login a {
			 border: 1px solid var(--primary-color);
			 padding-left: 15px !important;
			 padding-right: 15px !important;
		}

		#menu-primary-navigation .menu-item {
			padding: 0 3px !important;
			font-size: 10px !important;
		}
  }


@media (max-width: 850px) {
    #primary_navbar{
        display: none !important;
    }


    .navbar-expand-md .navbar-toggler{
        display: inline-block !important;
    }
	


}


@media (max-width: 800px) {
	.homepage-ribbon--hero {
		background-position: 80% center;
		background-size: auto 100%;
        min-height: 115vh;
	}

	.main-header {
		font-size: 8vw;
	}

	.main-header--sub {
        font-size: 4vw;
		margin-bottom: 0 !important;
		font-family: montserrat, sans-serif;
		font-weight: 700;
	}
	

	
	
}

@media (max-width: 850px) and (orientation: landscape)  {
	.homepage-ribbon--hero {
		background-position: 80% center;
		background-size: auto 100%;
        min-height: 115vh;
	}

	.main-header {
		font-size: 30px;
	}

	.main-header--sub {
		font-size: 18px;
		margin-bottom: 0 !important;
		font-family: montserrat, sans-serif;
		font-weight: 700;
	}
}


