@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap');

*{
  font-family: "Noto Sans", sans-serif;
  font-size: 12pt;
}
a {
  color:inherit;
  text-decoration:none;
}
a:hover{color: inherit;}

.ccdc_wind_slider{padding-top: 130px;}

.ccdc_wind_slider .carousel-item{ position: relative;}
.ccdc_wind_slider .carousel-item .windwheel {
    position: absolute;
    bottom: 12px;
    right: 30%;
}
.ccdc_wind_slider .carousel-item .windwheel_pillor{width: 420px;}
.ccdc_wind_slider .carousel-item .windwheel_fan {
    width: 350px;
    position: absolute;
    right: -155px;
    top: -169px;
}
.ccdc_wind_slider .carousel-item .windwheel_fan2 {
    width: 254px;
    position: absolute;
    right: 60px;
    top: 104px;
}
.ccdc_wind_slider .carousel-item .windwheel_fan3 {
    width: 175px;
    position: absolute;
    left: 1px;
    top: 277px;
}
.ccdc_wind_slider .carousel-item .windwheel_fan4 {
    width: 91px;
    position: absolute;
    left: -36px;
    top: 359px;
}
.ccdc_wind_slider .carousel-item .carousel-caption {
    position: absolute;
    left: 10%;
    text-align: left;
    top: 43%;
    transform: translate(0%, -50%);
    color: #000000;
    width: fit-content;
    background: #ffffffc4;
    height: fit-content;
    padding: 20px;
    border-radius: 8px;
}

.ccdc_wind_slider .carousel-item .carousel-caption h1{}
.ccdc_wind_slider .carousel-item .carousel-caption p{}
/*-------------------- rotate windwheel anination start------------- */
@-webkit-keyframes rotating /* Safari and Chrome */ {
    from {
      -webkit-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      transform: rotate(0deg);
    }
    to {
      -webkit-transform: rotate(360deg);
      -o-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  }
  @keyframes rotating {
    from {
      -ms-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      transform: rotate(0deg);
    }
    to {
      -ms-transform: rotate(360deg);
      -moz-transform: rotate(360deg);
      -webkit-transform: rotate(360deg);
      -o-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  }
  .rotating {
    -webkit-animation: rotating 10s linear infinite;
    -moz-animation: rotating 10s linear infinite;
    -ms-animation: rotating 10s linear infinite;
    -o-animation: rotating 10s linear infinite;
    animation: rotating 10s linear infinite;
  }


/*-------------------- rotate windwheel anination end------------- */
/* Hang */
@-webkit-keyframes hvr-hang {
    0% {
      -webkit-transform: translateY(8px);
      transform: translateY(8px);
    }
  
    50% {
      -webkit-transform: translateY(4px);
      transform: translateY(4px);
    }
  
    100% {
      -webkit-transform: translateY(8px);
      transform: translateY(8px);
    }
  }
  
  @keyframes hvr-hang {
    0% {
      -webkit-transform: translateY(8px);
      transform: translateY(8px);
    }
  
    50% {
      -webkit-transform: translateY(4px);
      transform: translateY(4px);
    }
  
    100% {
      -webkit-transform: translateY(8px);
      transform: translateY(8px);
    }
  }
  
  @-webkit-keyframes hvr-hang-sink {
    100% {
      -webkit-transform: translateY(8px);
      transform: translateY(8px);
    }
  }
  
  @keyframes hvr-hang-sink {
    100% {
      -webkit-transform: translateY(8px);
      transform: translateY(8px);
    }
  }
  
  .hvr-hang {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  }
  
  .hvr-hang:hover,
  .hvr-hang:focus,
  .hvr-hang:active {
    -webkit-animation-name: hvr-hang-sink, hvr-hang;
    animation-name: hvr-hang-sink, hvr-hang;
    -webkit-animation-duration: .3s, 1.5s;
    animation-duration: .3s, 1.5s;
    -webkit-animation-delay: 0s, .3s;
    animation-delay: 0s, .3s;
    -webkit-animation-timing-function: ease-out, ease-in-out;
    animation-timing-function: ease-out, ease-in-out;
    -webkit-animation-iteration-count: 1, infinite;
    animation-iteration-count: 1, infinite;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-direction: normal, alternate;
    animation-direction: normal, alternate;
  }
  .custom_menu li{ padding-left: 8px; padding-right: 8px;}
.social_media_icons {
    z-index: 999; 
     position: fixed; 
    bottom: 40%;
    right: 5px;
    display: grid;
    padding-bottom: 10px;
}
/* .social_media_icons1 a i{font-size: 25px;
  padding-left: 10px;
  color: #00a651;} */
.social_media_icons a {
    margin-bottom: 8px;
}
.social_media_icons a i.fa-facebook-square {
    background-color: #4267B2;
}
.social_media_icons a i {
    font-size: 29px;
    padding: 15px 18px;
    background: #ffffff26;
    border-radius: 50%;
    margin-left: 10px;
    margin-right: 10px;
    color: #ffffff;
}
.social_media_icons a i.fa-twitter-square {
    background-color: #00acee;
}
.social_media_icons a i.fa-brands.fa-linkedin {
    background-color: #0077b5;
}
.social_media_icons a i.fa-youtube-square {
    background-color: #FF0000;
}
.ccdc_wind_4blocks .container {
    border: 1px solid #dedede;
    border-radius: 8px;
   
    /* padding: 20px; */
    position: relative;
    top: -64px;
    background: #fffffff8;
    z-index: 111;    border-bottom: 3px solid #0fb367;
}
.ccdc_wind_4blocks .container .nav-pills{ text-align: center;}
.ccdc_wind_4blocks .container .four_blk_set {border-right: 1px solid #dedede;
    
}
.ccdc_wind_4blocks{position: relative;}
.ccdc_wind_4blocks .container .four_blk_set a{ color: #4a4a4a; font-weight: 600;}
.ccdc_wind_4blocks .container .four_blk_set img{ width: 80px;}
.green_block {
    position: absolute;
    left: -25px;
    bottom: 90px;
    background: #008000db;
    padding: 25px;
    color: #ffffff;    z-index: 1;
}
.footer_section {
    background: #3b4a64;
    color: #ffffff;
}
.bottom_footer {
  background: #2b3954;
  text-align: center;
  font-weight: 600;
  color: #ffffff;
}
.useful_links ul {
    padding-left: 0;
}
.useful_links ul li{list-style-type:none;}
.useful_links ul li a {
    text-decoration: none;
    color: #ffffff;
}
.footer_section a, .bottom_footer a {color: #ffffff; font-size: 12pt;}
.bottom_footer a {
  color: #0d6efd; font-size: 12pt;
}
.bottom_footer p, .bottom_footer small{font-size: 12pt;}
.ccdc_wind_4blocks .container .four_blk_set a:hover{color: #198754;}
.ccdc_wind_4blocks .container .nav-pills .four_blk_set.nav-link.active{color: #247cfe;border-radius: 0;  background-color: #ffffff;}
  .ccdc_wind_4blocks .container .nav-pills .four_blk_set.nav-link{background-color: #f7f7f7; color: #777777;border-radius: 0;}
.wind_enrgy_progm{background-color: #f7f7f7; }
.nav_menus a.btn.custom_active {
  color: #00a651;
  font-weight: 600;
}
.navbar-brand img{width: 250px!important;}
.login_bg{background-image: url("../images/bg12.jpg");
  background-position: center center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
width: 100%;
height: 100Vh; position: relative;}
.login_bg .login_form{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.login_bg .login_form .form_block {
  background: #ffffff;
  width: 400px;
  padding: 25px;
  border-radius: 8px;box-shadow: 0 0 15px #00000069;
}
/* .login_bg .login_form .form_block .ccdc_logo img{ width: 185px;} */
.bottom_footer{
  /* background-image: url(../images/bg121.png); */
  /* background-position: center center;
  background-attachment: fixed; */
  /* background-repeat:repeat; */
  /* background-size: cover;
 position: relative; */
}

.ccdc_wind_slider .carousel-control-next, .carousel-control-prev {width: 10%!important;}
@media screen and (min-device-width: 320px) and (max-device-width: 768px) {
  *{
    font-family: "Noto Sans", sans-serif;
    font-size: 12pt;
  }
  .ccdc_wind_slider{padding-top: 195px;}
  .text-end.nav_menus {display: flex;width: 100%;}
  .text-end.nav_menus a{    flex: 1 1 auto !important;}
  .ccdc_wind_4blocks .container {top: 20px;}
  .ccdc_wind_slider .carousel-item .carousel-caption h1 {font-size: 25px;}
  .ccdc_wind_slider .carousel-item .carousel-caption p{font-size: 12pt;}
  .ccdc_wind_4blocks .container .nav-pills li{width: 50%;}
}
@media screen and (min-device-width: 320px) and (max-device-width: 500px) {
  .navbar-brand img{width: 200px!important;}
  .ccdc_wind_slider{padding-top: 220px;}
  .ccdc_wind_slider .carousel-item img{ min-height: 320px;}
  /* .ccdc_wind_slider .carousel-item .windwheel img{height: 250px;} */
}

@media screen and (min-device-width: 780px) and (max-device-width: 1280px) {
  .nav_menus a.btn {
    font-size: 12pt;
}
}


/* search box */


        a.font_stng {
            padding-right: 10px;
            padding-left: 10px !important;
            border: 1px solid #dedede;
            width: 35px;
            height: 35px;
            margin-right: 5px;
            border-radius: 8px;
            background: #03b922;
            color: #ffffff;
        }

        /* a.font_stng:hover {
            background: #df8424
        } */

        .search_bar_fullscreen .openBtn {
            background: none;
            border: none;
            padding: 0px 0px;
            font-size: 20px;
            cursor: pointer;

            color: #ffffff;
        }

        /* .search_bar_fullscreen .openBtn:hover {
            background: #df8424
        } */

        .search_bar_fullscreen .overlay {
            height: 100%;
            width: 100%;
            display: none;
            position: fixed;
            z-index: 9999;
            top: 0;
            left: 0;
            background-color: rgb(0, 0, 0);
            background-color: rgba(0, 0, 0, 0.7);
        }

        .search_bar_fullscreen .overlay-content {
            position: relative;
            top: 20%;
            width: 50%;
            text-align: center;
            margin-top: 30px;
            margin: auto;
        }

        .search_bar_fullscreen .overlay .closebtn {
            position: absolute;
            top: 20px;
            right: 45px;
            font-size: 60px;
            cursor: pointer;
            color: white;
        }

        .search_bar_fullscreen .overlay .closebtn:hover {
            color: #ccc;
        }

        .search_bar_fullscreen .overlay input[type=text] {
            padding: 15px;
            font-size: 17px;
            border: none;
            float: left;
            width: 80%;
            background: white;
            height: 55px;
            border-radius: 10px 0px 0px 10px;
        }

        .search_bar_fullscreen .overlay input[type=text]:hover {
            background: #f1f1f1;
        }

        .search_bar_fullscreen .overlay button {
            float: left;
            width: 20%;
            padding: 15px;
            background: #df8424;
            font-size: 17px;
            border: none;
            cursor: pointer;
            height: 55px;
            color: #ffffff;
            border-radius: 0px 10px 10px 0px;
        }

        .search_bar_fullscreen .overlay button i {
            font-size: 24px;

        }

        .search_bar_fullscreen .overlay button:hover {
            background: #03b922;
        }

        .search_bar_fullscreen {
            position: relative;
        }

        .search_bar_fullscreen a.font_stng {
            position: relative;
            top: 1px;
            padding: 6px;
            outline: none;
        }

        .top_header .rightSide a {
            /* padding-left: 5px; */
            padding-top: 5px;
        }

        .language_button:hover {
            color: #000000;
        }

        .padding0 {
            padding: 0;
        }
.font_adjsmnt a:hover{ color: #ffffff;}

.lang_btn .btn-check:checked+.btn, .lang_btn .btn.active, .lang_btn .btn.show, .lang_btn .btn:first-child:active, :not(.btn-check)+.btn:active {
  color: #000000;}
  .lang_btn ul li a:hover, .lang_btn .btn:hover{color: #000000;}
  .font_adjsmnt .font_stng i{font-size: 15px;}
.nav_menus a:hover{color: #f7941d;}
.btn.orange_btn {
  background: #00a651;
  color: #ffffff;
}
.btn.orange_btn:hover {
  background: #f7941d;
  color: #ffffff;
}