*{margin:0;padding:0; box-sizing: border-box;}

img.top_logo{padding:5px 0px 5px 0px;}

ul.menu{margin-left:20%;}



body{font-family: 'Roboto', sans-serif;}

/*---------------------------first box--------------------------*/
.mask_a{background: white;font-size: 16px;padding: 24px 10px 26px 10px; width: 90%; text-align: center; border-radius: 8px;}
.mask_b{background: white;font-size: 16px;padding: 24px 10px 9px 10px;width: 90%;text-align: center;border-radius: 8px;margin-left:6%;}
.mask_c{background: white;font-size: 16px;padding: 24px 10px 48px 10px;width: 90%; text-align: center;border-radius: 8px;float:right;}
img.first_box_bottom{margin-left: 16%; padding: 25px;}
p.second_a{margin-top:25px;}


/*-------------------------------------------------*/

img.product_image{ border: 1px solid #ddd;
  border-radius: 4px;
  padding: 5px;
  width: 250px;}

div.product_gap{padding-top:50px;}


img.product_image:hover {
  box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
}

img.product_image.damage{ height:370px;}
img.product_image.blasting{ height:330px;}
img.product_image.kurti{ height:400px;}
img.product_image.leather{ height:330px;}
img.product_image.shirts{height:260px;}
img.product_image.fabric{height:260px;}
img.product_image.shorts{ height:260px;}
/*-------------------second box------------------------------ */
.why_print360{
width: 100%;
    box-sizing: border-box;
    float: left;
    background: url(../images/why-thomsonpress.jpg) top center no-repeat;
    margin: 0 0 50px 0;
    padding:50px;}


.plus {
    font-size: 40px;
    color: #fff;
    line-height: 10px;
    position: absolute;
    margin: -25px 0px 0px 0px;
}
.s-sign {
    font-size: 40px;
    color: #fff;
    line-height: 10px;
    position: absolute;
    margin: 10px 0px 0px -3px;
}


.common_head{ text-align:center;}
/*-------------------------------aboutus-------------------------*/

li.about
{
	
	border: 1px solid!important;
    border-radius: 4px!important;
    padding: 3px!important;
    margin-top: 5px;
}





/*----------------------------Contact Plulse---------------------------------*/


.pulse{cursor: pointer;  animation: pulse 1s infinite;}

@-webkit-keyframes pulse {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(101,252,203,0.5);
  }
  70% {
      -webkit-box-shadow: 0 0 0 8px rgba(101,252,203,0.5);
  }
  100% {
      -webkit-box-shadow: 0 0 0 0 rgba(101,252,203,0.5);
  }
}
@keyframes pulse {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(101,252,203,0.5);
    box-shadow: 0 0 0 0 rgba(101,252,203,0.5);
  }
  70% {
      -moz-box-shadow: 0 0 0 8px rgba(187,40,45, 0);
      box-shadow: 0 0 0 8px rgba(101,252,203,0.5);
  }
  100% {
      -moz-box-shadow: 0 0 0 0 rgba(101,252,203,0.5);
      box-shadow: 0 0 0 0  rgba(101,252,203,0.5);
  }
}


/*-----------------------------------------hvr shutter---------------*/

/* Shutter In Horizontal */
.hvr-shutter-in-horizontal {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  background: #a7ce44;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.hvr-shutter-in-horizontal:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background:#4a4a4a;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
  -webkit-transform-origin: 50%;
  transform-origin: 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-shutter-in-horizontal:hover, .hvr-shutter-in-horizontal:focus, .hvr-shutter-in-horizontal:active {
  color: white;
}
.hvr-shutter-in-horizontal:hover:before, .hvr-shutter-in-horizontal:focus:before, .hvr-shutter-in-horizontal:active:before {
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
}


/*----------------------title line between Horizontal------------------------- */

h1 {
    text-align:center;    font: 700 28px Play, Arial, Helvetica, sans-serif; color:#268FCD;
}
h1::before,
h1::after {
    display: inline-block;
    content: "";
    border-top: .3rem solid #268FCD;
    width: 4rem;
    margin: 0 1rem;
    transform: translateY(-1rem);
}

/*------------------title bellow horizonal line--------------- */

.box2 span {
    font-size: 0;
    height: 100%;
    display: inline-block;
    position: relative;
    top: -20px;
    background:#000000;
    width: 60px;
}
.box{display: inline-block;}

.boxa{
    width: 100%;
    height: 4px;
    display: block;
    margin: 0 0 20px;
}

/*-------------------contact box-------------------------- */

div.container.contact{border-radius:20px; padding:25px;}
p.contact_first_title{text-align: center; font-size: 4em;}
p.contact_second_title{text-align: center; font-size: 20px; font-style: italic; padding-bottom: 50px;}



/*--------------------------------------------*/
/* SLIDER */

#slider {
  background: green;
  border: 5px solid #eaeaea;
  box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.7);
  height: 500px;
  width: 100%;
  overflow: visible;
  position: relative;
}

#mask {
  overflow: hidden;
  height: 500px;
}

#mask img {
  width: 100%;
  height: 100%;
}

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

#slider li {
  width: 100%;
  height: 500px;
  position: absolute;
  top: -325px;
  list-style: none;
}

#slider li.firstanimation {
  -moz-animation: cycle 30s linear infinite;
  -webkit-animation: cycle 30s linear infinite;
}

#slider li.secondanimation {
  -moz-animation: cycletwo 30s linear infinite;
  -webkit-animation: cycletwo 30s linear infinite;
}

#slider li.thirdanimation {
  -moz-animation: cyclethree 30s linear infinite;
  -webkit-animation: cyclethree 30s linear infinite;
}

#slider li.fouranimation {
	-moz-animation:cyclefour 30s linear infinite;
	-webkit-animation:cyclefour 30s linear infinite;		
}
#slider li.fiveanimation {
	-moz-animation:cyclefive 30s linear infinite;
	-webkit-animation:cyclefive 30s linear infinite;		
}

#slider:hover li,
#slider:hover .progress-bar {
  -moz-animation-play-state: paused;
  -webkit-animation-play-state: paused;
}


/* PROGRESS BAR */

.progress-bar {
  position: relative;
  top: -5px;
  width: 100%;
  height: 5px;
  background: green;
  -moz-animation: fullexpand 30s ease-out infinite;
  -webkit-animation: fullexpand 30s ease-out infinite;
}


/* ANIMATION */
@-moz-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; }
	92% { top:-325px; opacity:0; z-index:0; }
	96% { top:-325px; opacity:0; }
	100%{ top:0px; opacity:1; }
	
}
@-moz-keyframes cycletwo {
	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; }
}
@-moz-keyframes cyclethree {
	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; } 
	60% { top:325px; opacity:0; z-index:0; }
	61% { top:-325px; opacity:0; z-index:-1; } 
	100%{ top:-325px; opacity:0; z-index:-1; }
}
@-moz-keyframes cyclefour {
	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; }
}
@-moz-keyframes cyclefive {
	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; }
}

@-webkit-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; }
	
}
@-webkit-keyframes cycletwo {
	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; }
}
@-webkit-keyframes cyclethree {
	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; }
}
@-webkit-keyframes cyclefour {
	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; }
}
@-webkit-keyframes cyclefive {
	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; }
}

/* ANIMATION BAR */
@-moz-keyframes fullexpand {
    0%, 20%, 40%, 60%, 80%, 100% { width:0%; opacity:0; }
    4%, 24%, 44%, 64%, 84% { width:0%; opacity:0.3; }
   16%, 36%, 56%, 76%, 96% { width:100%; opacity:0.7; }
   17%, 37%, 57%, 77%, 97% { width:100%; opacity:0.3; }
   18%, 38%, 58%, 78%, 98% { width:100%; opacity:0; }	
}
@-webkit-keyframes fullexpand {
    0%, 20%, 40%, 60%, 80%, 100% { width:0%; opacity:0; }
    4%, 24%, 44%, 64%, 84% { width:0%; opacity:0.3; }
   16%, 36%, 56%, 76%, 96% { width:100%; opacity:0.7; }
   17%, 37%, 57%, 77%, 97% { width:100%; opacity:0.3; }
   18%, 38%, 58%, 78%, 98% { width:100%; opacity:0; }	
}



/*----------------------------footer-------------------------*/

.footer{background-attachment: fixed !important;
    background-position:center !important;
    background-repeat:no-repeat !important;
    padding:50px 0px 50px 0px;}
ul.get_touch{list-style:none;color:white;font-size:16px;}






button.map_direction{border: 2px solid white;
    padding: 8px 25px;
    background: none;
    font-size: 20px;
    color: white;
    }
div.container-fluid.footer{background:#a7ce44;padding-bottom:50px;}
h3.quick_contact{color:white; text-align:center;padding-bottom:22px;}
h3.quick_link{color:white; text-align:center;padding-bottom:22px;}
h3.about_us{color:white; text-align:center;padding-bottom:22px;}
p.about-us{text-align:justify;font-size:15px;color:white;}
h3.get_in{color:white; text-align:center;padding-bottom:22px;}


h6.top-left {
	font-size: 17px;
	color:white;
	font-family: "Open Sans";
	
	margin: 0px;
	
}

h6.top-left2 {
	font-size: 17px;
	color:white;
	font-family: "Open Sans";
	
margin: 0px;
	padding-top: 30px;color:white;
}



/*----------------------------bellow Footer--------------------------------*/

li.footer_menu{
    list-style: none;
    text-align: center;
    vertical-align: middle;padding:10px;}
ul li.footer_menu a{color:white !important;}
/*--------------------------------footer social----------------------------- */


div.contact_form{padding:5px;border-radius:10px;color:black; border:1px dashed white; padding:5px;}
.submit_btn{padding: 5px 27px;font-size: 15px;color: black;}
table.footer_table{text-align:center;margin-top:25px;}

i.fa.fa-facebook.footer-fa{font-size: 27px;color: white;border: 1px solid white;padding: 9px 18px 12px 17px;text-align: center;}
i.fa.fa-linkedin.footer-linkedin{margin-left:7px;font-size: 27px;color: white;border: 1px solid white;padding: 9px 14px 12px 13px;}
i.fa.fa-twitter.footer-twitter{margin-left:7px;font-size: 27px; color: white;border: 1px solid white; padding: 9px 11px 11px 12px;}
i.fa.fa-youtube.footer-youtube{margin-left:7px;font-size: 27px; color: white;border: 1px solid white;padding: 9px 13px 9px 13px;}


/*-----------------footer right-----------------------*/
div.container-fluid.footer-right{background:#a7ce44;padding:10px;}
p.right_reserved{color:white;font-size:18px;text-align:center;}





  
 
  
  
  
  
  /*---------------------contact page----------------------------- */
 div.contact_address2{margin:50px;}
  .contact_table td{padding:12px; color:#268FCD !important;}
  div.google_map {padding: 0px 22px 50px 22px;} 
  table.footer_table{text-align:center;margin-top:25px;}
i.fa.fa-facebook.footer-faa{font-size: 27px;color:black;border: 1px solid black;padding: 9px 18px 12px 17px;text-align: center;}
i.fa.fa-linkedin.footer-linkedinn{margin-left:7px;font-size: 27px;color:black;border: 1px solid black;padding: 9px 14px 12px 13px;}
i.fa.fa-twitter.footer-twitterr{margin-left:7px;font-size: 27px; color:black;border: 1px solid black; padding: 9px 11px 11px 12px;}
i.fa.fa-youtube.footer-youtubee{margin-left:7px;font-size: 27px; color:black;border: 1px solid black;padding: 9px 13px 9px 13px;}

span.contact_title_h3{font-size:30px;}

  
  
  
  
  .button {
  display: inline-block;
  border-radius: 4px;
  background-color: #06b2f5 !important;
  border: none;
  color: #FFFFFF;
  text-align: center;
  font-size: 20px;
  padding: 20px;
  
  transition: all 0.5s;
  cursor: pointer;
  margin: 5px;
}

.button span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
}

.button span:after {
  content: '\00bb';
  position: absolute;
  opacity: 0;
  top: 0;
  right: -20px;
  transition: 0.5s;
}

.button:hover span {
  padding-right: 25px;
}

.button:hover span:after {
  opacity: 1;
  right: 0;
}

/*--------------------who-we-are----------------------*/

div.container-fluid.who-we-are{ background-attachment:fixed;}
div.container-fluid.who-we-are1{ background-attachment:fixed;}

/*-----------------------------menu-------------------------- */


<style>

p { text-align: center; }
 .toggle, [id^=drop] {
 display: none;
}
nav {
  margin: 0;
  padding: 0;
  background-color:#a7ce44;
}

#logo {
  display: block;
  padding: 0 30px;
  float: left;
  font-size: 20px;
  line-height: 60px;
}

nav:after {
  content: "";
  display: table;
  clear: both;
}

nav ul {
  float: left;
  padding: 0;
 
  list-style: none;
  position: relative;
}

nav ul li {
  
  display: inline-block;
  float: left;
  
}

nav a {
  display: block;
  padding: 0 20px;
  color: white;
  font-size: 18px;
  line-height: 40px;
  text-decoration: none !important;
}

nav ul li ul li:hover { background: #000000;color:white; }

nav a:hover { background-color: #000000;color:white; }

nav ul ul {
  display: none;
  position: absolute;
  top: 40px;background:#a7ce44;
}

nav ul li:hover > ul { display: inherit;}

nav ul ul li {
  
  float: none;
  display: list-item;
  position: relative;
}



li > a:after { content: ' +'; }

li > a:only-child:after { content: ''; }


/* Media Queries
--------------------------------------------- */

@media all and (max-width : 768px) {

#logo {
  display: block;
  padding: 0;
  width: 100%;
  text-align: center;
  float: none;
}

nav { margin: 0; }

.toggle + a,
 .menu { display: none;  }

.toggle {
  display: block;
  background-color: #254441;
  padding: 0 20px;
  color: #FFF;
  font-size: 18px;
  font-weight:bold;
  line-height: 60px;
  text-decoration: none;
  border: none;
}

.toggle:hover { background-color: #000000; }

[id^=drop]:checked + ul { display: block; }

nav ul li {
  display: block;
  width: 100%;
}

nav ul ul .toggle,
 nav ul ul a { padding: 0 40px; }

nav ul ul ul a { padding: 0 80px; }

nav a:hover,
 nav ul ul ul a { background-color: #000000; }

nav ul li ul li .toggle,
 nav ul ul a { background-color: #212121; }

nav ul ul {
  float: none;
  position: static;
  color: #ffffff;
}


}

@media all and (max-width : 330px) {

nav ul li {
  display: block;
  width: 94%;
}

}















/*------------------------ For Mobile -------------------------- */

@media screen and (max-width: 600px) {
	
	/*------------------index.html----------------*/
	img.top_logo{margin-left:0%;padding:5px 0px 8px 0px;}
	ul.menu{margin-left:0%;}
	
	#mask{width:100%; height:200px;}
	#slider{height:200px; background:none;}
	#slider li{height:200px;}
  
	.mask_a{margin-bottom:50px; }
	.mask_b{margin-left:1%;}
	.mask_c{margin-top:50px;margin-right:7%;}
	
	
h1{font-size:22px;}


  
 /*-----------------------contact-us.html------------------*/
 .contact_form_fill{padding:32px;} 
 span.contact_title_h3{font-size:22px;}
 div.google_map {padding: 0px 22px 50px 22px;} 
 
 p.right_reserved { font-size: 11px; margin:0px;}
  
}





@media screen and (max-width: 768px) {
	
	/*------------------index.html----------------*/
	
	ul.menu{margin-left:0%;}
	
	#mask{width:100%; height:200px;}
	#slider{height:200px; background:none;}
	#slider li{height:200px;}
  
	.mask_a{margin-bottom:50px; }
	.mask_b{margin-left:1%;}
	.mask_c{margin-top:50px;margin-right:7%;}
	
	


  
 
 /*-----------------------contact-us.html------------------*/
 .contact_form_fill{padding:32px;} 
 span.contact_title_h3{font-size:22px;}
 div.google_map {padding: 0px 22px 50px 22px;} 
 
 p.right_reserved { font-size: 11px; margin:0px;}
  
}