﻿#topWrapper { background-color:#444;background-image:url('http://imageserver.webpropartners.com/usermedia/goldseal/yellow1.png'); }



/* =========================== RFQ Button =============================== */
.rfqbutton { background:#000;padding:8px 12px;color:#feba0f;border:#FED363 1px solid;border-radius:5px;width:auto;position:absolute;left:50%;margin-left:340px;top:-105px;text-decoration:none; }
.rfqbutton:hover { background:#000;cursor:pointer; }



.gafVideoClass { cursor:pointer; }


#fullBackground { height:600px; }
#topWrapper { min-height:152px; }




/* ============================ Slide Title =============================== */
.slideTitle { 
 width:100%;
 background: linear-gradient(to left, #222222, #222222, transparent);
 background: -webkit-linear-gradient(right, #222222, #222222, transparent);
 background: -o-linear-gradient(right, #222222, #222222, transparent);
 background: -moz-linear-gradient(right, #222222, #222222, transparent);
 text-align:right;
 padding:5px 15px;
 font-size:17px;
 color:#fff;
 font-weight:bold;
 box-sizing:border-box;
 -moz-box-sizing:border-box;
 position:absolute;
 bottom:8px;
 z-index:2000;
  }







/* ============================================= */
/* =============== Global 2 RFQ ================ */
/* ============================================= */
.globalDivOne { text-align:center;width:49%;float:left;font-size:17px;line-height:1.3;color:#fff;padding:0 20px; }
.globalDivOne h2 { color:#ddd;font-size:30px;text-shadow:#222 2px 2px 4px; }
.globalDivOne h1 { color:#fff; }
.globalDivOne span { font-size:35px; }
.globalDivTwo { float:right;width:40%;border-left:#ccc 1px solid;padding:0 20px; }
.globalDivTwo input, .globalDivTwo textarea { width:100%;box-sizing:border-box;padding:5px;border:#ccc 1px solid;border-radius:3px; }
#global2Wrap { width:100%;max-width:1000px;margin:0 auto; }
#global2 { padding:6px 0; }





/* ============================= Hover Boxes ============================== */
    .boxheader {padding:8px;background:#000;color:#fff;border-radius:8px 8px 0 0}
    .boxbody {padding:8px;color:#333;border:#000 1px solid;border-radius: 0 0 8px 8px}




/* ================================= Tabs ================================*/
ul.tabbernav li { background-image: linear-gradient(#333, #333); border:#feba0f 1px solid; border-radius:4px 4px 0 0; padding:6px; }
ul.tabbernav li:hover { background:#333; }
ul.tabbernav li a, ul.tabbernav li.tabberactive a, ul.tabbernav li.tabberactive a:hover, ul.tabbernav li a:hover { background:transparent;color:#fff; }
ul.tabbernav li a:link { color: #fff; }
ul.tabbernav li a:visited { color: #fff; }
.tabbertab { border-top:#ddd 1px solid; }





/* ======================================================================== */
/* ========================== Hover Icon Images =========================== */
/* ======================================================================== */
.hoverIconWrap { margin:5px;position:relative;float:left; }
.hoverIconTitle { background:#000;opacity:0.8;padding:5px;color:#fff;position:absolute;width:100%;box-sizing:border-box;bottom:9px;text-align:right;font-weight:bold; }
.hoverIconBG { background:#feba0f;position:absolute;top:0px;left:0px;width:100%;height:100%;opacity:0;transition:all ease-in-out 200ms;cursor:pointer; }
.hoverIconWrap:hover > .hoverIconBG { opacity:0.9; }
.hoverIconViewMore { width:100px;color:#D15409;background:#fff;border-radius:4px;padding:8px;text-align:center;opacity:1;position:absolute;bottom:20px;left:50%;margin-left:-58px;transition:all ease-in-out 130ms; }
.hoverIconViewMore:hover { background:#fff; }
.sw_imgViewMore { width:100px;color:#feba0f;background:#fff;border-radius:4px;padding:8px;text-align:center;opacity:1;position:absolute;bottom:20px;left:50%;margin-left:-58px;transition:all ease-in-out 130ms; }





/* ======================================================================== */
/* ========================== Certainteed Hover Icon Images =========================== */
/* ======================================================================== */

.thumbImg { border:transparent 2px solid; }
.thumbImg:hover { cursor:pointer;opacity:0.8; }
.thumbTitle { position:absolute;bottom:8px;background:#000;opacity:0.8;color:#fff;text-align:right;font-weight:bold;width:100%;box-sizing:border-box;padding:4px 8px;display:none; }
.ocWrap { width:350px;height:260px;position:relative; }






/* ========================== Back Button ===================== */
.goBackArrow {text-align:left;font-size:10px;color:#fff;width:50px;position:relative;background:#000;border:1px solid #000;margin:4px 4px 4px 34px;padding:2px;text-decoration:none;border-radius:0 0 0 0;font-weight:bold; }
.goBackArrow:after, .goBackArrow:before {right:100%;top:50%;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none;}
.goBackArrow:after {border-right-color:#000;border-width:18px;margin-top:-18px;}
.goBackArrow:before {border-right-color:#000;border-width:20px;margin-top:-20px;}






/*================== Custom CSS for Borel Clay =================== */
.borthumbImg { border:transparent 2px solid;float:left;margin:3px;width:109px; }
.borthumbImg:hover { cursor:pointer;opacity:0.8; }
.borthumbTitle { position:absolute;bottom:8px;background:#000;opacity:0.8;color:#fff;text-align:right;font-weight:bold;box-sizing:border-box;padding:4px 8px;/*display:none;*/width:100%; }
.borWrap { width:350px;height:350px;position:relative;float:left;margin:3px; }

#socialMedia { width:270px;left:50%;margin-left:240px;top:-60px;z-index:5000; }






















/* ======== Mobile Classes ========= */
.servicesIcon { float:left;width:35%;margin-top:20px; }
.servicesIcon img { width:100%; }
.servicesDescription { float:left;width:63%;padding-left:5px;margin-top:20px; }
#mobileLogo2 { display:none; }


/* ======== Click to Call =========== */
#ctc, #cte { 
position:absolute;
top:108px;
left:50%;
margin-left:-175px;
font-size:14px;
text-decoration:none;
width:130px;
display:none;
padding:8px;
border:#FEBA0F 1px solid;
border-radius:5px;
background:#222; 
background-image: linear-gradient(#222, #222);
z-index:1000;
text-align:center;
color:#fff;
}

#cte { 
margin-left: 25px;
 }

#mobileLogo2 { position:absolute;top:5px;width:100%;z-index:5000;text-align:center; }
#mobileLogoSrc2 { margin:0 auto;width:100px; }
.mobileClass { display:none; }
@media (max-width: 700px) {
#menuBG { margin-top:-20px; }
  #global2, #footerSiteMap, .rfqbutton, .wideClass { display:none; }
  #ctc, #cte { display:block }
  #maincontent { width:95%; }
  .sectionNavItem { display:none; }
  .mobileClass, #mobileLogo2 { display:block; }
  .headerLnks { display:none; }
  #affilates { display:none; }
  #socialMedia { width:300px;top:15px;z-index:5000; }
}






/* ================================
============ Billboard ============
================================ */
#bgoverlay { display:none;z-index:10000;position:fixed;top:0;left:0;width:100%;height:1600px;background:rgba(0,0,0,0.6); }
#billboard { cursor:pointer;display:none;z-index:11000;position:fixed;left:50%;margin-left:-450px;width:900px;top:100px;box-shadow:#000 0 0 9px 1px;border-radius:8px;border:#bbb 1px solid; }
#billboard .boxheader { text-align:left; }
#billboard .boxbody { text-align:left;background:#fff;min-height:400px; }
#billboardClose { position:absolute;right:10px;top:6px;font-size:17px;font-weight:bold;cursor:pointer; }
@media (max-width: 1030px) { #billboard { top:20px; } }
