﻿/* Bootstrap 4 utilities */



.mt-0{margin-top:0px!important;}
.mt-1{margin-top:5px!important;}
.mt-2{margin-top:10px!important;}
.mt-3{margin-top:15px!important;}
.mt-4{margin-top:20px!important;}
.mt-5{margin-top:30px!important;}

.mr-0{margin-right:0px!important;}
.mr-1{margin-right:5px!important;}
.mr-2{margin-right:10px!important;}
.mr-3{margin-right:15px!important;}
.mr-4{margin-right:20px!important;}
.mr-5{margin-right:30px!important;}

.mb-0{margin-bottom:0px!important;}
.mb-1{margin-bottom:5px!important;}
.mb-2{margin-bottom:10px!important;}
.mb-3{margin-bottom:15px!important;}
.mb-4{margin-bottom:20px!important;}
.mb-5{margin-bottom:30px!important;}

.ml-0{margin-left:0px!important;}
.ml-1{margin-left:5px!important;}
.ml-2{margin-left:10px!important;}
.ml-3{margin-left:15px!important;}
.ml-4{margin-left:20px!important;}
.ml-5{margin-left:30px!important;}

.p-0{padding:0!important;}
.p-1{padding:5px!important;}
.p-2{padding:10px!important;}
.p-3{padding:15px!important;}
.p-4{padding:20px!important;}
.p-5{padding:30px!important;}

.pt-0{padding-top:0px!important;}
.pt-1{padding-top:5px!important;}
.pt-2{padding-top:10px!important;}
.pt-3{padding-top:15px!important;}
.pt-4{padding-top:20px!important;}
.pt-5{padding-top:30px!important;}

.pr-0{padding-right:0px!important;}
.pr-1{padding-right:5px!important;}
.pr-2{padding-right:10px!important;}
.pr-3{padding-right:15px!important;}
.pr-4{padding-right:20px!important;}
.pr-5{padding-right:30px!important;}

.pb-0{padding-bottom:0px!important;}
.pb-1{padding-bottom:5px!important;}
.pb-2{padding-bottom:10px!important;}
.pb-3{padding-bottom:15px!important;}
.pb-4{padding-bottom:20px!important;}
.pb-5{padding-bottom:30px!important;}

.pl-0{padding-left:0px!important;}
.pl-1{padding-left:5px!important;}
.pl-2{padding-left:10px!important;}
.pl-3{padding-left:15px!important;}
.pl-4{padding-left:20px!important;}
.pl-5{padding-left:30px!important;}

.font-weight-bold {font-weight:700!important;}


/* Bootstrap Colors */

.text-white, .text-white a{
	color:#FFFFFF!important;
}


/* Borders */
.border-0 {
    border: 0 !important;
}
.border-top-0 {
    border-top: 0 !important;
}
.border-right-0 {
    border-right: 0 !important;
}
.border-bottom-0 {
    border-bottom: 0 !important;
}
.border-left-0 {
    border-left: 0 !important;
}

/* Rounded */
.rounded{
border-radius: 4px!important;
}


.rounded-top {
    border-top-left-radius: 4px !important;
    border-top-right-radius: 4px !important;
}

.rounded-right {
    border-top-right-radius: 4px !important;
    border-bottom-right-radius: 4px !important;
}

.rounded-bottom {
    border-bottom-left-radius: 4px !important;
    border-bottom-right-radius: 4px !important;
}

.rounded-left {
    border-top-left-radius: 4px !important;
    border-bottom-left-radius: 4px !important;
}

.rounded-0{
border-radius: 0px!important;
}



/* bootstrap fix */
.img-responsive {
width:100%;
}

/* vertical alignment */

.align-items-top, .align-items-center, .align-items-bottom{
display:flex;
}

.align-items-top > div{
   align-self: top;
}


.align-items-center > div{
    align-self:  center;
}


.align-items-bottom > div{
align-self: flex-end;
}


/* BS 5 Column Layout */
.col-xs-20, .col-sm-20, .col-md-20, .col-lg-20{
    position: relative;
	float: left;
	width:100%;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;

}
.col-xs-20{
		width:20%;
		
}

@media ( min-width:768px ) {
.col-sm-20{
	width:20%;
	}
}

@media ( min-width: 992px ) {
.col-md-20{
	width:20%;
	}
}

@media ( min-width: 1200px ) {
.col-lg-20{
	width:20%;
	}
}


.ex-vat-before:before{
	content: "Ex-VAT ";
}

.ex-vat-after:after{
	content: " Ex-VAT";
}

.inc-vat-before:before{
	content: "Inc-VAT ";
}

.inc-vat-after:after{
	content: " Inc-VAT";
}

.product-code-sku:before{
	content: "SKU: ";
}

.product-code:before{
	content: "Product Code: ";
}
.rrp-before:before{
	content: "RRP ";
}

.rrp-after:after{
	content: " RRP";
}

.net-before:before{
	content: "(Net Price) ";
}

.net-after:after{
	content: " (Net Price)";
}