/*!
 * Start Bootstrap - Stylish Portfolio (http://startbootstrap.com/)
 * Copyright 2013-2016 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap/blob/gh-pages/LICENSE)
 */

/* Global Styles */

html,
body {
/*	overflow-x:hidden;
    max-width: 100%;
    height: 100%;
    
	
	margin: 0 auto;
	-webkit-overflow-scrolling: touch;*/
	
}

/*Hamburger code*/



.v{
    font-weight: bold;
    font-size: 20px;
    color:white;
    background-color: #cb9336; 
    text-align: right;
    float: right;
	z-index: 1;
    width: 100%;
    overflow: hidden;
    display: none;
   
}

.active, .v:hover {
    background-color: #cb9336; 
}


.panel {
    padding: 0 18px;
    
    background-color: #cb9336;
    z-index: 0;
    width: 100%;
}


@media(max-width:500px) {
    .v{
	 display: inline;
    };
}

@media(max-width:500px) {
    .panel{
	  display: none;
    };
}



/*End of Hamburger code*/









.cntr{
	text-align: left;
}

@media(max-width:500px) {
    .cntr {
	text-align: center;
    };
}

.fb{
	text-align: left;
}

@media(max-width:500px) {
    .fb {
	text-align: center;
    };
}

.callout-space{
	width:10%;
}

@media(max-width:500px) {
    .body {
	overflow-x:initial;
	-webkit-overflow-scrolling: touch;
    };
}

nav{
	text-align:center;

}

.nav-format{
	font-family: Modern No. 20;	
	background-color:#cb9336;
	list-style-type: none;
	
	Padding: 8px 10px 8px 10px;
	text-align: center;
		
}

@media(max-width:500px) {
    .nav-format {
	Padding: 0px 0px 0px 0px;
	
    };
}



.nav-list{
	Padding: 4px 20px 4px 20px;
	display: inline;
	
	text-align: center;
	
}



@media(max-width:700px) {
    .nav-list {
	font-size: 4px;
	padding: 10px;
	text-align: center;
	margin-bottom: 5px;
	
    };
}

a{
	font-family: Modern No. 20;	
	color: rgb(60,60,210);
	transition: 0.2s;
	font-weight: bold;
}

a:hover{
	color: rgb(140,140,220);
	transition: 0.2s;
	text-decoration: none;
}

a:focus{
	color: rgb(140,140,220);
	text-decoration: none;
}

a:active{
	color: rgb(140,140,220);
	text-decoration: none;
}




.a-home{
	color: rgba(60,67,240,.8);

	transition: 0.2s;
	font-weight: bold;
}

.a-home:hover{
	color: rgb(220,220,220);
	transition: 0.3s;
	text-decoration: none;
}

.a-home:focus{
	color: rgba(60,67,240,.6);
	text-decoration: none;
}

.a-home:active{
	color: rgba(60,67,240,.6);
	text-decoration: none;
}


.a-format{
	font-family: Modern No. 20;	
	text-align: center;
	font-size: 24px;
	color: white;
	font-weight: bold;
	text-decoration: none;
	
	
}

.a-format:hover{
	color: rgb(230,230,230);
	transition: 0.2s;
	text-decoration: none;
}

.a-format:focus{
		color: rgb(230,230,230);
	text-decoration: none;
}

.a-format:active{
		color: rgb(220,220,220);
	text-decoration: none;
}
@media(max-width:600px) {
    .a-format {
	color: rgb(220,220,220);
	font-size: 16px;
	display:block;
	padding: 0px 0px 0px 0px;
	text-align: center;
    };
}

 .about-index-format{}


@media(max-width:800px) {
    .about-index-format{
		z-index:-1;
	font-size: 16px;
	display:block;

	margin-bottom:-800;
	background-color: #e3e3e3;
    };
}

@media(max-width:800px) {
    .about-format {
	font-size: 16px;
	display:block;
	padding: 0px 80px 0px 80px;
	margin-bottom: 5px;
    };
}


.logo-format{
	
	transition: 0.2s;

	
}

.logo-format:hover{opacity: 0.8;}

.logo-format:focus{
	color:rgba(0,0,0,0.7);
	text-decoration: none;
}

.logo-format:active{
	color:#aaaaaa;
	text-decoration: none;
}

@media(max-width:700px) {
    .logo-format {
		
	width:50%;
	
	
    };
}

.article-format{
	
}



@media(max-width:700px) {
    .article-format {
		
	width:80%;
	
	
    };
}







.fb-format{
	
	transition: 0.2s;
	text-align: right;
	
}

.fb-format:hover{opacity: 0.55;}

.fb-format:focus{
	color:rgba(0,0,0,0.7);
	text-decoration: none;
}

.fb-format:active{
	color:#aaaaaa;
	text-decoration: none;
}

@media(max-width:500px) {
    .fb-format {
		
	
	text-align: center;
	
    };
}










.logo-format1{
	
}






@media(max-width:700px) {
    .logo-format1 {
		
	width:20%;
	
	
    };
}



.sales-dist-mob{}

@media(max-width:700px) {
    .sales-dist-mob {
		margin-left:15px;
		margin-bottom:55px;
    };
}



.content-mob{}

@media(max-width:700px) {
    .content-mob {
		margin-left:15px;
		margin-bottom:55px;
    };
}


.cofacts-h1-text{
	font-size:9px;
	font-weight:bold;
}

@media(max-width:700px) {
    .cofacts-h1-text {
	font-size: 5px;
	
	
    };
}


.cofacts-h2-text{
	font-size:16px;
	font-weight:bold;

}

.h2-text{
	font-size:16px;
	font-weight:bold;
	padding-bottom:10px;
	text-align:center;
}



/* Header and header text formatting for the cofacts page */
.h2-header{
	color:white;
	background-color:#163790;
	opacity:.90;
	max-width: 100%;
	margin: 0 auto;
	
}


/* Background color for all bodys of the site pages 
except for the index page*/
.content-color{
	background-color:#163766;
}


h4{
	font-size:14px;
}


.text-vertical-center {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}

.text-vertical-center h1 {
    margin: 0;
    padding: 0;
    font-size: 4.5em;
    font-weight: 700;
}

/* Custom Button Styles */

.btn-dark {
    border-radius: 0;
    color: #fff;
    background-color: rgba(0,0,0,0.6);
}

.btn-dark:hover,
.btn-dark:focus,
.btn-dark:active {
    color: #fff;
    background-color: rgba(0,0,0,0.7);
}


.btn-back {
    border-radius: 0;
    color: #fff;
    background-color: rgba(0,0,0,0.45);
	font-weight: bold;
	margin: 20px;
	font-size:10px;
}

.btn-back:hover,
.btn-back:focus,
.btn-back:active {
    color: #fff;
    background-color: rgba(0,0,0,0.6);
}





.btn-light {
    border-radius: 0;
    color: #333;
    background-color: rgb(255,255,255);
}

.btn-light:hover,
.btn-light:focus,
.btn-light:active {
    color: #333;
    background-color: rgba(255,255,255,0.8);
}

.btn-store{
	color: white;
	font-weight: bold;
	background-color: rgb(118,185,90);
	margin: 30px;
	padding: 20px;
	
	
}

.btn-store:hover,
.btn-store:focus,
.btn-store:active {
    color: white;
    background-color: rgb(100,165,80);
}

.sales-anchor{
	color: white;
	font-weight: bold;
	
}

.sales-anchor:hover{
	color:#aaaaaa;
	transition: 0.2s;
	text-decoration: none;
}

.sales-anchor:focus{
	color:#aaaaaa;
	text-decoration: none;
}



/* Custom Horizontal Rule */

hr.small {
    max-width: 100px;
}


/* Side Menu */

#sidebar-wrapper {
    z-index: 1000;
    position: fixed;
    right: 0;
    width: 250px;
    height: 100%;
    transform: translateX(250px);
    overflow-y: auto;
    background: #222;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.sidebar-mob{
	margin-right:100px;
}

.sidebar-close{
	margin: 10px 10px 0px 0px;
}



.sidebar-nav {
    position: absolute;
    top: 0;
    width: 250px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.sidebar-nav li {
    text-indent: 20px;
    line-height: 40px;
}

.sidebar-nav li a {
    display: block;
    text-decoration: none;
    color: #999;
}

.sidebar-nav li a:hover {
    text-decoration: none;
    color: #fff;
    background: rgba(255,255,255,0.2);
}

.sidebar-nav li a:active,
.sidebar-nav li a:focus {
    text-decoration: none;
}

.sidebar-nav > .sidebar-brand {
    height: 55px;
    font-size: 18px;
    line-height: 55px;
}

.sidebar-nav > .sidebar-brand a {
    color: #999;
}

.sidebar-nav > .sidebar-brand a:hover {
    color: #fff;
    background: none;
}

#menu-toggle {
    z-index: 1;
    position: fixed;
    top: 0;
    right: 0;
}

#sidebar-wrapper.active {
    right: 250px;
    width: 250px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.toggle {
    margin: 5px 5px 0 0;
}

/* Header */

.header {
    display: table;
    position: relative;
    width: 100%;
    height: 100%;
    background: url(../img/storefront5.png) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

@media(max-width:700px) {
    .header {
	font-size: 4px;
	background:none;
	width: 100%;
	margin:0px 0px -780px 0px;
	z-index:-1;
	
    };
}

.logos-header{
	
}

@media(max-width:700px) {
    .logos-header {
	
	
	margin:1px 0px 20px 0px;
	
    };
}



/* header for the About Page */
.headerabout {
    display: table;
    position: relative;
    width: 100%;
    height: 12%;
    background: url(../img/cofacts1.png) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	
}

/* header for the Cofacts Page */
.headercofacts {
    display: table;
    position: relative;
	text-align: center;
    width: 100%;
    height: 12%;
    background: url(../img/cofacts1.png) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

@media(max-width:700px) {
    .headercofacts {
	font-size: 4px;
	
	width: 100%;

	
    };
}


/* header for the Store Page */
.headerstore {
    display: table;
    position: relative;
    width: 100%;
    height: 12%;
    background: url(../img/cofacts1.png) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}


/* header for the Composite Page */
.headerComposite {
    display: table;
    position: relative;
    width: 100%;
    height: 12%;
    background: url(../img/Comp_Rein_Materials.png) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

/* header for the Product Information Page */
.headerProductInfo {
    display: table;
    position: relative;
    width: 100%;
    height: 12%;
    background: url(../img/cofacts1.png) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

@media(max-width:500px) {
    .headerProductInfo {
	font-size: 2px;
	width: 100%;
    };
}

/* header for the Technical Information Page */
.headerTechInfo {
    display: table;
    position: relative;
    width: 100%;
    height: 12%;
    background: url(../img/cofacts1.png) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

/* header for the Cofab Pages */
.headerCofab {
    display: table;
    position: relative;
    width: 100%;
    height: 12%;
    background: url(../img/cofacts1.png) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

/* header for the Comat Pages */
.headerComat {
    display: table;
    position: relative;
    width: 100%;
    height: 12%;
    background: url(../img/cofacts1.png) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

/* header for the Unicomposite Pages */
.headerUnicomp {
    display: table;
    position: relative;
    width: 100%;
    height: 12%;
    background: url(../img/cofacts1.png) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

/* header for the Sales and Distribution Page */
.headerSales {
    display: table;
    position: relative;
    width: 100%;
    height: 12%;
    background: url(../img/Comp_Rein_Materials.png) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}





/* Logo */
.logo
{
	width: 100%;
	height: auto;
	padding:5px 15px 5px 15px;
}

@media(max-width:450px) {
    .logo {
		width: 50%;
        height: 50%;
    }
}



/* About */

.about {
    padding: 50px 0;
}

/* Services */

.services {
    padding: 50px 0;
}

.service-item {
    margin-bottom: 30px;
}


.mob-space{}
@media(max-width:750px) {
    .mob-space {
		
		margin-bottom: 30px;
		margin-top: 30px;
    }
}


/* Callout 

		Callouts are used throughout the website.
	Callouts are being used image buttons. The user can
	hover over the callout and click on the callout to reach
	the location that the callout points the user toward.

*/

.btn-callout{
	margin-top: 10px;
	font-size: 12px;
	
}

@media(max-width:700px) {
    .btn-callout {
        font-size: 9px;
		margin-top: 8px;
		
    };
}

/*This callout is used on the index page */
.callout {
    display: table;
	height: 210px;
    width: 320px;
    margin: 20px;
	padding: 40px;
	padding-left:80px;
	padding-right:80px;
    color: #fff;
    background: url(../img/Comp_Rein_Materials1.png) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	font-size: 4px;
	
}


@media(max-width:800px) {
    .callout {
        font-size: 4px;
		  width: 150px;
    height: 100px;
	padding: 0px 10px 0px 10px;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    };
}



/*This callout is used on the index page */
.callout1 {
    display: table;
	height: 210px;
    width: 320px;
	margin: 20px;
	padding: 40px;
	padding-left:80px;
	padding-right:80px;
    color: #fff;
	font-size: 4px;
    background: url(../img/store.jpg) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	
	
	
}

@media(max-width:800px) {
    .callout1 {
        font-size: 4px;
		  width: 150px;
    height: 100px;
	padding: 0px 10px 0px 10px;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    };
}



/*This callout is used on the index page */
.callout2 {
    display: table;
    width: 400px;
	height: 185px;
    margin: 20px;
	padding: 40px;
	padding-left:80px;
	padding-right:80px;
    color: #fff;
	
    background: url(../img/plant.jpg) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	font-size: 4px;
	
}

@media(max-width:800px) {
    .callout2 {
         font-size: 4px;
		  width: 150px;
    height: 100px;
	padding: 0px 10px 0px 10px;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    };
}


/*This callout is used on the store page */
.callout3 {
    display: table;
    width: 380px;
	height: 200px;
    color: #fff;
	margin: 20px;
	padding: 40px;
	padding-left:80px;
	padding-right:80px;
    background: url(../img/chopped_500x320.png) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	font-size:4px;
	
}

@media(max-width:800px) {
    .callout3 {
 font-size: 4px;
		  width: 150px;
    height: 100px;
	padding: 0px 10px 0px 10px;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	
    };
}

/*This callout is used on the store page */
.callout4 {
    display: table;
    width: 380px;
	height: 200px;
    color: #fff;
	margin: 20px;
	padding: 40px;
	padding-left:80px;
	padding-right:80px;
	font-size: 4px;
    background: url(../img/chopped_500x320.png) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	font-size:4px;
}

@media(max-width:800px) {
    .callout4 {
	font-size: 4px;
	width: 150px;
    height: 100px;
	padding: 0px 10px 0px 10px;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    };
}

/*This callout is used on the composite page for product information
 and any image callouts that are related with cofab */
.callout5 {
    display: table;
    width: 300px;
	height: 160px;
    color: #fff;
	margin: 20px;
	padding: 40px;
	padding-left:80px;
	padding-right:80px;
    background: url(../img/A1010_500.png) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	font-size:4px;
}

@media(max-width:800px) {
    .callout5 {
	 font-size: 4px;
		  width: 150px;
    height: 100px;
	padding: 0px 10px 0px 10px;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    };
}

/*This callout is used on the composite page
 as the Technical Information callout */

.callout6 {
    display: table;
    width: 300px;
    height: 160px;
    color: #fff;
	margin: 20px;
	padding: 40px;
	padding-left:80px;
	padding-right:80px;
    background: url(../img/cofacts3.png) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	font-size:4px;
}

@media(max-width:800px) {
    .callout6 {
	 font-size: 4px;
		  width: 150px;
    height: 100px;
	padding: 0px 10px 0px 10px;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    };
}


/*This callout is used as the unicomposite callout*/
.callout7 {
    display: table;
    width: 300px; 
	height: 160px;
    color: #fff;
	margin: 20px;
	padding: 40px;
	padding-left:70px;
	padding-right:70px;
    background: url(../img/unicomposite.jpg) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	font-size:4px;
}

@media(max-width:800px) {
    .callout7 {
	 font-size: 4px;
		  width: 150px;
    height: 100px;
	padding: 0px 10px 0px 10px;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    };
}


/*This callout is used as the comat callout*/
.callout8 {
    display: table;
    width: 300px;
    height: 160px;
    color: #fff;
	margin: 20px;
	padding: 40px;
	padding-left:80px;
	padding-right:80px;
    background: url(../img/chopped_500x320.png) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	font-size:4px;
}

@media(max-width:800px) {
    .callout8 {
 font-size: 4px;
		  width: 150px;
    height: 100px;
	padding: 0px 10px 0px 10px;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    };
}


/*This callout is used on the composite page
 as the Sales and Distribution callout */
.callout9 {
    display: table;
    width: 300px;
	height: 160px;	
    color: #fff;
	margin: 20px;
	padding: 40px;
	padding-left:80px;
	padding-right:80px;
    background: url(../img/Comp_Rein_Materials.png) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	font-size:4px;
}

@media(max-width:800px) {
    .callout9 {
	 font-size: 4px;
		  width: 150px;
    height: 100px;
	padding: 0px 10px 0px 10px;
	
	-webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    };
}

.callout-desc{
	text-align:left;
	font-size:11px;
	margin: 3px 0px 0px 25px;
}

.postSpace
{
	margin-bottom: 60px;
}

/* Portfolio */

.portfolio {
    padding: 50px 0;
}

.portfolio-item {
    margin-bottom: 30px;
}

.img-portfolio {
    margin: 0 auto;
}

.img-portfolio:hover {
    opacity: 0.8;
}

/* Call to Action */

.call-to-action {
    padding: 50px 0;
}

.call-to-action .btn {
    margin: 10px;
}

/* Map */

.map {
    height: 500px;
}

@media(max-width:768px) {
    .map {
        height: 75%;
    }
}

.map iframe {
    pointer-events: ;
}

/* Footer */

footer {
  font-size:9px; 
}

.footer-padding{
	padding-left:3px;
	padding-bottom;
}

.footer-email-padding{
	padding-top:0px;
}

.footer-sign{
	 transition: 0.2s;
}

.footer-sign:hover {opacity: 0.55;}

.footer-pages{
	display: table;
    position: relative;
    width: 100%;
    height: 12%;
    background: url(../img/cofacts1.png);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

@media(max-width:500px) {
    .footer-pages {
	font-size: 4px;
	padding: 20px;
	
	margin-bottom: 5px;
	
    };
}


.footer-index{
	display: table;
    position: relative;
    width: 100%;
    height: 12%;
     background: url(../img/cofacts1.png);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

@media(max-width:500px) {
    .footer-index {
	font-size: 4px;
	padding: 20px;
	 width: 100%;
	margin-bottom: 5px;
	
    };
}

#to-top {
  display: none;
  position: fixed;
  bottom: 5px;
  right: 5px;
}

/* Added */

.shadow
{
    background-color: rgba(0,0,0,0.7);
	font-size: 4px;
	width:75%;
}

.shadow-index
{
    background-color: rgba(0,0,0,0.7);
	font-size: 4px;
	
}



.shadow-sml
{
    background-color: rgba(0,0,0,0.7);
	font-size: 4px;
	width:65%;
	
}

/* Shadow effect for cofacts header background */
.shadow-cofacts
{
    background-color: rgba(0,0,0,0.60);
	border-style: solid;
	border-width: 5px;
	border-color: rgba(0,0,0,0.2);
	margin:10px;

	
}

.shadow-cofacts-footer
{
    background-color: rgba(0,0,0,0.60);
	border-style: solid;
	border-width: 5px;
	border-color: rgba(0,0,0,0.2);
	margin: 5px 150px 5px 150px;
	padding-top: -20px; 
	
}

@media(max-width:500px) {
    .shadow-cofacts-footer {
	
	margin: 0%;
	width: 100%; 
	
	
    };
}



.shadow-index-footer
{
    background-color: rgba(0,0,0,0.58);
	border-style: solid;
	border-width: 5px;
	border-color: rgba(0,0,0,0.2);
	margin: 5px 100px 5px 100px;
	
	
}

@media(max-width:500px) {
    .shadow-index-footer {
	font-size: 4px;
	padding: 20px;
	 width: 10%;
	margin-bottom: 5px;
	
    };
}

/* Shadow effect for cofacts text in the header  */
.shadow-cofacts-text
{
    background-color: rgba(0,0,0,0.38);
	padding: 16px;
	border-radius: 10px;
}

/*Formatting for all images*/
img{
    user-drag: none; 
user-select: none;
-moz-user-select: none;
-webkit-user-drag: none;
-webkit-user-select: none;
-ms-user-select: none;
}

/* Formatting for the tables on the cofab 
and comat technical information. */
table, th, td{
	border: 2px solid black;
}

/* Formatting for the table headers */
th{
	text-align: center;
	font-size: 20px;
}

/*Image enlargement when user clicks on image*/

/*Image1*/


#myImg {
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
}

#myImg:hover {opacity: 0.7;}


/* Modal 2 */

#myImg1 {
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
}
#myImg1:hover {opacity: 0.7;}



/* Modal 3 */

#myImg2 {
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
}
#myImg2:hover {opacity: 0.7;}



/* Modal 4 */

#myImg3 {
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
}
#myImg3:hover {opacity: 0.7;}




/* Modal 5 */

#myImg4 {
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
}
#myImg4:hover {opacity: 0.7;}



/* Modal 6 */

#myImg5 {
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
}
#myImg5:hover {opacity: 0.7;}



/* Modal 7 Uni-Weft*/

#myImg6 {
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
}
#myImg6:hover {opacity: 0.7;}



/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* 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 */
}




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




/* Caption of Modal Image 1*/
#caption {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 70%;
    text-align: center;
    color: #ccc;
    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;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

/* Add Animation */
.modal-content, #caption8 {    
    -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: 60px;
    right: 250px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
}

.close:hover,
.close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px){
    .modal-content {
        width: 100%;
    }
}

.store-table{
	border:none;
	vertical-align:top;
	 margin: auto;
}

.store-cells{
	border: none;
	vertical-align:top;
	margin: auto;
	text-align: center;
	padding-bottom: 40px;
}

@media screen and (max-width:767px) {
    .store-table tr > *{
        display: block;

    }
    .store-table table {
        display: table-cell;
		
    }
	
}


table.MMM td {
    width: 20%;
}

@media screen and (max-width:500px) {
	table.MMM td {
    width: 80%;
	}
}



table.art-pic td {
    width: 20%;
	text-align:left;
}

@media screen and (max-width:500px) {
	table.art-pic td {
    width: 100%;
	text-align: center;
	}
	
}

table.art-text td {
    width: 60%;
}

@media screen and (max-width:500px) {
	table.art-text td {
    width: 60%;
	}
	
}



.art-text-1 {
    
}

@media screen and (max-width:500px) {
	.art-text-1 {
    width: 70%;
	margin-left: 15%;
	}
}






table.footer td {
    width: 25%;
}

@media screen and (max-width:500px) {
	table.footer td {
    width: 80%;
}
	
}


.cofab-table tr, th{
		
}



@media screen and (max-width:767px) {
   .cofab-table tr, th{
		font-size:10px;
	}
    
}