@font-face {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    /*font-family: '"Fira Sans", Sans-serif';  Name your font family */
    src: url('../fonts/Fira_Sans/FiraSans-Regular.ttf'); /* Locate the .ttf file within your directory*/
  }
  :root {
    --main-black: #000000;
    --main-red-icon: #ec1c24;
    --main-red-hover: #ec1c24;
    --main-dropdown-background:#c4c4c4;
    --white: #FFFFFF;
    --semi-white: #ececec;
    --container-fluid-background:rgba(256, 256, 256, 0.05);  
    --main-banner:#999997;
    --para-font-size: 1.1em;
    --h2-font-size: 3em;
    --listRightMark: #3a3939;
    --box-content-border:#CCC;
    --font-size18: 18px;

    /*Buttion*/
    --btn-fontBold:bold;
  }
  .active {     
     color:var('--main-red-icon: #ec1c24;');
  }
  .collapse:not(.show){
        display: block !important;
  }
   body{
    font-family: "Fira Sans", Sans-serif !important;
    background-color: var(--white) !important;  
    font-size:14px !important;  
    text-align: justify;
   }
   .box-content ul li {
    font-size: 0.85rem !important;
    list-style: square !important;   }

   p{
    text-align: justify;
   }

   .above-menu ul{
    float:right;
    margin-right:2%;
    margin-top:1%;
   }
   .above-menu ul li{
    display: inline;
    padding-left:10px;
   }
   .above-menu ul li a{
    color:var(--main-black)  !important;
    text-decoration: none;
    font-size: 0.8rem;
   }
   .above-menu ul li a:hover{
    color:var(--main-red-hover)  !important;
    border-bottom: 3px solid var(--main-red-hover)
   }
   
   .navbar-expand-md{
    float:right;
    font-size:0.7rem;
   }
   .navbar-brand{
    color:var(--main-yellow)  !important;
    font-size: 1.9em !important;
    letter-spacing: 5px;
    color:var(--white) !important;
   }
   .navbar-nav {
    letter-spacing: 0.9px;
    font-size:1.4em;
    
   }
   .navbar-nav li{
    padding:0px 8px;
    color:var(--white);
   }
   .navbar-nav li a{
    color:var(--white);

   }
   .navbar-nav li a:hover{
    color:var(--main-red-hover);
    background-color: transparent;
   }
   .navbar-brand img{
    width:50px;
    height:50px;
   }
   /*navbar-nav*/
    .navbar-nav li:hover > ul.dropdown-menu {
        display: block;
        border:0px;
        font-size:0.9em;
        background-color:var(--main-dropdown-background);
        }
        .dropdown-submenu {
            position:relative;
        }
        .dropdown-submenu > .dropdown-menu {
            top: 0;
            left: 100%;
            margin-top:-6px;
        }

        /* rotate caret on hover */
        .dropdown-menu > li > a:hover:after {
            text-decoration: underline;
            transform: rotate(-90deg);
        } 
        .banner h1{
            background-color: var(--main-banner) !important;
            color: var(--main-yellow) !important;
            font-size: 3.6em;
            padding: 1.2em;
            font-weight: bold;
        }
        .container-fluid-cls{
            background-color: var(--container-fluid-background) ;
            color:var(--main-yellow);
        }
        .box{
            color:var(--main-yellow);
        }
        h2{            
            text-align: center;
            font-size:var(--h2-font-size);
            font-weight: bold;
            padding: 0.3em;
        }
        p{
            font-size:var(--para-font-size);            
        }
        .banner-btn{
            font-weight:var(--btn-fontBold) !important;
            text-transform: uppercase;
            padding:10px;
            margin:-10% 0% 0% 9%;
        }
        .container-fluid-cls ul li{
            list-style: none;
            font-size:22px;
        }
        .container-fluid-cls ul li .fa{
            padding:20px;  
            color:var(--listRightMark);          
        }
        .services-container .btn{
            background-color: none;
            color:var(--listRightMark);
            font-size:1.2rem;
            font-weight:bold;
            text-decoration: underline;
        }
        .consultent-btn{
            font-weight: bold !important;
            padding:1% 5% !important;
            margin:1% 0% 1% 25%; 
            /* margin-top: 1%;
            margin-left: 25%;
            margin-bottom: 1%; */
        }
        .consultent-btn:hover, .banner-btn:hover{
            background-color:var(--white) !important;
            border:1px solid var(--main-yellow) !important;
            color:var(--main-yellow) !important
        }
        .navbar-expand-md .navbar-nav .dropdown-menu{
            width:500px;
        }
        .dropdown-row li{
            text-decoration: none;
            list-style: none;
        }
        .dropdown-row h6{
            float:left;
        }
        .dropdown-row .fa{
            float:left;
            margin-left:10px;
            color:var(--main-red-icon) !important;
            font-size:18px;
        }
        .dropdown-row .dropdown-item .fa{
            margin-right:25px;
        }
        .navbar-expand-md .navbar-nav .nav-link{
            text-wrap: nowrap;
        }
        .dropdown-menu ul li{
            text-decoration: none;
            list-style: none;
        }
        .box-content{
            border:1px solid var(--box-content-border);
            border-radius: 15px;
            background-color:#FFF;
            padding:10px;
            font-size:14px;
        }

        .box-content h5{
            font-weight: bold;
            padding:0px 20px;
            font-size: 0.9rem;
        }
        .box-content p{
            padding:0px 20px;
            font-size:14px !important;
        }
        .row2-content{
            background: rgb(255,255,255);
            background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(238,238,238,1) 100%);
        }
        .h2-cls{
            font-weight:bold;
            font-size:45px;
            text-align: left;
            padding:10px 0px;
        }
        .megenta-box{
            background-color:#A50053;
            width:100%;
            height:500px;
            border-radius: 35px 0px 35px 0px;
        }
        .contentIcon{
            font-size:var('--font-size18');
            color:var('--main-red-icon');
        }
.footerCls{    
    text-align:center;
    padding:10px
}
.footerCls a{
    color: var('--main-red-icon');
    text-decoration: none;

}
.footerCls a:hover{
    color: var('--main-black');
    text-decoration: none;
}

.btn .fa{
    color:#ec1c24 !important;
}
.loginPage a{
    color:#ec1c24;
}
.loginPage a:hover{
    color:#ec1c24;
}
.img-cls img{
    width: 100%;
    height:100%;
}
.img-cls{
    width:220px;
    height:200px;
}
/*X-Small devices (portrait phones, less than 576px)
 No media query for `xs` since this is the default in Bootstrap

 /* Small devices (landscape phones, 576px and up) */
@media (min-width: 380px) { 



 .navbar-expand-md{
        margin-right:145px;
    }
}


/*  Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) { 

header{
    margin-top: -365px;
    height:365px;
 }
}

/*  Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
     header{
    margin-top: -503px;
    height:503px;

   }


 }

/*  X-Large devices (large desktops, 1200px and up)  */
@media (min-width: 1200px) { 
    header{
    margin-top: -600px;
    height:600px;

   }
 }

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) { 
 }

  /* Make the image fully responsive */
  .carousel-inner img {
    width: 100%;
    height: 100%;
  }