:root {
	--app-height: 100%;
 }
 
html {
	scroll-behavior: smooth;
}

@font-face {
	font-family: myFirstFont;
	src: url(sansation_light.woff);
}

.splash {
	background-color: black;
	position: fixed;
	width: 100%;
	height: 100vh;
	top: 0;
	z-index: 999;
}

.addamin img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	opacity: 0;
}

@-webkit-keyframes fadeInimg {
	0% {
		opacity: 0;
	}
	20% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@keyframes fadeInimg {
	0% {
		opacity: 0;
	}
	20% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

.splashimg img {
	animation: fadeInimg ease 5s;
	-webkit-animation: fadeInimg ease 5s;
	-moz-animation: fadeInimg ease 5s;
	-o-animation: fadeInimg ease 5s;
	-ms-animation: fadeInimg ease 5s;
	/*animation-iteration-count: infinite;*/
}

@-webkit-keyframes fadeIn {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@keyframes fadeIn {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

.active {
	-webkit-animation-name: fadeIn;
	-webkit-animation: fadeIn;
	animation-name: fadeIn;
	animation: fadeIn;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	animation-timing-function: ease;
}

#banner-home .active {
	-webkit-animation-name: fadeIn;
	-webkit-animation: fadeIn;
	animation-name: fadeIn;
	animation: fadeIn;
	-webkit-animation-duration: .3s;
	animation-duration: .3s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	animation-timing-function: ease;
}
#clickAqui:focus{
	outline: 0;
}
@media only screen and (min-width: 1024px) {
	#section1 {
		height: 200vh;
		position: relative;
		z-index: 100;
	}
	.sticky {
		position: fixed;
		text-align: right;
		top: 0;
		margin: 3% 0%;
		right: 11%;
	}
	#section1 .frame1 {
		background: url('../img/cd-background-1.jpg');
		background-size: cover;
		background-position: center 20%;
		background-attachment: fixed;
		height: 100vh;
	}
	#section1 .frame1 .material {
		position: absolute;
		color: #fff;
		font-family: Arial;
		font-size: 14px;
		font-weight: normal;
		padding: 3% 0% 0 5%;
	}
	#section1 .frame1 .text-content {
		position: absolute;
		right: 6%;
		top: 8%;
	}
	#section1 .frame1 h1 {
		font-family: 'Source Sans Pro', sans-serif;
		font-size: 4vw;
		color: #fff;
		line-height: 90%;
		text-transform: uppercase;
	}
	#section1 .frame1 p {
		font-family: 'Alegreya', serif;
		font-size: 1.5vw;
		color: #fff;
		font-weight: bold;
	}
	#section1 .frame2 {
		background-image: url(../img/img_2.jpg);
		background-size: cover;
		background-position: center 20%;
		background-attachment: fixed;
		height: 100vh;
	}
	#section2 {
		position: relative;
		z-index: 100;
		/*height: 200vh;*/
	}
	#section2 .frame1 {
		background-image: url(../img/cd-background-2.jpg);
		background-size: cover;
		background-position: center;
		background-attachment: scroll;
		height: 80vh;
	}
	#section2 .frame2 {
		background-image: url(../img/2nd-flip-image.jpg);
		background-size: cover;
		background-position: center;
		background-attachment: scroll;
		height: 80vh;
	}
	.blue {
		background-image: linear-gradient(rgb(10, 30, 46), rgb(0, 69, 124));
		font-family: 'Alegreya', serif;
		/*font-size:  1.17vw;*/
		font-size: 22px;
		color: #fff;
		font-weight: bold;
	}
	.stickyblue {
		position: sticky;
		bottom: 0;
	}
	.pipe {
		border-left: 2px solid white;
		border-right: 2px solid white;
	}
	.first-image {
		width: 15%;
		margin: 5%;
	}
	#section3 {
		position: relative;
		background-color: #fff;
		background-image: url(../img/left2.png);
		background-size: cover;
		background-position: center 25%;
		background-attachment: fixed;
		/*height: 400vh;*/
	}
	#section3 .content-text {
		border-top: 5px solid #fff;
		border-bottom: 5px solid #fff;
		color: #fff;
		font-family: 'Alegreya', serif;
		font-size: 1.88vw;
		margin: 0 auto;
		display: table;
		padding: 3% 0;
		line-height: initial;
	}
	#section3 .content-text span {
		font-size: 0.73vw;
		font-family: 'Alegreya', serif;
		display: block;
		padding-top: 2%;
	}
	#section3 .project {
		height: 100vh;
		justify-content: center;
		align-items: center;
		background-attachment: fixed;
		position: absolute;
		width: 100%;
	}
	#section3 .projects {
		position: fixed;
		top: 0;
	}
	#section3 .project-one {
		z-index: 99;
	}
	#section3 .project-one, .project-two, .project-three, .project-four {
		opacity: 0;
	}
	#section3 .right_content {
		padding: 0 6% !important;
	}
	#section3 .right_content h2 {
		font-family: 'Source Sans Pro', sans-serif;
		font-size: 2.5vw;
		color: #c80000;
		text-transform: uppercase;
		line-height: 120%;
		margin-bottom: 3%;
	}
	#section3 .right_content h4 {
		font-family: 'Alegreya', serif;
		font-weight: bold;
		font-size: 1.4vw;
		color: #444444;
		margin-bottom: 0;
	}
	#section3 .right_content p {
		font-family: 'Alegreya', serif;
		font-size: 1.05vw;
		color: #444444;
		margin-bottom: 3%;
	}
	#section4 {
		position: relative;
		height: 110vh;
		z-index: 94;
	}
	#section4 .frame1 {
		height: 80vh;
		background-image: url(../img/WhoopingCough-CoffeeShop.jpg);
		background-size: cover;
		background-position: center 10%;
		background-attachment: fixed;
	}
	#section4 .red {
		background-image: linear-gradient(rgb(136, 2, 0), rgb(170, 1, 0));
		font-family: 'Alegreya', serif;
		font-size: 20px;
		color: #fff;
		height: 30vh;
	}
	#section4 .text-right-content {
		font-family: 'Alegreya', serif !important;
		font-size: 1.65vw;
		color: #fff;
		border-left: 3px solid white;
		padding-left: 4%;
		width: auto;
		line-height: initial;
	}
	#section4 .red-sec {
		position: absolute;
		bottom: 10%;
	}
	#section5 {
		position: relative;
		height: 100vh;
		background-image: url(../img/cd-background-3.jpg);
		background-size: cover;
		background-position: center 0;
		background-attachment: fixed;
		z-index: 95;
	}
	#section6 {
		position: relative;
		background-color: #fff;
		background-size: cover;
		background-position: center;
		background-attachment: fixed;
		z-index: 90;
	}
	#section6 .accord-sec {
		position: fixed;
		top: 0;
		margin: 5% 0;
		display: none;
		left: 50%;
		transform: translate(-50%, 0);
	}
	#section6 .accord-sec h2 {
		text-transform: uppercase;
		font-family: 'Source Sans Pro', sans-serif;
		font-weight: bold;
		/*font-size: 2.865vw;*/
		font-size: 2.3vw;
		color: #004b86;
		padding: 0px 0px 10px 0px;
	}
	#section6 .accordion_container {
		width: var(--max-width-xl);
		font-size: 18px;
	}
	#section6 .accordion_head {
		background-color: white;
		color: #444444;
		cursor: pointer;
		margin: 12px 0 12px 0;
		padding: 2% 9% 0% 2%;
		border: 3px solid #004b86;
		border-bottom: 0;
		position: relative;
		font-family: 'Alegreya', serif;
		font-size: 1.25vw;
		font-weight: bold;
	}
	#section6 .accordion_body {
		font-family: 'Alegreya', serif;
		background: white;
		border-bottom: 3px solid #004b86;
		border-left: 3px solid #004b86;
		border-right: 3px solid #004b86;
		margin: -15px 0px 0px 0px;
		font-size: 1.25vw;
		color: #444444;
		display: block;
	}
	#section6 .accordion_body p {
		padding: 2%;
		margin: 0px;
		color: #333 !important;
		line-height: 120%;
	}
	#section6 .plusminus {
		float: right;
		font-size: 1.875vw;
		color: #014B87;
		font-weight: bold;
		position: absolute;
		top: 0;
		right: 2%;
		font-family: Arial;
	}
	#section7 {
		position: relative;
		height: 100vh;
		background-image: url(../img/cd-background-4.jpg);
		background-size: cover;
		background-position: center;
		background-attachment: fixed;
		z-index: 97;
	}
	#section8 {
		position: relative;
		z-index: 98;
	}
	#section8 .blue-sec {
		padding: 8% 0;
	}
	#section8 .blue-content {
		font-family: 'Alegreya', serif !important;
		font-size: 1.875vw;
		color: #fff;
		border-top: 2px solid white;
		border-bottom: 2px solid white;
		padding: 1% 0;
		font-weight: normal;
		display: table;
	}
	#section9 {
		background-color: #fff;
		position: relative;
		z-index: 99;
		font-family: Arial;
	}
	#section9 .references {
		padding: 30px;
		font-size: 14px;
		color: #444444;
	}
	#section9 .references h4 {
		font-size: 16px;
		font-weight: bold;
	}
	#section9 .page-references {
		padding-bottom: 30px;
		border-bottom: 2px solid black;
	}
	#section9 .footer {
		padding-top: 30px;
		font-size: 14px;
		padding-right: 10%;
	}
	#section9 .footer p {
		margin-bottom: 2px;
	}
	#mobile {
		display: none;
	}
	#desktop {
		display: block;
	}
}

/*mobile*/

@media only screen and (min-width: 320px) and (max-width: 1024px) {
	html {
		scroll-behavior: smooth;
		overflow-x: hidden;
	}
	.footer{
		font-size: 12px;
	}
	.footer a{
		text-decoration: underline;
	}
	#mobile {
		display: block;
	}
	#desktop {
		display: none;
	}
	.menu {
		width: 100vw;
		display: flex;
		justify-content: space-between;
		background-color: transparent;
		position: fixed;
		z-index: 999;
	}
	.navbar {
		width: 100%;
	}
	.navbar-nav .nav-link {
		color: #ffffff;
	}
	.navbar-toggler {
		border: none;
		text-decoration: none;
	}
	.navbar-toggler-icon {
		background-image: url(../img/menu.svg)!important;
	}
	/* GENERALS */
	/* COLORS */
	.c-gray {
		color: #4E4E4E;
	}
	.c-red {
		color: #C80000;
	}
	.c-white {
		color: #ffffff;
	}
	/* TEXTS */
	.title {
		font-family: 'Source Sans Pro', sans-serif;
		font-size: 3.125rem;
		line-height: 3rem;
	}
	.title-second {
		font-family: 'Source Sans Pro', sans-serif;
		font-size: 2.5rem;
		line-height: 2.5rem;
	}
	.subtitle {
		font-family: 'Source Sans Pro', serif;
		font-size: 1.25rem;
	}
	.text {
		font-family: 'Alegreya', serif;
		font-size: 1.125rem;
		line-height: 1.3rem;
	}

	.bg-red{
		background-color: #C80000;
	}
	/* FRAME-1 */

	.frame1.frame-fixed{
		position: fixed;
		margin: 0;
	}

	.frame1.frame-fixed .mcontent {
		padding-bottom: 80px;
	}
	.frame1 {
		/*overflow-x: hidden;
		position: relative;
		height: 100vh;
		width:100vw;*/

		overflow: hidden;
	    position: relative;
	    height: 100vh;
	    width: 100vw;
	    top: 0;
	    left: 0;
	    right: 0;
	    z-index: 9;
	    
	}
	body, html{
		overflow: hidden;
	}
	.first-heading {
		background: url('../img/bg-mom.jpg');
		background-size: cover;
		background-position: center;
		position: relative;
		z-index: 99;
		left: 0;
		height: 100vh;
    @media not all and (hover:hover) {
        height: var(--app-height);
    }
	}
	.heading {
		background: url('../img/bg-mom-hero.jpg');
		background-size: cover;
		background-position: center;
		position: absolute;
		height: 100vh;
		z-index: 9;
	}
	.mcontent {
		padding: 50px 10px;
		width: 100vw;
		position: absolute;
		bottom: 0;
		left: 0;
		background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(92, 24, 24, 1) 100%);
		transition: 0.4s;
	}
	.video{
		border-radius: 10px;
		background-color: #a2adac;
		position: relative;
		z-index: 99;
	}
	.button-area {
		padding: 10px 0;
		width: 100vw;
		height: 10vh;
		position: relative;
	}
	.button {
		padding: 10px 30px;
		font-size: 14px;
		border: none;
		color: #ffffff;
		font-weight: bold;

	}
	.btn-principal {
		position: absolute;
		right: 10px;
		background-color: #7C1919;
		border: solid 3px #A81E1E;
		border-radius: 50px 0 0 50px;
		text-transform: uppercase;
	}
	/* FRAME-2 */
	.frame2 {
		overflow-x: hidden;
		position: relative;
		height: 70vh;
		background: linear-gradient(0deg, rgba(0, 67, 121, 1) 0%, rgba(9, 30, 48, 1) 100%);
	}
	.frame2 p {
		margin: 0;
	}
	.icone {
		width: 80%;
	}
	/* FRAME-3 */
	.frame3 {
		overflow-x: hidden;
		position: relative;
		background-color: #ffffff;
	}
	/* FRAME-4 */
	.frame4 {
		overflow-x: hidden;
		position: relative;
		background-color: #ffffff;
	}
	.destaque {
		border-top: solid 5px #A81E1E;
		border-bottom: solid 5px #A81E1E;
	}
	.destaque .text {
		font-size: 1.5rem;
		line-height: 1.875rem;
		margin: 0;
	}
	.info-card {
		margin: auto 20px;
		border-radius: 10px;
		position: relative;
		box-shadow: 0px 0px 15px 1px #cccccc81;
	}
	.info-card-img {
		position: relative;
		height: 240px;
		border-top-left-radius: 10px;
		border-top-right-radius: 10px;
		display: flex;
		align-items: center;
		padding: 0 30px;
	}
	.info-card-destaque {
		padding: 20px;
		border-top: solid 3px #ffffff;
		border-bottom: solid 3px #ffffff;
	}
	.info-card-text {
		height: 330px;
		padding: 30px;
	}
	.info-card-text .artigo {
		font-size: .9rem;
		line-height: 1.2rem;
		word-break: normal;
	}
	.img-1 {
		background-image: linear-gradient(to bottom, #00000088 0%, #00000088 100%), url(../img/cd-background-6.png);
		background-size: cover;
	}
	.img-2 {
		background-image: linear-gradient(to bottom, #00000088 0%, #00000088 100%), url(../img/cd-background-7.png);
		background-size: cover;
	}
	.img-3 {
		background-image: linear-gradient(to bottom, #00000088 0%, #00000088 100%), url(../img/cd-background-3.jpg);
		background-size: cover;
	}

	.frame5 {
		overflow-x: hidden;
		position: relative;
		background-color: #ffffff;
	}
	.accordion {
		background-color: #ffffff;
		cursor: pointer;
		padding: 20px 5px;
		width: 100%;
		border: none;
		text-align: left;
		outline: none;
		border-bottom: solid 1px #707070;
		transition: 0.4s;
	}
	.accordion .text {
		font-size: 1.375rem;
	}
	.accordion:hover {
		background-color: #004b86;
		color: #ffffff;
	}
	.panel {
		padding: 20px;
		display: none;
		background-color: white;
		overflow-x: hidden;
		border-bottom: 1px solid #707070;
	}

	.destaque-second{
		background: linear-gradient(0deg, rgba(0, 67, 121, 1) 0%, rgba(9, 30, 48, 1) 100%);
		padding: 40px 30px;
	}
	
	.border-second {
		border-top: solid 3px #ffffff;
		border-bottom: solid 3px #ffffff;
	}
	.border-second .text{
		font-size: 1.5rem;
		line-height: 1.875rem;
		margin: 0;
	}
	.frame6{
		overflow-x: hidden;
		position: relative;
		background-color: #ffffff;
	}
	.frame7 {
		overflow-x: hidden;
		position: relative;
		background-color: #ffffff;
	}
	.references{
		width: 100%;
		border-radius: 50px;
		background-color: #C80000;
	}
	.border-point{
		border-top: dashed 2px #004b86;
		border-bottom: dashed 2px #004b86;
	}
	.vacines{
		width: 100%;
		border-radius: 50px;
		background-color: #004b86;
	}
	.modal-content{
		border-radius: 1.1rem;
	}
	.modal-header{
		border-top-left-radius: 1rem;
		border-top-right-radius: 1rem;
	}
	.modal-title{
		font-size: 1.5rem;
	}
	.modal-body{
		height: 85vh;
		overflow-y: auto;
		word-break: break-all;
	}
	

	
}

@media only screen and (min-width: 576px) and (max-width: 1024px) {
	.frame15 .accordion_head, .frame15 .accordion_body {
		border-right: 3px solid #004b86;
		border-left: 3px solid #004b86;
	}
}

@media only screen and (min-width: 576px) and (max-width: 1024px) {
	.hamburger-menu {
		display: none;
	}
}