@import url('css2.css');
@import url('css21.css');


:root {
  --link-clr: #575757;
  --whiteclr: #fff;
  --primary-textclr: #3A3A3A;
  --darkClr: #000;
  --tcolor: #18c59d;
  --btnHover: #f26551;
  --borderClr: #707070;
  --bgLight: #f3f6f7 ;
  --primary-font:  'Jost', sans-serif;
  --secondary-font:  'Raleway', sans-serif;
  --fsbody: 16px;
  
  }


body{font-family: var( --primary-font); font-size:var(--fsbody);font-weight:400; color:var(--link-clr); line-height: 1.65;}
a{color: var(--link-clr);text-decoration:none;outline: none;}

a,
.btn,
button{-webkit-transition: all .3s;-moz-transition: all .3s;-o-transition: all .3s;transition: all .3s; }
a:hover {color: var(--darkClr); text-decoration: none;}
.fancybox-button{min-width: auto;} 

h1, h2, h3, h4, h5, h6{ font-family: var(--secondary-font); font-weight: 700; line-height: 1.2;  
margin-block-end: 20px; color: var(--primary-textclr);}
.main-section a.link { word-break: break-all;}
a.link i {font-size: 11px;}
h1{font-size: 40px; font-weight:700; letter-spacing:0px;}
h2{font-size: 37px; }
h3{font-size: 35px; font-weight: 700;}
h4{font-size: 25px;}
h5{font-size: 21px;}
h6{font-size: 16px;}


.mrt-20{margin-block-start:20px;}
.mb-50 {margin-block-end: 50px;}
.fs-60{font-size:60px;}
.fs-45 {font-size:45px;}
.fs-35 {font-size:35px;}
.fs-30 {font-size:30px;}
.fs-25{font-size:25px;}
.fs-18{font-size:18px;}


img{max-width: 100%;}
  
button, .btn, input[type="submit"]{min-width: 116px;border:0px;padding: 11px 20px;cursor: pointer;position: relative;font-family: var( --primary-font);box-shadow: none !important;color: var(--whiteclr);background: var(--tcolor);font-size: 15px;font-weight: 600;border-radius: 4px;letter-spacing: 1px;text-transform: capitalize;}
  
 
[type=reset]:hover, [type=submit]:hover, button:hover, .btn:hover, html [type=button]:hover  {background: var(--btnHover);border-color: var(--btnHover);color: var(--whiteclr);cursor: pointer;}
 




[type=reset]:focus, 
[type=submit]:focus,
button:focus, 
.btn:focus, 
html [type=button]:focus { outline: 0; box-shadow: 0 0 8px rgba(0, 0, 0, .33);}
 
a.link {font-weight: 600;text-decoration: none;}
input{ font-family: 'Rajdhani', sans-serif; }
input[type="file"] { font-size: 14px;   -webkit-appearance: none;}
.field {margin-block-end: 15px;display: inline-block;width: 100%;}
.form-control {outline: none !important;padding: 14px 15px;border-radius: 4px;border: 1px solid #C4C4C4;background: var(--whiteclr);box-shadow:none !important;font-size: 14px;font-weight: 400;color: #D8D8D8;font-family: var( --primary-font);}
textarea.form-control { min-height: 91px;}
.form-control:focus {  background-color: transparent;  border-color: inherit;} 
select.form-control:not([size]):not([multiple]) { height: 49px; -webkit-appearance: none;   background-image: url(https://agweb.co.in/ag/images/select-arrow.png);
    background-position: 95% center;    background-repeat: no-repeat;}
blockquote { padding: 25px 25px; border-left: 4px solid var(--darkClr);     background: rgba(16, 86, 120, 0.05);
   font-size: 17px;   font-weight: 300;   position: relative;  line-height: 28px; }
blockquote strong{font-weight:500;}
blockquote:before {content: "";  position: absolute;   top: 0;   right: 0;   border-style: solid;  border-width: 0 41px 41px 0;    border-color: #ddd #fff;   transition: all ease .5s;}
 
.bg-site {background: #FFF6EB;color: var(--whiteclr);}
.form-group label {display: block;  margin-block-end: 10px;}


 /* nochange*/
 
.font-medium{ font-weight: 500;}
.underline {text-decoration: underline;}
 strong { font-weight: 700;}
.font-light{font-weight: 300;}
.font-semi-bold{font-weight: 600;}
::placeholder {color: #C4C4C4;  opacity: 1;  }
::-webkit-input-placeholder {color:#C4C4C4; opacity:1;}
::-moz-placeholder { color:#C4C4C4; opacity:1;}
:-ms-input-placeholder {color:#C4C4C4; opacity:1;}
:-moz-placeholder {color:#C4C4C4; opacity:1;}

.white-placeholder .form-control::placeholder {  color:#FFF; opacity: 1;  }
.white-placeholder .form-control::-webkit-input-placeholder { color:#FFF; opacity: 1;}
.white-placeholder .form-control::-moz-placeholder {color:#FFF; opacity:1;}
.white-placeholder .form-control:-ms-input-placeholder {color:#FFF; opacity: 1;}
.white-placeholder .form-control:-moz-placeholder {color:#FFF; opacity: 1;}


.main-section{padding:60px 0px; background-size: cover !important; background-repeat: no-repeat !important; background-position: center center !important;position: relative;}
.main-section .container{position:relative;}
.main-section:before{content:""; position:absolute; left:0px; top:0px; width:100% !important; height:100% !important; background:transparent; }
.pr-50{padding-inline-end:50px;}
.pl-50{padding-inline-start:50px;}
button.close:before { display: none;}
button.close { min-width: auto;  color: var(--darkClr) !important;  opacity: 1;  background: transparent !important;}
button.close.white-btn {color: #fff !important;}
 .br-5{border-radius: 5px;}
.br-10{border-radius: 10px;}
.box-shadow{ box-shadow: 5px 5px 10px rgb(0 0 0 / 6%);}
.object-fit {overflow: hidden;}
.object-fit img { width: 100%; height: 100%;  object-fit: cover;}
.zoom-hover img {-webkit-transition-timing-function: cubic-bezier(0.7,0,0.3,1);
    transition-timing-function: cubic-bezier(0.7,0,0.3,1);
    transition: all .5s;}
.zoom-hover:hover img {transform: scale(1.1);}
.sprit-icon { background-image: url(https://agweb.co.in/ag/images/sprit.png); background-repeat: no-repeat;
  background-size: auto;  display: inline-block;}
.list-style {padding: 0px; list-style: none;}
.list-style li { display: inline-block;}
i.fas.fa-phone {transform: rotate(90deg);}

/* header */
.top-bar {padding: 5px 0px; background: #676767;  color: var(--whiteclr);} 
.top-bar ul { margin: 0px; } 
.top-bar ul li { margin-inline-end: 15px; } 
.top-bar ul li:last-child { margin-inline-end: 0px;  }
.top-bar ul li a{color:#fff;}
.main-bar {padding: 20px 0px 15px;}
nav.menu ul {display: inline-block;margin-inline-end: 50px;}
nav.menu ul.main-list > li{position: relative;}
nav.menu ul.main-list > li { margin-inline-end: 5px;}
nav.menu ul.main-list > li a {padding: 10px 15px;}


header.header.sticky {position: fixed; z-index: 11; background: var(--whiteclr); left: 0px; top: -3px; width: 100%; -ms-animation-name: fadeInDown; -moz-animation-name: fadeInDown; -op-animation-name: fadeInDown; -webkit-animation-name: fadeInDown; animation-name: fadeInDown; -ms-animation-duration: 500ms; -moz-animation-duration: 500ms; -op-animation-duration: 500ms; -webkit-animation-duration: 500ms; animation-duration: 500ms; -ms-animation-timing-function: linear; -moz-animation-timing-function: linear; -op-animation-timing-function: linear; -webkit-animation-timing-function: linear; animation-timing-function: linear; -ms-animation-iteration-count: 1; -moz-animation-iteration-count: 1;
 -op-animation-iteration-count: 1; -webkit-animation-iteration-count: 1; animation-iteration-count: 1;}


/* Banner  */

header.header {border-bottom: 1px solid rgb(0 0 0 / 6%);-webkit-transition: all .3s;-moz-transition: all .3s;-o-transition: all .3s;transition: all .3s;}
.hero-banner {height: calc(100vh - 130px);display: flex;align-items: center;justify-content: left;}
.hero-text {max-width: 70%;}
.hero-text h1{font-size: 80px; font-family: var( --primary-font);}
.hero-text p{font-size:30px;}

.divder { display: inline-block; width: 100%; margin: 0px 0px 25px; } 
.divder span { display: inline-block; width: 80px; height: 2px; background: var(--btnHover); } 
.main-title h2, 
.main-title h3, 
.main-title h4, 
.main-title h5, 
.main-title h6 { margin-block-end: 0px; } 
.tagline { color:var(--btnHover); font-weight: 500; margin-block-end: 0px; }
.services-info {padding: 15px 0px;}
.services-info h4 {margin-block-end: 10px;}
.count-text {font-size: 20px;font-weight: 500;}
.count-number {color: var(--btnHover);font-size: 30px;}

.count-number { color: var(--whiteclr); font-size: 25px; width: 80px; height: 80px; margin: auto; background: transparent; line-height: 80px; margin-block-end: 20px; border-radius: 100%; position: relative; z-index: 10; }
.count-number:after { content: ''; display: block; position: absolute; left: 0px; top: -2px; width: 100%; 
  height: 100%; background: var(--tcolor); border-radius: 63% 37% 54% 46%; 
  background-size: 1600% 1600%; animation: transform 10s ease-in-out infinite both alternate; z-index: -1; }
img.slider-img { position: absolute;  right: 50px;  top: 31%;  max-width: 331px;   transform: rotate(10deg);}

/* owl */
.owl-dots button:before, .owl-dots button:after, 
.owl-dots button span:before, .owl-dots button span:after { display: none; }
.owl-dots { height: auto !important; width: 100%; text-align: center;padding-block-start:20px;  background: transparent !important;}
.owl-dots button {background-color: var(--primary-textclr) !important;overflow: hidden;display: inline-block;min-width: auto !important;margin-inline-end: 5px;width: 2px;height: 12px;border: none !important;border-radius: 0px !important;vertical-align: bottom;}
.owl-dots button.owl-dot.active {background: var(--tcolor) !important;height: 20px;}
.owl-dots button{box-shadow:none !important; outline:none !important;}
.owl-nav button {width: 50px;min-width: auto;height: 50px;position: relative;line-height: 53px !important;overflow: hidden;border: none !important;color: #fff !important;pointer-events: all;background: var(--tcolor) !important;}
.owl-nav button span {position: relative;z-index: 1;min-width: auto;}  
.owl-nav  .fa-angle-right:before {font-family: 'remixicon' !important; content: "\ea6e";}
.owl-nav .fa-angle-left:before {font-family: 'remixicon' !important; content: "\ea64";} 
i.fa { font-style: normal;}
.owl-carousel .owl-item img {width: auto;}
.owl-nav { position: absolute; left: 50%; top: 50%; width: 100%; transform: translate(-50%, -50%); } 
.owl-nav .owl-next { float: right; margin-inline-end: -25px; } 
.owl-nav .owl-prev { float: left; margin-inline-start: -25px;  } 
.owl-nav button:hover { background: var(--btnHover) !important; }

.portfolio-header {text-align: center; padding: 15px 15px;}
.portfolio-header h5 {margin-block-end: 5px; font-size: 19px;}
.cta-section{background-image: url(../image/webplant-bg.jpg);}
.cta-section::before { background: linear-gradient(124deg, rgb(243 246 247 / 94%), rgb(243 246 247 / 50%));}

.test-img.object-fit { width: 70px; height: 70px; border-radius: 100%; 
  display: inline-block;  margin-inline-end: 10px; } 
.test-header { display: flex; width: 100%; align-items: center; margin-block-end: 10px; } 
.testimonials-slider .item { padding: 15px 15px; } 
.testimonials-slider .item .test-box {box-shadow: 0px 15px 60px 0px rgb(216 216 216 / 18%);
  padding: 20px;border-radius: 5px; overflow: hidden;  background: var(--whiteclr);  } 
.test-content { font-weight: 400; font-style: italic; }
.test-header p {font-style: italic; font-size: 13px;}
.about-img.align-left.text-center {float: left; margin: 0px 30px 30px 0px; max-width: 400px;}
.process-box { padding: 20px; font-size: 15px; -webkit-transition: all .3s; -moz-transition: all .3s; 
  -o-transition: all .3s; transition: all .3s; border-radius:10px; } 
.process-box h5 { margin-block-end: 10px; font-size:17px; } 
.services-icon { font-size: 35px; color: var(--btnHover); display: flex;align-items: center;justify-content: center;} 
.mb-30 { margin-block-end: 30px; } 
.process-box:hover { box-shadow: 0px 14px 18px rgb(0 0 0 / 21%); }

.article-txt h3 { -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; 
  font-size: 20px; margin-bottom: 10px; }
.homeblog .article-img.object-fit {height: 200px;}
.homeblog .article-img.object-fit img { width: 100%;}  


@keyframes transform{
  0%,
100% { border-radius: 63% 37% 54% 46% / 55% 48% 52% 45%; } 
 14% { border-radius: 40% 60% 54% 46% / 49% 60% 40% 51%; } 
 28% { border-radius: 54% 46% 38% 62% / 49% 70% 30% 51%; } 
 42% { border-radius: 61% 39% 55% 45% / 61% 38% 62% 39%; } 
 56% { border-radius: 61% 39% 67% 33% / 70% 50% 50% 30%; } 
 70% { border-radius: 50% 50% 34% 66% / 56% 68% 32% 44%; } 
 84% { border-radius: 46% 54% 50% 50% / 35% 61% 39% 65%; } 
}


.tcolor{color: var(--tcolor);}
.bg-light{background-color: var(--bgLight) !important; }
.bg-dark {background-color: var(--primary-textclr) !important;} 

/* footer  */

/* footer  */
.footer{padding-block-start: 60px;font-weight: 500;}
.footer-logo { max-width: 200px;}
.footer-widget ul { list-style: none; padding: 0px; margin: 0px; } 
.footer-widget ul li { font-weight: 500; margin-block-end: 10px; } 
.footer-widget ul li a:hover { color: var(--tcolor); } 
.widget-title { font-size: 20px; margin-block-start: 15px; margin-block-end: 20px; } 
address {position: relative;padding-inline-start: 30px;font-size: 16px;} 
address span,
address .i  { position: absolute; top: 0px; left: 0px; font-size: 20px; 
  color: var(--tcolor); }  
.copyright { margin-block-start: 25px; padding: 10px 0px; font-size: 13px; background: #ececec; }
.back-to-top {    position: fixed;  bottom: 70px;  right: 30px; text-align: center; font-size: 16px; color: var(--darkClr); letter-spacing: .308px; z-index: 1111;
    display: inline-block !important;}
.back-to-top span { border-radius: 50%; border: 1px solid var(--tcolor);width: 42px;  height: 42px;  overflow: hidden;   
  display: inline-block; line-height: 42px;vertical-align: middle;  margin-inline-start: 10px; letter-spacing: .308px; background: var(--tcolor); color:#fff;}
 a.whatsapp-link { display: inline-block;max-width: 155px;  position: fixed;  bottom: 20px; z-index: 11; left: 30px;} 

/* breadcrumb */
 
ul.breadcrumb{border-radius:0;margin:0;background:transparent;padding: 0px;display: inline-block;}
ul.breadcrumb a{ text-decoration:none;}
.breadcrumb li{text-transform:capitalize;transition:all .5s;display: inline-block;font-size: 16px;font-weight: 500;color: var(--btnHover);}
.breadcrumb li:nth-last-child(1):after{display:none;}
ol.breadcrumb {background: transparent;color: var(--whiteclr);padding: 0px;margin-block-end: 0;
  justify-content: center;}
.breadcrumb li a {color: var(--link-clr);}
.breadcrumb-item.active {color: var(--whiteclr);}
.breadcrumb-item+.breadcrumb-item::before {color: var(--whiteclr);content: "\e90a";
font-family: 'LineIcons' !important;     font-size: 11px;}
.breadcrumb li:after {content: "/";margin: 0px 4px 0px 8px;color: var(--darkClr);} 

/* about us */
.banner.inner-banner {background: rgb(0 0 0 / 6%); padding: 10px 0px;}
.value-box span {font-size: 40px;}
.value-box {background:var(--whiteclr); padding: 20px 20px; height: 100%;}
.ser-box {border-radius: 15px; padding: 50px;  margin: 0px 0px 40px; 
  background-color: var(--bgLight) !important;}
.work-pg .portfolio-header { position: absolute;   bottom: -35px;
    left: 0px;   width: 100%;  background: var(--btnHover);  color: var(--whiteclr);
    -webkit-transition: all .3s;   -moz-transition: all .3s;    -o-transition: all .3s;
    transition: all .3s;    display: flex;   align-items: center;  justify-content: center; }
.work-pg .portfolio-item { position: relative;  margin-block-end: 40px;  overflow: hidden;
    display: flex;  align-items: center;  justify-content: center;}
.work-pg .portfolio-header h5, .work-pg .portfolio-header a { color: var(--whiteclr);}
.work-pg .portfolio-item:hover .portfolio-header {bottom: 0px;background: var(--tcolor);}
.get-in-touch { background: rgb(0 0 0 / 6%); padding: 40px;  height: 100%;}
.fs-20 { font-size: 20px;}



/* faq page */
 

.card-header { padding: 0px; background: transparent; border: none; } 
.card {border: none;margin-block-end: 0px;border-radius: 0px;border-top: 1px solid var(--borderClr);background-color: transparent;} 
.card-header button {background: transparent !important;border-radius: 0px !important;text-align: left;
  width: 100%;  color: #3D3D3D !important;  font-size: 24px;  padding: 15px 40px 15px 0px;  font-weight: 500;  text-decoration: none !important;
  word-break: break-word;  border: none;  white-space: normal;  } 
.card-body p:last-child { margin-block-end: 0px; }
.card-header button.collapsed:before {transform: none;}
.card-header button:before { content: "+";   font-weight: 400;  position: absolute;  
   transform: rotate(45deg);   right: 0px;  padding: 0px 12px; font-style: normal;
    -webkit-font-smoothing: antialiased; } 
#accordion .card-body { padding: 0px 40px 35px 0px;}
div#accordion {border-bottom: 1px solid var(--borderClr);}
.sitemap-pg ul { list-style: none; padding: 0px;}
.sitemap-pg ul li { position: relative;  padding-inline-start: 23px;  margin-block-end: 10px;
    display: inline-block;   width: 33.33%;  float: left;  font-weight: 600;}
.sitemap-pg ul li:before { font-family: remixicon!important;  content: "\ea6e";  color: var(--btnHover);top: 0px;position: absolute;  left: 0px;}

.article-img.object-fit { height: 370px; border-radius: 10px; position: relative; margin-block-end: 30px; } 
.overlay { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 20px; 
  background: linear-gradient(45deg, black, transparent); color: var(--whiteclr); pointer-events: none; } 
  .overlay *{pointer-events: all;}
.overlay h3 { font-size: 23px; line-height: normal; margin-inline-end: 10px; color: var(--whiteclr);   } 
.overlay h3 a { color: var(--whiteclr); } 
.overlay h3 a:hover { color: var(--tcolor);; } 
.meta.d-flex { align-items: center; grid-gap: 15px; } 
.meta.d-flex p { margin-block-end: 0px; font-size: 14px; } 
.vam { vertical-align: middle; }
ul.pagination { justify-content: center; padding-block-start: 20px; } 
ul.pagination li a { color: var(--link-clr); outline:none; box-shadow:none; }
.page-link:focus,
.page-link:hover{box-shadow: none !important; color: var(--tcolor);}
.sidebar h5 { background: rgb(0 0 0 / 6%); padding: 10px; } 
.sidebar ul { padding-inline-start: 20px; } 
.sidebar ul li { font-size: 14px; margin-inline-end: 15px; } 
.sidebar { position: sticky; top: 100px; }
.sidebarwidget { margin-inline-end: 15px; } 
.tags { display: flex; flex-wrap: wrap; gap: 7px; } 
.tags a { background: rgb(0 0 0 / 6%); padding: 5px 8px; border-radius: 5px; font-size: 14px; } 
.tags a:hover { background: var(--tcolor); color: var(--whiteclr); }
.blog-single-pagination { border-top: 1px solid var(--borderClr); padding-block-start: 30px; margin-inline-start: 0px; } 
.blog-single-pagination ul { padding: 0px; list-style: none; display: flex; } 
.blog-single-pagination ul li { flex: 1; position: relative; padding-inline-start: 40px; } 
.blog-single-pagination ul li:last-child { padding-inline-start: 0px; padding-inline-end: 40px; text-align: right;}
.blog-single-pagination ul li i { position: absolute;  inset-inline-start: 0px;}
.blog-single-pagination ul li:last-child i {inset-inline-end: 0px; inset-inline-start: auto;} 


@keyframes fadeInTop {
  from {
    opacity: 0;
    transform: translate3d(0, 20%, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

/* container */
.container{margin: 0px auto;}
.container-left {
    padding-inline-start: calc(50% - 570px);
}
 
@media (min-width: 767px){ 
.container { max-width: 100%;}
}


@media (min-width: 768px){
.container {max-width: 720px;}
}

@media (min-width: 992px){
.container {max-width: 960px;}

}
@media (min-width: 1200px){
.container {max-width: 1170px; }
.container-fluid {padding-inline-start: 15px;  padding-inline-end: 15px;}

}

 
@media (min-width:1680px){
 
}


