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


.case-table { font-size:14px; }
.case-table tr { border-bottom:1px solid #000000; }
.case-table td { padding:4px 18px 4px 0; }
.table-head { font-family:myriadsemi; }





.btn-slider { border:2px solid #FFFFFF; padding:6px 10px; display:inline-block; margin:12px 0 0 0; font-size:22px; }
.btn-slider:hover { background:#FFFFFF; color:#000000; text-decoration:none; }

/* NEW ROLLERS APP */

.popup-row { display:inline-block; width:100%; padding-left:15px; padding-right:15px; background:#FFFFFF; clear:both; overflow:hidden; }

.roller-detail-left { float:left; padding:30px; width:50%; margin:0 0 0 0; }
.roller-detail-right { float:left; padding:30px; width:45%; margin:0 0 0 5%; }
.roller-detail-right img { width:100%; }

@media screen and (max-width: 767px) {
    .roller-detail-left { clear:both; width:100%; padding:5px; margin:0 0 10px 0; }
    .roller-detail-right { clear:both; width:100%; padding:5px; margin:0; }
	}


/* COUNTER */

.counter-head { font-family:myriadsemi; font-size:20px; margin:0 0 20px 0; }
.counter-bar { background:#666666; padding-top:40px; padding-bottom:0px; color:#FFFFFF; }
.counter { text-align:right; font-family:myriadsemi; color:#FFCC00; margin:0 0 30px 0; }
.counter span { font-family:myriadsemi; font-size:60px; color:#FFFFFF; margin:0; line-height:50px; }

@media screen and (max-width: 991px) { .counter span { font-size:50px; } }

@media screen and (max-width: 767px) { .counter { text-align:center; } }


/* BLOG */

.blog-main {  }

.blog-list-item { margin:0 0 4px 0; padding:20px; background:#EEEEEE; border-top:1px solid #666666; border-bottom:1px solid #666666; font-size:16px; }
.blog-list-item h2 { margin:0; }
.blog-list-item h2 a { color:#000000; }

.blog-side-panel {  }

.blog-feature-pic { float:right; margin:0 0 0 20px; width:35%; }
.blog-feature-pic img { width:100%; }

.BlogRecentPost ul, .BlogTagList ul, .BlogPostArchive ul { margin:0; padding:0; }
.BlogRecentPost li, .BlogTagList li, .BlogPostArchive li { font-size: 14px; list-style-type:none; margin:0 0 6px; }

/* BLOG IMAGE STYLING!!! */
.blog-content img { width:60%; margin:0 0 15px 15px; float:right; }
@media screen and (max-width: 767px) { .blog-content img { float:none; margin:0 0 15px 0; width:100%; } }
.blog-content img.blog-post-feature { max-width:100%; width:100%; margin:0 0 14px 0; float:none; }


/* BLOG POST ONE HOME */
.cps-news-home { margin:0 0 30px 0; }
.cps-news-home .blog-feature-pic { width:100%; margin:0 0 20px 0; }
.cps-news-home .blog-list-item h2 { font-size:22px; }
.cps-news-home .blog-desc { display:none; }

.blog-minor .blog-feature-pic, .blog-minor .blog-desc { display:none; }
.blog-minor h2 { font-size:22px; }

	@media screen and (max-width: 767px) {
    	.blog-feature-pic { float:none; width:100%; margin:0 0 10px 0; }
	}



/* BLOG LIST HACK */
.blog-recent-hack h2 { font-size:14px; color:#337AB7; }
.blog-recent-hack h2 a { color:#337AB7; }
.blog-recent-hack h2 a:hover { color:#23527C; }
.blog-recent-hack .blog-details { display:none; }
.blog-recent-hack .blog-desc { display:none; }
.blog-recent-hack .blog-feature-pic { display:none; }
.blog-recent-hack .blog-list-item { padding:0; margin:0 0 6px 0; background:none; border:0px; }




/***  SECURE ORDER SYSTEM  ***/

.cat-item { background:#ffcb05; padding:10px; border-radius:6px; width:99%; }
.cat-image img { width:100%; }

.prod-list {  }
.prod-listitem { padding:14px; background:#EEEEEE; border-radius:6px; border:1px solid #666666; margin:0 0 6px 0; }
.prod-listimage { position:relative; background:#FFFFFF; height:140px; border-radius:4px; padding:10px; }
img.prod-image { position:absolute; top:0; right:0; bottom:0; left:0; margin:auto; width:80%; }
.prod-label { position:absolute; z-index:999; left:-30px; top:8px; width:50px; height:50px; border-radius:25px; overflow:hidden; background:#000000; color:#FFFFFF; font-family:myriadsemi; text-align:center; font-size:40px; }

.prod-code { font-family:myriadsemi; font-size:14px; }
.prod-listinfo {  }
.prod-listinfo h3 { font-family:myriadreg; font-weight:500; margin:0; padding:7px 8px 4px 8px; color:#FFFFFF; background:#000000; border-radius:8px;  }
.price-block { float:left; display:inline-block; margin:0 20px 0 0; }
.prodlist-addtocart { margin:3px 0 0 0; }
.prodlist-addtocart input[type="text"] { height:26px; }
.prodlist-addtocart input[type="submit"] { border-radius:6px; border:1px solid #666666; background:#ffcb05; }

.secure-nav-app { float:left; width:60%; }
a.secure-btn { padding:4px; border-radius:4px; margin:0 4px 4px 0; background:#666666; color:#FFCB05; display:block; text-decoration:none; float:left; }
a.secure-btn:hover { background:#000000; }
.secure-cart { float:right; width:25%; }


.diagram { width:!00%; background:#ffcb05; border-radius:8px; padding:20px; margin:0 0 10px 0; }
.diagram img { width:100%; border-radius:4px; overflow:hidden; }


.secure-nav-section { background:#FFCC00; padding:20px; border-radius:0 0 20px 20px; }



/* VISION */

.vision-letter { float:left; font-family:myriadsemi; font-size:40px; margin:0 10px 10px 0; clear:left; width:50px; height:50px; text-align:center; background:#FFCC00; border-radius:6px; }
.vision-text { float:left; }
.vision-text span { font-family:myriadsemi; }



/* NEW */

.header-bar {  background:#666666; padding-top:20px; padding-bottom:20px; border-bottom:4px solid #FFCC00; }
.logo-header img { width:100%; }
@media screen and (max-width: 991px) { .logo-header { margin-bottom:60px; } }
@media screen and (max-width: 767px) { .logo-header { margin-bottom:0px; } }

.navi { position:absolute; bottom:0; right:0; text-align:right; }
@media screen and (max-width: 991px) { .navi { position:default; } }
 

.header-bottom { border-top:4px solid #FFCC00; }

.header-rollers { position:absolute; top:-57px; right:40px; width:500px; height:90px; background:url('/nav/header-rollers.png'); }


.header-end { position:relative; height:37px; background:#BDBCB1; border-bottom:4px solid #FFCC00; }



/* HOME UPDATES JUN16 */

.home-article { width:100%; margin:0 0 90px 0; }
img.home-article-pic { float:right; margin:0 0 20px 20px; width:30%; }





@media screen and (max-width: 767px) { img.fill-pic { width:100%; } }

img.border-pic { border:1px solid #666666; }



/* Roller Detail */

.roller-type { width:90%; margin:30px 0 0 0; }
.roller-image { position:relative; height:120px; }
.roller-image img { max-height:120px; max-width:100%; position:absolute; margin:auto; top:0; right:0; bottom:0; left:0; }
.roller-type a { position:relative; display:block; background:#FFFFFF url('/nav/icon-see-more-sml.png'); background-repeat:no-repeat; background-position:95% 50%; color:#666666; margin:0; padding:6px 6px 5px 8px; z-index:9; border:3px solid #FFCC00; font-family:myriadreg; font-size:17px; transition:all ease-in-out 0.2s; }
.roller-type a:hover { background:#FFCC00 url('/nav/icon-see-more-sml.png'); background-repeat:no-repeat; background-position:95% 50%; transition:all ease-in-out 0.2s; }
.roller-description { font-size:16px; box-sizing:border-box; width:100%; background:#EEEEEE; border:1px solid #666666;  overflow:hidden; padding:0 20px 0 20px; transition: all 0.5s ease-in-out; max-height:4px; margin:-12px 0 0 0; }
.roller-description p { font-size:16px; margin:0; }
.active-roller { height:inherit; margin:0; max-height:9999px; padding:20px; }



/* Order Form */

.contact-form .form-label { width:20% }

.form-panel { background:#EEEEEE; border:solid 1px #666666; padding:20px; border-radius:6px; margin:0 0 10px 0; }
.form-content { width:90%; }
.form-label { float:left; width:47%; margin:0 3% 8px 0; text-align:right; }
.form-field { float:left; width:50%; margin:0 0 8px 0; text-align:left; }
.form-field select, .form-field input { width:100%; }
.form-field-textarea {  }

.dimension-field { display:none; clear:left; }

.shaft { float:right; border-radius:6px; overflow:hidden; }
.shaft-slot { background:url('/images/rollers/order-diagram-1.jpg'); background-repeat:no-repeat; background-size:contain; height:400px; }
.shaft-open { background:url('/images/rollers/order-diagram-2.jpg'); background-repeat:no-repeat; background-size:contain; height:400px; }
.shaft-suspended { background:url('/images/rollers/order-diagram-3.jpg'); background-repeat:no-repeat; background-size:contain; height:400px; }
.shaft-weigh { background:url('/images/rollers/order-diagram-4.jpg'); background-repeat:no-repeat; background-size:contain; height:400px; }
.shaft-none { background:url('/images/rollers/order-diagram-5.jpg'); background-repeat:no-repeat; background-size:contain; height:400px; }

@media ( max-width:767px ) {
    .form-label { float:none; width:100%; text-align:left; }
	.form-field { float:none; width:100%; }
    .form-field textarea { width:100%; }
	
    .shaft { clear:both; width:100%; }
	}


.select-shaft img { width:100%; max-width:100px; border-radius:8px; border:solid 1px #666666; }

#small-form, #large-form { display:none; }

.is-selected { background:#FFCC00; color:#666666; }




/* CONTACT PAGE */

.contact-head { padding:0; margin:0 0 -6px 0; }
iframe.google-map { width:100%; height:400px; margin:0; }




/*------ LAYOUT & STRUCTURE ------*/


.pad-20-bottom { padding-bottom:20px; }
.pad-40-bottom { padding-bottom:40px; }
.pad-20-top { padding-top:20px; }
.pad-40-top { padding-top:40px; }




h2.glyphicon { font-size:24px; color:#FFCC00; }

.slider { position:relative; height:400px; overflow:hidden; padding:0; }
@media screen and (min-width: 992px) { .slider { height:400px; } .slide-pic img { height:100%; width:100%; } }
@media screen and (max-width: 991px) { .slider { height:300px; } }
@media screen and (max-width: 767px) { .carousel { display:none; } }

.slide-info { position:absolute; color:#FFFFFF; bottom:0px; left:160px; padding:20px 20px 40px 20px; border-radius:20px 20px 0 0; background:url('/nav/bg-shadow.png'); }
.slide-info h2, .slide-info h3, .slide-info p, .slide-info a {color:#FFFFFF;}
	
	@media screen and (max-width: 991px) {
		.active .slide-info {  }
	}

@media screen and (max-width: 767px) {
    .slide-pic img { height:100%; width:default; }
}
    
    
.slide-pic { max-height:400px; overflow:hidden; }




.item, .active .item { padding:0; margin:0 -15px 0 -15px; }




.header-pic img { width:100%; margin:0; }
.header-pic { padding:0; margin:0; overflow:hidden; height:400px; }

/* Header */

.header-strip { background:#FFCC00; height:10px; }
.header-logo { position:absolute; top:140px; right:20px; width:240px; height:70px; background:url('/nav/logo-cps-header.png'); background-repeat:no-repeat; z-index:999; }

	@media screen and (max-width: 768px) {
		.header-logo { left:10%; right:10%; width:80%; background-position:50% 0%; }
	}

a.btn-iso { display:block; }
.header-icon-iso { position:absolute; right:0; bottom:0; width:70px; height:70px; background:url('/images/icon-iso.jpg') #FFFFFF; background-size:80%; background-position:center; background-repeat:no-repeat; border-radius:8px; }



/* Main Body */

.main-content { font-size:18px; }

.splash { margin-bottom:40px; height:160px; }
.splash-tn { position:relative; width:100%; height:60px; border-bottom:solid 1px #666666; margin:0 0 10px 0; overflow:hidden; }
.splash-tn img { margin:15px 0 0 10px; width:80%; }
.splash-icon { float:left; width:10%; margin:0 3% 0 0; }
.splash-icon h2.glyphicon { color:#FFCC00; font-size:24px; }
.splash h2 { color:#666666; font-size:24px; }
.splash-desc { float:left; position:relative; width:87%; height:140px; overflow:hidden; z-index:9; }

.splash-fade { position:absolute; z-index:999; width:100%; height:80px; bottom:0; left:0;
	background:transparent linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #FFFFFF 80%) repeat scroll 0% 0%;
	}

a.btn-splash {
    padding:15px 30px; border-radius:12px; background:#FFCC00; color:#FFFFFF; width:80%; font:myriadlight;
	display:block; font-size:28px; text-decoration:none;
	}

a.btn-splash:hover, a.btn-sml:hover, a.btn-pdf:hover, a.btn-full:hover { background:#FFCC00; transition:all ease-in-out 0.2s; }


a.btn-sml {
    padding:3px 10px; color:#666666; font:myriadlight; transition:all ease-in-out 0.2s;
	display:inline-block; font-size:20px; text-decoration:none; position:relative; border:3px solid #FFCC00;
	}

a.btn-full {
    padding:3px 10px; color:#666666; width:100%; font:myriadlight; transition:all ease-in-out 0.2s;
	display:block; font-size:20px; text-decoration:none; position:relative; border:3px solid #FFCC00; text-align:center;
	}

a.btn-pdf {
    padding:3px 85px 3px 10px; color:#666666; width:480px; font:myriadlight; transition:all ease-in-out 0.2s;
	display:inline-block; font-size:20px; text-decoration:none; position:relative; border:3px solid #FFCC00;
	}

@media screen and (max-width: 767px) { a.btn-pdf { width:100%; } }

.btn-pdf-icon { position:absolute; right:20px; top:-11px; }


.testimonials-outer { background:#EEEEEE; margin:0 0 60px 0; padding-bottom:40px; }
.testimonials { padding:30px;  }
.testimonials h2 { color:#FFCC00; }

.comment {  }
.comment-icon h3 {  }
.comment-icon { float:left; width:12%; height:12%; margin:0 8% 0 0; }
.speech-bubble { float:left; position:relative; background:#FFFFFF; border-radius:12px; box-shadow: 2px 2px 10px #777777; padding:20px; width:80%; }
.speech-bubble:before { content: ''; position:absolute; top:6px; left:-25px; width:0; height:0; border:16px solid; border-color:#FFFFFF #FFFFFF transparent transparent; }


.customer-logo {border:solid 1px #666666; width:96%; padding:20px; }


.home-main-items { margin-bottom:40px; border-bottom:solid 2px #666666; }


.sidebar-green {
	border:solid 1px #666666;
	background:#FFCC00;
	border-radius:12px;
	padding:20px;
	margin:0 0 20px 0;
    text-align:left;
    font-size:18px;
	}

.search {position:absolute; right:0; top:4px; }
	@media screen and (max-width: 767px) {
		.search img { position:absolute; left:0; right:auto; }
	}


/* Footer */



.footer-iso { float:left; border-radius:8px; width:55px; height:55px; padding:3px; overflow:hidden; background:#FFFFFF; margin:20px 10px 5px 0; }
.footer-iso img { width:100%; }
.footer-iso-comment { height:55px; float:left; margin:30px 0 5px 0; width:65%; font-size:20px; font-family:myriadsemi; line-height:18px; }

.sm-link { margin:6px 0 0 0; font-size:15px; }
.sm-link img { margin:0 5px 0 0; }

.footer-logo img { width:90%; }



.footer-left {  }
.footer-left img {  }
.footer-mid {  }
.footer-right { text-align:right; }

.footer-bottom { padding-top:40px; padding-bottom:20px; }




.footer { background:#C3CF21; }
.footer-top {  }
.footer-top-left { padding:0 0 20px 0; }
.footer-right {  }
.footer-top-right { position:absolute; bottom:0; right:0; padding:20px; background:#EEEEEE; border-top-left-radius:12px; border-top-right-radius:12px; }



.footer-top-right img { float:left; margin:0 20px 0 0; }

	@media screen and (max-width: 767px) {
		.footer-top-right img { float:none; }
    .footer-mid { margin:14px 0 14px 0; }
    .footer-right { text-align:left; }
    .footer-logo img { width:100%; }
	}

.footer-bottom, .footer-bottom a { color:#FFFFFF; }
.footer-bottom-left { float:left; padding-top:20px; }

.footer-bottom-right { float:left; position:absolute; right:0; background:#EEEEEE; padding:20px; border-bottom-left-radius:12px; border-bottom-right-radius:12px; height:80px; }

	@media screen and (max-width: 991px) {
		.footer-bottom-right { position:static; }
	}


	@media screen and (max-width: 991px) {
		.footer-top-right { position:static; }
	}


.footer-top-left ul { list-style-type:none; margin:0 20px 20px 0; padding:0; }
.footer-top-left ul li { float:left; }
.footer-top-left ul li ul { margin:6px 20px 0 0; border-top:solid 1px #666666; }
.footer-top-left ul li ul li { clear:both; border:none; }


/* System Pages */

.system-page-box {
	background-color: #f9f9f9;
	border: 1px solid #eee;
	color: #666;
	margin: 18px;
	height: auto !important;
	padding: 36px 36px 36px 36px;
	}



/* Elements */



/* Navigation */

.navi { text-align:right }
.navbar { position:relative; background:#666666; border-radius:8px; margin:0 0 20px 0; padding:12px 10px 10px 10px; min-height:0; margin:10px 0 0 0; }

.nav { position:absolute; right:0px; bottom:0; padding:0; margin:0; text-align:right; }
.nav ul { list-style-type:none; margin:0; padding:0; text-align:left; }
.nav ul li { float:left; position:relative; margin:0 0 0 14px; }
.nav ul li a { position:relative; display:block; font-family:myriadlight; font-size:18px; color:#FFFFFF; text-decoration:none; padding:8px 2px 8px 2px; }
.nav ul li:hover {   }
.nav ul li:hover > a { color:#FFCC00; }

.nav ul li ul { display:none; position:absolute; left:5%; top:97%; margin:0; padding:0; border:solid 1px #999999; background:#FFFFFF; z-index:9999; min-width:160px; }
.nav ul li:hover > ul { display:block; }

.nav ul li ul li { clear:both; margin:0; width:100%; color:#666666; }
.nav ul li ul li:hover { background:#FFCC00; margin:0; }
.nav ul li ul li:hover > a { color:#FFFFFF; }
.nav ul li ul li a { font-family:myriadlight; padding:6px 12px; font-size:16px; color:#666666; }
.nav ul li ul li a:hover { color:#FFFFFF; }
.nav ul li ul li ul { top:-1px; left:90%; }

.nav ul li ul li.top-level { border-bottom:solid 1px #999999; }


.mob-nav { display:none; color:#FFFFFF; position:relative; z-index:9999;margin:0 0 10px 0; }
.mob-nav .cartSummaryItem { color:#FFFFFF: }

.mob-nav a { color:#FFFFFF; font-size:15px; padding:6px; }

.mob-nav ul { list-style-type:none; margin:0; padding:0; }
.mob-nav ul li { border-top:solid 1px #888888; }
.mob-nav ul li a { display:block; padding:6px 0 6px 8px; font-size:15px; color:#FFFFFF; text-decoration:none; }
.mob-nav ul li ul { display:none; opacity:0; transition:height 1.5s; overflow:hidden;visibility:hidden; }
.mob-nav ul li:hover > ul { display:block; opacity:1;visibility:visible; transition:visibility 0s linear 0.5s, opacity 0.5s linear; }
.mob-nav ul li ul li { padding:0 0 0 8px; border:none; background:#888888; }

.mob-nav .search { position:static; color:#000000; }


	/* MOBILE Nav ON */
	@media screen and (max-width: 767px) {
		.mob-nav { display:inline; }
    	.nav { display:none; }
    	.mob-off { display:none; }
		}



/*------ DEFAULT SETTINGS ------*/

body { margin:0; font-family:myriadlight, Arial, Helvetica; background:#666666; }
h1 { margin:0 0 20px 0; }
h2 { margin:0 0 10px 0; color:#000000; }
h3 { margin:0 0 16px 0; color:#666666; }
h4 { font-size:17px; }
p { margin:0 0 10px 0; font-size:17px; }
p a { text-decoration:underline; }
a {  }
a:hover {  }

form label { font-size:16px; font-weight:500; margin:0 0 4px 0; }
form input.cat_textbox { line-height:90%; margin:0 0 4px 0; }


.relative { position:relative; }
.main-container { padding:0; margin:0; background:#FFFFFF; }
.clear { clear:both; }
.clear-left { clear:left; }
.clear-right { clear:right; }


.xs-only { display:none; } @media screen and (max-width: 767px) { .xs-only { display:block; } }
.xs-hide { display:block; } @media screen and (max-width: 767px) { .xs-hide { display:none; } }
.sm-hide { display:block; } @media screen and (max-width: 991px) { .sm-hide { display:none; } }



/*------ FONTS ------*/

@font-face {font-family:myriadlight;
src:url('/fonts/myriadpro_light.eot?#iefix') format('embedded-opentype'),
url('/fonts/myriadpro_light.ttf') format('truetype'); }

@font-face {font-family:myriadreg;
src:url('/fonts/myriadpro_regular.eot?#iefix') format('embedded-opentype'),
url('/fonts/myriadpro_regular.ttf') format('truetype'); }

@font-face {font-family:myriadsemi;
src:url('/fonts/myriadpro_semibold.eot?#iefix' ) format('embedded-opentype'),
url('/fonts/myriadpro_semibold.ttf') format('truetype'); }