@charset "utf-8";
/* CSS Document */

/*---------------------------------------------------------------------
    import Fonts
---------------------------------------------------------------------*/

@import url(https://fonts.googleapis.com/css?family=Lato);
@import url(https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap);

.navbar-nav .nav-item .nav-link:hover {
    color: #f61500 !important;
    font-family: "Lato Black", sans-serif;
}
.navbar-nav .nav-item .nav-link {
    /*color: #011535 !important;*/
	color: #ffffff !important;
    font-family: "Lato Black", sans-serif;
}
.list-btn {
	list-style: none;
	max-width: 300px;
}
.lato-thin {
    font-family: "Lato", sans-serif;
    font-weight: 100;
    font-style: normal;
}

.lato-light {
    font-family: "Lato", sans-serif;
    font-weight: 300;
    font-style: normal;
}

.lato-regular {
    font-family: "Lato", sans-serif;
    font-weight: 400;
    font-style: normal;
}

.lato-bold {
    font-family: "Lato", sans-serif;
    font-weight: 700;
    font-style: normal;
}

.lato-black {
    font-family: "Lato", sans-serif;
    font-weight: 900;
    font-style: normal;
}

.lato-thin-italic {
    font-family: "Lato", sans-serif;
    font-weight: 100;
    font-style: italic;
}

.lato-light-italic {
    font-family: "Lato", sans-serif;
    font-weight: 300;
    font-style: italic;
}

.lato-regular-italic {
    font-family: "Lato", sans-serif;
    font-weight: 400;
    font-style: italic;
}

.lato-bold-italic {
    font-family: "Lato", sans-serif;
    font-weight: 700;
    font-style: italic;
}

.lato-black-italic {
    font-family: "Lato", sans-serif;
    font-weight: 900;
    font-style: italic;
}

/****************************************************
	HEADER
****************************************************/
.container	{
	margin: 0 auto;
	width: 90%;
	max-width: 1920px;
}
.header-container {
	width: 100%;
	/*max-width: 980px;*/
	/*border: 1px solid #5F5D5D;*/
	margin: 0 auto;
	display:flex;
	justify-content: space-between;
}
header	{
	/*color:#5F5D5D;*/
	/*color:white;
	margin-left: 2rem;
    margin-right: 2rem;
	padding: 0.5rem;*/
	border-bottom-width: thick;
	border-bottom-color: #A8A6A6;

}

#btn-back-to-top {
position: fixed;
    /*visibility: hidden;
    opacity: 0;*/
    border-radius: 50%;
    transition: all 0.4s;
    justify-content: center;
bottom: 20px;
left: 20px;
display: none;
  box-shadow: 0 0 10px #b1b1b1;
}

i.bi {
    color: white;
    text-align: center;
}

/******************************************************
	BODY
******************************************************/

/********************************************************
    TRANSFORMATIONS
****************************************************************/
.reveal{
  position: relative;
  transform: translateY(150px);
  opacity: 0;
  transition: 2s all ease;
}
.reveal.active{
  transform: translateY(0);
  opacity: 1;
}
div-back {
    background: transparent;
}
/******************************************************
	NAVIGATION
******************************************************/
.icon-blue {
        color: darkslategrey;
      }
      .icon-red {
        color: red;
      }
      .icon-large {
        font-size: 25px;
      }

nav {
    font-family: Lato;
    font-size: 0.75rem;
}
nav ul {
	list-style: none;
	display: flex;
	justify-content: center;
}
nav li {

	margin: 0 1em;
    font-size: 0.75rem;
}
nav a {
	text-decoration: none;
	/*color: #5F5D5D;*/
	color:#14033E;
	padding: 0.25em;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}
a.nav-item.nav-link {
    color:  #14033E;
}
a.nav a:hover {
    color:  #FF0000;
}
a.nav-link:hover {
    color:  #FF0000;
	transform: scale(1.05);
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}
a.nav a:focus {
	color:slategray;

}

.quick-item:hover {
	color:  #FF0000;
	transform: scale(1.05);
}

.services_heading {
    font-family: "Lato Black";
}

a.footer-link {
    text-decoration: none;
    color: white;
}

a.footer-link:hover {
    color:#24CCE8;
}
h1,h2,h3,h4,h5,h6 {
    font-weight: bold;
}
.navbar-light .navbar-nav .nav-link li{
    color: #14033E;
}

#readbutton:hover {
	border-color: #14033E;
    color: #14033E;
}
.button-container {
	display: flex;
    justify-content: center;
	}
.button-container #readbutton {
	width: 300px;
    height: 80px;
    margin-top: 40px;

}

#about_us	{
	font-family: Lato;
	margin: 15px;
	/*background :url("../images/722857.jpg");*/
	height: 300px;
}

.main	{
	text-align: center;
	align-content: center;
	padding: 45px;
	/*border: #D70F12;
	border-style: solid;*/
}
#values-list	{
	list-style:none;
}
.columns	{
	display: flex;
	margin: 0.5rem 0;
	text-align: center;
	color: #14033E;
	justify-content: space-between;
	align-items: flex-start;
}
.columns2	{
	display: flex;
	margin: 0.5rem 0;
	margin-top: 15rem;
	text-align: center;
	color:#14033E;
	justify-content: space-between;
	align-items: flex-start;

}

.mission {
	padding: 0.5rem;
    color: #14033E;
	/*background-color:gold;*/
}
.vision	{
	padding: 0.5rem;
    color: #14033E;
	/*background-color: orange;*/
}
.values	{
	padding: 0.5rem;
    color: #14033E;
	/*background-color: orange;*/
}
.col-1	{
	width: 20%;
}
.col-2	{
	width: 45%;
}
.col-3	{
	width: 20%;
}
.col-a	{
	width: 20%;
}
.col-b	{
	width: 45%;
}
.col-c	{
	width: 20%;
}

/*cOLS FOR SERVICES*/
.col-aX	{
	width: 20%;
}
.col-bX	{
	width: 20%;
}
.col-cX	{
	width: 20%;
}
.col-dX {

    width: 20%;
}

.services_heading {

	color: #14033E;
}

.col-cX li {

    color: #C70003;
}


.button-container {
	align-content: center;
	}
.col-button {
	width: 100%;

}

.infinitech {
	margin-top: 3em;
	width: 40%;
}
.about {
	margin-top: 6em;
	width: 60%;
	mix-blend-mode: normal;
}
/*
.carousel {
	max-width: 80%;
	display: flex;
	margin: 0.5rem 0;
	margin-top: 15rem;
	text-align: center;
	color:blue;
	justify-content: space-between;
	align-items:flex-start;

}
#carousel {

	text-align: center;
	align-items: center;
	justify-content: center;
		width: 1280px;
	height: auto;
}
#carousel img{
	width: 980px;
	height: auto;
}
.carousel-inner {
	display: flex;
	position: relative;
	width: 100%;
}


*/
/*****************************************************
	FOOTER
*****************************************************/
footer	{
	margin: 10px auto;
	width: 100%;
	/*max-width: 980px;*/
	background:#0D0335;
	text-align: center;
    font-family: Lato;
	font-size: 0.75rem;
	color: black;
	padding: 0.5rem;
	border-style: hidden;
	margin-top: 200px;

	/*position:fixed;
	bottom: 0;
	*/

	/*background:linear-gradient(to bottom right,gold,goldenrod,darkgoldenrod);
	background:linear-gradient(to bottom right,gold,goldenrod,darkgoldenrod);*/
	/*background:linear-gradient(to bottom,white,grey);
	/*color: chartreuse;
	color: lawngreen;*/
	/*background: url("../images/orange.jpg");*/
}

.contact	{
	padding: .5rem;
}
.social_link	{
	text-decoration: none;
	list-style: none;
	padding: .5rem;

}

.services_images {
	max-width: 60%;
	padding: .5rem;

}

.foot {
	justify-content: center;
}
#main-container {
    color: #000000;
}
#main-container h1 h2 h3 {

    font-family: "Lato Black";
}
.copyright {
    color: #FFFFFF;
}
.search-icon {
    color: #14033E;
}

.course-links {
	color: #FFFFFF;
    background:#232323;
	background:#d40000;
   /* border-style: solid;
    /*border-color: #14033E;
    border-radius: 5px;
	border-color: #232323;*/
}
.course-heading {
    color: #FFFFFF;
    background:#232323;
    border-style: solid;
    /*border-color: #14033E;*/
    border-radius: 5px;
	border-color: #232323;
}
.red {
   /* background: #C70003;
    border-color: #C70003;*/
}
.purple {
    background:#14033E;
}
.course-links h5 {
    font-size: 0.75rem;
}
.course-heading .red .purple {

}

.circle-red {
    background: #FF0000;
    border-style: solid;
    border-color: #FF0000;
    border-radius: 50%;
    width: 10rem;
	height: 10rem;
	/*background: #14033E;*/
	/*display: flex;*/
	justify-content: center;
	align-items: center;
    color: #FFFFFF;
    font-size: 0.rem;

}

.circle-purple {
    background: #14033E;
    border-style: solid;
    border-color: #14033E;
    border-radius: 50%;
    width: 10rem;
	height: 10rem;
	/*background: #14033E;*/
	/*display: flex;*/
	justify-content: center;
	align-items: center;
    color: #FFFFFF;
    font-size: 0.6rem;

}
.circle-purple h6, .circle-red h6 {
    font-size: 0.75rem;
}
.card-body h4{
    color: #14033E;
}
.card-text {
	font-size: 0.75rem;
}
.col .card {
    height: 100%;
}

.breadcrumb {
    padding-right:5px;
}
.breadcrumb-item {
    font-size: 0.75rem;
    font-weight: normal;
    justify-items:start;
    font-family: Lato;

}

.carousel-container {
    width: 100% !important;
    margin: 0px 0px 0px 0px;
   /*margin-top:-230px;*/
   height: 800px;
   /*width: 100vw;*/
}
.carousel-container-dept {
    width: 100% !important;
    margin: 0px 0px 5px 0px;
    /*margin-top:-230px;*/
    height: 500px;
    /*width: 100vw;*/
}
.carousel-container2 {
    width: 100% !important;
    margin: 0px 0px 5px 0px;
   /*margin-top:-230px;*/
   height: 200px;
   /*width: 100vw;*/
}
.dept-info {
    background: linear-gradient(to bottom right, #0D0335, #2dc7ff);

}
.dept-auto {
    background: linear-gradient(to bottom right, #810101, #fd0021);

}
.dept-mechanical {
    background: linear-gradient(to bottom right, #151515, #c3c3c3);

}
.dept-electrical {
    background: linear-gradient(to bottom right, #d34400, #ed9c00);

}
.dept-cosmetology {
    background: linear-gradient(to bottom right, #9a024b, #ff1d82);

}
.dept-clothing {
    background: linear-gradient(to bottom right, #8105a5, #d876ff);

}
.dept-hospitality {
    background: linear-gradient(to bottom right, rgba(11, 55, 0, 0.52), #33ff03);

}
.dept-construction {
    background: linear-gradient(to bottom right, #d34400, #ed9c00);

}
.depts img{
    object-fit: cover;
    /*width: 100% !important;*/
    /*margin: 0;*/
    /*padding: 0;*/
    /*display: block;*/
}
/*.card-img {*/
/*    max-width: 100%;*/
/*    object-fit: cover;*/
/*}*/

/*
.carousel {
    justify-items: center;
    width: 100%;
}*/
.carousel-item {
    height: 100vh;
  min-height: 500px;
  background: no-repeat center center scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size:cover;
  transition: transform 2.6s ease-in-out;
}
.carousel-item2x {
    height: 45vh;
    min-height: 500px;
    background: no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size:cover;
    transition: transform 2.6s ease-in-out;
}
.carousel-fade .active.carousel.item-start,
.carousel-fade .active.carousel.item-end {
    transition: opacity 0s 2.6s;
}
.carousel-item2 {
    height: 45vh;
  min-height: 200px;
  background: no-repeat center center scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size:cover;
  transition: transform 2.6s ease-in-out;
}
/*.carousel .item {
    height: 500px;
  }

  .item img {
      position: absolute;
      object-fit:cover;
      top: 0;
      left: 0;
      min-height: 500px;
  }
.carousel-inner {
    justify-content:flex-start;

}*/
.carousel-caption h1{
    font-size: 4rem;
    font-family: Lato;
	/*font-family:Georgia, 'Times New Roman', Times, serif;
	font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;*/
    font-weight: bolder;
    color: #FFFFFF;
    text-align: center;
    top: 50%;
    transform: translateY(-50%);
    bottom: initial;
    -webkit-text-stroke-color: #14033E;
    -webkit-text-stroke-width: 0.07rem;

}
.carousel-caption .school h1{
    font-size: 3rem;
    /*font-family: Madani_bold;*/
	font-family:Georgia, 'Times New Roman', Times, serif;
    font-weight: bolder;
    color: #FFFFFF;
    text-align: center;
    /*top: 50%;
    transform: translateY(-50%);*/
    bottom: initial;
    -webkit-text-stroke-color: #14033E;
    -webkit-text-stroke-width: 0.05rem;

}
.carousel-caption .back{
    background: #14033E;
    opacity: 70%;

}
.carousel-control-next-icon {
	
    height: 60px;
    width: 60px;

}
.carousel-control-prev-icon {
	
    height: 60px;
    width: 60px;
}
.hide-icon {
	display: none;
}
#carouselExampleCaptions {
    /*width: 100%;*/
}
.carousel-caption {
    top: 60%;
    transform: translateY(-40%);
    /*vertical-align: middle;*/
}
.apply-icon {
    color:#14033E;
    background: #14033E;
}

.course-list li{
    text-decoration: none;
}

.miss h4{
   /* color: #14033E !important;*/
}

/**********************************************************
    DEPARTMENTS
    ****************************************************/

    .div-auto {
        width: 100% !important;
        margin: 0px,0px,0px,0px;
       /*margin-top:-230px;*/
       height: 350px;
       background-size:cover;
    }
    .card-department {

        /*background: #14033E;*/

    }

    .card img {
        width: 100%;
    }
    .card-body .card-title .card-text {
        color: #14033E !important;
        text-decoration: none;
    }
    .card-title {
        color: #14033E !important;
        font-size: 1rem;
    }
    .card-link {
        color: #14033E !important;
        font-size: 0.75rem;
    }
    .card-icon bi{
        color: #14033E !important;
    }

    /**************
    navbar
    ***********/

.navbar-nav li .dropdown-menu {
    background: #011535;
}
.navbar-nav li .dropdown-menu .nav-link {
    color: #FFFFFF !important;
}

.navbar-light .navbar-nav .nav-link{
    color: #14033E;
}
.navbar-light .navbar-nav .nav-link:hover{
    color: #C70003;
}

/******************************
NAV FLEX COLUMN
***************************/

.sidebar {
    background: #0D0335;
}
.sidebar h6 {
    color:#FFFFFF;
    padding-bottom: 10px;
}
.nav-flex-column{
    text-decoration: none;
    list-style: none;
}
.nav-flex-column li .nav-link{
    text-decoration: none;
    font-size: 0.75rem;
    color:#FFFFFF;
}
.nav-flex-column li .active{
    background: #d40000;
    color:#ffffff;
}
.nav-flex-column li .nav-link:hover{
    background: #FFFFFF;
    color:#14033E;
}
/**********************************************
HEADINGS
******************************************/

.cert-heading {
    color: #0D0335;
}

/*************************************
ACCORDIONS
************************/
.accordion-body ul li {
    list-style: none;
}
.accordion-button {
    background: #0D0335;
}
.accordion-button h6 {
    color:#FFFFFF;
}
.accordion-button:not(.collapsed) {
    background: #0D0335;
  }
  .accordion-button:not(.collapsed)::after {
    color: yellow;

    font-weight: bold;
    font-size: 18px;
  }

  .director-pic img{

    /*border-radius: 0%;*/

  }
.note .col-md-9 p {
    font-size: 0.75rem;
}

/************
NOTES
******************/
.director .note {
	/*border-style: solid;
	border-width: 0.5px;
	border-radius: 15px;*/
	border-color: #0D0335;
	background: #ffffff;
	/*background: #c6c6ff;*/
	/*box-shadow: 0px 0px 3px grey;*/

}

.principal .note {
	/*border-style: solid;
	border-width: 0.5px;
	border-radius: 15px;*/
	border-color: #0D0335;
	background: #ffffff;
	/*background: #c6c6ff;*/
	/*box-shadow: 0px 0px 3px grey;*/
	

}
.director-pic img{
	/*border-top-right-radius: 50px;
	border-top-left-radius: 50px;
	border-radius: 15px;*/

}
.note span h5 {
	text-align: left;
	color: #FFFFFF;
	background: #111010;
	/*border-radius: 10px;*/
	font-size: 1rem;
}

.principal h5 {
	text-align: left;
	color: #FFFFFF;
	background: #0D0335;
	/*border-radius: 10px;*/
	font-size: 1rem;
}

.note-text p {
	font-size: 1rem;
}
/***************************************
	REGISTRATION
	**************************/

.registration h3{
	color: #14033E;
}

.registration col-6 {
	background-color: #6d6d6d;
}

/***************************
INNOVATION
************/
.innovation {
	/*border-radius: 15px;*/
	/*border-color: #0D0335;*/
	background: #ffffff;
	/*background: #c6c6ff;
	box-shadow: 0px 0px 3px grey;*/
}
.innovation img{
	/*border-top-right-radius: 50px;
	border-top-left-radius: 50px;
	border-radius: 15px;*/

}
.innovation .col h2{

	text-align: center;
    top: 50%;
    transform: translateY(-50%);
    bottom: initial;
}

/********************************************
FIND MORE
*************************/
.find-more {
	min-height: 500px;
}

.find-more h1{
	font-size: 4rem;
	text-align: left;
	color:#FFFFFF;
	font-family:Georgia, 'Times New Roman', Times, serif;
	font-family: "Lato Black", serif;
}
.find-more h5{
	text-align: left;
	color:#FFFFFF;
	font-family: "Lato Black", serif;
}
.find-more p{
	text-align: left;
	color:#FFFFFF;
	font-family: "Lato", serif;
}
.find-more .learn h3{
	vertical-align: middle;
	font-family:"Lato Black", serif;
}
.find-more .learn {
	display: flex;
  align-items: center;
  justify-content: center;
}
.find-more .learn h3:hover {
	background: #0D0335;
	border-color: #0D0335;
}
.find-more a {
	color:#FF0000;
}

.reg {
	font-size: 5rem;
    font-family: "Lato Black", serif;
	text-align: center;
	/*text-shadow: 1px 1px 0.5px #FF0000;*/
	background: -webkit-linear-gradient(#0D0335,#FF0000,#0D0335);
	background-clip: inherit;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.apply {
	font-family:"Lato", sans-serif;
	background-color: #14033E;
}
/*********************************************************************
	DOWLOAD FILES
	******************************/
.download-file a{

	color:#0D0335;
}
/*********************************************
	BOLD TEXT
	***************************/
.bold {
	
	/*font-family: Madani_bold;*/
}
/****************************************************
    EVENTS
    *********************************/

	.event-date {
		background-color: #0D0335;
		color:#ffffff;
		font-family: "Lato Black";
	}
/*****************************************************
	GENERAL AREA
*****************************************************/
body{
	margin: 0px;
    font-family: "Lato Light";
	font-size: 1rem;
	font-weight: normal;
    overflow-x: hidden;

	/*font-family: 'Lato', sans-serif;
	font-family:"Trebuchet MS",lato, Arial, Helvetica, sans-serif;*/
	/*
	font-family:'lato',sans-serif;*/
	/*color: #2e354f;*/
	/*color: #292727;
	color:#5F5D5D;*/
	color:black;
    /*background-color: #FFFFFF;*/
	/*background:linear-gradient(to bottom,#ffffff,#ffffff, #0D0335);
	background: url(/images/wood.jpg);
	background-blend-mode:normal;
	background-size:cover;
	background-position:center;
	background-repeat: no-repeat;
	background-attachment:inherit;*/
    background-color: white;


	/*
	background:-moz-linear-gradient(top left,yellow,orange,darkorange);

	background:-webkit-gradient(linear,to bottom right,yellow,orange,darkorange);

	background:-webkit-linear-gradient(top left,yellow,orange,darkorange);

	background:-o-linear-gradient(top left,yellow,orange,darkorange);

	background:-ms-linear-gradient(top left,yellow,orange,darkorange);
	background:radial-gradient(#464444,#2D2B2B,#090909 ,#464444,#2D2B2B,#090909);
	/*
	color:#464444;
	color:#2D2B2B;
	color:#090909;

	color: darkorange;
	/*
*/
}

/*
a {
	/*color: #1f1f1f;
	color:#1A1616;
	text-decoration: none !important;
	/*outline: none !important;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}
*/
.contact a	{
	color: #2A1D02;

}

a {
	text-decoration: none;
}

img{
	width: 100%;
	max-width: 980px;
}
img #banner	{
	padding: 0.5rem;
}
h1{
	font-size: 3rem;
}
h2{
	font-size: 2rem;
}

.row h5 {
    color: #FFFFFF;
}
.row address {
    color: #FFFFFF;
}
.bi-search:hover {
    color:#24CCE8;
}

/****************************************************
	CONTACT FORM
*****************************************************/
.img_icon {
	height: 40px;
	width: 40px;
}
.contact_section {
	position: relative;
	min-height: 100vh;
	padding: 50px 100px;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}

.contact_section .content {
	max-width: 800px;
	text-align: center;
    color:#000000;
}

.contact_section .content h2 {
	font-size: 36px;
	font-weight: 500;
	color:#14033E;
}

.contact_section .content p {

	font-weight: 300;
	color:#000000;
}
.content h2{
    color:#14033E;
}
.containter_contact {
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 30px;

}
.containter_contact .contactInfo {
	width: 50%;
	display: flex;
	flex-direction: column;
}

.containter_contact .contactInfo .box {

	position: relative;
	padding: 20px 0;
	display: flex;
}

.containter_contact .contactInfo .box .icon {

	min-width: 60px;
	height: 60px;
	/*background: #14033E;*/
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 50%;
	font-size: 22px;

}

.containter_contact .contactInfo .box .text {

	display: flex;
	margin-left: 20px;
	font-size: 16px;
	color: #14033E;
	flex-direction: column;
	font-weight: 300;
}

.containter_contact .contactInfo .box .text h3{

	font-weight: 500;
	color: #14033E;
}

.contactForm {

	width: 40%;
	/*padding: 40px;*/
	background: #FFFFFF;


}
.content p {
    color: #000000;
}
.contactForm h2{

	font-size: 30px;
	color: #14033E;
	font-weight: 500;
}

.contactForm .inputBox {
	position: relative;
	width: 100%;
	margin-top: 10px;
}

.contactForm .inputBox input,
.contactForm .inputBox textarea {

	width: 100%;
	padding: 5px 0;
	font-size: 16px;
	margin: 10px 0;
	border: none;
	border-bottom: 2px solid #14033E;
	outline: none;
	resize: none;
}

.contactForm .inputBox textarea {

	height:100px;
}

.contactForm .inputBox span {

	position: absolute;
	left: 0;
	padding: 5px 0;
	font-size: 16px;
	margin: 10px 0;
	pointer-events: none;
	transition: 0.5s;
	color: #14033E;
}

.contactForm .inputBox input:focus ~ span,
.contactForm .inputBox input:valid ~ span,
.contactForm .inputBox textarea:focus ~ span,
.contactForm .inputBox textarea:valid ~ span {

	color:#D05208;
	font-size: 12px;
	transform: translateY(-20px);
}

.contactForm .inputBox input[type="submit"] {

	width: 100%;
	/*background:linear-gradient(to bottom right,#2A012B,#D8022A,#D8022A,#2A012B);*/
	color: #ffffff;
	border: none;
	cursor: pointer;
	padding: 10px;
	font-size: 18px;
}

.contactForm .inputBox input[type="submit"]:hover {

	/*background:linear-gradient(to bottom right,#D8022A,#D8022A,#2A012B);*/

}

/*    REQUEST FORM:     */

.contactForm .inputBox2 {
	position: relative;
	/*width: 100%;*/
	margin-top: 10px;
}
.request .contactForm {

    width: 80%;
}
.contactForm .inputBox2 input,
.contactForm .inputBox2 textarea {

	width: 100%;
	padding: 5px 0;
	font-size: 16px;
	margin: 10px 0;
	border: none;
	border-bottom: 2px solid #232323;
	outline: none;
	resize: none;
}

.contactForm .inputBox2 span {

	position: absolute;
	left: 0;
	padding: 5px 10px;
	font-size: 16px;
	margin: 10px 0;
	pointer-events: none;
	transition: 0.5s;
	color: #232323;
}

.contactForm .inputBox2 input:focus ~ span,
.contactForm .inputBox2 input:valid ~ span,
.contactForm .inputBox2 textarea:focus ~ span,
.contactForm .inputBox2 textarea:valid ~ span {

	color:#D05208;
	font-size: 12px;
	transform: translateY(-20px);
}
/****************************************************
	MEDIA QUERIES
****************************************************/
@media (min-width: 34em) {
    .card-deck > .card {
        width:29%;
        flex-wrap: wrap;
        flex:initial;
    }
}
/* for all devices with a max-width of 480px*/
@media (max-width:480px) and (orientation:portrait)	{

	body {
		background: #FFFFFF;
        overflow-x: hidden;
		width: 100%;
	}
	.list-btn {
		width: 300px;
		margin-top: 20px;
	}
	#main-container {
		padding-left: 0px;
		padding-right: 0px;
		margin-left: 0px;
		margin-right: 0px;
	}
	.content {
		margin-left: 0px;
		margin-right: 0px;
	}
	.container {
		width: 100%;
	}
    .carousel-caption h1, .carousel-caption p{
        font-family: Lato;
        font-weight: bold;
        color: #FFFFFF;
        text-align: center;
        -webkit-text-stroke-color: #14033E;
    -webkit-text-stroke-width: 0px;
    display: none;
    }
	.carousel-control-next-icon, .carousel-control-prev-icon {
		display: none;
	}

	.services_images {
		mix-blend-mode: luminosity;
	}

	#logo_image	{

	mix-blend-mode:luminosity;
}
	.about {
		margin-bottom: 5rem;
	}

	#carousel {

	text-align: center;
	align-items: center;

		width: 100%;
	height: auto;
		display: none;
}
    .contactForm {

	width: 100%;
	/*padding: 40px;*/
	background: #ffffff;
    opacity: 80%;
}
.containter_contact .contactInfo {
	width: 100%;
	display: flex;
	flex-direction: column;
    padding-right: 10px;
    font-size: 0.75rem;
}
.containter_contact .contactForm form{
    width: 100%;
}
.cert-heading {
    margin-top:15px;
}

.director-pic {
    margin-bottom: 20px;
}
.director .note {
	/*border-style: solid;
	border-width: 0.5px;
	border-radius: 15px;*/
	border-color: #0D0335;
	background: #ffffff;
	/*background: #c6c6ff;*/
	padding: 0px;
	margin:0px;
	box-shadow: 0px 0px 0px grey;

}
.director-pic {
	width: 100%;
}
.director .note .note-text {
	margin-left: 0px;
	margin-right: 0px;
	padding-left: 0px;
	padding-right: 0px;
}
.principal .note {
	/*border-style: solid;
	border-width: 0.5px;
	border-radius: 15px;*/
	border-color: #0D0335;
	background: #ffffff;
	/*background: #c6c6ff;*/
	padding: 0px;
	margin:0px;
	box-shadow: 0px 0px 0px grey;

}
.principal .note .note-text {
	margin-left: 0px;
	margin-right: 0px;
	padding-left: 0px;
	padding-right: 0px;
}

.innovation {
	margin-left: 0px;
	margin-right: 0px;
	padding-left: 0px;
	padding-right: 0px;
}
.innovation .col-md-6 {
	width: 100%;
	margin-left: 0px;
	margin-right: 0px;
	padding-left: 0px;
	padding-right: 0px;
	margin-top: 0px;
	margin-bottom: 10px;
	background-color: #FFFFFF !important;
}
.intake {
	margin-bottom: 10px;
	margin-top: 10px;
}
.registration {
	margin-bottom: 10px;
}
.registration .col-md-6 {
	margin-bottom: 10px;
	width: 100%;
	padding: 0px;
	background: #ffffff !important;
}
.col-md-4 .card-department {
	box-shadow: none !important;
	margin-left: 0px;
	margin-right: 0px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	margin-bottom: 5px;
}

.reg {
	font-size: 0.75em;
	font-family:Lato;
	text-align: center;
	/*text-shadow: 1px 1px 0.5px #FF0000;*/
	background: -webkit-linear-gradient(#0D0335,#FF0000,#0D0335);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.carousel-container {

   height: auto;
   /*width: 100vw;*/
}
}

@media (max-width:675px)  {

    body {
        overflow-x: hidden;
    }
	.list-btn {
		max-width: 300px;
		margin-top: 20px;
	}
	.columns	{
		flex-direction:column;
	}

	.col-1,
	.col-2,
	.col-3 {
		width:100%;
	}

	.columns2	{
		flex-direction:column;
	}


	.col-a,
	.col-b,
	.col-c {
		width:100%;
	}
    .col-aX {

        width:100%;
    }
    .col-bX {

        width:100%;
    }
    .col-cX {

        width:100%;
    }
    .col-dX {

        width:100%;
    }

	.portal-section {
		background-repeat: #d40000 !important;
	}

	.header-container {

	/*flex-direction: column;*/
	}
	.name {
		width: 100%;
	}

	header {

		text-align: center;
	}

	nav ul {

		flex-direction: column;
	}

	nav li {

		margin: 0.5em 0;
	}

	#readbutton {
		width: 100%;
	}

	.button-container {
		/*display: flex;
		flex-direction: column;
		justify-content:center;
		*/
	}

	.col-button {
		/*flex-direction: column;*/
		width: 90%;
		/*justify-content: center;*/
		}
	#readbutton {
		display: none;
	}
	#main-container {
		display: block !important;
	}
	.about {
		width: 100%;
	}
      .contactForm {

	width: 90%;
	/*padding: 40px;*/
	background: #ffffff;
    opacity: 80%;
}
.cert-heading {
    margin-top:40px;
}
.director-pic {
    margin-bottom: 20px;
}

.reg {
	font-size: 3rem;
	font-family:"Lato Black";
	text-align: center;
	/*text-shadow: 1px 1px 0.5px #FF0000;*/
	background: -webkit-linear-gradient(#0D0335,#FF0000,#0D0335);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.director .note {
	/*border-style: solid;
	border-width: 0.5px;
	border-radius: 15px;*/
	/*border-color: #0D0335;*/
	background: #ffffff;
	/*background: #c6c6ff;*/
	padding: 0px;
	margin:0px;
	/*box-shadow: 0px 0px 0px grey;*/

}
.director-pic {
	width: 100%;
}
.director .note .note-text {
	margin-left: 0px;
	margin-right: 0px;
	padding-left: 0px;
	padding-right: 0px;
}
.principal .note {
	/*border-style: solid;
	border-width: 0.5px;
	border-radius: 15px;*/
	/*border-color: #0D0335;*/
	background: #ffffff;
	/*background: #c6c6ff;*/
	padding: 0px;
	margin:0px;
	/*box-shadow: 0px 0px 0px grey;*/

}
.principal .note .note-text {
	margin-left: 0px;
	margin-right: 0px;
	padding-left: 0px;
	padding-right: 0px;
}

.innovation {
	margin-left: 0px;
	margin-right: 0px;
	padding-left: 0px;
	padding-right: 0px;
}
.innovation .col-md-6 {
	width: 100%;
	margin-left: 0px;
	margin-right: 0px;
	padding-left: 0px;
	padding-right: 0px;
	margin-top: 0px;
	margin-bottom: 10px;
	background-color: #FFFFFF !important;
}
.intake {
	margin-bottom: 10px;
	margin-top: 10px;
}
.registration {
	margin-bottom: 10px;
}
.registration .col-md-6 {
	margin-bottom: 10px;
	width: 100%;
	padding: 0px;
	background: #ffffff !important;
}
.col-md-4 .card-department {
	box-shadow: none !important;
	margin-left: 0px;
	margin-right: 0px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	margin-bottom: 5px;
}
.carousel-caption h1, .carousel-caption p {
	display: none;
}

.carousel-control-next-icon, .carousel-control-prev-icon {
	display: none;
}

.carousel-container {
  
   height:auto;
   /*width: 100vw;*/
}

}

@media (max-width:991px)  {

		.contact_section {

			padding: 50px;
		}
		.containter_contact {

			flex-direction: column;	}

	.containter_contact .contactInfo {

		margin-bottom: 40px;
	}

	.containter_contact .contactInfo .contactForm{

		width: 100%;
	}
      .contactForm {

	width: 100%;
	/*padding: 40px;*/
	background: #ffffff;
    opacity: 80%;
}
}
@media (min-width: 992px) {
  .dropdown:hover > .dropdown-menu {
    display: block;
    margin-top: 0; /* Prevents a slight vertical shift/flicker */
  }
  /* Optional: Prevent the main link from being unclickable on hover */
  .dropdown > .dropdown-toggle:active {
    pointer-events: none;
  }
}

/****************************************************
	CONTACT PAGE
****************************************************/

.cont {
	margin: 0 auto;
	width: 90%;
	max-width: 980px;
	padding: 3rem;
}