 body {
     font-family: 'Nunito', sans-serif;
 }

 .text-primary {
     color: #01356e !important;
 }

 .bg-primary {
     background-color: #01356e !important;
 }

 .text-secondary {
     color: #3eb2e5 !important;
 }

 .form-control {
     color: #fff;
     background-color: transparent;
     border-bottom: 1px solid #fff !important;
     border: none;
     border-radius: 0;
 }

 .mt-12 {
     margin-top: 9rem;
 }

 .headingFont {
     font-family: 'alex_brushregular';
     font-size: 3.75rem;
 }

 .fontSizeLarge {
     font-size: 2.8125rem;
 }

 .bannerImage {
     background-image: url(../images/mainSection.jpg);
     background-repeat: no-repeat;
     min-height: 779px;
 }

 .ganeshBannerImage {
     background-image: url(../images/ganesh.png);
     background-repeat: no-repeat;
     min-height: 690px;
 }

 .kalanjaliBannerImage {
     background-image: url(../images/kalanjali.png);
     background-repeat: no-repeat;
     min-height: 690px;
 }

 .line {
     height: 1px;
     display: inline-block;
     width: 13rem;
     background: #0099dc;
     border-radius: 1.5625rem;
 }

 .contactBg {
     padding-top: 70px;
 }

 .hexagon {
     position: relative;
     width: 30px;
     height: 30px;
     background-color: #64C7CC;
     margin: 20px 0;
 }

 .hexagon:before,
 .hexagon:after {
     content: "";
     position: absolute;
     width: 0;
     border-left: 15px solid transparent;
     border-right: 15px solid transparent;
 }

 .hexagon:before {
     bottom: 100%;
     border-bottom: 10px solid #64C7CC;
 }

 .hexagon:after {
     top: 100%;
     width: 0;
     border-top: 10px solid #64C7CC;
 }

 .floatMusicRight {
     position: absolute;
     bottom: 0;
     right: 20px;
 }

 .floatMusicLeft {
     position: absolute;
     bottom: 0;
     left: -50px;
 }

 .contactPlaceholder::placeholder {
     color: #fff;
     opacity: 1;
     /* Firefox */
 }

 .contactPlaceholder:-ms-input-placeholder {
     /* Internet Explorer 10-11 */
     color: #fff;
 }

 .contactPlaceholder::-ms-input-placeholder {
     /* Microsoft Edge */
     color: #fff;
 }

 .btnRadius {
     border-radius: 20px;
 }

 /*Float animation*/

 @-webkit-keyframes float {
     0% {
         -webkit-transform: translatey(0px);
         transform: translatey(0px);
     }

     50% {
         -webkit-transform: translatey(-20px);
         transform: translatey(-20px);
     }

     100% {
         -webkit-transform: translatey(0px);
         transform: translatey(0px);
     }
 }

 @keyframes float {
     0% {
         -webkit-transform: translatey(0px);
         transform: translatey(0px);
     }

     50% {
         -webkit-transform: translatey(-20px);
         transform: translatey(-20px);
     }

     100% {
         -webkit-transform: translatey(0px);
         transform: translatey(0px);
     }
 }

 .floatObject {
     -webkit-transform: translatey(0px);
     transform: translatey(0px);
     -webkit-animation: float 6s ease-in-out infinite;
     animation: float 6s ease-in-out infinite;
 }

 /* make keyframes that tell the start state and the end state of our object */

 @-webkit-keyframes fadeIn {
     from {
         opacity: 0;
     }

     to {
         opacity: 1;
     }
 }

 @-moz-keyframes fadeIn {
     from {
         opacity: 0;
     }

     to {
         opacity: 1;
     }
 }

 @keyframes fadeIn {
     from {
         opacity: 0;
     }

     to {
         opacity: 1;
     }
 }

 .fade-in {
     opacity: 0;
     /* make things invisible upon start */
     -webkit-animation: fadeIn ease-in 1;
     /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
     -moz-animation: fadeIn ease-in 1;
     animation: fadeIn ease-in 1;
     -webkit-animation-fill-mode: forwards;
     /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
     -moz-animation-fill-mode: forwards;
     animation-fill-mode: forwards;
     -webkit-animation-duration: 1s;
     -moz-animation-duration: 1s;
     animation-duration: 1s;
 }

 .fade-in.one {
     -webkit-animation-delay: 0.5s;
     -moz-animation-delay: 0.5s;
     animation-delay: 0.5s;
 }

 .rcorners1 {
     border-radius: 300px;
     background: #3eb2e5;
     width: 100%;
     height: 70%;
     transform: rotate(20deg);
     overflow: hidden;
 }

 .mapStyle {
     transform: rotate(-20deg);
     margin-top: -165px;
     position: relative;
 }

 .mapOverlay {
     position: absolute;
     background: #3eb2e58f;
     height: 100%;
     width: 100%;
     top: 0;
 }

 /**/
 .panel {
     height: 100vh;
 }

 .footerHeight {
     height: 115px !important;
 }

 .contactHeight {
     height: 523px !important;
 }

 .paddingLogo {
     padding-right: 155px;
 }

 /**/

 @media only screen and (max-width: 500px) {
     .bannerImage {
         min-height: auto;
         background-image: none;
     }

     .ganeshBannerImage {
         min-height: auto;
         background-image: none;
     }

     .kalanjaliBannerImage {
         min-height: auto;
         background-image: none;
     }

     .mt-12 {
         margin-top: 0;
     }

     .fontSizeLarge {
         font-size: 1.8125rem;
     }

     .contactBg {
         padding-top: 0;
     }


     .paddingLogo {
         padding-right: 0;
     }
 }