@charset "utf-8";
*::after{box-sizing: border-box; }
  
html {scroll-behavior: smooth;}

h1      {font-family: 'Raleway', sans-serif;}

h2      {font-family: 'Raleway', sans-serif;}

h3      {font-family: 'Raleway', sans-serif;
         }

h4      {font-weight:400;
         font-family: 'Raleway', sans-serif;}

p      {font-weight:500;
        font-family: 'Raleway', sans-serif;}

#social_link    {width:10%;
                 padding:5vh 5vw;
                 font-size:2.5vw;
                 position: fixed;
                 margin-left:90%;}

#social_link a  {color: #1FA1D1;}

#social_link a:hover  {color:#3D5471;}

.heading        {text-align: center;
                 color:#3D5471;
                 width:50%;
                 margin-left:25%;
                 font-weight:900;
                 padding:5vh 5vw;}

nav         {padding:5vh 5vw;}

nav img    {width:20%;
            margin-left:40%;}

header      {width:100%;
             display: flex;}

.head_img   {width:50%;
            }

.head_img img {width:100%;}

.head_text     {width:50%;
                padding:10vh 5%;}

.head_text h2   {color:#3D5471;
                 font-weight:900;
                 }

.head_text h3   {color:#3D5471;
                 font-weight:700;
                 font-size:1.8vw;}

/*================================================================= header css end =========================================================*/
                 


.form           {width:90%;
                 margin-left:5%;
                 padding:5vh 5vw;
                 background:#3D5471;
                 border-radius:20px;
                 }

 table          {width:100%;
                 }

 table tr       {}
 
 table td       {width:48%;
                 padding-left:2%;
                 padding-top:3vh;}

 table td input      {width:90%;
                     padding:2.5vh 1vw;}

 table textarea      {width:100%;
                      border-radius:20px;
                      padding:2vh 2vw;}

.form_button        {border:none;
                     min-width:20%;
                     margin-left:40%;
                     margin-top:4vh;
                     padding:1.5vh 2vw;
                     background:white;
                     font-weight:700;
                     border-radius:20px;
                     color:#3D5471;}

/*========================================================== form css end ===========================================================*/

#company_parts      {width:100%;
                     padding:2vh 5vw;
                     margin-top:7vh;
                     display: flex;}

.part_details       {width:50%;
                     border:1.5px solid black;
                     padding:3vh 5vw;}

.part_details h2    {color: #3D5471;
                    font-weight:700;
                    }

.part_details img   {width:100%;
                     padding-bottom:5vh;}

/*====================================================== company_parts css end ======================================================*/

#widespread_wings   {width:100%;
                     display:flex;}

.counter            {width:25%;
                     border:1px solid #3D5471;
                     background-color:white;
                     color:#3D5471;
                     text-align: center;
                     padding:6vh 5vw;}

.counter:hover      {background: #3D5471;
                     color:white;
                     }

.counter:hover .white   {display: block;}

.counter:hover .blue   {display:none;}


.white      {display:none;}

  .item img  {width:80%;
              margin-left:10%;}

 .item h1{
    
    margin-top:3vh;
    margin-bottom: 2vh;
    font-size: 40px;
  }
.item h3{
    
    font-weight:500;
  }

  /* ============================================================= widespread_wings css end ============================================*/

  #Why_flourtech    {width:100%;
                     padding:5vh 5vw;}

  .why1             {width:60%;
                     padding:5vh 4vw;
                     background:#3D5471;
                     color:white;
                     float:left;}

.why2               {width:40%;
                    padding:12vh 4vw;
                    border:1px solid black;
                    background-size:100% 100%;
                    color: #3D5471;
                    background-image:url(images/why2_back-min.png);
                    float:left;}

.why3               {width:60%;
                    padding:5vh 4vw;
                    background-size:cover;
                    border:1px solid black;
                    margin-top:5vh;
                    color: #3D5471;
                    background-image:url(images/why3_back-min.png);}

.why4               {width:40%;
                     padding:5vh 4vw;
                     color:white;
                     background:#6C7784;
                     float:left;}

.why5                {width:60%;
                      padding:4vh 4vw;
                      color:white;
                      background: #3D5471;
                      float:left;}

/*============================================================ Why_flourtech ===============================================================*/
#our_project        {width:100%;
                    height: auto;
                    margin-top:30vh;
                     }
                    
#project_carousel   {width:90%;
                     margin-left:5%;
                     background: #3D5471;
                     }

.our_project        {margin-top:5vh;}

/* .carousel-item      {display:flex;
                    } */

/* .project_img        {width:50%;
                    float: left;
                  }

.project_img img    {width:100%;} */

.project_text       {width:100%;
                    text-align: center;
                    padding:15vh 5vw;
                    color:white;
                     float:left;}

/*=================================================== project_carousel part end ==============================================================*/

#certificate      {width:100%;
                   background: #3D5471;
                   padding:4vh 5vw;
                   margin-top:10vh;
                   display: flex;} 

.certi_text       {width:50%;
                  padding:10vh 5vw;}

.certi_text h2    {color:white;
                   font-weight:700;}

.certi_text p    {color:white;
                   font-weight:400;}

.certi_img       {width:50%;
                  }

.certi1           {width:35%;
                   margin-top:15vh;}

.certi2           {width:50%;
                   margin-left:8%;
                   margin-top:-20vh;}

.certi3           {width:40%;
                   margin-left:43%;
                   margin-top:-15vh;}

/*========================================================= certificate css end =======================================================*/

#machines         {width:100%;
                   margin-top:10vh;}

.machine1         {background-image: url(images/machine1.jpg);
                   background-size:100% 100%;
                   max-height:40vh;
                   overflow: hidden;}

.machine2         {background-image: url(images/machine2.jpg);
                   background-size:100% 100%;
                   max-height:40vh;
                   overflow: hidden;}

.machine3         {background-image: url(images/machine3.jpg);
                   background-size:100% 100%;
                   max-height:40vh;
                   overflow: hidden;}

.machine4         {background-image: url(images/machine4.jpg);
                   background-size:100% 100%;
                   max-height:40vh;
                   overflow: hidden;}

.machine5         {background-image: url(images/machine5.jpg);
                   background-size:100% 100%;
                   max-height:40vh;
                   overflow: hidden;}

.machine6         {background-image: url(images/machine6.jpg);
                   background-size:100% 100%;
                   max-height:40vh;
                   overflow: hidden;}

.machine7         {background-image: url(images/machine7.jpg);
                   background-size:100% 100%;
                   max-height:40vh;
                   overflow: hidden;}

.machine8         {background-image: url(images/machine8.jpg);
                   background-size:100% 100%;
                   max-height:40vh;
                   overflow: hidden;}

.machine_back:hover .machine_text {margin-top:0vh;}

.machine_text     {background:white;
                   opacity:0.8;
                   color: #3D5471;
                   transition-duration:0.5s;
                   transition-timing-function: ease-in-out;
                   margin-top:50vh;
                   padding:5vh 3vw;}

/*======================================================= machines css end ==============================================================*/

#testimonial    {width:80%;
                 margin-left:10%;
                 border:2px solid black;}

.testi_text       {width:80%;
                   margin-left:10%;}

.testi_name       {background:#3D5471;
                   padding:2vh 5vw;
                   width:80%;
                   margin-left:10%;
                   color:white;}

.testi_box img    {width:5%;}

.coma2            {float:right;}

.content-slider {
  width: 100%;
  height:auto;
}

.slider {
  height: 320px;
  
  margin: 40px auto 0;
  overflow: visible;
  position: relative;
}

.mask {
  overflow: hidden;
  height: 320px;
}

.slider ul {
  margin: 0;
  padding: 0;
  position: relative;
}

.slider li {
  
  height: 320px;
  position: absolute;
  top: -325px;
  list-style: none;
}

.slider .quote {
  font-size: 40px;
  font-style: italic;
}

.slider .source {
  font-size: 20px;
  text-align: right;
}

.slider li.anim1 {
  animation: cycle 15s linear infinite;
}

.slider li.anim2 {
  animation: cycle2 15s linear infinite;
}

.slider li.anim3 {
  animation: cycle3 15s linear infinite;
}

.slider li.anim4 {
  animation: cycle4 15s linear infinite;
}

.slider li.anim5 {
  animation: cycle5 15s linear infinite;
}

.slider:hover li {
  animation-play-state: paused;
}

@keyframes cycle {
  0% {
    top: 0px;
  }
  4% {
    top: 0px;
  }
  16% {
    top: 0px;
    opacity: 1;
    z-index: 0;
  }
  20% {
    top: 325px;
    opacity: 0;
    z-index: 0;
  }
  21% {
    top: -325px;
    opacity: 0;
    z-index: -1;
  }
  50% {
    top: -325px;
    opacity: 0;
    z-index: -1;
  }
  92% {
    top: -325px;
    opacity: 0;
    z-index: 0;
  }
  96% {
    top: -325px;
    opacity: 0;
  }
  100% {
    top: 0px;
    opacity: 1;
  }
}

@keyframes cycle2 {
  0% {
    top: -325px;
    opacity: 0;
  }
  16% {
    top: -325px;
    opacity: 0;
  }
  20% {
    top: 0px;
    opacity: 1;
  }
  24% {
    top: 0px;
    opacity: 1;
  }
  36% {
    top: 0px;
    opacity: 1;
    z-index: 0;
  }
  40% {
    top: 325px;
    opacity: 0;
    z-index: 0;
  }
  41% {
    top: -325px;
    opacity: 0;
    z-index: -1;
  }
  100% {
    top: -325px;
    opacity: 0;
    z-index: -1;
  }
}

@keyframes cycle3 {
  0% {
    top: -325px;
    opacity: 0;
  }
  36% {
    top: -325px;
    opacity: 0;
  }
  40% {
    top: 0px;
    opacity: 1;
  }
  44% {
    top: 0px;
    opacity: 1;
  }
  56% {
    top: 0px;
    opacity: 1;
    z-index: 0;
  }
  60% {
    top: 325px;
    opacity: 0;
    z-index: 0;
  }
  61% {
    top: -325px;
    opacity: 0;
    z-index: -1;
  }
  100% {
    top: -325px;
    opacity: 0;
    z-index: -1;
  }
}

@keyframes cycle4 {
  0% {
    top: -325px;
    opacity: 0;
  }
  56% {
    top: -325px;
    opacity: 0;
  }
  60% {
    top: 0px;
    opacity: 1;
  }
  64% {
    top: 0px;
    opacity: 1;
  }
  76% {
    top: 0px;
    opacity: 1;
    z-index: 0;
  }
  80% {
    top: 325px;
    opacity: 0;
    z-index: 0;
  }
  81% {
    top: -325px;
    opacity: 0;
    z-index: -1;
  }
  100% {
    top: -325px;
    opacity: 0;
    z-index: -1;
  }
}

@keyframes cycle5 {
  0% {
    top: -325px;
    opacity: 0;
  }
  76% {
    top: -325px;
    opacity: 0;
  }
  80% {
    top: 0px;
    opacity: 1;
  }
  84% {
    top: 0px;
    opacity: 1;
  }
  96% {
    top: 0px;
    opacity: 1;
    z-index: 0;
  }
  100% {
    top: 325px;
    opacity: 0;
    z-index: 0;
  }
}

/*============================================================= testimonial css end ======================================================*/

footer  {width: 100%;
        padding:5vh 10%;
        background-color: #3D5471;
        margin-top:5vh;
        color:white;}

.Copyright  {text-align:center;
             margin-top:3vh;}




      


























/* ============================================================large screen ke liye =======================================================*/

@media screen and (max-width:990px) {
 

h4      {font-weight:400;
         font-family: 'Raleway', sans-serif;}

p      {font-weight:500;
        font-family: 'Raleway', sans-serif;}

#social_link    {
                
                 padding:5vh 5vw;
                 font-size:2.5vw;
                 position: fixed;
                 margin-left:90%;}

#social_link a  {color: #1FA1D1;
                 font-size:4vw;}

#social_link a:hover  {color:#3D5471;}

.heading        {text-align: center;
                 color:#3D5471;
                 width:50%;
                 margin-left:25%;
                 font-weight:900;
                 padding:5vh 5vw;}

nav         {padding:5vh 5vw;}

nav img    {width:40%;
            margin-left:30%;}

header      {width:100%;
             display:grid;
             flex-direction:column;}

.head_img   {width:100%;
            }

.head_img img {width:100%;}

.head_text     {width:100%;
                padding:10vh 5%;}

.head_text h2   {color:#3D5471;
                 font-weight:900;
                 }

.head_text h3   {color:#3D5471;
                 font-weight:700;
                 font-size:2.5vw;}

/*================================================================= header css end =========================================================*/
                 


.form           {width:90%;
                 margin-left:5%;
                 padding:5vh 5vw;
                 background:#3D5471;
                 border-radius:20px;
                 }

 table          {width:100%;
                 }

 table tr       {}
 
 table td       {width:48%;
                 padding-left:2%;
                 padding-top:3vh;}

 table td input      {width:90%;
                     padding:2.5vh 1vw;}

 table textarea      {width:100%;
                      border-radius:20px;
                      padding:2vh 2vw;}

.form_button        {border:none;
                     min-width:20%;
                     margin-left:40%;
                     margin-top:4vh;
                     padding:1.5vh 2vw;
                     background:white;
                     font-weight:700;
                     border-radius:20px;
                     color:#3D5471;}

/*========================================================== form css end ===========================================================*/

#company_parts      {width:100%;
                     padding:2vh 5vw;
                     margin-top:7vh;
                     display: flex;
                     flex-direction: column;}

.part_details       {width:80%;
                     margin-left:10%;
                     border:1.5px solid black;
                     padding:3vh 5vw;}

.part_details h2    {color: #3D5471;
                    font-weight:700;
                    }

.part_details img   {width:100%;
                     padding-bottom:5vh;}

/*====================================================== company_parts css end ======================================================*/

#widespread_wings   {width:100%;
                     display:grid;
                     justify-content: center;
                     grid-template-columns:repeat(auto-fit,minmax(300px , 300px));}

.counter            {width:auto;
                     border:1px solid #3D5471;
                     background-color:white;
                     color:#3D5471;
                     text-align: center;
                     padding:6vh 5vw;}

.counter:hover      {background: #3D5471;
                     color:white;
                     }

.counter:hover .white   {display: block;}

.counter:hover .blue   {display:none;}


.white      {display:none;}

  .item img  {width:80%;
              margin-left:10%;}

 .item h1{
    
    margin-top:3vh;
    margin-bottom: 2vh;
    font-size: 40px;
  }
.item h3{
    
    font-weight:500;
  }

  /* ============================================================= widespread_wings css end ============================================*/

  #Why_flourtech    {width:100%;
                     padding:5vh 5vw;}

  .why1             {width:60%;
                     padding:5vh 4vw;
                     background:#3D5471;
                     color:white;
                     float:left;}

.why2               {width:40%;
                    padding:12vh 4vw;
                    border:1px solid black;
                    background-size:100% 100%;
                    color: #3D5471;
                    background-image:url(images/why2_back.png);
                    float:left;}

.why3               {width:60%;
                    padding:5vh 4vw;
                    background-size:cover;
                    border:1px solid black;
                    margin-top:5vh;
                    color: #3D5471;
                    background-image:url(images/why3_back.png);}

.why4               {width:40%;
                     padding:5vh 4vw;
                     color:white;
                     background:#6C7784;
                     float:left;}

.why5                {width:60%;
                      padding:4vh 4vw;
                      color:white;
                      background: #3D5471;
                      float:left;}

/*============================================================ Why_flourtech ===============================================================*/
#our_project        {width:100%;
                    height: auto;
                    margin-top:30vh;
                     }
                    
#project_carousel   {width:90%;
                     margin-left:5%;
                     background: #3D5471;
                     }

.our_project        {margin-top:5vh;}

/* .carousel-item      {display:flex;
                    } */

/* .project_img        {width:50%;
                    float: left;
                  }

.project_img img    {width:100%;} */

.project_text       {width:100%;
                    text-align: center;
                    padding:15vh 5vw;
                    color:white;
                     float:left;}

/*=================================================== project_carousel part end ==============================================================*/

#certificate      {width:100%;
                   background: #3D5471;
                   padding:4vh 5vw;
                   margin-top:10vh;
                   display:flex;
                   justify-content: center;
                   flex-direction:column;} 

.certi_text       {width:auto;
                   
                  padding:10vh 5vw;}

.certi_text h2    {color:white;
                   font-weight:700;}

.certi_text p    {color:white;
                  font-weight:400;}

.certi_img       {width:auto;
                  }

.certi1           {width:35%;
                   margin-top:15vh;}

.certi2           {width:50%;
                   margin-left:8%;
                   margin-top:-20vh;}

.certi3           {width:40%;
                   margin-left:43%;
                   margin-top:-15vh;}

/*========================================================= certificate css end =======================================================*/

#machines         {width:100%;
                   display:grid;
                   justify-content: center;
                   margin-top:10vh;}

.machine1         {background-image: url(images/machine1.jpg);
                   background-size:100% 100%;
                   max-height:40vh;
                   overflow: hidden;}

.machine2         {background-image: url(images/machine2.jpg);
                   background-size:100% 100%;
                   max-height:40vh;
                   overflow: hidden;}

.machine3         {background-image: url(images/machine3.jpg);
                   background-size:100% 100%;
                   max-height:40vh;
                   overflow: hidden;}

.machine4         {background-image: url(images/machine4.jpg);
                   background-size:100% 100%;
                   max-height:40vh;
                   overflow: hidden;}

.machine5         {background-image: url(images/machine5.jpg);
                   background-size:100% 100%;
                   max-height:40vh;
                   overflow: hidden;}

.machine6         {background-image: url(images/machine6.jpg);
                   background-size:100% 100%;
                   max-height:40vh;
                   overflow: hidden;}

.machine7         {background-image: url(images/machine7.jpg);
                   background-size:100% 100%;
                   max-height:40vh;
                   overflow: hidden;}

.machine8         {background-image: url(images/machine8.jpg);
                   background-size:100% 100%;
                   max-height:40vh;
                   overflow: hidden;}

.machine_back:hover .machine_text {margin-top:0vh;}

.machine_back     {min-width:300px;}

.machine_text     {background:white;
                   opacity:0.8;
                   color: #3D5471;
                   transition-duration:0.5s;
                   transition-timing-function: ease-in-out;
                   margin-top:50vh;
                   padding:5vh 3vw;}

/*======================================================= machines css end ==============================================================*/

#testimonial    {width:80%;
                 margin-left:10%;
                 border:2px solid black;}

.testi_text       {width:80%;
                   margin-left:10%;}

.testi_name       {background:#3D5471;
                   padding:2vh 5vw;
                   width:80%;
                   margin-left:10%;
                   color:white;}

.testi_box img    {width:5%;}

.coma2            {float:right;}

.content-slider {
  width: 100%;
  height:auto;
}

.slider {
  height: 320px;
  
  margin: 40px auto 0;
  overflow: visible;
  position: relative;
}

.mask {
  overflow: hidden;
  height: 320px;
}

.slider ul {
  margin: 0;
  padding: 0;
  position: relative;
}

.slider li {
  
  height: 320px;
  position: absolute;
  top: -325px;
  list-style: none;
}

.slider .quote {
  font-size: 40px;
  font-style: italic;
}

.slider .source {
  font-size: 20px;
  text-align: right;
}

.slider li.anim1 {
  animation: cycle 15s linear infinite;
}

.slider li.anim2 {
  animation: cycle2 15s linear infinite;
}

.slider li.anim3 {
  animation: cycle3 15s linear infinite;
}

.slider li.anim4 {
  animation: cycle4 15s linear infinite;
}

.slider li.anim5 {
  animation: cycle5 15s linear infinite;
}

.slider:hover li {
  animation-play-state: paused;
}

@keyframes cycle {
  0% {
    top: 0px;
  }
  4% {
    top: 0px;
  }
  16% {
    top: 0px;
    opacity: 1;
    z-index: 0;
  }
  20% {
    top: 325px;
    opacity: 0;
    z-index: 0;
  }
  21% {
    top: -325px;
    opacity: 0;
    z-index: -1;
  }
  50% {
    top: -325px;
    opacity: 0;
    z-index: -1;
  }
  92% {
    top: -325px;
    opacity: 0;
    z-index: 0;
  }
  96% {
    top: -325px;
    opacity: 0;
  }
  100% {
    top: 0px;
    opacity: 1;
  }
}

@keyframes cycle2 {
  0% {
    top: -325px;
    opacity: 0;
  }
  16% {
    top: -325px;
    opacity: 0;
  }
  20% {
    top: 0px;
    opacity: 1;
  }
  24% {
    top: 0px;
    opacity: 1;
  }
  36% {
    top: 0px;
    opacity: 1;
    z-index: 0;
  }
  40% {
    top: 325px;
    opacity: 0;
    z-index: 0;
  }
  41% {
    top: -325px;
    opacity: 0;
    z-index: -1;
  }
  100% {
    top: -325px;
    opacity: 0;
    z-index: -1;
  }
}

@keyframes cycle3 {
  0% {
    top: -325px;
    opacity: 0;
  }
  36% {
    top: -325px;
    opacity: 0;
  }
  40% {
    top: 0px;
    opacity: 1;
  }
  44% {
    top: 0px;
    opacity: 1;
  }
  56% {
    top: 0px;
    opacity: 1;
    z-index: 0;
  }
  60% {
    top: 325px;
    opacity: 0;
    z-index: 0;
  }
  61% {
    top: -325px;
    opacity: 0;
    z-index: -1;
  }
  100% {
    top: -325px;
    opacity: 0;
    z-index: -1;
  }
}

@keyframes cycle4 {
  0% {
    top: -325px;
    opacity: 0;
  }
  56% {
    top: -325px;
    opacity: 0;
  }
  60% {
    top: 0px;
    opacity: 1;
  }
  64% {
    top: 0px;
    opacity: 1;
  }
  76% {
    top: 0px;
    opacity: 1;
    z-index: 0;
  }
  80% {
    top: 325px;
    opacity: 0;
    z-index: 0;
  }
  81% {
    top: -325px;
    opacity: 0;
    z-index: -1;
  }
  100% {
    top: -325px;
    opacity: 0;
    z-index: -1;
  }
}

@keyframes cycle5 {
  0% {
    top: -325px;
    opacity: 0;
  }
  76% {
    top: -325px;
    opacity: 0;
  }
  80% {
    top: 0px;
    opacity: 1;
  }
  84% {
    top: 0px;
    opacity: 1;
  }
  96% {
    top: 0px;
    opacity: 1;
    z-index: 0;
  }
  100% {
    top: 325px;
    opacity: 0;
    z-index: 0;
  }
}

/*============================================================= testimonial css end ======================================================*/

footer  {width: 100%;
        padding:5vh 10%;
        background-color: #3D5471;
        margin-top:5vh;
        color:white;}

.Copyright  {text-align:center;
             margin-top:3vh;}

.foot_part  {min-width:300px;}

  
}


















/* ============================================================large screen ke liye =======================================================*/

@media screen and (max-width:660px) {
 

  h4      {font-weight:400;
           font-family: 'Raleway', sans-serif;}
  
  p      {font-weight:500;
          font-family: 'Raleway', sans-serif;}
  
  #social_link    {width:10%;
                   padding:5vh 5vw;
                   font-size:2.5vw;
                   position: fixed;
                   margin-left:80%;}
  
  #social_link a  {color: #1FA1D1;
                   font-size:7vw;}
  
  #social_link a:hover  {color:#3D5471;}
  
  .heading        {text-align: center;
                   color:#3D5471;
                   width:50%;
                   margin-left:25%;
                   font-weight:900;
                   padding:5vh 5vw;}
  
  nav         {padding:5vh 5vw;}
  
  nav img    {width:40%;
              margin-left:30%;}
  
  header      {width:100%;
               display:grid;
               flex-direction:column;}
  
  .head_img   {width:100%;
              }
  
  .head_img img {width:100%;}
  
  .head_text     {width:100%;
                  padding:10vh 5%;}
  
  .head_text h2   {color:#3D5471;
                   font-weight:900;
                   }
  
  .head_text h3   {color:#3D5471;
                   font-weight:700;
                   font-size:3.2vw;}
  
  /*================================================================= header css end =========================================================*/
                   
  
  
  .form           {width:90%;
                   margin-left:5%;
                   padding:5vh 5vw;
                   background:#3D5471;
                   border-radius:20px;
                   }
  
   table          {width:100%;
                   }
  
   table tr       {}
   
   table td       {width:48%;
                   padding-left:2%;
                   padding-top:3vh;}
  
   table td input      {width:90%;
                       padding:2.5vh 1vw;}
  
   table textarea      {width:100%;
                        border-radius:20px;
                        padding:2vh 2vw;}
  
  .form_button        {border:none;
                       min-width:20%;
                       margin-left:40%;
                       margin-top:4vh;
                       padding:1.5vh 2vw;
                       background:white;
                       font-weight:700;
                       border-radius:20px;
                       color:#3D5471;}
  
  /*========================================================== form css end ===========================================================*/
  
  #company_parts      {width:100%;
                       padding:2vh 5vw;
                       margin-top:7vh;
                       display: flex;
                       flex-direction: column;}
  
  .part_details       {width:80%;
                       margin-left:10%;
                       border:1.5px solid black;
                       padding:3vh 5vw;}
  
  .part_details h2    {color: #3D5471;
                      font-weight:700;
                      }
  
  .part_details img   {width:100%;
                       padding-bottom:5vh;}
  
  /*====================================================== company_parts css end ======================================================*/
  
  #widespread_wings   {width:100%;
                       display:grid;
                       justify-content: center;
                       grid-template-columns:repeat(auto-fit,minmax(300px , 300px));}
  
  .counter            {width:auto;
                       border:1px solid #3D5471;
                       background-color:white;
                       color:#3D5471;
                       text-align: center;
                       padding:6vh 5vw;}
  
  .counter:hover      {background: #3D5471;
                       color:white;
                       }
  
  .counter:hover .white   {display: block;}
  
  .counter:hover .blue   {display:none;}
  
  
  .white      {display:none;}
  
    .item img  {width:80%;
                margin-left:10%;}
  
   .item h1{
      
      margin-top:3vh;
      margin-bottom: 2vh;
      font-size: 40px;
    }
  .item h3{
      
      font-weight:500;
    }
  
    /* ============================================================= widespread_wings css end ============================================*/
  
    #Why_flourtech    {width:100%;
                       padding:5vh 5vw;}
  
    .why1             {width:60%;
                       padding:5vh 4vw;
                       background:#3D5471;
                       color:white;
                       float:left;}
  
  .why2               {width:40%;
                      padding:12vh 4vw;
                      border:1px solid black;
                      background-size:100% 100%;
                      color: #3D5471;
                      background-image:url(images/why2_back.png);
                      float:left;}
  
  .why3               {width:60%;
                      padding:5vh 4vw;
                      background-size:cover;
                      border:1px solid black;
                      margin-top:5vh;
                      color: #3D5471;
                      background-image:url(images/why3_back.png);}
  
  .why4               {width:40%;
                       padding:5vh 4vw;
                       color:white;
                       background:#6C7784;
                       float:left;}
  
  .why5                {width:60%;
                        padding:4vh 4vw;
                        color:white;
                        background: #3D5471;
                        float:left;}
  
  /*============================================================ Why_flourtech ===============================================================*/
  #our_project        {width:100%;
                      height: auto;
                      
                      margin-top:55vh;
                       }
                      
  #project_carousel   {width:90%;
                       margin-left:5%;
                       background: #3D5471;
                       }
  
  .our_project        {margin-top:5vh;}
  
  /* .carousel-item      {display:flex;
                      } */
  
  /* .project_img        {width:50%;
                      float: left;
                    }
  
  .project_img img    {width:100%;} */
  
  .project_text       {width:100%;
                      text-align: center;
                      padding:15vh 5vw;
                      color:white;
                       float:left;}
  
  /*=================================================== project_carousel part end ==============================================================*/
  
  #certificate      {width:100%;
                     background: #3D5471;
                     padding:4vh 5vw;
                     margin-top:10vh;
                     display: flex;} 
  
  .certi_text       {width:auto;
                    padding:10vh 5vw;}
  
  .certi_text h2    {color:white;
                     font-weight:700;}
  
  .certi_text p    {color:white;
                     font-weight:400;}
  
  .certi_img       {width:auto;
                    }
  
  .certi1           {width:35%;
                     margin-top:15vh;}
  
  .certi2           {width:50%;
                     margin-left:8%;
                     margin-top:-20vh;}
  
  .certi3           {width:40%;
                     margin-left:43%;
                     margin-top:-15vh;}
  
  /*========================================================= certificate css end =======================================================*/
  
  #machines         {width:100%;
                     display:grid;
                     justify-content: center;
                     margin-top:10vh;}
  
  .machine1         {background-image: url(images/machine1.jpg);
                     background-size:100% 100%;
                     max-height:40vh;
                     overflow: hidden;}
  
  .machine2         {background-image: url(images/machine2.jpg);
                     background-size:100% 100%;
                     max-height:40vh;
                     overflow: hidden;}
  
  .machine3         {background-image: url(images/machine3.jpg);
                     background-size:100% 100%;
                     max-height:40vh;
                     overflow: hidden;}
  
  .machine4         {background-image: url(images/machine4.jpg);
                     background-size:100% 100%;
                     max-height:40vh;
                     overflow: hidden;}
  
  .machine5         {background-image: url(images/machine5.jpg);
                     background-size:100% 100%;
                     max-height:40vh;
                     overflow: hidden;}
  
  .machine6         {background-image: url(images/machine6.jpg);
                     background-size:100% 100%;
                     max-height:40vh;
                     overflow: hidden;}
  
  .machine7         {background-image: url(images/machine7.jpg);
                     background-size:100% 100%;
                     max-height:40vh;
                     overflow: hidden;}
  
  .machine8         {background-image: url(images/machine8.jpg);
                     background-size:100% 100%;
                     max-height:40vh;
                     overflow: hidden;}
  
  .machine_back:hover .machine_text {margin-top:0vh;}
  
  .machine_back     {min-width:300px;}
  
  .machine_text     {background:white;
                     opacity:0.8;
                     color: #3D5471;
                     transition-duration:0.5s;
                     transition-timing-function: ease-in-out;
                     margin-top:50vh;
                     padding:5vh 3vw;}
  
  /*======================================================= machines css end ==============================================================*/
  
  #testimonial    {width:80%;
                   margin-left:10%;
                   border:2px solid black;}
  
  .testi_text       {width:80%;
                     margin-left:10%;}
  
  .testi_name       {background:#3D5471;
                     padding:2vh 5vw;
                     width:80%;
                     margin-left:10%;
                     color:white;}
  
  .testi_box img    {width:5%;}
  
  .coma2            {float:right;}
  
  .content-slider {
    width: 100%;
    height:auto;
  }
  
  .slider {
    height: 320px;
    
    margin: 40px auto 0;
    overflow: visible;
    position: relative;
  }
  
  .mask {
    overflow: hidden;
    height: 320px;
  }
  
  .slider ul {
    margin: 0;
    padding: 0;
    position: relative;
  }
  
  .slider li {
    
    height: 320px;
    position: absolute;
    top: -325px;
    list-style: none;
  }
  
  .slider .quote {
    font-size: 40px;
    font-style: italic;
  }
  
  .slider .source {
    font-size: 20px;
    text-align: right;
  }
  
  .slider li.anim1 {
    animation: cycle 15s linear infinite;
  }
  
  .slider li.anim2 {
    animation: cycle2 15s linear infinite;
  }
  
  .slider li.anim3 {
    animation: cycle3 15s linear infinite;
  }
  
  .slider li.anim4 {
    animation: cycle4 15s linear infinite;
  }
  
  .slider li.anim5 {
    animation: cycle5 15s linear infinite;
  }
  
  .slider:hover li {
    animation-play-state: paused;
  }
  
  @keyframes cycle {
    0% {
      top: 0px;
    }
    4% {
      top: 0px;
    }
    16% {
      top: 0px;
      opacity: 1;
      z-index: 0;
    }
    20% {
      top: 325px;
      opacity: 0;
      z-index: 0;
    }
    21% {
      top: -325px;
      opacity: 0;
      z-index: -1;
    }
    50% {
      top: -325px;
      opacity: 0;
      z-index: -1;
    }
    92% {
      top: -325px;
      opacity: 0;
      z-index: 0;
    }
    96% {
      top: -325px;
      opacity: 0;
    }
    100% {
      top: 0px;
      opacity: 1;
    }
  }
  
  @keyframes cycle2 {
    0% {
      top: -325px;
      opacity: 0;
    }
    16% {
      top: -325px;
      opacity: 0;
    }
    20% {
      top: 0px;
      opacity: 1;
    }
    24% {
      top: 0px;
      opacity: 1;
    }
    36% {
      top: 0px;
      opacity: 1;
      z-index: 0;
    }
    40% {
      top: 325px;
      opacity: 0;
      z-index: 0;
    }
    41% {
      top: -325px;
      opacity: 0;
      z-index: -1;
    }
    100% {
      top: -325px;
      opacity: 0;
      z-index: -1;
    }
  }
  
  @keyframes cycle3 {
    0% {
      top: -325px;
      opacity: 0;
    }
    36% {
      top: -325px;
      opacity: 0;
    }
    40% {
      top: 0px;
      opacity: 1;
    }
    44% {
      top: 0px;
      opacity: 1;
    }
    56% {
      top: 0px;
      opacity: 1;
      z-index: 0;
    }
    60% {
      top: 325px;
      opacity: 0;
      z-index: 0;
    }
    61% {
      top: -325px;
      opacity: 0;
      z-index: -1;
    }
    100% {
      top: -325px;
      opacity: 0;
      z-index: -1;
    }
  }
  
  @keyframes cycle4 {
    0% {
      top: -325px;
      opacity: 0;
    }
    56% {
      top: -325px;
      opacity: 0;
    }
    60% {
      top: 0px;
      opacity: 1;
    }
    64% {
      top: 0px;
      opacity: 1;
    }
    76% {
      top: 0px;
      opacity: 1;
      z-index: 0;
    }
    80% {
      top: 325px;
      opacity: 0;
      z-index: 0;
    }
    81% {
      top: -325px;
      opacity: 0;
      z-index: -1;
    }
    100% {
      top: -325px;
      opacity: 0;
      z-index: -1;
    }
  }
  
  @keyframes cycle5 {
    0% {
      top: -325px;
      opacity: 0;
    }
    76% {
      top: -325px;
      opacity: 0;
    }
    80% {
      top: 0px;
      opacity: 1;
    }
    84% {
      top: 0px;
      opacity: 1;
    }
    96% {
      top: 0px;
      opacity: 1;
      z-index: 0;
    }
    100% {
      top: 325px;
      opacity: 0;
      z-index: 0;
    }
  }
  
  /*============================================================= testimonial css end ======================================================*/
  
  footer  {width: 100%;
          padding:5vh 10%;
          background-color: #3D5471;
          margin-top:5vh;
          color:white;}
  
  .Copyright  {text-align:center;
               margin-top:3vh;}
  
  .foot_part  {min-width:300px;}
  
  
  
  
        
  
  
  
  
  
  
  
  
  
  
  
  
  
  
    
  }