/* Card with title, image in center and text in footer */
.orange-card { text-align: center;border-color:#ccc #ccc #ccc #fc0;border-width:thin thin thin thick;margin-top:5px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.12), 0 1px 3px #F9F9FA; transition: all 0.3s cubic-bezier(.25,.8,.25,1); height:100%}
.orange-card:hover {border-color:#006699;}
.orange-card .card-title{margin-top:5px; margin-bottom:5px;}
.orange-card p {font-size:14px; padding: 10px 4px 4px 4px; margin-bottom:0px;}

.orange-border-card {;border-color:#ccc #ccc #ccc #fc0;border-width:thin thin thin thick;margin-top:5px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.12), 0 1px 3px #F9F9FA; transition: all 0.3s cubic-bezier(.25,.8,.25,1); height:100%}
.orange-border-card:hover {border-color:#006699;}

.card > a{height: 100%; color:#006699;}
.flex-wrap{background-color:#fff;}
.image-center{text-align:center; padding-left:5px; padding-right:5px; }
.one-card-grid{ display: -ms-grid; display: grid; grid-template-columns:auto; grid-gap: 10px;}
.two-cards-grid{ display: -ms-grid; display: grid; grid-template-columns:auto; grid-gap: 10px;}
.three-cards-grid{ display: -ms-grid; display: grid; grid-template-columns:auto; grid-gap: 10px;}
.four-cards-grid{ display: -ms-grid; display: grid; grid-template-columns:auto; grid-gap: 10px;}
.card-drop-shadow{box-shadow: 1px 1px #888888;}
.four-cards-grid li{font-size: 15px}


/* Product Details Css */
.orange-line{background-color:#fc0!important;color:#fc0!important;border:solid 1px #fc0!important;width:100%!important}
.card-shadow{box-shadow:0 1px 4px rgba(0,0,0,.12),0 1px 3px #f9f9fa;transition:all .3s cubic-bezier(.25,.8,.25,1)}
.nowrap{white-space:nowrap}

/*
.img-height-110 { height: 110px; margin: 0.5rem 0 0.5rem 0 }
.img-height-120 { height: 120px; margin: 0.5rem 0 0.5rem 0 }
.img-height-100 { height: 100px; margin: 0.5rem 0 0.5rem 0 }
.img-height-90 { height: 90px; margin: 0.7rem 0 0.7rem 0}
.img-height-85 { height: 85px; margin: 0.5rem 0 0.5rem 0}
.img-height-75 { height: 75px; margin: 0.5rem 0 0.5rem 0 }
.line-height-120{line-height: 120px;}
.line-height-110{line-height: 110px;}
.line-height-90{line-height: 90px;}
.line-height-75{line-height: 75px;}
.line-height-90 img{max-height: 100%}
*/

/* Image aline center and middle */
.img-75{line-height:75px;text-align:center;margin:.5rem 0 .5rem 0}
.img-75>img{display:inline-block;vertical-align:middle;height:auto;max-width: 100%}
.img-90{line-height:90px;text-align:center;margin:.5rem 0 .5rem 0}
.img-90>img{display:inline-block;vertical-align:middle;height:auto;max-width: 100%}	
.img-110{line-height:110px;text-align:center;margin:.5rem 0 .5rem 0}
.img-110>img{display:inline-block;vertical-align:middle;height:auto;max-width: 100%}	
.img-120{line-height:120px;text-align:center;margin:.5rem 0 .5rem 0}
.img-120>img{display:inline-block;vertical-align:middle;height:auto;max-width: 100%}
.img-diagram {text-align:center;}
.img-diagram >img {max-height:140px; margin:auto; max-width:100%; display:block; padding:5px;}


.title{background-color:#eff3fa;margin-bottom:13px;padding:10px 0px 10px;font-weight:bold;}
.title-product{background-color:#ebf5ff;border:1px solid transparent;border-radius:4px;display:inline-block;padding:10px 10px 10px;text-align:center;vertical-align:middle;width:100%;margin-top:0px;margin-bottom:10px;}
.card ul{padding-left: 1rem;}
.card a, .card{font-weight: normal}
.card > a, .card-left-img div.card, .card.no-link{padding: 0.5rem 0.5rem 0;}
.card > a:hover, .card-left-img .card:hover{text-decoration: none; box-shadow: 1px 1px 4px 1px #006699; color:#666666;}
.no-link .card{color: #000033}
.no-link .card:hover{box-shadow:none}
.card-text li a:hover{text-decoration: underline}
/* End */

/* Card with left image */
.card-left-img .card-text li a{display: block}
.card-left-img .card{box-shadow: 1px 1px #888888;}
.card-left-img .card:hover{box-shadow: 1px 1px 4px 1px #337ab7;}
.card-title.mobile{display: none}
.card.list-arrow li{list-style: none}
.card.list-arrow ul{padding-left: 0;}
.card-left-img .card.orange-card{padding: 0;}
.card-left-img .orange-card .card-image img{width: 100px;}
.card-left-img .orange-card{height: auto; margin: 0; text-align: left}
.card-left-img .orange-card p{font-size: 16px;}
/* End Card with left image */


/* Responsive */

@media (min-width: 576px) {
.four-cards-grid{grid-template-columns:auto auto;grid-gap: 10px;}
}

@media (min-width: 768px) {
.three-cards-grid{grid-template-columns: repeat( 2, 1fr ); -ms-grid-columns:repeat( 2, 1fr ); grid-gap: 17px;}
}

@media (min-width: 992px) {
.one-card-grid{grid-template-columns: repeat( 1, 1fr ); -ms-grid-columns:repeat( 1, 1fr ); grid-gap: 17px; }
.two-cards-grid{grid-template-columns: repeat( 2, 1fr ); -ms-grid-columns:repeat( 2, 1fr ); grid-gap: 17px;}
.three-cards-grid{grid-template-columns: repeat( 2, 1fr ); -ms-grid-columns:repeat( 2, 1fr ); grid-gap: 17px;}
.four-cards-grid{grid-template-columns: repeat( 3, 1fr ); -ms-grid-columns:repeat( 3, 1fr ); grid-gap: 17px;}
}

@media (max-width: 575px) {
 /* Card-left-img - For the different design in mobile then desktop */
 .card-left-img .card-image{width: 100%;}
 .card-image img{margin: 0 auto; display: block}
 .card-left-img .col{text-align: center}
 .card-left-img .col ul{text-align: left}
 .card-left-img .col ul+a{text-align: left}	
 .card-title.mobile{display:block; width: 100%; margin: 15px 0 0 0; text-align: center}
 .card-title.desktop{display: none}
 .card-image.padding75-125{padding-bottom: 0;}

}

/* End Responsive */


/* Cards CSS for IE browser versions */

/* IE <=7 */
@media screen\9 {
.card-left-img .card-image{float:left;}
.card-left-img .col{float:right; width: 66%; padding-left: 15px}
.card-left-img .card{display: inline-block; vertical-align: middle; float:left; width: 40%; border:1px solid #ddd; border-radius: 5px; padding: 15px; box-sizing: border-box; box-shadow: 1px 1px 0 0 #888888}
.card-left-img.card-deck{display: inline-block; vertical-align: middle; width: 100%;}
.card-left-img.card-deck .card{margin-bottom: 30px;}
 .col-md-4 .card-left-img .card{width: 100%}
.w-100{display: none}
}
/*For Orange Cards positions for IE Browser Verisons - 8<= */
@media (min-width: 1281px){
.one-card-grid{grid-template-columns: repeat(1, 1fr ); -ms-grid-columns:repeat( 1, 1fr ); }
.two-cards-grid{grid-template-columns: repeat(2, 1fr ); -ms-grid-columns:repeat( 2, 1fr ); }
.three-cards-grid{display: -ms-grid; display: grid; grid-template-columns: repeat(3, 1fr ); -ms-grid-columns:repeat( 3, 1fr ); }
.four-cards-grid{grid-template-columns: repeat( 4, 1fr ); -ms-grid-columns:repeat( 4, 1fr ); }


.cell-1 {-ms-grid-row: 1;   -ms-grid-column: 1;}
.cell-2 { -ms-grid-row: 1;   -ms-grid-column: 2;}
.cell-3 {-ms-grid-row: 1;   -ms-grid-column: 3;}
.cell-4 {-ms-grid-row: 1;   -ms-grid-column: 4;}
.cell-5 { -ms-grid-row: 2;   -ms-grid-column: 1;}
.cell-6 { -ms-grid-row: 2;   -ms-grid-column: 2;}
.cell-7 { -ms-grid-row: 2;   -ms-grid-column: 3;}
.cell-8 { -ms-grid-row: 2;   -ms-grid-column: 4;}
.cell-9 { -ms-grid-row: 3;   -ms-grid-column: 1;}
.cell-10 { -ms-grid-row: 3;   -ms-grid-column: 2;}
.cell-11 { -ms-grid-row: 3;   -ms-grid-column: 3;}
.cell-12 { -ms-grid-row: 3;   -ms-grid-column: 4;}
.cell-13 { -ms-grid-row: 4;   -ms-grid-column: 1;}
.cell-14 { -ms-grid-row: 4;   -ms-grid-column: 2;}
.cell-15 { -ms-grid-row: 4;   -ms-grid-column: 3;}
.cell-16 { -ms-grid-row: 4;   -ms-grid-column: 4;}
.cell-17 { -ms-grid-row: 5;   -ms-grid-column: 1;}
.cell-18 { -ms-grid-row: 5;   -ms-grid-column: 2;}
.cell-19 { -ms-grid-row: 5;   -ms-grid-column: 3;}
.cell-20 { -ms-grid-row: 5;   -ms-grid-column: 4;}
.cell-21 { -ms-grid-row: 6;   -ms-grid-column: 1;}
.cell-22 { -ms-grid-row: 6;   -ms-grid-column: 2;}
	
.cell3-1 {-ms-grid-row: 1;   -ms-grid-column: 1;}
.cell3-2 { -ms-grid-row: 1;   -ms-grid-column: 2;}
.cell3-3 {-ms-grid-row: 1;   -ms-grid-column: 3;}
.cell3-4 {-ms-grid-row: 2;   -ms-grid-column: 1;}
.cell3-5 { -ms-grid-row: 2;   -ms-grid-column: 2;}
.cell3-6 { -ms-grid-row: 2;   -ms-grid-column: 3;}
	
.cell2-1{-ms-grid-row: 1;   -ms-grid-column: 1;}
.cell2-2{-ms-grid-row: 1;   -ms-grid-column: 2;}
.cell2-3{-ms-grid-row: 2;   -ms-grid-column: 1;}
.cell2-4{-ms-grid-row: 2;   -ms-grid-column: 2;}
.cell2-5{-ms-grid-row: 3;   -ms-grid-column: 1;}
.cell2-6{-ms-grid-row: 3;   -ms-grid-column: 2;}
.cell2-7{-ms-grid-row: 4;   -ms-grid-column: 1;}
.cell2-8{-ms-grid-row: 4;   -ms-grid-column: 2;}
.cell2-9{-ms-grid-row: 5;   -ms-grid-column: 1;}
.cell2-10{-ms-grid-row: 5;   -ms-grid-column: 2;}
.cell2-11{-ms-grid-row: 6;   -ms-grid-column: 1;}
.cell2-12{-ms-grid-row: 6;   -ms-grid-column: 2;}
.cell2-13{-ms-grid-row: 7;   -ms-grid-column: 1;}
.cell2-14{-ms-grid-row: 7;   -ms-grid-column: 2;}
.cell2-15{-ms-grid-row: 8;   -ms-grid-column: 1;}
.cell2-16{-ms-grid-row: 8;   -ms-grid-column: 2;}
.cell2-17{-ms-grid-row: 9;   -ms-grid-column: 1;}
.cell2-18{-ms-grid-row: 9;   -ms-grid-column: 2;}
.cell2-19{-ms-grid-row: 10;   -ms-grid-column: 1;}
.cell2-20{-ms-grid-row: 10;   -ms-grid-column: 2;}
	
.cell1-1{-ms-grid-row: 1;   -ms-grid-column: 1;}
.cell1-2{-ms-grid-row: 2;   -ms-grid-column: 1;}
.cell1-3{-ms-grid-row: 3;   -ms-grid-column: 1;}
.cell1-4{-ms-grid-row: 4;   -ms-grid-column: 1;}
.cell1-5{-ms-grid-row: 5;   -ms-grid-column: 1;}
.cell1-6{-ms-grid-row: 6;   -ms-grid-column: 1;}
.cell1-7{-ms-grid-row: 6;   -ms-grid-column: 1;}
.cell1-8{-ms-grid-row: 6;   -ms-grid-column: 1;}
.cell1-9{-ms-grid-row: 6;   -ms-grid-column: 1;}
.cell1-10{-ms-grid-row: 6;   -ms-grid-column: 1;}
.cell1-11{-ms-grid-row: 6;   -ms-grid-column: 1;}
.cell1-12{-ms-grid-row: 6;   -ms-grid-column: 1;}
	
}
/*End Orange Cards positions for IE Browsers */

/* IE 8 */
@media \0screen {
.card-left-img .card-image{display: inline-block; vertical-align: middle; width: auto}
.card-left-img .col{display: inline-block; vertical-align: middle; width: 58%; padding-left: 5%}
.card-left-img .card{display: inline-block; vertical-align: top; width: 45%; border:1px solid #ddd; border-radius: 5px; padding: 15px; box-sizing: border-box; box-shadow: 1px 1px 0 0 #888888}
.card-left-img.card-deck .card{margin-bottom: 30px;}
.col-md-4 .card-left-img .card{width: 100%}
.four-cards-grid{display: inline-block; vertical-align: top; width: 100%}
	
.cell-1, .cell-2, .cell-3, .cell-4, .cell-5, .cell-6, .cell-7, .cell-8, .cell-9, .cell-10, .cell-11, .cell-12, .cell-13, .cell-14, .cell-15, .cell-16, .cell-17, .cell-18, .cell-19, .cell-20, .cell-21, .cell-22 {width:24%; border: 1px solid #fc0; float:left; margin-right:7px; margin-bottom:5px;}

.cell1-1, .cell1-2, .cell1-3, .cell1-4, .cell1-5, .cell1-6, .cell1-7, .cell1-8, .cell1-9, .cell1-10, .cell1-11, .cell1-12 {width:99%; height:auto; float:left;margin-right:7px; margin-bottom:7px; }
	
.one-card-grid{display: inline-block; vertical-align: top; width: 100%;display: -ms-grid; display: grid;}
.one-card-grid .card{width:1100px; height: auto; float:left;margin-right:7px; margin-bottom:7px; border:1px solid #ccc;}
	
.two-cards-grid{display: inline-block; vertical-align: top; width: 100%;display: -ms-grid; display: grid;}
.two-cards-grid .card{width:545px; height: auto; float:left;margin-right:7px; margin-bottom:7px; border:1px solid #ccc;}
	
.three-cards-grid{display: inline-block; vertical-align: top; width: 100%}
.three-cards-grid .card{width:32%; border: 1px solid #ccc; float:left; margin-right:7px; margin-bottom:7px; height: 260px}

.main-section .col-lg-8{max-width:60% !important; display: inline-block; -ms-flex: 0 0 30%}
.main-section .col-lg-4{max-width:30% !important; display: inline-block; -ms-flex: 0 0 30%}
}
/* IE 9+ */
@media screen and (min-width:0\0) {
.cell-1, .cell-2, .cell-3, .cell-4, .cell-5, .cell-6, .cell-7, .cell-8, .cell-9, .cell-10, .cell-11, .cell-12, .cell-13, .cell-14, .cell-15, .cell-16, .cell-17, .cell-18, .cell-19, .cell-20, .cell-21, .cell-22 {width:275px; float:left;margin-right:7px; margin-bottom:7px; }

.cell2-1, .cell2-2, .cell2-3, .cell2-4, .cell2-5, .cell2-6, .cell2-7, .cell2-8, .cell2-9, .cell2-10, .cell2-11, .cell2-12, .cell2-13, .cell2-14, .cell2-15, .cell2-16, .cell2-17, .cell2-18, .cell2-19, .cell2-20 {width:49%; height:auto; float:left;margin-right:7px; margin-bottom:7px; }
	
.cell1-1, .cell1-2, .cell1-3, .cell1-4, .cell1-5, .cell1-6, .cell1-7, .cell1-8, .cell1-9, .cell1-10, .cell1-11, .cell1-12 {width:99%; height:auto; float:left;margin-right:7px; margin-bottom:7px; }
	

.one-card-grid{display: inline-block; vertical-align: top; width: 100%;display: -ms-grid; display: grid;}
.one-card-grid .card{width:1100px; height: auto; float:left;margin-right:7px; margin-bottom:7px; border:1px solid #ccc;}
	
.two-cards-grid{display: inline-block; vertical-align: top; width: 100%;display: -ms-grid; display: grid;}


.three-cards-grid{display: inline-block; vertical-align: top; width: 100%; display: -ms-grid; display: grid;}
.three-cards-grid .card{min-height: 260px;width:32%; float:left; margin-right:7px; margin-bottom:5px;}
	
.card-left-img .card-image{display: inline-block; vertical-align: middle}
.card-left-img .col{display: inline-block; vertical-align: middle; width: 59%; padding-left: 5%}
.card-left-img .card{display: inline-block; vertical-align: top; width: 46%;}
.col-md-4 .card-left-img .card{width: 100%}
.four-cards-grid{display: inline-block; vertical-align: top; width: 100%; display: -ms-grid; display: grid;}
.four-cards-grid .card{height: 267px}

}
/* IE10+ */ 
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) { 
.cell-1, .cell-2, .cell-3, .cell-4, .cell-5, .cell-6, .cell-7, .cell-8, .cell-9, .cell-10, .cell-11, .cell-12, .cell-13, .cell-14, .cell-15, .cell-16, .cell-17, .cell-18, .cell-19, .cell-20, .cell-21, .cell-22 {width:275px; float:left;margin-right:7px; margin-bottom:7px; }

.cell1-1, .cell1-2, .cell1-3, .cell1-4, .cell1-5, .cell1-6, .cell1-7, .cell1-8, .cell1-9, .cell1-10, .cell1-11, .cell1-12 {width:99%; height:auto; float:left; margin-bottom:7px; }
	
.cell2-1, .cell2-2, .cell2-3, .cell2-4, .cell2-5, .cell2-6, .cell2-7, .cell2-8, .cell2-9, .cell2-10, .cell2-11, .cell2-12, .cell2-13, .cell2-14, .cell2-15, .cell2-16, .cell2-17, .cell2-18, .cell2-19, .cell2-20 {width:49%; height:auto; float:left;margin-right:7px; margin-bottom:7px; }
	
.cell3-1, .cell3-2, .cell3-3, .cell3-4, .cell3-5, .cell3-6{width:355px; float:left;margin-right:7px; margin-bottom:7px;}
	
.one-card-grid{display: inline-block; vertical-align: top; width: 100%;display: -ms-grid; display: grid;}
.one-card-grid .card{width:1100px; height: auto; float:left;margin-right:7px; margin-bottom:7px; border:1px solid #ccc;}
	
.two-cards-grid{display: inline-block; vertical-align: top; width: 100%;display: -ms-grid; display: grid;}
.two-cards-grid .card{width:545px; height: auto; float:left;margin-right:7px; margin-bottom:7px; border:1px solid #ccc;}

	
.three-cards-grid{display: inline-block; vertical-align: top; width: 100%;display: -ms-grid; display: grid;}
.three-cards-grid .card{width:355px;}

.main-section .container > .row{display: block}	
.main-section .container > .row.four-cards-grid{display: -ms-grid}	
.four-cards-grid{display: inline-block; vertical-align: top; width: 100%;display: -ms-grid; display: grid;}
}
/* End Cards CSS for IE browser versions */