@charset "utf-8";
/* CSS Document */


*{ margin:0; padding:0;}

body{ margin:0; padding:0; text-align:center; background:#fff;}

a{transition:all 0.5s ease-in-out;-webkit-transition:all 0.5s ease-in-out;-moz-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;-ms-transition:all 0.5s ease-in-out;}
/*=================== classes start here======================*/

.headings{ font-family:'headachenormal'; font-size:20px; color:#253149;}

.content{  font-family:"Times New Roman", Times, serif; font-size:14px; color:#474747; text-align:left;}

.span{ font-family:'ambleregular'; font-size:14px; color:#05132f;}

.span-2{ font-family:'ambleregular'; font-size:14px; color:#05132f; margin:0px 0px 0px 0px;}


.copy-right{ font-family:'helveticaregular'; color:#727272; font-size:12px; margin:100px 10px 0 0;}

.transletdiv-back{ float:left; margin:15px 0 0 4px;}
.translet-flag-back{ float:left; margin:3px 0 0 -4px; width:400px; height:40px; /*background:#666;*/}
.translet-main-div{ float:right; margin:0px 0 0 0; width:540px; height:47px; /*background:#000;*/}
.flag-1{ float:left; margin:5px 5px 0 10px; width:40px; height:20px; background:#999; /*border:solid 1px #000;*/}






/*=============== classes end here========================*/


.header-a-100{ width:100%; margin:0 auto; padding:0; /*background-color:#000;*/ background:url(../images/header-100.png) repeat-x;}

.header-container-1031{ width:1031px; height:47px; margin:0 auto; padding:0; /*background-color:#CCC;*/}

.fb-button-back{ width:166px; height:34px; float:left; margin:8px 0 0 20px; padding:0 0 0 0; /*background-color:#009;*/}

.menu-back-a-100{ width:100%; margin:0 auto; padding:0; /*background-color:#000;*/ background:url(../images/menu-back-100.png) repeat-x;}

.menu-container-1031{ width:1031px; height:43px; margin:0 auto; padding:0; /*background-color:#999;*/ /*background:url(../images/menu-bar-back.png)*/ position:relative;}

.logo{ width:169px; height:129px; float:left; margin:0 0 0 15px; padding:0; /*background-color:#000;*/position:absolute;z-index:10;
/*z-index:9999999;*/
}

.main-menu-back{ width:690px; height:43px; float:left; margin:0 0 0 185px; /*background-color:#093;*/}

.menu{ margin-left:75px; padding:0;}

.menu ul{ margin:0; padding:0; list-style-type:none;}

.menu li{ margin:0; padding:0; list-style-type:none; display:inline; float:left;}

.menu li a{ margin:0px 0 0 0; padding:13px 12px 10px 20px; list-style-type:none; display:inline; float:left; text-decoration:none; font-family:'kingthings_exeterregular', serif; font-size:18px; color:#FFF; border-right:1px solid #3f3f3f; box-shadow: 0px 0px 1px 0px #000;}

.menu li a:hover{ margin:0px 0 0 0; padding:13px 12px 10px 20px; list-style-type:none; display:inline; float:left; text-decoration:none; font-family:'kingthings_exeterregular'; font-size:18px; color:#5dcaf0; border-right:1px solid #3f3f3f; box-shadow: 0px 0px 1px 0px #000; -o-transition:color 0.3s ease-out, background 0.3s ease-in;
  -ms-transition:color 0.3s ease-out, background 0.3s ease-in;
  -moz-transition:color 0.3s ease-out, background 0.3s ease-in;
  -webkit-transition:color 0.3s ease-out, background 0.3s ease-in;}

.request-button-back{ width:147px; height:43px; float:right; margin:0; padding:0; background:url(../images/request-button-back.png) no-repeat;}

#request-button-link{ margin:10px 0px 0px 0px; padding:0; float:left; width:147px; /*background:#006;*/}
.request-button-back a{ margin:10px 0 0 0; padding:0; list-style-type:none; text-decoration:none; color:#000; font-family:'Arial', Helvetica, sans-serif; font-size:18px; font-style:italic; font-weight:bold;}





.banner-a-100{ width:100%; margin:0 auto; padding:0; /*background-color:#000;*/ background:url(../images/images/banner-back.png) repeat-x #1884cc; }

.banner-container-1305{ width:1305px; height:528px; margin:0 auto; padding:0; /*background-color:#CCC;*/}


.banner-bottom-a-100{ width:100%; margin:0 auto; padding:0; /*background-color:#000;*/ background:url(../images/banner-bottom-100.png) repeat-x; position:absolute;z-index:10;
/*z-index:999;*/
    
}

.banner-bottom-container-1305{ width:1051px; height:49px; margin:0 auto; padding:0; /*background-color:#CCC;*/ }

.banner-bottom-button-1{ width:203px; height:81px; float:left; margin:-43px 0 0 0px; padding:0; background-color:#000; background:url(../images/images/button\ 1.png) no-repeat; cursor:pointer;}

.banner-bottom-button-2{ width:203px; height:81px; float:left; margin:-43px 0 0 8px; padding:0; background-color:#000; background:url(../images/images/laminated.png) no-repeat; cursor:pointer;}

.banner-bottom-button-3{ width:203px; height:81px; float:left; margin:-43px 0 0 8px; padding:0; background-color:#000; background:url(../images/images/ButtonsBop.png) no-repeat; cursor:pointer;}

.banner-bottom-button-4{ width:203px; height:81px; float:left; margin:-43px 0 0 8px; padding:0; background-color:#000; background:url(../images/pvc-roll-new-btn.png) no-repeat; cursor:pointer;}

.banner-bottom-button-5{ width:203px; height:81px; float:left; margin:-43px 0 0 8px; padding:0; background-color:#000; background:url(../images/pvc-button-back.png) no-repeat; cursor:pointer;}

#button-1-link{ width:150px; height:40px; float:left; margin:20px 0 0 50px; padding:0; /*background:#093;*/}

#button-1-link a{ margin:10px 0 0 24px; padding:0; text-decoration:none; text-align:left; float:left;}

#button-1-link a:hover{ margin:10px 0 0 24px; padding:0; text-decoration:none; text-align:left; float:left;}

.container-my-a-100{ width:100%; margin:30px auto; padding:0; /*background-color:#000;*/ background:url(../images/container-100.png) repeat-x; clear:both; position:absolute;}

.container-my-container-1305{ width:1051px; height:766px; margin:0 auto; padding:0; /*background-color:#CCC;*/}

.c-c-div-1{ float:left; margin:40px 0 0 10px; padding:0; width:697px; height:283px; /*background-color:#000;*/ background:url(../images/shresav-welcome-container-back.png) no-repeat; border:solid 1px #CCC;}

.c-c-div-1-profile{ float:left; margin:40px 0 0 10px; padding:0; width:697px;  /*background-color:#000;*/ background:url(../images/headings-back-new.png) no-repeat; /*background:#FFF*/; border:solid 1px; color:#CCC; border-bottom: solid 1px #CCC;}

.c-c-div-1-a{ width:200px; float:left; margin:0 0 0 0; padding:0; height:40px; /*background-color:#009;*/}

#c-c-div-1-a-hed{ text-align:left; margin:10px 0 0 10px; padding:0; }

.c-c-div-1-b{ width:697px; /*height:230px;*/ float:left; margin:5px 0 0 0; padding:0; /*background-color:#0FC;*/}

.c-c-div-1-b-1-cont-back{ width:360px;/* height:220px;*/ float:left; margin:5px 0 0 0; /*background:#960;*/}

.c-c-div-1-b-1-cont-back-profile{ width:697px;/*height:680px;*/ float:left; margin:-5px 0 0 0; background:#fff;}

.our-mission-div{ float:left; margin:50px 0 0 0; width:697px; height:200px; /*background-color:#999;*/}

#c-c-div-b-cont{ text-align:left; margin:0 0 0 10px; padding:0; line-height:22px; text-align:justify;}
.mission-cont{  text-align:left; margin:0 0 0 10px; padding:0; line-height:22px;}
.profile-cont{ text-align:left; margin:20px 0 0 10px; padding:0; line-height:22px;}
#welcome-read-more{ margin:25px 0 0 10px; padding:0; text-align:left;}

#welcome-read-more a{ margin:10px 0 0 0px; padding:6px 25px 8px 25px; text-align:left; text-decoration:none;  font-family:'Myriad Pro'; font-weight:bold; font-size:13px; background:#5dcaf0; border-radius:10px; color:#043261;}

#welcome-read-more a:hover{ margin:10px 0 0 0px; padding:6px 25px 8px 25px; text-align:left; text-decoration:none;  font-family:'Myriad Pro'; font-weight:bold; font-size:13px; background:#1a8fb8; border-radius:10px; color:#043261; transition:color 0.3s ease-out, background 0.3s ease-in;
	-o-transition:color 0.3s ease-out, background 0.3s ease-in;
  -ms-transition:color 0.3s ease-out, background 0.3s ease-in;
  -moz-transition:color 0.3s ease-out, background 0.3s ease-in;
  -webkit-transition:color 0.3s ease-out, background 0.3s ease-in;}


#welcome-img-div-1{ width:326px; height:179px; float:left; margin:20px 0 0 0; padding:0; /*background-color:#00C;*/}

.quick-contact-back{ width:322px; height:230px; float:left; margin:40px 0 0px 13px; padding:0; background-color:#fff; border: solid 1px #ccc;}

.quick-request-contact-back{ width:322px; height:250px; float:left; margin:40px 0 0px 13px; padding:0; background-color:#fff; border: solid 1px #ccc;}

.quick-contact-hed-back{ width:322px; float:left; margin:0 0 0 0; padding:0; /*height:41px;*/ background:url(../images/form-back.png) no-repeat top left; /*background-color:#009;*/}

#quick-contact-hed{ margin:10px 0 0 10px; text-align:left;}

#contact-form-back{ width:320px; float:left; margin: 8px 0 0 0px; /*background-color:#0FF;*/ text-align:left; background:#fff; /*border: solid 1px #ccc;*/}





.c-c-div-2{ width:500px; float:left; margin: 5px 0 0 0px; padding:0; height:422px; /*background-color:#666;*/}

.tab-menu-gallery-back{ width:698px; height:422px; float:left; margin:0px 0 0 10px; background:url(../images/gallery.png) no-repeat;}
.gallery-box{ float:left; width:698px; margin:10px 0 0 0;}

.list-back{ width:322px; height:305px; float:left; margin:5px 0 0 13px; background:url(../images/list-back.png) no-repeat;}

.list-hed-back{ width:100px; height:40px; float:left; margin:0 0 0 0; /*background-color:#009;*/}

#list-hed{ margin:10px 0 0 10px; text-align:left;}

#list-main-back{ width:322px; height:250px; float:left; margin:10px 0 0 0px; /*background-color:#999;*/ text-align:left;}





.c-2-div-4-b {
margin : 5px 0 0 10px;
padding : 0;
float : left;
}

.list-2{float:left; }

.c-2-div-4-b ul{ float:left;}

.c-2-div-4-b li{ width:224px; height:35px; background:url(../images/list-img.png) no-repeat;}

.c-2-div-4-b li a{ padding :0 0 0 30px; text-decoration:none; font-family:'helveticaregular'; color:#727272; font-size:14px;}

.c-2-div-4-b li a:hover{padding :0 0 0 30px; text-decoration:none;font-family:'helveticaregular'; color:#5dcaf0; font-size:14px; -o-transition:color 0.3s ease-out, background 0.3s ease-in;
  -ms-transition:color 0.3s ease-out, background 0.3s ease-in;
  -moz-transition:color 0.3s ease-out, background 0.3s ease-in;
  -webkit-transition:color 0.3s ease-out, background 0.3s ease-in;}


.c-c-div-2-b{ width:322px; height:161px; float:left; margin:10px 0 0 0; padding:0; /*background-color:#000;*/ background:url(../images/testmonials-back.png) no-repeat;}

.c-c-div-2-b-hed-test-back{ width:150px; height:40px; float:left; margin:0 0 0 0; padding:0; /*background-color:#03C;*/}

#test-hed{ text-align:left; margin:10px 0 0 10px;}

.test-cont-back{ width:322px; height:120px; float:left; margin:0 0 0 0; padding:0; /*background-color:#0F0;*/}

#test-cont{ text-align:left; margin:5px 0 0 10px; font-style:italic; line-height:20px;}

#test-name{ font-family:Myriad Pro; font-size:13px; margin:0px 0px 0px 10px; padding:0; font-weight:bold; text-align:left; font-style:italic;}


#test-read{ margin:-25px 0 0 150px; padding:0;}

#test-read a{ margin:0 0 0 0; padding:5px 10px 5px 10px; text-decoration:none; font-family:Myriad Pro; font-size:13px; font-weight:bold; background-color:#5dcaf0; border-radius:8px; color:#104674;}

#test-read a:hover{ margin:0 0 0 0; padding:5px 10px 5px 10px; text-decoration:none; font-family:Myriad Pro; font-size:13px; font-weight:bold; background-color:#1a8fb8; border-radius:8px; color:#104674; -o-transition:color 0.3s ease-out, background 0.3s ease-in;
  -ms-transition:color 0.3s ease-out, background 0.3s ease-in;
  -moz-transition:color 0.3s ease-out, background 0.3s ease-in;
  -webkit-transition:color 0.3s ease-out, background 0.3s ease-in;}
  
.client-gallery-main-div{ width:1032px; height:160px; float:left; margin:20px 0 0 15px; /*background-color:#C93;*/ background:url(../images/gallery-back-client-new.png) no-repeat;}
.client-gallery-main-div-request{ width:1032px; height:160px; float:left; margin:55px 0 0 15px; /*background-color:#C93;*/ background:url(../images/gallery-back-client-new.png) no-repeat;}


.client-hed-back{ /*width:130px;*/  /*background-color:#009;*/ float:left; margin:10px 0 0 10px; padding:0;}


.gallery-my{ width:1023px; float:left; margin:10px 0 0 5px; /*background-color:#009;*/ height:108px;}

.my-new-div-left{ float:left;  width:717px; /*background-color:#009;*/ }


.my-div-new{ float:right; padding:0; width:315px; /*height:750px;*/ margin: 0 18px 0 0px; /*background:#9F9;*/}

/*====== contact page====*/
.contact-form-div{ float:left; width:360px; /*background:#666;*/ /*height:200px;*/ margin:-20px 0 0 10px;}

.contact-form-address-div{ float:left; width:290px;/* background:#666;*//* height:200px;*/ margin:20px 0 0 20px;}

.product-back{ float:left; margin:10px 0 10px 0; /*background:#666;*/ width:699px;}

.product-1{ float:left; margin:0 0 0 10px; background:rgb(228, 237, 243); width:200px;/* height:150px;*/}
/*.product-1:hover{ float:left; margin:0 0 0 10px; background:#000; width:200px;/* height:150px;}*/

.product-img{ float:left; background:#ccc; width:200px; height:180px; margin:0 0 10px 0;}

/*.product-img :hover{ float:left; background:#ccc; width:200px; height:180px;}*/
.product{ margin:0px 0 0 0; padding:10px 0 10px 0; }
.product a{ text-decoration:none; color:rgb(42, 118, 194); padding:0 0 0 0; text-transform:uppercase; font-family:'ambleregular'; font-size:14px; font-weight:bold;}
.product a:hover{ text-decoration:none; color:#09F; padding:0 0 0 0; text-transform:uppercase; font-family:'ambleregular'; font-size:14px; -o-transition:color 0.3s ease-out, background 0.3s ease-in; font-weight:bold;
  -ms-transition:color 0.3s ease-out, background 0.3s ease-in;
  -moz-transition:color 0.3s ease-out, background 0.3s ease-in;
  -webkit-transition:color 0.3s ease-out, background 0.3s ease-in;}
.product-cont{ margin:-10px 0 0 0;}
/*=====contact page ======*/

.footer-main-100{ width:100%; margin:0 auto; padding:0; background:url(../images/footer-back-100.png) repeat-x; clear:both;}

.footer-container-1051{ width:1051px; height:138px; margin:0 auto; padding:0;/* background-color:#00C;*/}

.footer-logo{ width:162px; height:107px; float:left; margin:20px 0 0 25px; padding:0;}

.footer-link-back{ width:550px; float:left; margin:25px 0 0 50px; padding:0;/* background-color:#CF3;*/ height:80px;}

.footer-link-box-1{ width:100px; float:left; margin:0; padding:0; /*background-color:#939;*/ height:80px;}


.footer-link-box-2{ width:100px; float:left; margin:0 0 0 -40px; padding:0; /*background-color:#939;*/ height:80px;}


.footer-link-box-3{ width:100px; float:left; margin:0 0 0 -30px; padding:0; /*background-color:#939;*/ height:80px;}


.footer-link-box-4{ width:100px; float:left; margin:0 0 0 -13px; padding:0; /*background-color:#939;*/ height:80px;}

.footer-link-box-5{ width:100px; float:left; margin:0 0 0 90px; padding:0; /*background-color:#939;*/ height:80px;}


.footer-link ul{ float:left;}

.footer-link li{ width:224px; text-align:left; margin:0px 0px 0px -30px; line-height:20px;}

.footer-link li a{ padding :0 0 0 30px; text-decoration:none; font-family:'HelveticaNeueLTPro-Cn'; color:#727272; font-size:12px;}

.footer-link li a:hover{padding :0 0 0 30px; text-decoration:none; font-family:'HelveticaNeueLTPro-Cn'; color:#5dcaf0; font-size:12px;}


.footer-copy-right{ float:right; /*background-color:#999;*/}




.product-box{ float:left; width:200px; padding:0 0px 0 0px; }
.product-img{cursor:pointer;}


/*MORPH*/
.product-img{
opacity:0.5;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
          transition: all 0.5s ease;

}

.product-img:hover {
opacity:1;
		 
}
.product-1-back{ float:left; margin:0 0 0 7px; width:684px;  /*background:#000;*/}
.product{ float:left; margin:0 0 0 0; width:696px; /*height:300px;*/ /*background:#000;*/}
.product-hed{ float:left; margin:0 0 0 10px; width:696px; text-align:left; font-size:16px;}
.product-tect{ float:left; margin:10px 0 0 10px; font-size:16px;}
.tech-sheet{ float:left; margin:0 0 0 0; width:696px; background:#CCC; height:200px;}
.navigations{ float:left; margin:20px 0 0 30px; color:#666; font-family:Arial, Helvetica, sans-serif; font-size:12px;}
.nav-txt{color:#f07914; font-family:Arial, Helvetica, sans-serif; font-size:12px;}
.grey-page-nav{ margin:0 0 0 20px; color:#999999; font-family:Arial, Helvetica, sans-serif; font-size:12px;}

.p-nav{ float:left; width:650px;}
/* .pagelinks{ float:left;}
.pagelinks ul{ float:left; margin:10px 0px 10px 8px;display: flex;}
.pagelinks li{display:inline; margin:0 0 0 0px; }
.pagelinks li a{ background:#5dcaf0; color:#FFFFFF;  text-decoration:none; font-family:Arial, Helvetica, sans-serif;  font-size:12px; padding:9px; color:#666; background:#ccc;
	 border-radius:5px 5px 0 0; }
.pagelinks li a:hover{background:#0099FF; color:#fff; font-family:Arial, Helvetica, sans-serif;  font-size:12px; padding:9px;  
	 border-radius:5px 5px 0 0;} */

   .grid-container {
    /* display: grid;
    grid-template-columns: auto auto auto auto; */
    display: flex;
    justify-content: space-evenly;
   }
  .list {
    /* border: 1px solid rgba(0, 0, 0, 0.8);  */
    font-size: 12px;
    text-align: center;
    width: 24%;
    /* margin: 10px; */
    padding: 10px 0;
    font-family: Arial, Helvetica, sans-serif;
    border-radius: 5px 5px 0 0;
    background: #5dcaf0;
    color: #FFFFFF !important;
  }

  /* .list:hover a{
    background:#0099FF;  
     color:#fff;
  } */
   
   /* a:hover{
    background:#0099FF; 
    color:#fff;
  } */
  
   a{
   text-decoration:none;
   /* background:#5dcaf0; 
   color:#FFFFFF; */
   } 
	 
	 
	 
.pagetexts{ float:right; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#555; margin:20px 0 0 0;}
.product-img-hed-back{ float:left; margin:10px 0 0 10px; width:400px; height:200px; background:#666;}

.p-img{ float:left; margin:0 0 0 0; width:180px; height:190px; background:#000; border-radius:10px; border: solid 5px #F00;}
.p-img:hover{ float:left; margin:0 0 0 0; width:180px; height:190px; background:#000; border-radius:10px; border: solid 5px #CCC;}

.client-gallery100{width:100%; margin:0 auto;}
.client-gallery1032{width:1032px;margin:0 auto;}
.d{ float:left; height:20px; width:660px;}
.mycontent{ font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#333333; line-height:25px; text-align:left;}
.com-div{ float:left; text-align:left;}
.com-div ul{ float:left;}
.com-div li{ list-style-type:circle; margin:0 0 0 20px; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#333333; line-height:25px;}
.clr{ clear:both;}
.m-head{ font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#000000; font-weight:bold;}



.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction { bottom: var(--swiper-pagination-bottom,8px); top:476px !important; left: 0; width: 100%;}

.swiper-button-prev, .swiper-button-next { color: #fff !important;}

.swiper-button-prev::after, .swiper-button-next::after { font-size: 30px !important;}

.swiper-pagination-bullet { background: #fff !important; opacity: 0.8 !important;}

.swiper-pagination-bullet-active { background: #007aff !important; opacity: 1 !important;}

.cntheight{ height: 900px !important;;}

 .prfheight{ height:850px !important; } 



 /* marquee{ animation: marquee 30s linear infinite;} */

 /* @keyfram  es marquee {
  from { transform: translateX(0); }
  to { transform: translateX(0%); }
} */

/*@keyframes marquee {
  0% { left: 0%; }
  100% { left: -1100px; }
} */

/* Infrastructure */
.infImg{ width: 500px;height: 250px; margin-left: 10px;}

.infText{text-align: justify;padding: 20px;font-family: "Times New Roman", Times, serif;font-size: 14px;color: #474747;}

/* Contactus */
.mail-address{
  padding-left: 45px;
}

/* Profile */
.mis-cont{color: #474747;font-size: 14px; text-align: start;margin-top: 20px;padding-left: 10px;font-family: "Times New Roman", Times, serif;}

.mis-cont b {color: #000;}

.mis-cont strong{color: #000;font-size: 20px;}
.mis-cont span{padding-top: 5px;
  display: flex;
    align-items: baseline;
    gap: 5px;
}
.profileheight{height: 810px;}

/* Infrastructure & Contactus */
.marcnt{ margin:65px 0 0 15px !important}

/* Footer Slider */

.marquee {
  position: relative;
  display: flex;
  overflow: hidden;
  user-select: none;
  gap: 1rem;
}

.marquee__content {
  flex-shrink: 0;
  display: flex;
  justify-content: space-around;
  gap: 1rem;
  min-width: 100%;
}
.marquee__content li{
  list-style: none;
  margin: 0 20px;
}
/* .marque_copy{
  margin-left: -40px;
} */

@keyframes scroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(calc(-100% - 1rem));
  }
}

.marquee__content {
  animation: scroll 90s linear infinite;
}
.marquee:hover .marquee__content {
  animation-play-state: paused;
}

.marquee img {
  height: 100px;
}

@keyframes scroll-abs {
  from {
    transform: translateX(calc(100% + 1rem));
  }
  to {
    transform: translateX(0);
  }
}
/* ISO Certificate */
.mis-content{
  display: flex;
  justify-content: space-between;
}

#myImg {
  border-radius: 5px;
  cursor: pointer;
  transition: 1s;
  /* width:100%; */
  max-width:150px;
  margin: 40px 50px 0px 0px ;

}

#myImg:hover {opacity: 0.7;}

.isotext{
  color: #000;
  font-size: 22px;
  margin: 10px 40px 0px 0px;
  font-weight: bold;
}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 11; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
  overflow:hidden;
}

/* Modal Content (image) */
.modal-content {
  margin: auto;
  display: block;
  width: 60%;
  max-width: 400px;
}

/* Caption of Modal Image */
#caption {
  margin: auto;
  display: block;
  width:80%;
  max-width: 700px;
  text-align: center;
  color: black;
  padding: 10px 0;
  height: 150px;
}

/* Add Animation */
.modal-content, #caption {  
  -webkit-animation-name: zoom;
  -webkit-animation-duration: 0.6s;
  animation-name: zoom;
  animation-duration: 0.6s;
}

@-webkit-keyframes zoom {
  from {-webkit-transform:scale(0)} 
  to {-webkit-transform:scale(1)}
}

@keyframes zoom {
  from {transform:scale(0)} 
  to {transform:scale(1)}
}

/* The Close Button */

.close {
  position: absolute;
  top: 15px;
  right: 35px;
  color: #f1f1f1;
  font-size: 40px;
  font-weight: bold;
  transition: 0.3s;
}

.close:hover,
.close:focus {
  color: #bbb;
  text-decoration: none;
  cursor: pointer;
}
.reqheight{
    height:670px !important;
}
}