/* login responsiveness page*/
@media only screen and (max-width: 950px) {
    #loginbodyWrapper {
        width: 100% !important;
    }
    #loginLoginSubLeft {
        max-width: 398px;
        margin-bottom: 20px;
    }
    #loginLoginSubRight {
        max-width: 348px;
        border-left: none !important;
    }
    #loginLoginSubRight, #loginLoginSubLeft {
        height: auto !important;
        float: none !important;
        width: 100% !important;
        padding: 0 0 0 2% !important;
        box-sizing: border-box !important;
    }
    .loginSubFormWrapper {
        width: 100% !important;
    }
    #loginSignInHeader {
       padding: 18px 15px !important; 
    }
}
/* end of login responsiveness page*/

html, body {
    font-family:'Helvetica', sans-serif;
    background:#fff url(/lighting-data/images/bg_img.jpg);
}
a:hover {
    color:#009932;
}
#fullTopHeader {
    display:flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-end;
    background:#7F8084;
    width:100%;
    max-width:960px
}
#topHeader {
    display:flex;
    flex-direction: row;
    text-align: right;
    justify-content: flex-end;
    flex-wrap: wrap;
    width:100%;
    max-width: 960px;
    margin:0 auto;
}

.topBtn {
    display:inline-block;
    padding:10px;
    color:#fff;
    border-right:1px solid #888;
}
.topBtn:hover {
    background:#555 url(http://prospector.xolights.com/Images/site-templates/xo_designtheme1/menu_trans5.png) repeat-x center;
}
.noHover {
    display:inline-block;
    padding:10px;
    color:#fff;
    border-right:none;
}
.noHover:hover {
    background:transparent;
}
#fullWrap {
    display:flex;
    flex-direction: column;
    align-items: center;
    width:100%;
    max-width:960px;
    margin:0 auto;
    box-shadow:1px 1px 20px #666;
}
#fullHeader {
    background:#fff;
    z-index:10000;
    width:100%;
    max-width: 960px;
}
#headerSection{
    display:flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content:space-around;
}
#leftHeader {
    display:flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    font-size: 14px;
    line-height: 25px;
    color: #333;
    padding:15px;
    width:100%;
    max-width:300px;
    padding-bottom:0
}


#leftHeader picture img, #rightHeader picture img{
    width:100%;
    max-width:250px;
    margin:20px;
}


#leftHeader h4, #rightHeader h4{
    text-transform: uppercase;
    font-style: italic;
    margin-bottom:0
}
#rightHeader {    
    display:flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    font-size:14px;
    line-height:25px;
    color:#333;
    padding:15px;
    width:100%;
    max-width:300px;
    padding-bottom:0
}
#menuSection{
    display:flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

#navList{
    display:flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center; 
    width:100%;
}
#mobileMenuSection{
    display:none;
}
.dropTab {
    display:flex;
    justify-content: space-between;
    width:100%
}
.dropName {
    padding:20px 0px;
    color:#000;
    font-size:13px;
    text-transform:uppercase;
    text-align:center;
}
.dropBox {
    width:200px;
    background:#fff;
    border-radius:5px;
    text-align:left;
}
.dropBox .dropName {
    background:#fff;
    color:#000;
}
.dropName:hover {
    color:#009932;
}
.activeDrop {
    color:#000 !important;
    text-decoration:underline;
}
.activeLeft {
    margin-left:-200px;
}
.activeRight {
    margin-left:200px;
}
#searchBox {
    display:block;
    vertical-align:top;
    width:100%;
    transition: all 0.3s ease;
}
#searchIcon {
    font-size:20px;
    color:#666;
    text-align:center;
    cursor:pointer;
    padding:20px 0px;
    width:45px;
}
#searchIcon:hover {
    color:#fff;
    background:#c8c8c8;
}
#searchEngine {
    display:flex;
    flex-direction: row;
    width:100%;
    max-width: 960px;
    position:absolute;
    overflow:hidden;
    transition: all 0.3s ease;
    background:#c8c8c8;
    height:0;
    z-index: 999;
   padding:0!important;
}
#searchForm1-2{
    display:flex;    
    width:100%;
    max-width: 930px;
    height:40px;    
    padding:0 10px;
    padding-top:5px;

}
#searchInputBox {
    display:flex;
    vertical-align:top;
    border:1px solid #ddd;
    background:#fcfcfc;
    border-right:0px;
    height:40px;
    width:100%;
    border-radius:5px 0px 0px 5px;
}
#searchInputBox input {
        display:flex;
    flex-direction: row;
    border:0px;
    background:transparent;
    margin:2px;
    padding:10px;
    width:100%;
    font-size:14px;
    color:#999;
    font-weight:300;
}
#searchSubmitBtn {
    height:40px;
    display:flex;
    flex-direction: row;
    align-items: center;
    vertical-align:top;
    background:#fcfcfc;
    padding:0px 15px 0px 10px; 
    color:#bbb;
    cursor:pointer;
    border:1px solid #ddd;
    border-left:0px;
    border-radius:0px 5px 5px 0px;
    font-size:18px;
}
#searchSubmitBtn:hover {
    color:#999;
}
.menuBtn {
    float:left;
    color:#f7eb19;
    font-size:14px;
    padding:15px 20px;
    color:#f7eb19;
}
.menuBtn:hover {
    color:#fff;
}
#bodySection {
    display:flex;
    flex-direction: column;
    width:100%;
    max-width:1000px;
    background:#fff;
}
.itemSmallBtn {
    font-size:16px !important;
}
#footerSection {
    display:flex;
    background:#f2f2f2;
    width:100%;
}
#footerTop {
    border-top:1px solid #dbdbdb;
    border-bottom:1px solid #dbdbdb;
    padding:20px 0;
    text-align: center;
    font-size:14px;
}
#topContent {
    width:585px;
    margin:0 auto;
}
#footerTop span {
    display:inline-block;
    padding:10px 0;
}
#footerSubcribeBtn {
    background:#fff;
    padding:10px 5px;
    color:#c00;
    text-align:center;
    transition:all .5s ease-in-out;
    display:inline-block;
}
#footerSubcribeBtn:hover {
    background:#000;
    color:#fff;
}
#fullFooterBottom {
    display:flex;
    flex-direction: row;
    border-top:1px solid #fff;

    width:100%;
}
#footerBottom {
    display:flex;
    flex-direction: column;
    align-items: center;
    width:100%;
    padding:30px 0;
    margin:0 auto;

}
#footerLinks a {
    padding:10px;
    font-size:16px;
    color:#000;
    transition:all .5s ease-in-out;
    text-decoration:none;
}
#footerLinks a:hover {
    text-decoration:underline;
}
#bottomSection {
    display:flex;
    flex-direction:row;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    width:100%;
    padding:30px 0
}
#socialMedia {
    float:left;
    border-right:1px solid #dbdbdb;
    font-size:14px;
    padding:20px 0;
}
#socialMedia span {
    float:left;
    line-height:35px;
}
.socialBtn {
    display:inline-block;
    margin:0 3px;
    font-size:20px;
    color:#fff;
    height:35px;
    width:35px;
    text-align:center;
    line-height:35px;
    border-radius:8px;
}
#pinterestIcon {
    background:#cb2027;
}
#facebookIcon {
    background:#3b5998;
}
#twitterIcon {
    background:#55acee;
}
#youtubeIcon {
    background:#bb0000;
}
#instagramIcon {
    background:#125688;
}
#houzzIcon {
    background:#73ba37;
}
#reserveArea {
    float:left;
    border-left:1px solid #fff;
    text-align:center;
    font-size:14px;
    line-height:35px;
    padding:20px 10px;
}
#threeBoxes {
    display:flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    width:100%;
    max-width:1000px;
    padding:10px 0;
}
.fullBox {
    display:flex;
    flex-direction: column;
    justify-content: center;
    padding:10px 15px;
    width:100%;
    max-width: 450px;
}
.boxTitle {
    font-size:22px;
    padding:0 0 10px;
    color:#000;
}
.boxImg {
    padding: 0 0 10px;
    width:450px;
}
.boxImg img {
    width:100%;
}
.boxText {
    font-size:16px;
    font-weight:100;
    color:#000;
}
.boxText a {
    color:#009932;
    text-decoration:underline;
    transition:all 1s ease-in-out;
    line-height:45px;
}
.boxText a:hover {
    color:#000;
    text-decoration:underline;
}
#scrollSelectBox1 {
    display: none !important;
}
.pageBtn:hover, .currentPage {
    border:1px solid #009932 !important;
    background:#009932 !important;
}
#refineHeader {
    color:#009932 !important;
}
.sideContentTitle {
    color:#009932 !important;
}
.sideLinkContainer:hover {
    color:#009932 !important;
}
.viewAllBtn {
    background:#009932 !important;
}
.productPrice {
    color:#009932 !important;
}
.productBoxBorder:hover {
    border:1px solid #009932 !important;
}
.inputBtnBox {
    background:#009932 !important;
}
#showBreadCrumb {
    display:none !important;
}
.crumbBtn i:hover {
    color:#009932 !important;
}
.crumbBtn:hover {
    color:#009932 !important;
}
.flexBorder:hover {
    border:1px solid #009932 !important;
}
#itemDetailPrice {
    color:#009932 !important;
}
#productDetailBox img {
    display:none;
}
#WishListButton {
    background:#3A84DF url(/Images/site-templates/xo_designtheme1/menu_trans5.png) repeat-x center !important;
    color:#fff !important;
    text-shadow:none !important;
}
.catalogInfoTitle {
    font-size:18px !important;
}
.catalogInfoText {
    font-weight:400 !important;
}
.sideContentLinks {
    font-weight:400 !important;
}
.customFlexBox {
    width:215px;
    display:inline-block;
    margin:10px;
    vertical-align:top;
}
.hamburger {
	display: none;
}
.hamburger.active .top-bar {
	-moz-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
}
.hamburger.active .middle-bar {
	opacity: 0;
}
.hamburger.active .bottom-bar {
	-moz-transform: rotate(135deg);
	-webkit-transform: rotate(135deg);
	-o-transform: rotate(135deg);
	-ms-transform: rotate(135deg);
	transform: rotate(135deg);
	top: 50%;
}
.top-bar ,
.middle-bar, 
.bottom-bar {
	width: 22px;
	height: 2px;
	background-color: #000;
	position: absolute;
	right: 50%;
	transition-delay: 0.1s,0.2s;
	transition-duration: 0.1s,0.1s;
	transition-timing-function: ease-in-out;
	left: calc(50% - 11px);
	border-radius: 5px;
}
.top-bar {
	top: calc(50% - 7px);
	transform-origin: 11px 1px;
}
.middle-bar {
	top: 50%;
}
.bottom-bar {
	top: calc(50% + 7px);
}
@media only screen and (max-width: 768px) {
    #mobileMenuSection{

        list-style-type: none;
        font-size:15px;
        line-height: 1.9;
        padding-left:0;
    }
    
    .mobileDropTab{
        text-transform: uppercase;
        width:100%;
        border-bottom:1px solid rgb(0,0,0,0.1)
    }
    
    .mobileDropBox{
        display:none;
    }
    
    .mobileDropTabLink{
        color:#000;
    }
    .linkFlex{
        display:flex;
        flex-direction: row;
        justify-content: space-between;        
        align-items: center;
        margin:0 15px
    }
    
    #menuSection{
        justify-content: flex-end
    }
    #navList{
        display:none;
    }
    .downArrow{
        cursor: pointer;
        transition:0.3s ease;
    }
    .downArrow.arrowRotate{
        rotate: 180deg;
        transition:0.3s ease;
    }
    .mobileDropBox{
        background:rgb(0,0,0,0.1);
        border-top:1px solid rgb(0,0,0,0.3);
        list-style-type: none;

    }
    .mobileDropBoxTab{
        width:100%;
    }
    .mobileDropBoxTab a{
        display:flex;
        width:100%;
        color:#000;

    }
    
    .mobileDropBoxTab a:hover{
        background:#fff;
        color:green
    }
.hamburger {
		display: inline-block;
		cursor: pointer;
		padding: 20px;
	    right: 11px;
	    position: relative;
	}
}

@media screen and (max-width:492px){
    #footerLinks{
        display: flex;
        align-items: center;
        text-align: center;
        flex-direction: column;
    }
}