/*********************************************************/
/******************** 980 DESKTOP ************************/
/*********************************************************/

#Products												{ width: 100%; }

.Wrapper                         	   	 			  	{ width: 980px; }
.Column													{ padding-left: 15px; padding-right: 15px; }
.Column .Column 										{ padding-left: 0; padding-right: 30px; }
.Column.Product											{ padding-left: 10px; padding-right: 10px; }


#Main #Left												{ width: 196px; }
#Main #Right											{ width: 196px; }

#Main #Content											{ width: 980px; }
#Left + #Content,
#Right + #Content										{ width: 784px; }
#Right + #Left + #Content								{ width: 588px; }


.Column.Full											{ width: 100%; }
.Column.FourFifth										{ width: 80%; }
.Column.ThreeQuarters									{ width: 75%; }
.Column.TwoThirds										{ width: 66.66%; }
.Column.ThreeFifth										{ width: 60%; }
.Column.Half											{ width: 50%; }
.Column.TwoFifth										{ width: 40%; }
.Column.Third											{ width: 33.33%; }
.Column.Quarter											{ width: 25%; }
.Column.Fifth											{ width: 20%; }
.Carousel .Column.Product											{ width: 135px; }

.Column.Twenty											{ width: 20%; }
.Column.Thirty											{ width: 30%; }

/*********************************************************/
/******************** 1176 BIG DESKTOP *******************/
/*********************************************************/

@media only screen and (min-width: 1176px) {
	
.Wrapper                          						{ width: 1176px; }

.Disable-BigDesktop										{ display: none; }
.Spacer													{ display: block; height: 10px; }


#Main #Left												{ width: 196px; }
#Main #Right											{ width: 196px; }

#Main #Content											{ width: 1176px; }
#Left + #Content,
#Right + #Content										{ width: 980px; }
#Right + #Left + #Content								{ width: 784px; }


.Column.Full											{ width: 100%; }
.Column.FourFifth										{ width: 80%; }
.Column.ThreeQuarters									{ width: 75%; }
.Column.TwoThirds										{ width: 66.66%; }
.Column.ThreeFifth										{ width: 60%; }
.Column.Half											{ width: 50%; }
.Column.TwoFifth										{ width: 40%; }
.Column.Third											{ width: 33.33%; }
.Column.Quarter											{ width: 25%; }
.Column.Fifth											{ width: 20%; }
.Carousel .Column.Product											{ width: 135px; }
   	
}

/*********************************************************/
/******************** 784 BIG TABLET *********************/
/*********************************************************/

@media only screen and (min-width: 784px) and (max-width: 979px) {
	
.Wrapper                          						{ width: 784px; }
.Move-Right .Wrapper 									{ left: 196px; }
.Move-Left .Wrapper										{ right: 196px; }
.Disable-BigTablet										{ display: none; }


#Main #Left												{ width: 196px; }
#Main #Right											{ width: 100%; }

#Main #Content											{ width: 808px; }
#Left + #Content										{ width: 588px; }
#Right + #Content										{ width: 808px; }
#Right + #Left + #Content								{ width: 588px; }


.Column.Full											{ width: 100%; }
.Column.FourFifth										{ width: 100%; }
.Column.ThreeQuarters									{ width: 100%; }
.Column.TwoThirds										{ width: 100%; }
.Column.ThreeFifth										{ width: 50%; }
.Column.Half											{ width: 50%; }
.Column.TwoFifth										{ width: 50%; }
.Column.Third											{ width: 50%; }
.Column.Quarter											{ width: 50%; }
.Column.Fifth											{ width: 25%; }
.Carousel .Column.Product											{ width: 135px; }

.Column.Twenty											{ width: 50%; }
.Column.Thirty											{ width: 50%; }

}

/*********************************************************/
/******************** 588 SMALL TABLET *******************/
/*********************************************************/

@media only screen and (min-width: 588px) and (max-width: 783px) {
	
.Wrapper                       	 						{ width: 588px; }
.Move-Right .Wrapper 									{ left: 196px; }
.Move-Left .Wrapper										{ right: 196px; }
.Disable-Tablet											{ display: none; }


#Main #Left												{ width: 100%; }
#Main #Right											{ width: 100%; }

#Main #Content											{ width: 588px; }
#Left + #Content,
#Right + #Content										{ width: 588px; }
#Right + #Left + #Content								{ width: 588px; }


.Column.Full											{ width: 100%; }
.Column.FourFifth										{ width: 100%; }
.Column.ThreeQuarters									{ width: 100%; }
.Column.TwoThirds										{ width: 100%; }
.Column.ThreeFifth										{ width: 100%; }
.Column.Half											{ width: 100%; }
.Column.TwoFifth										{ width: 100%; }
.Column.Third											{ width: 50%; }
.Column.Quarter											{ width: 50%; }
.Column.Fifth											{ width: 50%; }
.Carousel .Column.Product											{ width: 135px; }

.Column.Twenty											{ width: 50%; }
.Column.Thirty											{ width: 50%; }
	
}

/*********************************************************/
/******************** FLUID MOBILE ***********************/
/*********************************************************/

@media only screen and (max-width: 587px) {
	
.Wrapper                      	   						{ width: 100%; min-width: 240px; }
.Move-Right .Wrapper 									{ left: 196px; }
.Move-Left .Wrapper										{ right: 196px; }
.Disable-Mobile 										{ display: none; }


#Main #Left												{ width: 100%; display: none; }
#Main #Right											{ width: 100%; }

#Main #Content											{ width: 100%; min-width: 240px; }
#Left + #Content,
#Right + #Content										{ width: 100%; min-width: 240px; }
#Right + #Left + #Content								{ width: 100%; min-width: 240px; }


.Column.Full											{ width: 100%; }
.Column.FourFifth										{ width: 100%; }
.Column.ThreeQuarters									{ width: 100%; }
.Column.TwoThirds										{ width: 100%; }
.Column.ThreeFifth										{ width: 100%; }
.Column.Half											{ width: 100%; }
.Column.TwoFifth										{ width: 100%; }
.Column.Third											{ width: 100%; }
.Column.Quarter											{ width: 100%; }
.Column.Fifth											{ width: 50%; }
.Carousel-List { width: 100% !important; }
.Carousel .Column.Product											{ width: 50%; }

.Column.Twenty											{ width: 50%; }
.Column.Thirty											{ width: 50%; }
	
}

@media only screen and (max-width: 319px) {
	
.Column.Fifth											{ width: 100%; }
.Carousel .Column.Product											{ width: 100%; }

}

/*********************************************************/
/**************** CUSTOM RESPONSIVENESS ******************/
/*********************************************************/

@media only screen and (max-width: 979px) {
    #Account-Basket {
        display: none;
    }
    
     #Footer-Newsletter .sign-up{
       position: static;
       margin-top: 10px;
       margin-bottom: 5px;
   }
}
 

@media only screen and (max-width: 783px) {
 
    #Header #Search{
        margin: 0 0 10px;
        width: 100%;
    }
    #Footer-Newsletter{
        width: 100%;
        margin-right: 0;
    }
    .Item{
        display: none;
    }
    #Filters {
        display: none;
    }
    #Footer .Footer-Wrapper .Footer-Item, #Footer-Info {
        height: auto !important;
    }
    #Footer .Footer-Wrapper .Footer-Item:nth-child(odd) {
        border: none;        
    }
}

@media only screen and (max-width: 587px) {
    #Header{
        text-align: center;
    }
    #Header #Logo{
        display: inline-block;
     
        float: none;
    }
    #Header-Links{
        display: none;
    }
    #Header #Search{
        margin-bottom: 10px;
    }
    #Header .Menu{
        margin: 0 0 10px;
    }
    #Header .Menu .Item {
        display: none;
    }
    
    #Header-Links {
        float: right;
        padding: 0;
    }
    #Header-Links a {
        float: right;
    }
    
    #Header-Links a:last-child {
        display: none;
    }
}

@media only screen and (max-width: 425px) {
    #Header #Header-Slogan{
        background-size: 100%;
        width: 290px;
        margin-left: 0px;
    }
    #Footer .Footer-Wrapper .Footer-Item, #Footer-Info {
        height: auto !important;
    }
    #Footer .Footer-Wrapper .Footer-Item {
        border: none;        
        width: 100%;
    }
    
    
}