/*
Theme Name: Cementing Products Inc.
Theme URI: http://www.scissorthemes.com/theme/writee
Author: Scissor Themes
Author URI: http://www.scissorthemes.com
Description: Writee is a creatively bold and visually stunning, free personal WordPress blog theme. Writee is fully responsive and mobile friendly. The theme features pixel perfect design and includes custom widgets, Customizer Options, full-width/boxed slider to showcase your content with style. Checkout out the live demo at http://www.scissorthemes.com/demo/writee/ and theme documentation to explore about WRITEE.
Version: 100
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: writee
Tags:  two-columns,one-column, left-sidebar, custom-logo, custom-colors, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready, theme-options,Blog, E-Commerce, Education, Entertainment, News, Photography, Portfolio
*/

@font-face { font-family: 'LuzSans-Book'; font-style: normal; font-weight: normal; src: local('LuzSans-Book'), url('fonts/LUZRO.woff') format('woff'); }

body { font-family:'LuzSans-Book'; color: #333333; }
span.blue-gradient { background: -webkit-linear-gradient(#81d3f6, #006e96); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
span.line-cont { letter-spacing: -0.15em; font-size: 12px; vertical-align: 1em; }
button.grey { background: #86878d; color: white; padding: 0.5em 2em 0.5em 2em; cursor: pointer; border-radius: 30px; -moz-border-radius: 30px; -webkit-border-radius: 30px; border: 0; font-weight: bold; }
button.blue,
input[type="submit"] { background: #0d4466; color: white; padding: 0.5em 2em 0.5em 2em; cursor: pointer; border-radius: 30px; -moz-border-radius: 30px; -webkit-border-radius: 30px; border: 0; font-weight: bold; }
header ul.top { list-style-type: none; text-align: right; padding: 0.5em 0 0em 0.5em; }
header ul.top li { display: inline-block; padding-right: 2em; }
header ul.top li:last-child { padding-right: 0; }
header ul.top li a { color: black; }
header .main-menu .container-fluid { background-image: url(images/menubgwhole2.png); background-repeat: no-repeat; height: 162px; background-size: cover; }
header ul.bottom { list-style-type: none; text-align: right; padding: 2.5em 0 1em 0.5em; }
header ul.bottom li { display: inline-block; padding-left: 2em; padding-right: 2em; text-align: center; border-right: 2px solid rgba(255,255,255,0.5); }
header ul.bottom li:last-child { padding-right: 0; border: 0; }
header ul.bottom li a { color: white; font-size: 20px; }
footer { text-align: center; }
footer .bottom-band { background: #0d4466; color: white; padding: 1em; text-align: center; width: 100%; }
.cta-reverse { background-image: url(images/cta2.png); background-repeat: no-repeat; background-size: cover; }
.cta-reverse .row { padding: 5em 5em 5em 5em; }
.cta-reverse button { font-size: 20px; }
.page-title { background-image: url(images/pagetitle.png); background-repeat: no-repeat; background-size: cover; color: white; }
.page-title .row { padding: 5em 5em 5em 5em; }
.mobile-menu { display: none; }
.menu-item { padding-bottom: 0.5em !important; }
.menu-item a { color: rgba(0,0,0,.5); }

.banner .container-fluid { background-image: url(images/banner.png); background-repeat: no-repeat; color: white; height: 600px; background-size: cover; }
.banner .container-fluid .row .col-md-12 { padding: 10em; }
.banner h2 { line-height: 1.5em; }
.banner .search .search-grp { background: white; padding: 0.2em; width: 500px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
.banner .adv-search { width: 500px; }
.banner .adv-search a { color: white; }
.banner .search input[type="text"] { border: 0; width: 355px; font-size: 14px; }
.banner button,
.banner input[type="submit"],
.not-found input[type="submit"] { background: rgba(129,211,246,1); background: -moz-linear-gradient(top, rgba(129,211,246,1) 0%, rgba(0,110,150,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(129,211,246,1)), color-stop(100%, rgba(0,110,150,1))); background: -webkit-linear-gradient(top, rgba(129,211,246,1) 0%, rgba(0,110,150,1) 100%); background: -o-linear-gradient(top, rgba(129,211,246,1) 0%, rgba(0,110,150,1) 100%); background: -ms-linear-gradient(top, rgba(129,211,246,1) 0%, rgba(0,110,150,1) 100%); background: linear-gradient(to bottom, rgba(129,211,246,1) 0%, rgba(0,110,150,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#81d3f6', endColorstr='#006e96', GradientType=0 ); color: white; border: 0; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; font-weight: bold; padding: 0.5em 1em 0.5em 1em; cursor: pointer; }

.about .row { padding: 5em 5em 5em 5em; }
.about ul { padding-left: 0; list-style-type: none; }
.about ul li:first-child { background: url(images/ourstandards.png) no-repeat; padding-left: 4em; }
.about ul li:last-child { background: url(images/ouradvantages.png) no-repeat; padding-left: 4em; }

.projects { background-image: url(images/projectshome.png); background-repeat: no-repeat; background-size: cover; }
.projects .row { padding: 10em 5em 10em 5em; }
.projects button { border: 0; border-radius: 30px; -moz-border-radius: 30px; -webkit-border-radius: 30px; background: #0d466b; color: white; padding: 0.5em 2em 0.5em 2em; font-weight: bold; cursor: pointer; }

/*.products { background-image: url(images/productshome.png); background-repeat: no-repeat; background-size: cover; }*/
.products .row { padding: 5em 0em 5em 0em; text-align: center; }

.cta { background-image: url(images/ctahome.png); background-repeat: no-repeat; background-size: cover; }
.cta .row { padding: 10em 0em 10em 5em; }

.blog .row { padding: 5em 5em 5em 5em; text-align: center; }
.blog .article { text-align: left; -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3); -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3); box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3); border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 1em 1em 3em 1em; }
.blog .date-badge { background: #86878d; padding: 0.5em 0.5em 0.5em 0.5em; color: white; text-align: center; width: 90px; font-size: 30px; line-height: 1em; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; position: absolute; top: 0; }
.blog .date-badge span { font-size: 25px;}
.blog img { width: 100%; }
.blog .view-all { color: #333; font-size: 25px; }

.contact { background-image: url(images/contact.png); background-repeat: no-repeat; background-size: cover; }
.contact .row { padding: 5em 5em 5em 5em; }
.contact h4 span.line-cont { vertical-align: 0.4em; }
.contact form .row { padding: 0em; }
.contact input[type="text"],
.contact input[type="email"],
.contact input[type="phone"],
.contact textarea { background-color: rgba(255,255,255,0.5); border-radius: 30px !important; -moz-border-radius: 30px !important; -webkit-border-radius: 30px !important;  }
.contact .contact-details { color: white; }
.contact .contact-details ul { list-style-type: none; padding-left: 0; }
.contact .contact-details ul li { margin-bottom: 2.5em; }
.contact .contact-details ul li:nth-child(1) { background-image: url(images/marker.png); background-repeat: no-repeat; padding-left: 5em; }
.contact .contact-details ul li:nth-child(2) { background-image: url(images/phone.png); background-repeat: no-repeat; padding-left: 5em; }
.contact .contact-details ul li:nth-child(3) { background-image: url(images/fax.png); background-repeat: no-repeat; padding-left: 5em; }
.contact .contact-details p:nth-child(4) { font-size: 20px; }
.contact .contact-details p:nth-child(4) img { vertical-align: -0.5em; }

.quick-links .row { padding: 5em 5em 5em 5em; text-align: center; }
.quick-links ul { list-style-type: none; text-align: center; }
.quick-links ul li { display: inline-block; padding: 0.5em 3em 0.5em 3em; border-right: 1px solid #333; margin-bottom: 2em; }
.quick-links ul li:last-child { border: 0; }
.quick-links ul li a { color: #333; font-weight: bold; }

.c-products { background-image: url(images/products/banner.jpg); background-repeat: no-repeat; background-size: cover; }
.c-products .row { padding: 5em 5em 5em 5em; }
.c-p-list .row { padding: 5em 5em 5em 5em; }
.c-p-list table h5 { color: #1c5274; }

.company { background-image: url(images/company/banner.png); background-repeat: no-repeat; background-size: cover; }
.company .row { padding: 5em 5em 5em 5em; }
.about-further .row { padding: 5em 5em 5em 5em; }
.about-further .row div:first-child ul { list-style-type: none; padding-left: 0; }
.about-further .row div:first-child ul li:first-child { background-image: url(images/ourstandards.png); background-repeat: no-repeat; }
.about-further .row div:first-child ul li { padding-left: 5em; }
.about-further .row div:last-child ul { list-style-type: none; padding-left: 0; }
.about-further .row div:last-child ul li:first-child { background-image: url(images/ouradvantages.png); background-repeat: no-repeat; }
.about-further .row div:last-child ul li { padding-left: 5em; }

.contact-us { background-image: url(images/contact/banner.png); background-repeat: no-repeat; background-size: cover; }
.contact-us .row { padding: 5em 5em 5em 5em; }
.contact-us h4 span.line-cont { vertical-align: 0.4em; }
.contact-us form .row { padding: 0em; }
.contact-us input[type="text"],
.contact-us input[type="email"],
.contact-us input[type="phone"],
.contact-us textarea { background-color: rgba(255,255,255,0.5); border-radius: 30px !important; -moz-border-radius: 30px !important; -webkit-border-radius: 30px !important;  }
.contact-us .contact-details { color: white; }
.contact-us .contact-details ul { list-style-type: none; padding-left: 0; }
.contact-us .contact-details ul li { margin-bottom: 2.5em; }
.contact-us .contact-details ul li:nth-child(1) { background-image: url(images/marker.png); background-repeat: no-repeat; padding-left: 5em; }
.contact-us .contact-details ul li:nth-child(2) { background-image: url(images/phone.png); background-repeat: no-repeat; padding-left: 5em; }
.contact-us .contact-details ul li:nth-child(3) { background-image: url(images/fax.png); background-repeat: no-repeat; padding-left: 5em; }
.contact-us .contact-details p:nth-child(4) { font-size: 20px; }
.contact-us .contact-details p:nth-child(4) img { vertical-align: -0.5em; }
.locations .row { padding: 5em 5em 5em 5em; }
.locations .row ul { list-style-type: none; padding-left: 0; }
.locations .row ul li { background-image: url(images/contact/marker.png); background-repeat: no-repeat; padding-left: 5em; }

.page-products .row { padding: 5em 5em 5em 5em; }
.page-products .card-body .row { padding: 0; }

.page-projects { background-image: url(images/projects/banner.png); background-repeat: no-repeat; background-size: cover; }
.page-projects .row { padding: 5em 5em 5em 5em; }

/* gate popup */
.popup-gate { width: 20%; height: auto; position: absolute; top: 20%; left: 50%; background: #81d3f6; border: 1px solid #ccc; padding: 2em; display: none; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;  }
.popup-gate input[type="text"] { width: 100%; padding: 0.5em; }
.popup-gate p:last-child { text-align: center; }
.c-products, 
.c-p-list,
.pass-form { display: none; }
.err-msg-gate { display: none; color: red; font-weight: bold; }

/* color def */
.blue { background: #0d4466 !important; }

/* bootstrap overrides */
.card-header { border-bottom: 0 !important; background: #f9f9f9 !important; }
.card-header button { color: #0d466b !important; padding-left: 0 !important; font-size: 20px !important; }
.card-body { background: #f9f9f9 !important; }

/* media queries */
/*==================================================
=            Bootstrap 3 Media Queries             =
==================================================*/


/*==========  Mobile First Method  ==========*/

/* Custom, iPhone Retina */ 
@media only screen and (min-width : 320px) {
}

/* Extra Small Devices, Phones */ 
@media only screen and (min-width : 480px) {
  
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
}



/*==========  Non-Mobile First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
  .popup-gate { width: 40%; top: 40%; left: 40%; }
}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {
  .mobile-menu { display: block !important; }
  .top-menu,
  .main-menu { display: none; }
  .menu-item br { display: none; }
  .company .row,
  .page-projects .row,
  .c-products .row { background: rgba(255,255,255,0.9); }
  .quick-links ul li { padding: 0 1.5em 0 0 !important; border-right: 0 !important; }
  .page-products .row { padding: 1em !important; }
  .page-title .row { padding: 1em !important; }
  .line-cont { display: none; }
  .cta-reverse .row { padding: 1em !important; text-align: center; }
  .locations .row,
  .contact-us .row,
  .quick-links .row,
  .c-products .row,
  .c-p-list .row { padding: 1em !important; }
  .form-spacer { display: none; }
  .contact-us form .col-md-6 { margin-bottom: 2em; }
  .contact-us form .row { padding: 0 !important; }
}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
  .banner .container-fluid .row .col-md-12 { padding: 2em !important; }
  .banner .container-fluid { height: auto !important;}
  .popup-gate { width: 50%; top: 40%; left: 30%; }
}

/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 480px) {
  .banner .search .search-grp { width: 100% !important; }
  .banner .search input[type="text"] { width: 53% !important; }
  .popup-gate { width: 80%; top: 20%; left: 10%; }
}

/* Custom, iPhone Retina */ 
@media only screen and (max-width : 320px) {
}
/* media queries */