/* CUSTOM STYLESHEET */

/* GENERAL */

body {
	background-color:#ffffff; color:#272d30;
	font-family: 'Montserrat', sans-serif; font-size:1.0em; font-weight:400;
}

h1, h2, h3, h4, h5, h6, p, ul, ol, label {
	font-family: 'Montserrat', sans-serif;
}

h1, .h1 {
	font-size:3em; font-weight: 600;
	line-height:1.3em;
}

h2, .h2 {
	font-size:2em; font-weight: 600;
	line-height:1.3em;
}

h3, .h3 {
	font-size:1.25em; font-weight:600;
	line-height:1.3em;
}

.boldred { color:#D9282F; }

.btn-primary, .btn-primary:visited {
	font-family: "Montserrat", sans-serif; font-size: 16px; font-weight: 600;
	background-color:#d9282f; border-radius:2px 2px 2px 2px !important; border:1px solid #d9282f; border-color:transparent; box-shadow:none;
	color:#ffffff; letter-spacing:0.3px;  padding:0.5rem 2rem 0.5rem 2rem; text-decoration: none; transition:all .3s;
}
.btn-primary:hover, .btn-primary:active { background-color: #f8c04a; border-color: #f8c04a; }

.btn-outline, .btn-outline:visited {
	font-family: "Montserrat", sans-serif; font-size: 16px; font-weight: 600;
	background-color:transparent; border-radius:2px 2px 2px 2px !important; border:1px solid #b8b8b8; box-shadow:none;
	color:#202020; letter-spacing:0.3px;  padding:0.5rem 2rem 0.5rem 2rem; text-decoration:none; transition:all .3s;
}
.btn-outline:hover, .btn-outline:active { border:1px solid #b8b8b8; color:#d9282f; }

.btn-transparent, .btn-transparent:visited { 
	color:#202020; font-weight:700; letter-spacing:0.3px; 
}
.btn-transparent:hover, .btn-transparent:active { color:#d9282f; }

.link-white { color:#ffffff; }

.container {
	margin:0 auto !important;
	max-width:1280px !important;
}

/* LOGO & NAV */

#header { padding:1rem 0; }

#knowtify-logo { max-width:190px; }

.dropdown-menu {
	padding:1rem;
}

/* HERO */

#hero {
	background:#000000 url("./Images/bkgSoftwareHero.jpg") center center no-repeat;
	background-size:cover; color:#ffffff; padding:10rem 0;
}

.hero-subheadline {
	font-size:2em; line-height:1.5em;
	margin-bottom:2rem;
}

#highlight {
	background-color:#000000; color:#ffffff;
	padding:2rem 0;
}

.headline { 
	font-size: 1.5em; font-weight: 600; line-height: 1.5em;
	margin-bottom:0; padding-right:2rem; padding-left:2rem;
}


/* SECTION 1 - DISCOVER */

#section-one {
	padding:4rem 0;
}

.px-8 { padding-right:8rem; padding-left:8rem; }

.icon-col {
	margin:1rem; padding:1rem;
}

.icon-description {
	font-size:1.15em; font-weight:500;
	margin-top:2rem;
}


/* SECTION 2 - ADVANTAGES */

#section-two {
	background-color:#ebebeb; color:#272d30;
	padding:4rem 0;
}

.advantage-box {
	max-width:360px; padding:1rem; margin:0 auto;
}
.headline-pillbox {
	background-color:#000000; color:#ffffff;
	border-radius:50px; font-size:1.5em; font-weight:700; padding:4px;
}
.advantage-box p {
	font-size:1.2em; font-weight:500;
	line-height:1.3em;
}

.icon-knowtify { max-width:180px; }


/* SECTION 3 -  REPORT */

#section-three {
	padding:4rem 0;
}

.list-check li.list-group-item { border-bottom:0; }

.bi-check-square { color:#d9282f; margin-right:6px; }


/* SECTION FOUR - PRICING */

#section-four {
	background-color:#272d30; color:#ffffff;
	padding:4rem 0;
}

#section-four h2 { line-height:1.5em; }

.text-bling {
	border-bottom:3px solid #f8c04a;
}

.box-white {
	background-color:#ffffff; border-radius:12px;
	color:#272d30; margin:10px; padding:3rem;
}

.bi-database-fill { margin-right:6px; }

.price { 
	color:#d9282f; 
	font-size:3em; font-weight:700;
}

/* SECTION FIVE - SLIDESHOW  */

#section-five {
	padding:4rem 0 2rem 0;
}

#slideshow {
	border-bottom:1px solid #ebebeb; padding-bottom:4rem;
}

.bd-placeholder-img {
	text-anchor: middle; 
	-webkit-user-select: none; -moz-user-select: none; user-select: none;
}

.carousel-item { margin-bottom:4rem; }
.carousel-caption { top:1%; }

.quote { 
	font-size:1.25em; font-weight:500;
	line-height:1.5em;
}

.nav-scroller {
	position: relative; z-index: 2; height: 2.75rem; overflow-y: hidden;
}

.nav-scroller .nav {
	display: flex; flex-wrap: nowrap; padding-bottom: 1rem; margin-top: -1px;
     overflow-x: auto; text-align: center; white-space: nowrap; 
	-webkit-overflow-scrolling: touch;
}


/* SECTION SIX - CONTACT FORM */

#section-six {
	padding:2rem 0 4rem 0;
}

#contactform {
	background-color:#ebebeb; color:#272d30;
	border-radius:12px; padding:2rem;
}

/* SECTION SEVEN - HOW MANAGED */

#section-seven {
	padding:4rem 0;
}

.category { font-weight:500; }

.bi-toggle-on { color:#d9282f; margin-right:6px; }


/*  FOOTER */

#footer {
	background-color:#54565B; color:#ffffff;
	padding:4rem 0;
}

.divider-bottom {
	border-bottom:1px dotted #ebebeb;
	margin-bottom:1rem; padding-bottom:1rem;
}

.footer-link {
	color:#ffffff; text-decoration:none;
	margin-right:1rem;
}
.footer-link:hover, .footer-link:active {
	color:#f8c04a;
}

.copyright { font-size:0.75em; }


/* STYLESHEET FROM PREV LANDING PAGE */

.dropdown { position: relative; z-index: 1000; }
.dropdown-toggle:focus { outline: 0; }

.dropdown-menu {
    position: absolute; top: 100%; left: 0; z-index: 1000; display: none;
    float: left; min-width: 160px; padding: 5px 0; margin: 2px 0 0; list-style: none;
    font-size: 16px; background-color: #fff; border: 1px solid #ebebeb; border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175); box-shadow: 0 6px 12px rgba(0,0,0,.175);
    background-clip: padding-box;
}

.dropdown-menu.pull-right { right: 0; left: auto;  }
.open>.dropdown-menu { display: block; }
.open>a { outline: 0; }
.dropdown-backdrop { position: fixed; left: 0; right: 0; bottom: 0; top: 0; z-index: 990; }
.pull-right>.dropdown-menu { right: 0; left: auto; }

.btn.btn-primary.dropdown-toggle.show {
	background-color:#f8c04a !important;
	border-color:#f8c04a !important;
}

.login-form {
	border: 0; padding: 12px; 
    -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
    -webkit-box-shadow: 2px 2px 5px 0 rgba(0,0,0,.12); box-shadow: 2px 2px 5px 0 rgba(0,0,0,.12);
}

.login-form:before {
	content: ''; display: inline-block; position: absolute; top: -7px; right: 16px;
	border-left: 8px solid transparent; border-right: 8px solid transparent;
	/*border-bottom: 7px solid #ccc; border-bottom-color: rgba(0,0,0,.2);*/	
}

.login-form:after {
	content: ''; display: inline-block; position: absolute; top: -6px; right: 18px;
	/*border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 6px solid #fff;*/
}

.login-form .loading {
    background: url('https://knowtify.net/Content/images/loading.gif'),rgba(0,0,0,.8);
    background-repeat: no-repeat; background-position: center center;
    -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
    width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1000;
}

.login-form ul {
	background-color: #f1f1f1; margin: 0 0 16px 0; padding:0; width: 220px;
	-webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px
}

.login-form li {
	border-bottom:2px solid #ffffff;
	list-style-type:none !important; margin:0 0 5px 0;
	position: relative; width: 100%;
}

.login-form li label { position: absolute; left: 5px; top: 12px; }
.login-form li label.remember { position: relative; font-weight: normal; padding: 10px 0; left: auto; top: auto; }
.login-form li i { position: absolute; right: 8px; top: 17px; color: #646464; }

.login-form input[type='text'],
.login-form input[type='password'] {
    background: transparent; border: 0; width: 190px; height: 50px; margin-bottom: 5px; padding-left: 5px;
    -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; 
}

.login-form input[type='text']:focus,.login-form input[type='password']:focus {
    outline: none; -webkit-box-shadow: none; box-shadow: none;
}

.login-form input[type='checkbox'] {
    margin: 0 5px 0 10px;
}

.login-form p a { color: #000000; text-decoration:underline; }
.login-form .alert { line-height: 20px; margin-bottom: 12px; }

.account-btn.btn-red, .account-btn.btn-red:visited {
	font-family: "Montserrat", sans-serif; font-size: 16px; font-weight: 600;
	background-color:#d9282f; border-radius:2px 2px 2px 2px !important; border:1px solid #d9282f; border-color:transparent; box-shadow:none;
	color:#ffffff; letter-spacing:0.3px;  padding:0.5rem 2rem 0.5rem 2rem; text-decoration: none; transition:all .3s;
}
.account-btn.btn-red:hover, .account-btn.btn-red:active { 
	background-color: #f8c04a; border-color: #f8c04a;
}

.dropdown.open .account-btn.btn-red {
	font-family: "Montserrat", sans-serif; font-size: 16px; font-weight: 600;
	background-color:#f8c04a; border-radius:2px 2px 2px 2px !important; border:1px solid #f8c04a; border-color:transparent; box-shadow:none;
	color:#ffffff; letter-spacing:0.3px;  padding:0.5rem 2rem 0.5rem 2rem; text-decoration: none; transition:all .3s;
}

.logout-btn.btn-red, .logout-btn.btn-red:visited {
	font-family: "Montserrat", sans-serif; font-size: 16px; font-weight: 600;
	background-color:#d9282f; border-radius:2px 2px 2px 2px !important; border:1px solid #d9282f; border-color:transparent; box-shadow:none;
	color:#ffffff; letter-spacing:0.3px;  padding:0.5rem 2rem 0.5rem 2rem; text-decoration: none; transition:all .3s;
}
.logout-btn.btn-red:hover, .logout-btn.btn-red:active { 
	background-color: #f8c04a; border-color: #f8c04a;
}

.account-dropdown ul {
	margin: 16px 0 16px 0; padding:0;
}
.account-dropdown li {
	border-bottom:2px solid #ffffff;
	list-style-type:none !important; margin:0 0 5px 0;
	position: relative; width: 100%;
}

.account-dropdown ul li a, 
.account-dropdown ul li span {
    display: block; width: 100%; padding: 5px 15px; color: #6d6e71; font-size: 16px; background-color: #fff; text-decoration:none;
	-webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease;
}

.account-dropdown ul li a:hover,.account-dropdown ul li span:hover {
    -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease; 
	background-color: #6d6e71; color: #fff;
}

.account-dropdown ul li a i, .account-dropdown ul li span i {
    float: right;
}

.account-dropdown span {
    padding: 15px; display: block;
}

.account-dropdown span a {
    display: block;
}

.account-dropdown:before {
    content: '';
    display: inline-block;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #ccc;
    border-bottom-color: rgba(0,0,0,.2);
    position: absolute;
    top: -7px;
    right: 16px
}

.account-dropdown:after {
    content: '';
    display: inline-block;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #fff;
    position: absolute;
    top: -6px;
    right: 17px
}

/* RESPONSIVE */

@media (max-width: 1023px) {
	
	#header .col { flex:none; text-align:center;  }
	#header .text-end { text-align:center !important; }
	
	#knowtify-logo { margin-bottom:12px; }
	
	#hero h1 { font-size:2.5em; }
	.hero-subheadline { font-size:1.5em; }
	
	.icon-col { margin:0.5rem; padding:0.5rem; }
	
	.carousel-item { margin-bottom:8rem; }
	
	h2.px-8 { padding-right:0; padding-left:0; }
	
	#section-six { padding-right:1rem; padding-left:1rem; }
	
	#footer .col { flex:none; }
	#footer .text-end { text-align:center !important; }
	#footer a { display:block; margin:6px auto; text-align:center !important; }
	
}

@media (max-width: 768px) {
	
	h1 { font-size:2.25em; }
	h2 { font-size:1.75em; }
	
	.px-8 { padding-right:0; padding-left:0; }
	
	.col { flex:none; }
	.icon-col { margin:0.5rem auto; }
	
	.hide-mobile { display:none !important; }
	
	#header a.btn {
		display:block; margin:12px auto 6px auto;
	}
	#header .text-end { text-align:center !important; }
	
	#hero { padding:6rem 1rem; }
	
	.hero-subheadline { font-size:1.25em; }
	.headline { font-size:1.5em; }
	
	.box-white { margin:10px auto; max-width:90%; }
	
	.carousel-item { margin-bottom:13rem; }
	.quote { font-size:1.0em; }
	
	#section-six { padding-right:1rem; padding-left:1rem; }
	
	#footer .text-end { text-align:center !important; }
	#footer a { display:block; margin:6px auto; text-align:center !important; }
}