html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address,big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul,li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed,figure, figcaption,footer, header, hgroup,menu, nav, output, ruby, section, summary,time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;}article, aside, details, figcaption, figure,footer,header, hgroup, menu, nav, section {display: block;}body {line-height: 1;}ol, ul{list-style: none;}blockquote, q {quotes: none;}blockquote:before, blockquote:after,q:before, q:after {content: "";content: none;}table {border-collapse: collapse;border-spacing: 0;}

@font-face {
  font-family: Montserrat-Regular;
  src: url("../fonts/Montserrat-Regular.ttf");
}

@font-face {
  font-family: Montserrat-Medium;
  src: url("../fonts/Montserrat-Medium.ttf");
}

@font-face {
  font-family: Montserrat-SemiBold;
  src: url("../fonts/Montserrat-SemiBold.ttf");
}


@font-face {
  font-family: Montserrat-Bold;
  src: url("../fonts/Montserrat-Bold.ttf");
}

@font-face {
  font-family: Montserrat-Black;
  src: url("../fonts/Montserrat-Black.ttf");
}

.white-background{
	background-color: #fff;
}

.hidden{
	display: inline-block;
	width: 0;
	opacity: 0;
}

.hide{
	display: inline-block;
	animation: buttonHide .4s forwards;
}

.show{
	margin-left: .5em;
	animation: buttonReveal .4s forwards;
}

@keyframes buttonHide{
	0%{ opacity: 100%; width: auto; margin-left: .5em;}
	40%{opacity: 0%;}
	100%{ width: 0; margin-left: 0; opacity: 0%;}

}
@keyframes buttonReveal{
	from{ opacity: 0%; width: 0; margin-left: 0;}
	to{opacity: 100%; width: auto; margin-left: .5em;}

}

body{
	font-family: Montserrat-Regular;
	background-color: #efefef;
	font-size: 1.2rem;

}

p{
	margin: .5em 0;
	line-height: 1.2em;
}

.p-m-small{
	margin: .25em 0 .75em 0;
}

.p-full{
	width: 100%;
	text-align: center;
}

.list-item{
	line-height: 1.2em;
	list-style: disc;
	list-style-position: outside;
	margin-left: 1.2em;
}

.link{
    text-decoration: none;
    color: #fff;
}

/*TITLE*/

h1{
  	font-family: Montserrat-Bold;
	font-style: normal;
	font-size: 2rem;
	line-height: 1.25em;
	color: #3A3B60;
}

h2{
 	font-family: Montserrat-Bold;
	font-style: normal;
	font-size: 2rem;
	line-height: 1.25em;
	color: #3A3B60;
}

h3{
	margin-top: .5em;
	font-size: 1.5rem;
	line-height: 1.25em;
  	font-family: Montserrat-Bold;;
}

.title-full{
	width: 100%;
	text-align: center;
}

.title-white{
	color: #fff;
}

.subpage-h2{
	color: #000;
}

/*NAV*/

#navbar-wrapper{
	background-color: #fff;
}

#navbar{
	padding: 1em 0;
	margin: 0 auto;
	max-width: 1200px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	box-sizing: border-box;
}

#logo{
	display: flex;
	justify-content: center;
	align-items: center;
}

#logo img{
	width: 150px;
	display: block;
}

#btn-menu{ 
	display: none;
    width: 2.6em;
	cursor: pointer;
}

.bar1,
.bar2,
.bar3 {
    border-radius: 2px;
    width: 2em;
    height: 4px;
    background-color: #3A3B60;
    margin: 8px auto;
    transition: 0.3s;
}

#nav{
	display: flex;
	align-items: center;
}

.btn-dropdown{
    font-size: 1.1rem;
    border: none;
    outline: none;
    background-color: transparent;
    color: #333;
  	font-family: Montserrat-SemiBold;
    padding: 1em;
    margin: 0;
}

.menu-item{
    font-size: 1.1rem;
	line-height: normal;
    color: #333;
    padding: 1em;
	box-sizing: border-box;
	text-decoration: none;
  	font-family: Montserrat-SemiBold;
}
 
.dropdown{
    overflow: hidden;
}

.dropdown-content {
    display: none;
    position: absolute;
    min-width: 160px;
	background-color: #3A3B60;
    z-index: 999;
	box-shadow: 1px 1px 4px 1px rgba(0,0,0,.2);
}

.dropdown-content a{
    padding: 1em;
    z-index: 999;		
}

.menu-item:hover{
	transition: .5s all;
  	background-color: #9c7db9;
	color: #fff;
    cursor: pointer;
}

.btn-dropdown:hover{
	transition: .5s all;
    background-color: #9c7db9;
	color: #fff;
    cursor: pointer;
}

.dropdown-content .menu-item{
	color: #fff;
}

.minus-x .bar1 {
    animation: minus-x-1 .6s forwards;
}
.minus-x-rev .bar1{
    animation: minus-x-1-rev .4s forwards;
}
@keyframes minus-x-1{
    50%{   transform: translateY(12px);}
    100%{transform: rotate(-45deg) translate(-9px, 8px); background-color: firebrick;}
}
@keyframes minus-x-1-rev{
    0%{transform: rotate(-45deg) translate(-9px, 8px); background-color: firebrick;}
    100%{transform: rotate(0deg) translate(0,0);}
}
.minus-x .bar2 {
    opacity: 0;
}
.minus-x .bar3 {
    animation: minus-x-3 .6s forwards;
}
.minus-x-rev .bar3{
    animation: minus-x-3-rev .4s forwards;
}
@keyframes minus-x-3{
    50%{   transform: translateY(-12px);}
    100%{ transform: rotate(45deg) translate(-8px, -8px); background-color: firebrick;}
}
@keyframes minus-x-3-rev{
    0%{transform: rotate(45deg) translate(-8px, -8px); background-color: firebrick;}
    100%{transform: rotate(0deg) translate(0,0);}
}

/*CONTACT BAR*/

#contact-bar{
	padding: 1em 0;
    width: 100%;
	background-color: #3A3B60;
	display: flex;
	justify-content: flex-start;
	align-items: center;
}

#phone-wrapper{
	padding: 0 1em;
    margin: 0 auto;
    width: 1200px;
    display: flex;
    justify-content: space-between;
	align-items: center;
    box-sizing: border-box;
	background-color: #3A3B60;
	color: #fff;
}

.phone{
  	font-family: Montserrat-SemiBold;
	font-size: 1rem;
	display: flex;
	align-items: center;
}

.phone img{
	margin-right: .5em;
	height: 20px;
	display: inline-block;
}

#phone-wrapper a{
	color: #333;
 	font-family: Montserrat-SemiBold;
}
.button-big{
	padding: .75em 1.25em;
	font-size: 1rem;
	text-decoration: none;
	background-color: #fff;
	transition: all .5s;
	border-radius: 5px;
}

/*BUTTONS*/

.button-blue{
	padding: .5em 1.25em;
	background-color: #9c7db9;
	color: #fff;
	font-size: 1rem;
	text-decoration: none;
	cursor: pointer;
	transition: padding .2s;
	display: inline-block;
	border-radius: 5px;
}

.button-blue:hover{
	transition: all .3s ease-in-out;
	transform: scale(1.05);
	box-shadow: 0px 0px 6px 1px rgba(0,0,0,.2);
	background-color: #3A3B60;
}

/*HEADERS*/

#header-index{
	background-image: url('../img/header.png');
	background-position: top;
	background-size: cover;
	height: calc(100vh - 180.11px);
	/*min-height: 400px;*/
	width: 100%;
	display: flex;
	align-items: center;
}

#header-index-text{
	text-align: center;
	margin: 0 auto;
	max-width: 800px;
	color: #fff;
	font-weight: 500;
}

#header-index-text h1{
	color: #fff;
	font-size: 2.5rem;
	font-weight: 1000;
	opacity: 0;
}

.header-buttons{
	display: flex;
	justify-content: center;
	gap: 1em;
	opacity: 0;
}

.header-buttons .button-blue{
	padding: 1em 1.25em;
}

.p-header{
	margin: 1em 0;
	font-size: 1.25rem;
	line-height: 1.3em;
	opacity: 0;
}

.subpage-header{
	background-color: #9c7db9;
}

#header-services{
	padding: 2em;
	text-align: center;
	background-color: #9c7db9;
}

#header-resources{
	padding: 2em;
	background-color: #9c7db9;
}

#header-resources-inner{
	margin: 0 auto;
	width: 1200px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.header-services-images-wrapper{
	margin: 2em auto;
	display: flex;
	justify-content: center;
	align-items: center;
}

.header-resources-image-wrapper{
	
}

.header-resources-title{
	padding: 0 2em;
}

.header-img{
	padding: 0 2em;
	height: 100px;
	text-align: center;
}

.arrow{
	height: 30px;
}

.header-img-text{
	padding-top: 1em;
	color: #fff;
}

/*INDEX*/

#section-index{
	padding: 4em 1em;
	min-height: 26vh;
	min-height: 200px;
	display: flex;
	justify-content: center;
	align-items: center;
	opacity: 0;
}

#resources{
	background-image: url('../img/resources.png');
	background-size: cover;
	background-position: center;
	display: flex;
	flex-wrap: wrap;
}

.section-overlay{
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
	background-color: rgba(0, 0, 0, .3);
	-webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

/*FAQ*/

.faq{
	margin: 0 auto 1em auto;
	width: 1200px;
	background-color: #fff;	
}

.faq-question{
	padding: 1em;
	display: flex;
	justify-content: space-between;
	transition: background-color .5s;
	cursor: pointer;
	background-color: #9c7db9;
	box-sizing: border-box;
}

.faq-question:hover{
	background-color: #3A3B60;
	color: #fff;
}

.faq-question:hover h2{

}

.faq-question h2{
	margin-bottom: 0;
	font-size: 1.25rem;
	line-height: 1.15em;
	font-family: montserrat-Medium;
	color: #fff;
}

.down-arrow{
	text-align: center;
	transition: transform .3s;
	transform: rotate(90deg);
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 1.5rem;
	color: #fff;
}

.faq-answer{
	overflow: hidden;
	max-height: 0;
	transition: max-height .5s;
}

.faq-answer-inner{
	padding: 1em;
}

.active-question{
	background-color: #3A3B60;
	color: #fff;
}

.active-question h2{
	color: #fff;
}

.active{
	max-height: 800px;
	
}

.active-arrow{
	transform: rotate(270deg);
}

/*FORMS*/

#pointofcare-form-wrapper{
	padding: 4em 2em 5em 2em;
	margin: 0 auto;
	width: 1200px;
}

#demo-form-wrapper{
	margin: 0 auto;
	width: 1200px;
}

#pointofcare-form-text, #demo-form-text{
	text-align: center;
}

#demo-form-text{
	color: #fff;
}

#pointofcare-form, #demo-form{
	padding: 2em;
	border-radius: 5px;
	box-shadow: 1px 1px 4px 1px rgba(0,0,0,.2);
 	background-color: #fff;
}

#ordering-form-wrapper{
	margin: 0 auto;
	width: 1200px;
}

#ordering-form-text{
	text-align: center;
	color: #fff;
}

#ordering-form{
	padding: 2em;
	border-radius: 5px;
	box-shadow: 1px 1px 4px 1px rgba(0,0,0,.2);
 	background-color: #fff;
	overflow: hidden;
}

input[type=text]:focus ,input[type=tel]:focus{
	outline: 0;
	border-bottom: 2px solid #3A3B60;
	transition: border .2s;
}

input[type=checkbox]{
    margin-top: 1em;
	cursor: pointer;
}

.input-text{
	padding: .25em;
	margin-bottom: 1.5em;
	width: 100%;
	font-size: 1.2rem;
	font-family: Montserrat-Regular;
	border: 0;
	border-bottom: 2px solid #9B7DB9;
	background-color: transparent;
	box-sizing: border-box;
}

.input-text:focus{
	outline: 0;
}

#preference-wrapper{
	margin-bottom: 1.5em;
}
 
.message{
	padding: .25em;
    margin-bottom: 1.5em;
	width: 100%;
	border: 0;
	height: 100px;
	resize: none;
	font-size: 1.2rem;
	font-family: Montserrat-Regular;
	box-sizing: border-box;
	background-color: #efefef;
	box-shadow: 1px 1px 4px 1px rgba(0,0,0,.2) inset;
}

.message:focus{
	outline: 0;
	border: 0;
}

.select-medication{
	position: relative;
	font-family: Montserrat-Regular;
}

.select{
	font-size: 1rem;
	font-family: Montserrat-Regular;
	margin-bottom: 1.5em;
	width: 100%;
	border: 0;
	border-bottom: 1px solid #9c7db9;
	background-color: transparent;
}

.select-created{
	width: 96%;
	font-size: 1rem;
	font-family: Montserrat-Regular;
	margin-bottom: 1.5em;
	border: 0;
	border-bottom: 1px solid #9c7db9;
	background-color: transparent;
}

.add-field{
	padding: .5em 1.25em;
	margin-bottom: 1.75em;
	font-family: Montserrat-Regular;
	font-size: 1rem;
	color: #fff;
	background-color: #9c7db9;
	border: 0;
	border-radius: 5px;
	cursor: pointer;
	transform-origin: left center;
}

.add-field:hover{
	transition: transform .3s ease-in-out;
	transform: scale(1.05);
}

.remove-field{
	position: absolute;
	right: 1em;
	top: 1em;
	text-align: center;
	font-weight: 800;
	cursor: pointer;
}

.placeholder{
	color: #666;
}

.input-submit{
	margin: 1.5em 0 0 0;
	padding: .5em 1.25em;
	font-family: Montserrat-Regular;
	color: #fff;
	background-color: #9c7db9;
	border: 0;
	cursor: pointer;
	transform-origin: left center;
	font-size: 1.2rem;
	border-radius: 5px;
}

.input-submit:hover{
	transition: all .3s ease-in-out;
	transform: scale(1.05);
	background-color: #3A3B60;
}

#contact-form{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	position: relative;
}

.g-recaptcha{
    width: 100%;
}

.input-text-half{
	width: 46%;
	padding: 0;
	font-size: 1.2rem;
	font-family: Montserrat-Regular;
	margin-bottom: 1.5em;
	border: 0;
	border-bottom: 2px solid #9B7DB9;
	background-color: transparent;
	box-sizing: border-box;
	position: relative;
}



.input-medications-wrapper-inner{
    position: relative;
    padding: 1em 1em 0 1em;
    margin-bottom: 1.5em;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    background-color: #efefef;
}

.input-medications-wrapper-inner .input-text{
    width: calc(50% - 1em);
    
}

.input-medications-wrapper-inner label{
    width: 100%;
    margin-bottom: 1em;
    
}

/*SECTIONS*/

.blue-section-wrapper{
	padding: 4em 1em;
	background-color: #9c7db9;
}

.section-centered-wrapper{
	padding: 4em 1em;
}

.section-centered{
	padding: 2em;
	margin: 0 auto;
	width: 800px;
	text-align: center;
	position: relative;
	box-sizing: border-box;
}

.left-bracket, .right-bracket{
	position: absolute;
	top: 0;
	height: 100%;
}

.left-bracket{
	left: 0;
}

.right-bracket{
	right: 0;
}

.left-bracket img, .right-bracket img{
	height: 100%;
}

.section-centered-left-align-wrapper{
	padding: 3em 1em;
}

.section-centered-left-align{
	margin: 0 auto;
	width: 1200px;
	text-align: left;
}

#whoweserve{
	margin: 0 auto;
	text-align: center;
	max-width: 1200px;
}

#gallery-whoweserve{
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	flex-wrap: wrap;
	overflow: hidden;
}

#gallery-staff{
	display: flex;
	justify-content: flex-start;
	align-items: stretch;
	flex-wrap: wrap;
	overflow: hidden;
}

#packaging{
	margin: 0 auto;
	text-align: center;
	max-width: 1200px;
}

#contact-section{
	margin: 0 auto;
	padding: 3em 2em;
	max-width: 1200px;
	display: flex;
	flex-wrap: wrap;
}

#contact-left{
	padding: 2em;
	width: 30%;
	box-sizing: border-box;
	background-color: #9c7db9;
	color: #fff;
	box-shadow: 1px 1px 4px 1px rgba(0,0,0,.2);
    text-align: center;
	border-radius: 5px 0 0 5px;
}
.contact-img{
    width: 80%;
    margin-bottom: .5em;
	border-radius: 10px;
}

#contact-right{
	padding: 2em;
	width: 70%;
	box-sizing: border-box;
	background-color: #fff;
	box-shadow: 1px 1px 4px 1px rgba(0,0,0,.2);
	border-radius: 0 5px 5px 0;
}

#gallery-packaging{
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
}

.section-half{
	margin: 0 auto;
	width: 1200px;
	display: flex;
	min-height: 40vh;
	align-items: center;
}

.text-half-wrapper{
	width: 50%;
	padding: 4em 2em 4em 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

.img-half{
	margin: 2em 0;
	width: 50%;
	height: 600px;
	overflow: hidden;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

#img-half-pointofcare{
	background-image: url("../img/services/pointofcare/repack_lifestyle_1.jpg");
}

#img-half-contract{
	background-image: url("../img/services/contract/blister_lifestyle.jpg");
	background-position: center;
}

#img-half-government{
	background-image: url("../img/services/government/government.jpg");
	background-position: center;
}

#img-half-antibiotics{
	background-image: url("../img/services/antibiotic/tablets_bottle_lifestyle.jpg");
	background-position: center;
}

#img-half-ordering{
	background-image: url("../img/resources/ordering/baggies_lifestyle_1.jpg");
}

#img-half-about{
	background-image: url("../img/about/groupshot.jpg");
}

#img-half-software{
	background-image: url("../img/resources/dispensingsoftware/doctoronpc.jpg");
}

#img-half-packaging{
	background-image: url("../img/packaging/groupshot_flatlay.jpg");
}

#img-half-FAQ{
	background-image: url("../img/resources/FAQ/background.jpg");
}

#pointofcare-nextsteps{
	padding: 4em 2em;
	min-height: 30vh;
	background-color: #8C6FB5;
	background-image: url('../img/services/pointofcare/dispensing.png');
	background-position: bottom;
	display: flex;
	align-items: center;
}

#pointofcare-nextsteps-inner{
	margin: 0 auto;
	width: 1200px;
	display: flex;
	justify-content: space-between;
	font-family: Montserrat-Medium;
}
	

.next-step-wrapper{
	padding: 2em .5em;
	width: calc((100%/3) - 1.5em);
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	color: #333;
	box-sizing: border-box;
	border-radius: 5px;
	background-color: #fff;
}

.next-step-wrapper:hover{
	transition: transform .3s;
	transform: scale(1.03);
	transform-origin: center center;
}

.next-step{
	display: flex;
	align-items: center;
}

.next-step img{
	height: 80px;
}

.next-step-text{
	margin-left: 1em;
}
	
#contract-packaging-tabs-wrapper{
	background-color: #3A3B60;
}

#contract-packaging-tabs{
	margin: 0 auto;
	max-width: 1200px;
	display: flex;
	justify-content: space-between;
}

.contract-packaging-tab{
	padding: 0 0 2em 0;
	width:  calc(100%/3);
	text-align: center;
	cursor: pointer;
	background-color: #3A3B60;
	color: #fff;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

.tab-title{
	padding: .75em;
	background-color: #fff;
	border-radius: 7px;
	color: #3A3B60;
}

.tab-title:hover{
	transition: transform .3s;
	transform: scale(1.08);
	transform-origin: center;
}

.tab-img{
	padding: 2em;
	box-sizing: border-box;
	width: 80%;
}

.tab-text{
	animation: fade 1s forwards;
	margin: 0 auto;
	max-width: 1200px;
	text-align: center;
	padding: 0 1em;
	color: #fff;
}

.tab-active{
	transition: all 1s;
	background-color: #9c7db9;
}

.tab-active .tab-title{
	background-color: transparent;
	color: #fff;
} 


#section-features{
	padding: 4em 1em;
	background-color: #9c7db9;
	color: #fff;
}

.features-inner{
	margin: 0 auto;
	max-width: 1200px;
}

.feature-row{
	margin: 2em auto 0 auto;
	max-width: 1200px;
	display: flex;
	justify-content: space-between;
}

.feature{
	width: calc(50% - 1em);
	display: flex;
	align-items: center;
	line-height: 1.2em;
}

.feature-right{
	width: 80%;
}

.feature-left{
	width: 10%;
	margin-right: 2em;
	display: flex;
	justify-content: center;
}

.feature-left img{	
 	width: 100%;
}

#section-reporting{
	padding: 4em 1em;
}

.report-row{
	max-width: 1200px;
	margin: 2em auto 0 auto;
	display: flex;
	justify-content: space-between;
}

.report{
	padding: 2em 1em;
	width: calc(50% - 1em);
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
	line-height: 1.2em;
	background-color: #fff;
	box-sizing: border-box;
	box-shadow: 1px 1px 4px 1px rgb(0 0 0 / 20%);
}

.report-left{
	width: 100%;
	display: flex;
	justify-content: center;
}

.report-left img{	
 	height: 90px;
}

.report-right{
	margin-top: 1em;
	width: 100%;
	text-align: center;
}

/*ITEMS*/

.gallery-item-packaging{
	margin-top: 2em;
	width: calc((100%/3) - 2em);
	border-radius: 5px;
	background-color:#3A3B60;
	box-shadow: 2px 2px 4px 1px rgba(0,0,0,.2);
	box-sizing: border-box;
}

.gallery-item{
	margin-top: 1em;
	padding: 2em;
	width: calc((100%/4) - 1em);
	background-color:#3A3B60;
	border-radius: 5px;
	box-shadow: 2px 2px 4px 1px rgba(0,0,0,.2);
	box-sizing: border-box;
}


.galleryLeft{
	margin-left: -1200px;
}

 .galleryCenter{
	margin-bottom: -1200px;
}

.galleryRight{
	margin-right: -1200px;
}

.gallery-item-staff{
	margin: 1em;
	width: calc((100%/3) - 2em);
	background-color:#3A3B60;
	border-radius: 5px;
	box-shadow: 2px 2px 4px 1px rgba(0,0,0,.2);
	display: flex;
	flex-wrap: wrap;
}

.gallery-item-gov{
	margin-top: 2em;
	width: calc((100%/3) - 2em);
	background-color:#3A3B60;
	border-radius: 5px;
	box-shadow: 2px 2px 4px 1px rgba(0,0,0,.2);
}


.gallery-img{
	padding: 1.2em 1em 0 1em;
	width: 100%;
	box-sizing: border-box;
}



.gallery-img-nopad{
	width: 100%;
	box-sizing: border-box;
}

.gallery-img-small{
	height: 80px;
}

.gallery-img-full{ 
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 5px 5px 0 0;
} 

.gallery-text{
	width: 100%;
	padding: 1em;
	border-radius: 0 0 5px 5px;
	position: relative;
	align-self: stretch;
	box-sizing: border-box;
	color: #fff;
}

.gallery-staff{
	padding: .5em;
	background-color: #fff;
	border-radius: 0 0 5px 5px;
	position: relative;
}

.gallery-img-staff{
	width: 100%;
}


.gallery-text-blue{
	padding: .5em;
	background-color:#8C6FB5;
	color: #fff;
	border-radius: 0 0 5px 5px;
}

.p-centered{
	margin-bottom: 1em;
	line-height: 1.5em;
}

.two-columns{
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	overflow: hidden;
	box-sizing: border-box;
}

 .two-columns .column-wrapper{
	padding: 3em 2em;
	margin-top: 1em;
	width: calc((100%/2) - .5em);
	display: flex;
	align-content: center;
	background-color: #fff;
	box-sizing: border-box;
	border-radius: 5px;
	box-shadow:  1px 1px 4px 1px rgba(0,0,0,.2);
}

.columnLeftServices{
	margin-left: -1000px;
}

.columnRightServices{
	margin-right: -1000px;
}

.two-columns .column-wrapper-transparent{
	color: #fff;
	padding: 2em 1em;
	margin-top: 1em;
	width: calc((100%/2) - 1em);
	display: flex;
	align-items: center;
	box-sizing: border-box;
	opacity: 0;
}

.column-img{
	width: 100%;
	text-align: center;
}

.column-img img{
	height: 120px;
}

.column-title{
	margin: 1em auto 0 auto;
	width: 80%;
	font-family: myriad-pro, sans-serif;
	font-weight: 400;
	font-style: normal;
	text-align: center;
	font-size: 1.5rem;
}

.column-text{
	margin: .5em auto 0 auto;
	text-align: center;
	line-height: 1.5em;
	width: 100%;
}


/*STAFF*/

.staff-name{
	font-size: 1.5rem;
	padding: 0;
	margin: 0;
	margin-bottom: .5em;
}

.staff-title{
	font-size: 1.2rem;
	margin: 0;
	font-weight: 550;
}

.staff-email{
	width: 100%;
	padding: .5em;
	position: absolute;
	top: -60px;
	left: 0;
	background-color: rgba(0,0,0,.3);
	box-sizing: border-box;
	font-size: 1.25rem;
}

.staff-email a{
	width: 100%;
	color: #fff;
	text-decoration: none;
}



.popup{
	margin-left: -150px;
	margin-top: -100px;
	width: 300px;
	height: 200px;
	position: fixed;
	left: 50%;
	top: 50%;
	background-color: rgba(0,0,0,.6);
	color: #fff;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	align-items: center;
	align-content: center;
	font-size: 1.5rem;	
}

.popup p{
	width: 100%;
	text-align: center;
}

.popup p:nth-child(2){
		margin-top: .5em;
}

.popup a{
	width: 100%;
	font-size: 1.25rem;
	color: #fff;
}

/*FOOTER*/

.footer-top-wrapper{
	background-color: #fff;
}

.footer-top{
	margin: 0 auto;
	padding: 3em 1em;
	max-width: 1200px;
	box-sizing: border-box;
}

#nabp-section{
	display: flex;
	align-items: center;
}

#nabp-img{
	height: 150px;
	margin-right: 2em;
}

#nabp-text{
	width: 500px;
}

.footer-bottom-wrapper{
	background-color: #9c7db9;
}

.footer-bottom{
	margin: 0 auto;
	padding: 3em 1em;
	max-width: 1200px;
	display: flex;
	justify-content: space-between;
	box-sizing: border-box;
}

.footer-bottom-item-wrapper{
	display: flex;
}

.footer-bottom-item{
	margin-right: 3em;
	line-height: 1.5em;
	color: #fff;
}

.footer-bottom-item-social{
	margin-top: .5em; 
	display: flex;
}

.social{
	margin-right: .5em;
}

.social:hover{
	transition: transform .3s;
	transform: scale(1.1);
}


/*ANIMATIONS*/

@keyframes fade{
    0%{opacity: 0; transform: translateX(-50px);}
    100%{opacity: 1; transform: translateX(0);}
}


@media only screen and (min-width: 1201px){
	#nav{
		width: auto !important;
	}
	
	body.hasHover .dropdown:hover .dropdown-content{
		display: flex;
		flex-direction: column;
	}
}

@media only screen and (max-width: 1500px){
	
	#header-resources{
		padding: 2em 1em;
	}
	
	#header-resources-inner{
		width: 100%;
	}
	.header-resources-image-wrapper{
		display: none;
	}
	
	.section-half{
		height: auto;
		flex-wrap: wrap;
	}
	
	.text-half-wrapper{
		padding: 1em;
		width: 100%;
	}
	
	.img-half{
		height: 40vh;
		width: 100%;
	}
	
	#pointofcare-nextsteps-inner{
		width: 100%;
	}
	
	#demo-form-wrapper{
		width: 100%;
	}
	
	#ordering-form-wrapper{
		width: 100%;
	}
	
	.faq{
		width: 100%;
	}
}

@media only screen and (max-width: 1400px){
	
	#navbar{
		padding: 1em;
		position: relative;
	}
	
	#nav{
		position:absolute;
		right: 0;
		top: 97%;
		max-height: 0%;
		width: 100%;
		overflow: hidden;
		flex-direction: column;
		background-color: #3A3B60;
		z-index: 999;
		transition: max-height .6s ease-in;
	}
	
	.menu-item{
		width: 100%;
		color: #fff;
		text-align: center;
	}
	
	.dropdown{
		width: 100%;	
	}
	
	.dropdown-content{
		width: 100%;
		position: static;
		flex-direction: column;
		background-color: #B595DB;
	}
	
	.btn-dropdown{
		width: 100%;
		color: #fff;
	}
	
	#btn-menu{
        display: block;
    }
	
	.shownav{
		display: flex;
    	flex-direction: column;

	}
	
	.section-centered{
		width: 100%;
	}
	
	.header-services-images-wrapper{
		
	}
	
	#header-img-half-index{
		height: 30vh;
		width: 100%;
	}
	
	.header-services-images-wrapper{
		margin: 0;
		flex-wrap: wrap;
	}
	
	#header-index{
		min-height: 70vh;
		flex-wrap: wrap;
		padding: 3em 1em;
		box-sizing: border-box;
	}
	
	.header-img-wrapper{
		padding: 2em 0;
		width: 100%;
	}
	
	.header-img{
		
	}
	
		
	.section-centered-left-align{
		width: 100%;
	}
	
	.section-half{
		width: 100%;
	}
	
	
	#pointofcare-nextsteps-inner{
		flex-wrap: wrap;
	}
    

	
	/*GALLERY*/
    

	#gallery-whoweserve{
		flex-wrap: wrap;

	}
	
	.gallery-item{
		margin-top: .5em;
		padding: .5em;
		width: calc((100%/4) - .5em);
	}
	
	.gallery-text{
		padding: 1em 0 1em 0;;
	}
	
	.gallery-img-small {
		height: 50px;
	}
	
	.gallery-item-packaging{
		width: calc((100%/2) - 1em);
	}
	
	.gallery-item-staff{
		width: calc((100%/2) - 2em);
	}
	
	.gallery-img-staff{
		width: 100%;
	}
	
	/*FORMS*/

	#pointofcare-form-wrapper{
		padding: 2em 1em;
		width: 100%;
		box-sizing: border-box;
	} 
	
	#pointofcare-form, #demo-form, #ordering-form{
		padding: 1em;
	}
	
	#contact-section{
		padding: 2em 1em;
	}
    
    .contact-img{
        width: 50%;
    }
	
	#contact-left, #contact-right{
		width: 100%;
		padding: 1em;
	}
}

@media only screen and (max-width: 1000px){
	
	.next-step-wrapper{
		margin-bottom: 1em;
		width: 100%;
	}
		
}

@media only screen and (min-width: 801px) {
    @keyframes slide-column-right {
        0% {
            margin-left: -1400px;
        }

        100% {
            margin-left: 0px;
        }
    }

    @keyframes slide-column-left {
        0% {
            margin-right: -1400px;
        }

        100% {
            margin-right: 0px;
        }
	}
	
	@keyframes slide-column-up {
        0% {
            margin-bottom: -1400px;
        }

        100% {
            margin-bottom: 0px;
        }
	}
	
	@keyframes fade-in{
		0%{opacity: 0; }
		100%{opacity: 1; }
	}



}

@media only screen and (max-width: 800px){
	
	#section-index{
		opacity: 1;
	}
	
	.img-half{
		margin: 0;
	}

	#header-index h1, .p-header, .header-buttons{
		opacity: 1;
	}
	
	.feature-row{
		margin: 0;
		flex-wrap: wrap;
	}
	
	.feature{
		margin: 2em 0;
		width: 100%;
	}
	
	.report-row{
		margin: 0;
		flex-wrap: wrap;
	}

	.report{
		margin: 2em 0;
		width: 100%;
	}
	
	#demo-form-wrapper{
		padding: 0;
		width: 100%;
		box-sizing: border-box;
	}
	
	.gallery-item{
		width: calc((100%/2) - .25em);
	}
	
	.gallery-item-gov{
		margin-top: .5em;
		width: calc((100%/2) - .25em);
	}
	
	.gallery-text{
		line-height: 1.25em;
	}
	
	#phone-wrapper{
		flex-wrap: wrap;
		justify-content: center;
	}
	
	.phone{
		width: 100%;
		font-size: 1rem;
		text-align: center;
	}
	
	#phone-wrapper .button-big{
		display: none;
	}
	
	body{
		
	}
	
	p{
		
	}
	
	
	#header-img-half, #index-form-wrapper{
		width: 100%;
	}
	
	.p-centered{
	}
	
	.button-big{
		font-size: 1rem;
	}
	
	#index-form, #demo-form{
		width: 100%;
		padding: 1em;
		box-sizing: border-box;
	}	
	
	.three-columns{
		flex-wrap: wrap;
	}
	
	.column-wrapper{
		margin-bottom: 2em;
		width: 100%;
	}
	
	#pointofcare-nextsteps{
		padding: 3em 1em 2em 1em;
		flex-wrap: wrap;
	}

	.tab-text{
		padding: 0;
	}
	
	.two-columns .column-wrapper{
		width: 100%;
	}

	.two-columns .column-wrapper-transparent{
		justify-content: center;
		width: 100%;
		opacity: 1;

	}
    
	.columnLeftServices{
		margin-left: 0;
	}

	.columnRightServices{
		margin-right: 0;
	}
    
    #resources .column-wrapper-transparent{
	    margin-bottom: 0px;
    }
    
    .galleryLeft{
        margin-left: 0px;
    }

    .galleryCenter{
        margin-bottom: 0px;
    }

    .galleryRight{
        margin-right: 0px;
    }

	/*FORMS*/
	
	.g-recaptcha iframe{
		transform: scale(0.77);
		transform-origin: 0 0;
	}
    
    .input-submit{
        margin: .4em 0 0 0;
    }
    
    .contact-img{
        width: 80%;        
    }

	/*FOOTER*/
	
	#nabp-section{
		flex-wrap: wrap;
	}
	
	#nabp-text{
		margin-top: 1em;
		width: 100%;
	}

	.footer-bottom{
		flex-wrap: wrap;
	}
	
	.footer-bottom-item{
		margin-bottom: 1em;
		width: 100%;
	}
	
	.footer-bottom-item-wrapper{
		flex-wrap: wrap;
	}
}


@media only screen and (max-width: 600px){
	
	body{
		font-size: .9rem;
	}
	
	h1{
		font-size: 1.25rem;
	}
	
	h2{
		font-size: 1.25rem;
	}
	
	.faq-question h2 {
		font-size: 1rem;
	}
	
	h3, .staff-name{
		font-size: 1.15rem;
	}
	
	#header-index-text h1 {
		font-size: 1.5rem;
	}
	
	.p-header{
		font-size: .9rem;
	}
	
	.header-buttons .button-blue{
		font-size: .9rem;
	}
	
	#header-resources{
		flex-wrap: wrap;
		justify-content: center;
		text-align: center;
	}
	
	#section-features, #section-reporting{
		padding: 2em 1em;
	}
	
	.blue-section-wrapper, .section-centered-left-align-wrapper, .footer-bottom{
		padding: 2em 1em;
	}
	
	.button-blue{
		font-size: .85rem;
	}
	
	.next-step-wrapper{
	
	}
	
	.report{
		margin: 1em 0;
	}
	
	.input-text, .input-submit, .message, .input-text-half, .staff-email, .staff-title, .add-field{
		font-size: .9rem;
	}
	
	.input-medications-wrapper-inner .input-text{
		width: 100%;
	}
	
	#pointofcare-form{
		margin-top: 1em;
	}
	
	.gallery-item-staff{
		margin: .5em 0;
	}
	
	.gallery-item-packaging{
		width: 100%;
	}
	
	.contract-packaging-tab{
		padding-bottom: .5em;
	}
	
	.feature-left{
		width: 13%;
	}
	
	.tab-img{
		padding: .5em;
		box-sizing: border-box;
		width: 100%;
	}
	
	.tab-title{
        color: #fff;
        background-color: transparent;
		padding: .75em .5em .75em .5em;
	}

	.input-text-half{
		width: 100%;
	}
	
	.gallery-item-staff{
		width: 100%;
	}
}