@font-face{
  font-family: 'Stint';
  font-weight: 400;
  src: url("../fonts/Stint_Ultra_Condensed/StintUltraCondensed-Regular.ttf") format('truetype');
 }
 @font-face{
   font-family: 'Roboto';
   font-weight: 400;
   src: url("../fonts/Roboto/Roboto-Regular.ttf") format('truetype');
  }
  @font-face{
    font-family: 'Merriweather';
    font-weight: 400;
    src: url("../fonts/Merriweather/Merriweather-Regular.ttf") format('truetype');
   }

   * {
       margin: 0;
   }
   html, body {
       height: 100%;
   }

BODY,
.form-label {
  font-family: Roboto;
}

.navbar {

  padding: 0.7rem;
  padding-left: 2rem;
  padding-right: 2rem;

  background: #62b6ce !important;
  bbackground: #195c6f !important;
}

@media only screen and (min-width: 992px) {
  .navbar-collapse {
    display: flex;
    justify-content: flex-end;
    margin-right: 2rem;
  }

}


.smImage,
.lgImage
{
  display: none !important;
}

@media only screen and (min-width: 981px) {
  .lgImage {
    display: block !important;
  }
}
@media only screen and (max-width: 980px) {
  .smImage {
    display: block !important;
  }
}




.navbar-brand {
  font-size: 2.5rem;
  text-shadow: 2px 2px #333;
}
.nav-item .nav-link{
  font-size: 1.2rem;
  Ccolor: #195c6f !important;
  color: #FFF !important;
  text-shadow: 1px 1px #333;
  font-weight: bolder;
}
.nav-item .nav-link:hover {
  color: #ffd847 !important;
}
.navbar-brand {
  font-family: Merriweather, Roboto;
  ccolor: #195c6f !important;
  color: #FFF !important;
}




.page-section {
  padding: 3rem 0;
}
.page-section h2 {
  padding-bottom: 2rem;
}
.page-section .fa-stack {
  margin-bottom: 1rem;
}
.page-section.section2 {
  bbackground:#EAEEEE;
}
.page-section h2.section-heading{
  font-family: Merriweather, Roboto;
  font-size: 2rem;
  margin-top: 0;
  margin-bottom: 15px;
  font-weight: bolder;
}
.page-section h3 {
  font-size: 1.2rem;
}
.page-section .text-primary {
  color: #62b6ce !important;
}
.page-section.section2 .text-primary {
  ccolor: #ffd847  !important;
}

.carousel-caption {
  background: rgba(25, 92, 111, 0.7);
  background: rgba(0,0,0,0.6);
  width: 50%;
  margin-left: 10%;
}
.carousel-caption H5,
 .carousel-caption P{
  color: #FFF;
}
.carousel-caption H5 {
  font-size: 1.8rem;
}
.carousel-caption P {
  font-size: 1.1rem;
}
.carousel-dark .carousel-indicators [data-bs-target] {
    background-color: #FFF;
}
.carousel-dark .carousel-control-next-icon, .carousel-dark .carousel-control-prev-icon {
    filter: invert(0) grayscale(100);
}


.carousel {
  margin-top: 74px;
}

.section3 {
  background: #ffa500;
    color: #000;
    background: #ffd847;
}

.section3 LI {
  margin-top: 3vh;
}
.section3 UL {
  width: 60%;
  margin-left: 20%;
  text-align: left;

}


@media only screen and (max-width: 991px) {
  .carousel-item IMG {
    height: 50vh;
    object-fit: cover;
  }
  .navbar-brand {
    font-size: 3rem;
  }
  .carousel-caption H5 {
    font-size: 3rem;
  }
  .carousel-caption P {
    font-size: 2.5rem;
  }
  .carousel-caption {
    width: 70%;
    margin-left: 0;
  }
  .carousel {
    margin-top: 100px;
  }
  .nav-item .nav-link{
    font-size: 2.5rem;
  }
  .text-muted,
  .page-section h3 {
    font-size: 2.5rem;
    margin-bottom: 10vw;
    bborder: 1px solid red;
  }
  .section3 LI {
    font-size: 2.5rem;
  }
  .service-heading {
    font-size: 2.5rem;
  }
  .section3 UL {
    width: 100%;
    margin-left: 0%;
  }
}

FOOTER {
  background: #333333;
  color: #FFF;
  padding-top: 20px;
  padding-bottom: 10px;
}
FOOTER I {
  cursor:pointer;
}
FOOTER A,
FOOTER A:hover,
FOOTER A:active,
FOOTER A:hover:active {
  color: #FFF;
}

.float{
	position:fixed;
	width:60px;
	height:60px;
	bottom:40px;
	right:40px;
	background-color:#25d366;
	color:#FFF;
	border-radius:50px;
	text-align:center;
  font-size:30px;
	box-shadow: 2px 2px 3px #999;
  z-index:100;
}
@media only screen and (max-width: 991px) {
  .float {
    font-size: 80px;
    width:114px;
  	height:114px;
  }
}
.float:HOVER,
.float:active,
.float:hover:active{
  color: #FFF;
}
.my-float{
	margin-top:16px;
}

.section5 {
  background: #efefef !important;
  bcolor:#FFF;
}

.divflags {
  position: absolute;
  top:4px;
  right: 4px;
}
.argflag,
.usflag,
.braflag  {
  width: 30px;
  height: 30px;
  cursor: pointer;
  border: 2px solid #FFF;
  border-radius: 25px;
  background: url("https://flagpedia.net/data/flags/w580/us.png") ;
  background-size: cover;
  background-position: center;
  float:left;
}
@media only screen and (max-width: 991px) {
  .argflag,
  .usflag,
  .braflag  {
    width: 5rem;
    height: 5rem;
    border-radius: 4rem;
  }
  .divflags {
    top: auto;
    bottom: 4px;
    right: 10px;
  }
}

.braflag  {
  background: url("https://flagpedia.net/data/flags/w580/br.png");
  background-size: cover;
  background-position: center;
}
.argflag  {
  background: url("https://flagpedia.net/data/flags/w580/ar.png");
  background-size: cover;
  background-position: center;
}



.section6 {
  background: #ffc3c3;
}
.section6 IMG {
  width: 130px;
  height: 130px;
  border-radius: 80px;
  border: 2px solid #FFF;
  float: left;
  margin-right: 30px;
}

h4 {
  font-size: 1.1rem;
}

@media only screen and (max-width: 992px) {
.btn {
  font-size: 3rem;
}
.section6 UL{
  font-size: 2rem;
}
.section6 .col-12 {
    margin-top: 10px;
}

.section2 .col-12 {
  margin-top: 20px;
}
.section2 P,
.section2 A {
  font-size: 1.8rem;
}

.section2  h3 {
  margin-bottom: 0px;
}

.section2 H4 {
  font-size: 2rem;
}
}

.cursos .curso {
  background:#fff8a5;
  border-radius: 10px;
  padding:10px;
  margin-left: 10px;
  margin-right: 10px;
  height: 100%;
}
.cursos .caracteristicas {
  background:#dedede;
  border-radius: 10px;
  padding:20px;
  margin-left: 10px;
  margin-right: 10px;
}
.cursos H3 {
  font-weight: bolder;
}


.modal-body .mb-4{
  margin-bottom: 0.5rem!important;
}
.modal-body .form-label {
  margin-bottom: 0.1rem!important;
}

.row-flex {
  display: flex;
  flex-wrap: wrap;
}

.hidecursos {
  ddisplay: none !important;
}

@media only screen and (max-width: 992px) {
  .page-section h2.section-heading {
    font-size: 3rem;
  }
  .form-control,
  .form-label {
    font-size: 3rem !important;
  }
  .modal-title,
  .modal-body,
  .modal-footer .btn {
    font-size: 3rem;
  }
}

.modal-footer .btn {
  padding-left: 2rem;
  padding-right: 2rem;
}


.aulas h2 {
  padding-bottom: 0px;
}
.aulas .col-12 {
  margin-top: 40px;
}






.user_card {
			height: 300px;
			width: 350px;
			margin-top: auto;
			margin-bottom: auto;
			background: #cce7ef;
			position: relative;
			display: flex;
			justify-content: center;
			flex-direction: column;
			padding: 10px;
			box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
			-webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
			-moz-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
			border-radius: 5px;
      margin-top: 100px;
		}

    @media only screen and (max-width: 991px) {
      .user_card {
        width: 90%;
      }
      #formLogin {
        width: 80%;
      }
    }

		.brand_logo_container {
			position: absolute;
			height: 170px;
			width: 170px;
			top: -75px;
			border-radius: 50%;
			background: #60a3bc;
			padding: 10px;
			text-align: center;
		}
		.brand_logo {
			height: 150px;
			width: 150px;
			border-radius: 50%;
			border: 2px solid white;
		}
		.form_container {
			margin-top: 100px;
		}
		.login_btn {
			width: 100%;
			background: #0c688a !important;
			color: white !important;
		}
		.login_btn:focus {
			box-shadow: none !important;
			outline: 0px !important;
		}
		.login_container {
			padding: 0 2rem;
		}
		.input-group-text {
			background: #0c688a !important;
			color: white !important;
			border: 0 !important;
			border-radius: 0.25rem 0 0 0.25rem !important;
      height: 100%;

		}
		.input_user,
		.input_pass:focus {
			box-shadow: none !important;
			outline: 0px !important;
		}
		.custom-checkbox .custom-control-input:checked~.custom-control-label::before {
			background-color: #c0392b !important;
		}
    .user_card .form-control,
    .user_card .btn {
      font-size: 1rem !important;
    }

.content {
  min-height: calc(100% - 186px);
    height: auto !important; /* This line and the next line are not necessary unless you need IE6 support */
    height: 100%;
}
.btn-primary {
  background: #0c688a;
  border-color: #0c688a;
}
.btn-check:active+.btn-primary,
.btn-check:checked+.btn-primary,
.btn-primary.active,
.btn-primary:active,
.btn-primary.hover,
.btn-primary:hover,
.show>.btn-primary.dropdown-toggle{
  background: #09465d;
  border-color: #09465d;
}
.container li {
  list-style-type: none;
}

.filebox {
  width: 100%;
  display: table;
  margin-top: 4px;
  margin-bottom: 4px;
  padding-left: 38px !important;
}

AUDIO {
  float: left;
}
.audiodet {
  float: left;
  margin-top: 15px;margin-left: 5px;
}

.divopen {
  cursor: pointer;
  background: #ecf9ff;
  padding: 4px 10px;
}
.filebox,
.divopen {
  border-left: 1px solid #DEDEDE;
  border-right: 1px solid #DEDEDE;
  border-bottom: 1px solid #DEDEDE;
  border-top: 1px solid #DEDEDE;
  margin: 0px;
  padding: 4px;
}
.filebox .fas,
.divopen .fas{
  margin-left: 10px;
    margin-right: 10px;
}




@media only screen and (max-width: 991px){
	.float {
	    font-size: 40px;
	    width: 70px;
	    height: 70px;
	}
	.carousel {
    margin-top: 73px;
}
.nav-item .nav-link {
    font-size: 1.2rem !important;
}
.navbar-brand {
    font-size: 1.7rem !important;
}

.text-muted,
.page-section h3 {
    font-size: 1.5rem
}
.section2 P, .section2 A {
    font-size: 1.3rem;
}
.btn {
    font-size: 1.5rem;
}
.page-section h2.section-heading {
    font-size: 2rem;
}
.section3 LI {
    font-size: 1.5rem;
}
.service-heading {
    font-size: 1.5rem;
}
.form-control, .form-label {
    font-size: 1.5rem !important;
}

    
}

HTML {
	overflow-x: hidden;
}