/** ADD YOUR AWESOME CODES HERE **/

/** MAIN TOP - MENU    **/

@media (max-width: 980px) {
	
header.main-top {
display:none! important;	
}

header.main-header {
display:block! important;	
background-color: black! important;
background-size: cover! important;	
padding: 0px! important;	
margin: 0px! important;
width: 100%! important; 
box-shadow: none! important; 
z-index: 12! important;
cursor: pointer! important;
}

.container-mobile {
	background-color: black! important;
    background-size: cover! important;	
	color: white! important;
	width: 100%! important;
	margin: 0px! important;
	padding: 0px! important;
}
 

.topnav {
  overflow: hidden;
  background-color: black;
  position: block;
  width:100%;
  
}

.topnav #myLinks {
  display: none;
  margin: 0px 0px 0px 20px;
  padding: 0px 10px;

}

.topnav a {
  color: white;
  margin: 0px 0px 0px 20px;
  padding: 0px;
  text-decoration: none;
  font-size: 18px;
  display: inline-block;
  width: 100%;
  
}

.topnav a.icon {
  background: black;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  width:100%;
  
}

.topnav a:hover {
  background-color: grey;
  color: red;
}

/* about.html */

.container-about-box-main{
	 padding: 30px 20px 0px 20px;
}

 .services-box-main{
     padding: 0px! important;
}
 

 .filter-button-group button{
         font-size: 15px! important;
         padding: 2px 10px! important;
    }

div.blog-boxB{
 left: 29px;
}

	
}

.all-title-box h9{
	 font-size: 22px;
	 font-weight: 600;
     color: white;
	 text-shadow: 1px 1px 2px black, 0 0 25px blue, 0 0 5px darkblue;
	 position: relative;


  
}

 .top {
	 font-size: 18px;
	 font-weight: 600;
	 color: white;
	 text-shadow: 1px 1px 2px black, 0 0 25px blue, 0 0 5px darkblue;
     position: relative;
     padding-bottom: 15px;

}



@media (min-width: 981px) {
	

.all-title-box h9{
	 font-size: 29px;
	 font-weight: 600;
     color: white;
	 text-shadow: 1px 1px 2px black, 0 0 25px blue, 0 0 5px darkblue;
	 position: relative;
  
}

 .top {
	 font-size: 24px;
	 font-weight: 600;
     color: white;
	 text-shadow: 1px 1px 2px black, 0 0 25px blue, 0 0 5px darkblue;
	 padding-bottom: 50px;

}	

header.main-header  {
display:none! important;		
}

header.main-top {
display:initial! important;	
background: #010101;
z-index: 12! important;
width: 100%! important;
margin: 0px;
padding: 0px:


}

/* about.html */

.container-about-box-main{
	 padding: 35px 90px 5px 90px;
}

 .services-box-main{
     padding: 5px 0px 5px 0px! important;
}



.container-fluid {
	background-color: black! important;
	
}


nav ul {
	margin:0;padding:0;
	list-style-type:none;
    padding: 20px 5px 20px 5px;
    display:inline-block;
	z-index: 10! important;
	
}

nav ul li {
 
	position:relative;
	margin:0 30px 0 0;
	padding: 10px 5px 10px 5px;
	z-index: 10! important;
    display: inline-block;
}


li > a:after { content: ' »'; } /* Change this in order to change the Dropdown symbol */

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

nav ul li a {
  padding: 20px 5px 20px 5px;
  display:inline-block;
  color:white;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 12px;
  z-index: 15! important;
  
}

nav ul li a:hover {
  color: #d33b33;
  background-color: #f1f1f1;
  z-index: 15! important;
 
}

nav ul li ul {
  display: none;
  position:absolute;
  left:0;
  z-index: 15! important;

}

nav ul li ul li {
  width:auto;
  border: 1mm ridge red;
  z-index: 999! important;
  overflow: visible! important;
  background-color: #010101;
  height: auto;
  
}

nav ul li:hover ul {
  display:block;

}
 
.filter-button-group button{
         font-size: 16px! important;
         padding: 3px 10px! important;
} 

.navbar {
  overflow-y: visible! important;
  background: #010101;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 999! important;
}

.navbar a {
  
  padding: 8px 10px 8px 10px;
  display:inline-block;
  color:white;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 20px;
 

}

.navbar a.list {
  
  padding: 6px;
  display: block;
  color: white;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 16px;
  width: 360px;
 

}
.navbar a:hover {
  background: #ddd; 
  color: black;
  display:block;

}

.main {
  padding: 148px 0px 0px 0px;
  margin-top: 0px;
  height: 1000px; /* Used in this example to enable scrolling */
}

div.blog-boxB{
 left: 400px;
}

 	
}	 
 
/* OTHERS */

a.nav-link {
  background: purple;
  color: white;
  z-index: 10! important;
  
}

b.nav-link {
  background: purple;
  color: white;
  font-size: 16px;
  z-index: 10! important;
  
}


.zoom  {
  
  transition: transform .2s;

}

.zoom  :hover {
  -ms-transform: scale(1.5); /* IE 9 */
  -webkit-transform: scale(1.5); /* Safari 3-8 */
  transform: scale(1.5); 
}

.shop-cat-box h5{
	 color: #ffffff;
     font-size: 16px;
}

 .filter-button-group button{
         font-size: 15px! important;
         padding: 2px 10px! important;
}
	
	
/* shop-gasket/ shop-packings/ shop-rubbersealing/ shop-fluoropolymermaterials/ shop-fluoropolymertubing/shop-processedproducts/ shop-goregaskets / shop-gorepacking / shop-corrosionresistant =================================*/

.center {
  text-align: center;

}


div.desc {
  padding: 15px;
  text-align: left;
  box-sizing: border-box;
  border: 1px solid #ccc;
}


div.gallery {

  border: 1px solid #ccc;

  width: 380px;
}

div.gallery img {
  width: 100%;
  height: 100%;
}

#customers {
  font-family: Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

#customers td, #customers th {
  border: 1px solid #ddd;
  padding: 8px;
}

#customers tr:nth-child(even){background-color: #f2f2f2;}

#customers tr:hover {background-color: #ddd;}

#customers th {
  padding-top: 20px;
  padding-bottom: 20px;
  text-align: left;
  background-color: #0a70f0;
  color: white;
}

.p3 {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 28px;
  
}

.p4 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 20px;
  color: black;
  text-decoration: underline;
}

.p5 {
  font-weight: bold;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 15px;
  color: red;
}

img {
border: 1px solid #101010;
}

img.a {
border: 3px solid #B22222;
}

img.b {
border: 3px solid #010101;
width: 255px;
height: 250px;

}

ul.breadcrumb {
   background: black;
   margin: 0px;
   display: inline-block;
   border-radius: 5px;
}
ul.breadcrumb li {
   display: inline-block;
   color: white;
   font-size: 16px;
}

ul.breadcrumb li+li:before {
  padding: 8px;
  color: grey;
  content:">\00a0";
}
ul.breadcrumb li a {
  color: red;
  font-size: 16px;
}
ul.breadcrumb li a:hover {
  color: blue;
  text-decoration: underline;
}

div.blog-boxA{
     -webkit-box-shadow: 0px 5px 35px 0px rgba(148, 146, 245, 0.15);
     box-shadow: 0px 5px 35px 0px rgba(148, 146, 245, 0.15);
     background: #ffffff;
     margin-bottom: 30px;
	 border: 3px solid #010101;
}

div.blog-boxB{

	position: relative;
    padding: 0px;
    font-size: 20px;
    font-weight: 700;
    color: #010101;
	margin: 0px;
    width: 100%;
}



/* shop-goregaskets / shop-gorepacking =================================*/


.buttonA {
  border: none;
  background-color: inherit;
  padding: 2px 4px;
  font-size: 16px;
  cursor: pointer;
  display: inline-block;
}


.info {color: blue;}

.infoA {color: white;}

.mySlides {display:none;}

p.a{
text-align: justify;
color: gray;
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
}


/* shop-fluoropolymermaterials/shop-fluoropolymertubing =================================*/

div.d {
  position: relative;
  left: 412px;
  width: 1080px;
  height: 380px;
 border: 3px solid gray;

}

/* products1/ products2 / products3 =================================*/

div.a {
  position: relative;
  left: 200px;
  width: 1630px;
  height: 1480px;

}

div.b {
  position: absolute;
  left: 100 px;
  width: 310px;
  height: 1450px;
  border: 3px solid black;
} 

div.c {
  position: relative;
  left: 307px;
  width: 1200px;
  height: 1450px;
 border: 3px solid black;
} 

.w3-button-a {
	border:3px solid black;
	display:inline-block;
	width: 256px;
	height: 40px;
	padding: 0px 0px;
	vertical-align: middle;
	overflow:hidden;
	text-decoration:none;
	color:white;
	background-color:red;
	text-align: center;
	cursor:pointer;
	white-space:nowrap;
}

.w3-button {
	border:3px solid black;
	display:inline-block;
	width:350px;
	height: 85px;
	padding:0px 0px;
	vertical-align:middle;
	overflow:hidden;
	text-decoration:none;
	color:inherit;
	background-color:red;
	text-align:center;
	cursor:pointer;
	white-space:nowrap;
}

.w3-buttonA {
	border:3px solid black;
	display:inline-block;
	width: 35px;
	height: 35px;
	padding:0px 0px;
	vertical-align:middle;
	overflow:hidden;
	text-decoration:none;
	color:inherit;
	background-color:red;
	text-align:center;
	cursor:pointer;
	white-space:nowrap;
}
.w3-hover-red:hover {
	
	color:#fff!important;background-color:#333!important
}