/********* BOOTSTRAP 5 COLS EXTRA *********/
.col-xs-1-5,.col-sm-1-5,.col-md-1-5,.col-lg-1-5{position: relative;min-height: 1px;padding-right: 10px;padding-left: 10px;}
.col-xs-1-5 {width: 20%;float: left;}

@media (min-width: 768px){
    .col-sm-1-5 {width: 20%;float: left;}
    }

@media (min-width: 992px){
    .col-md-1-5 {width: 20%;float: left;}
    }

@media (min-width: 1200px){
    .col-lg-1-5 {width: 20%;float: left;}
    }


/* 2 0f 5 */

.col-xs-2-5,.col-sm-2-5,.col-md-2-5,.col-lg-2-5{position: relative;min-height: 1px;padding-right: 10px;padding-left: 10px;}
.col-xs-2-5 {width: 40%;float: left;}

@media (min-width: 768px){
    .col-sm-2-5 {width: 40%;float: left;}
    }

@media (min-width: 992px){
    .col-md-2-5 {width: 40%;float: left;}
    }

@media (min-width: 1200px){
    .col-lg-2-5 {width: 40%;float: left;}
    }

/* 3 of 5 */

.col-xs-3-5,.col-sm-3-5,.col-md-3-5,.col-lg-3-5{position: relative;min-height: 1px;padding-right: 10px;padding-left: 10px;}
.col-xs-3-5 {width: 60%;float: left;}

@media (min-width: 768px){
    .col-sm-3-5 {width: 60%;float: left;}
    }

@media (min-width: 992px){
    .col-md-3-5 {width: 60%;float: left;}
    }

@media (min-width: 1200px){
    .col-lg-3-5 {width: 60%;float: left;}
    }

/* 4 of 5 */

.col-xs-4-5,.col-sm-4-5,.col-md-4-5,.col-lg-4-5{position: relative;min-height: 1px;padding-right: 10px;padding-left: 10px;}
.col-xs-4-5 {width: 80%;float: left;}

@media (min-width: 768px){
    .col-sm-4-5 {width: 80%;float: left;}
    }

@media (min-width: 992px){
    .col-md-4-5 {width: 80%;float: left;}
    }

@media (min-width: 1200px){
    .col-lg-4-5 {width: 80%;float: left;}
    }

.col-xs-5-5,.col-sm-5-5,.col-md-5-5,.col-lg-5-5{position: relative;min-height: 1px;padding-right: 10px;padding-left: 10px;}
.col-xs-5-5 {width: 100%;float: left;}

@media (min-width: 768px){
    .col-sm-5-5 {width: 100%;float: left;}
    }

@media (min-width: 992px){
    .col-md-5-5 {width: 100%;float: left;}
    }

@media (min-width: 1200px){
    .col-lg-5-5 {width: 100%;float: left;}
    }


/* extra stuff */
@media(max-width:767px){
    .xs-text-left{text-align:left;}
    .xs-text-left > img{margin-left:0;margin-right:auto}
    .xs-text-right{text-align:right;}
    .xs-text-right > img{margin-left:auto;margin-right:0}
    .xs-text-center{text-align:center;}
    .xs-text-center > img{margin-left:auto;margin-right:auto}
    
    .xs-pull-left{float:left !important}
    .xs-pull-none{float:none !important}
    .xs-pull-right{float:right !important}
    }

@media (min-width: 768px){
    .sm-text-left{text-align:left;}
    .sm-text-left > img{margin-left:0;margin-right:auto}
    .sm-text-right{text-align:right;}
    .sm-text-right > img{margin-left:auto;margin-right:0}
    .sm-text-center{text-align:center;}
    .sm-text-center > img{margin-left:auto;margin-right:auto}

    .sm-pull-left{float:left !important}
    .sm-pull-none{float:none !important}
    .sm-pull-right{float:right !important}
    }

@media (min-width: 992px){
    .md-text-left{text-align:left;}
    .md-text-left > img{margin-left:0;margin-right:auto}
    .md-text-right{text-align:right;}
    .md-text-right > img{margin-left:auto;margin-right:0}
    .md-text-center{text-align:center;}
    .md-text-center > img{margin-left:auto;margin-right:auto}

    .md-pull-left{float:left !important}
    .md-pull-none{float:none !important}
    .md-pull-right{float:right !important}
    }

@media (min-width: 1200px){
    .lg-text-left{text-align:left;}
    .lg-text-left > img{margin-left:0;margin-right:auto}
    .lg-text-right{text-align:right;}
    .lg-text-right > img{margin-left:auto;margin-right:0}
    .lg-text-center{text-align:center;}
    .lg-text-center > img{margin-left:auto;margin-right:auto}

    .lg-pull-left{float:left !important}
    .lg-pull-none{float:none !important}
    .lg-pull-right{float:right !important}
    }


.text-left > img{margin-left:0;margin-right:auto}
.text-right > img{margin-left:auto;margin-right:0}
.text-center > img{margin-left:auto;margin-right:auto}
    
.nopadding {padding: 0 !important;margin: 0 !important;}
.padding-5 {padding-left:5px !important;padding-right:5px !important;}
.padding-10 {padding-left:10px !important;padding-right:10px !important;}

 
/*CAROUSEL CSS TRICK FOR FADING*/
.carousel-fade .carousel-inner .item {
    opacity: 0;
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    -o-transition-property: opacity;
    transition-property: opacity;
    }
.carousel-fade .carousel-inner .active {
    opacity: 1;
    }
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
    left: 0;
    opacity: 0;
    z-index: 1;
    }
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
    opacity: 1;
    }
.carousel-fade .carousel-control {
    z-index: 2;
    }