.ts-clearfix{
	clear: both;
	&:before, &:after { 
		display: table; 
		content: ''; 
	}
}
.ts{
    nav{
        ul,
        .ts-nav-collapse{
            margin: @sizemd auto;
        }
    }
    .ts-screenxs-visible,
    .ts-screensm-visible,
    .ts-screenmd-visible,
    .ts-screenlg-visible,
    .ts-screenxl-visible,
    .ts-screenxx-visible{
        display: initial;
    }
    .ts-screenxs-hidden,
    .ts-screensm-hidden,
    .ts-screenmd-hidden,
    .ts-screenlg-hidden,
    .ts-screenxl-hidden,
    .ts-screenxx-hidden{
        display: initial;     
    }
    .ts-nav-collapse{

        .ts-nav-collapse-dropdown{
            display: none;
            padding: 0 @sizelg;
            margin: 0;
            li{
                padding-top: @sizesm;
                padding-bottom: @sizesm;
            }
        }
        &:hover{
            .ts-nav-collapse-dropdown{
                display: block;
            }
        }
    }
}

//nav collapse
@media screen and (min-width: @navcollaspe){
    .ts{
        .ts-nav-collapse{
            .ts-nav-collapse-button{
                display: none;
            }
            .ts-nav-collapse-dropdown{
                display: block;
                li{
                    display: inline-block;
                    padding-right: @sizesm;
                    padding-left: @sizesm;
                }
            }
        }
    }
}

//micro/extra-small screen
@media screen and (max-width: (@screensm - 0.001em))  {
    .ts{
        .ts-screenxs-hidden{
            display: none;     
        }
        .ts-screenxs-clearfix{
        	.ts-clearfix;
        }
        .ts-container{
            margin: 0 1rem;
        }
        .ts-asset-slideshow{
            height:(@assetheight * @headingxs);
        }
        //text-position
        .ts-screenxs-text-center{
        	text-align: center;
        }
				.ts-screenxs-text-left{
        	text-align: left;
        }
				.ts-screenxs-text-right{
        	text-align: right;
        }
        //text-size
        .ts-screenxs-text-xs{
				    font-size:@percentxs;
				}
				.ts-screenxs-text-sm{
				    font-size:@percentsm;
				}
				.ts-screenxs-text-md{
				    font-size:@percentmd;
				}
				.ts-screenxs-text-lg{
				    font-size:@percentlg;
				}
				.ts-screenxs-text-xl{
				    font-size:@percentxl;
				}
				.ts-screenxs-text-xx{
				    font-size:@percentxx;
				}
				//grid
        .ts-row,.ts-form-row,.ts-form .ts-form-row{
			    .ts-screenxs-col-span12{
			        width: percentage(12 / 12);
			    }
			    .ts-screenxs-col-span11{
			        width: percentage(11 / 12);
			    }
			    .ts-screenxs-col-span10{
			        width: percentage(10 / 12);
			    }
			    .ts-screenxs-col-span9{
			        width: percentage(9 / 12);
			    }
			    .ts-screenxs-col-span8{
			        width: percentage(8 / 12);
			    }
			    .ts-screenxs-col-span7{
			        width: percentage(7 / 12);
			    }
			    .ts-screenxs-col-span6{
			        width: percentage(6 / 12);
			    }
			    .ts-screenxs-col-span5{
			        width: percentage(5 / 12);
			    }
			    .ts-screenxs-col-span4{
			        width: percentage(4 / 12);
			    }
			    .ts-screenxs-col-span3{
			        width: percentage(3 / 12);
			    }
			    .ts-screenxs-col-span2{
			        width: percentage(2 / 12);
			    }
			    .ts-screenxs-col-span1{
			        width: percentage(1 / 12);
			    }
				}

				.ts-screenxs-height-max-100{
				    max-height: 100%;
				}
				.ts-screenxs-height-max-80{
				    max-height: 80%;
				}
				.ts-screenxs-height-max-50{
				    max-height: 50%;
				}
				.ts-screenxs-height-100{
				    height: 100%;
				}
				.ts-screenxs-height-90{
				    height: 90%;
				}
				.ts-screenxs-height-75{
				    height: 75%;
				}
				.ts-screenxs-height-66{
				    height: 66%;
				}
				.ts-screenxs-height-50{
				    height: 50%;
				}
				.ts-screenxs-height-33{
				    height: 33%;
				}
				.ts-screenxs-height-25{
				    height: 25%;
				}
				.ts-screenxs-height-10{
				    height: 10%;
				}
				.ts-screenxs-width-100{
				    width: 100%;
				}
				.ts-screenxs-width-90{
				    width: 90%;
				}
				.ts-screenxs-width-75{
				    width: 80%;
				}
				.ts-screenxs-width-66{
				    width: 66%;
				}
				.ts-screenxs-width-50{
				    width: 50%;
				}
				.ts-screenxs-width-33{
				    width: 33%;
				}
				.ts-screenxs-width-25{
				    width: 25%;
				}
				.ts-screenxs-width-10{
				    width: 10%;
				}
    }
}
//small/mobile
@media screen and (min-width:@screensm) and (max-width: (@screenmd - 0.001em)){
    .ts{
        .ts-screensm-hidden{
            display: none;     
        }
        .ts-screensm-clearfix{
        	.ts-clearfix;
        }
        .ts-container{
            margin: 0 1rem;
        }
        .ts-asset-slideshow{
            height:(@assetheight * @headingsm);
        }
        //text-position
        .ts-screensm-text-center{
        	text-align:center;
        }
				.ts-screensm-text-left{
        	text-align: left;
        }
				.ts-screensm-text-right{
        	text-align: right;
        } 
        //text-size
        .ts-screensm-text-xs{
				    font-size:@percentxs;
				}
				.ts-screensm-text-sm{
				    font-size:@percentsm;
				}
				.ts-screensm-text-md{
				    font-size:@percentmd;
				}
				.ts-screensm-text-lg{
				    font-size:@percentlg;
				}
				.ts-screensm-text-xl{
				    font-size:@percentxl;
				}
				.ts-screensm-text-xx{
				    font-size:@percentxx;
				}
        //grid
        .ts-row,.ts-form-row,.ts-form .ts-form-row{
			    .ts-screensm-col-span12{
			        width: percentage(12 / 12);
			    }
			    .ts-screensm-col-span11{
			        width: percentage(11 / 12);
			    }
			    .ts-screensm-col-span10{
			        width: percentage(10 / 12);
			    }
			    .ts-screensm-col-span9{
			        width: percentage(9 / 12);
			    }
			    .ts-screensm-col-span8{
			        width: percentage(8 / 12);
			    }
			    .ts-screensm-col-span7{
			        width: percentage(7 / 12);
			    }
			    .ts-screensm-col-span6{
			        width: percentage(6 / 12);
			    }
			    .ts-screensm-col-span5{
			        width: percentage(5 / 12);
			    }
			    .ts-screensm-col-span4{
			        width: percentage(4 / 12);
			    }
			    .ts-screensm-col-span3{
			        width: percentage(3 / 12);
			    }
			    .ts-screensm-col-span2{
			        width: percentage(2 / 12);
			    }
			    .ts-screensm-col-span1{
			        width: percentage(1 / 12);
			    }
				}
				.ts-screensm-height-max-100{
				    max-height: 100%;
				}
				.ts-screensm-height-max-80{
				    max-height: 80%;
				}
				.ts-screensm-height-max-50{
				    max-height: 50%;
				}
				.ts-screensm-height-100{
				    height: 100%;
				}
				.ts-screensm-height-90{
				    height: 90%;
				}
				.ts-screensm-height-75{
				    height: 75%;
				}
				.ts-screensm-height-66{
				    height: 66%;
				}
				.ts-screensm-height-50{
				    height: 50%;
				}
				.ts-screensm-height-33{
				    height: 33%;
				}
				.ts-screensm-height-25{
				    height: 25%;
				}
				.ts-screensm-height-10{
				    height: 10%;
				}
				.ts-screensm-width-100{
				    width: 100%;
				}
				.ts-screensm-width-90{
				    width: 90%;
				}
				.ts-screensm-width-75{
				    width: 80%;
				}
				.ts-screensm-width-66{
				    width: 66%;
				}
				.ts-screensm-width-50{
				    width: 50%;
				}
				.ts-screensm-width-33{
				    width: 33%;
				}
				.ts-screensm-width-25{
				    width: 25%;
				}
				.ts-screensm-width-10{
				    width: 10%;
				}
    }
}

//medium/ipad
@media screen and (min-width:@screenmd) and (max-width: (@screenlg - 0.001em)) {
    .ts{
        .ts-screenmd-hidden{
            display: none;     
        }
        .ts-screenmd-clearfix{
        	.ts-clearfix;
        }
        .ts-container{
            margin: 0 1rem;
        }
        .ts-asset-slideshow{
            height:(@assetheight * @headingmd);
        }
        //text-position
        .ts-screenmd-text-center{
        	text-align: center;
        }
				.ts-screenmd-text-left{
        	text-align: left;
        }
				.ts-screenmd-text-right{
        	text-align: right;
        }
        //text-size
        .ts-screenmd-text-xs{
				    font-size:@percentxs;
				}
				.ts-screenmd-text-sm{
				    font-size:@percentsm;
				}
				.ts-screenmd-text-md{
				    font-size:@percentmd;
				}
				.ts-screenmd-text-lg{
				    font-size:@percentlg;
				}
				.ts-screenmd-text-xl{
				    font-size:@percentxl;
				}
				.ts-screenmd-text-xx{
				    font-size:@percentxx;
				}
        //grid
        .ts-row,.ts-form-row,.ts-form .ts-form-row{
			    .ts-screenmd-col-span12{
			        width: percentage(12 / 12);
			    }
			    .ts-screenmd-col-span11{
			        width: percentage(11 / 12);
			    }
			    .ts-screenmd-col-span10{
			        width: percentage(10 / 12);
			    }
			    .ts-screenmd-col-span9{
			        width: percentage(9 / 12);
			    }
			    .ts-screenmd-col-span8{
			        width: percentage(8 / 12);
			    }
			    .ts-screenmd-col-span7{
			        width: percentage(7 / 12);
			    }
			    .ts-screenmd-col-span6{
			        width: percentage(6 / 12);
			    }
			    .ts-screenmd-col-span5{
			        width: percentage(5 / 12);
			    }
			    .ts-screenmd-col-span4{
			        width: percentage(4 / 12);
			    }
			    .ts-screenmd-col-span3{
			        width: percentage(3 / 12);
			    }
			    .ts-screenmd-col-span2{
			        width: percentage(2 / 12);
			    }
			    .ts-screenmd-col-span1{
			        width: percentage(1 / 12);
			    }
				}
				.ts-screenmd-height-max-100{
				    max-height: 100%;
				}
				.ts-screenmd-height-max-80{
				    max-height: 80%;
				}
				.ts-screenmd-height-max-50{
				    max-height: 50%;
				}
				.ts-screenmd-height-100{
				    height: 100%;
				}
				.ts-screenmd-height-90{
				    height: 90%;
				}
				.ts-screenmd-height-75{
				    height: 75%;
				}
				.ts-screenmd-height-66{
				    height: 66%;
				}
				.ts-screenmd-height-50{
				    height: 50%;
				}
				.ts-screenmd-height-33{
				    height: 33%;
				}
				.ts-screenmd-height-25{
				    height: 25%;
				}
				.ts-screenmd-height-10{
				    height: 10%;
				}
				.ts-screenmd-width-100{
				    width: 100%;
				}
				.ts-screenmd-width-90{
				    width: 90%;
				}
				.ts-screenmd-width-75{
				    width: 80%;
				}
				.ts-screenmd-width-66{
				    width: 66%;
				}
				.ts-screenmd-width-50{
				    width: 50%;
				}
				.ts-screenmd-width-33{
				    width: 33%;
				}
				.ts-screenmd-width-25{
				    width: 25%;
				}
				.ts-screenmd-width-10{
				    width: 10%;
				}
    }
}

//large screen
@media screen and (min-width:@screenlg) and (max-width: (@screenxl  - 0.001em)) {
    .ts{
        .ts-screenlg-hidden{
            display: none;     
        }
        .ts-screenlg-clearfix{
        	.ts-clearfix;
        }
        // text-position
        .ts-screenlg-text-center{
        	text-align:center;
        }
				.ts-screenlg-text-left{
        	text-align: left;
        }
				.ts-screenlg-text-right{
        	text-align: right;
        }
        // text-size
        .ts-screenlg-text-xs{
				    font-size:@percentxs;
				}
				.ts-screenlg-text-sm{
				    font-size:@percentsm;
				}
				.ts-screenlg-text-md{
				    font-size:@percentmd;
				}
				.ts-screenlg-text-lg{
				    font-size:@percentlg;
				}
				.ts-screenlg-text-xl{
				    font-size:@percentxl;
				}
				.ts-screenlg-text-xx{
				    font-size:@percentxx;
				}
				//grid
        .ts-row,.ts-form-row,.ts-form .ts-form-row{
			    .ts-screenlg-col-span12{
			        width: percentage(12 / 12);
			    }
			    .ts-screenlg-col-span11{
			        width: percentage(11 / 12);
			    }
			    .ts-screenlg-col-span10{
			        width: percentage(10 / 12);
			    }
			    .ts-screenlg-col-span9{
			        width: percentage(9 / 12);
			    }
			    .ts-screenlg-col-span8{
			        width: percentage(8 / 12);
			    }
			    .ts-screenlg-col-span7{
			        width: percentage(7 / 12);
			    }
			    .ts-screenlg-col-span6{
			        width: percentage(6 / 12);
			    }
			    .ts-screenlg-col-span5{
			        width: percentage(5 / 12);
			    }
			    .ts-screenlg-col-span4{
			        width: percentage(4 / 12);
			    }
			    .ts-screenlg-col-span3{
			        width: percentage(3 / 12);
			    }
			    .ts-screenlg-col-span2{
			        width: percentage(2 / 12);
			    }
			    .ts-screenlg-col-span1{
			        width: percentage(1 / 12);
			    }
				}
				.ts-screenlg-height-max-100{
				    max-height: 100%;
				}
				.ts-screenlg-height-max-80{
				    max-height: 80%;
				}
				.ts-screenlg-height-max-50{
				    max-height: 50%;
				}
				.ts-screenlg-height-100{
				    height: 100%;
				}
				.ts-screenlg-height-90{
				    height: 90%;
				}
				.ts-screenlg-height-75{
				    height: 75%;
				}
				.ts-screenlg-height-66{
				    height: 66%;
				}
				.ts-screenlg-height-50{
				    height: 50%;
				}
				.ts-screenlg-height-33{
				    height: 33%;
				}
				.ts-screenlg-height-25{
				    height: 25%;
				}
				.ts-screenlg-height-10{
				    height: 10%;
				}
				.ts-screenlg-width-100{
				    width: 100%;
				}
				.ts-screenlg-width-90{
				    width: 90%;
				}
				.ts-screenlg-width-75{
				    width: 80%;
				}
				.ts-screenlg-width-66{
				    width: 66%;
				}
				.ts-screenlg-width-50{
				    width: 50%;
				}
				.ts-screenlg-width-33{
				    width: 33%;
				}
				.ts-screenlg-width-25{
				    width: 25%;
				}
				.ts-screenlg-width-10{
				    width: 10%;
				}
    }
}
//extra-large screen
@media screen and (min-width: @screenxl) and (max-width: (@screenxx - 0.001em)) {
    .ts{
        .ts-screenxl-hidden{
            display: none;     
        }
        .ts-screenxl-clearfix{
        	.ts-clearfix;
        }
        //text-position
        .ts-screenxl-text-center{
        	text-align:center;
        }
				.ts-screenxl-text-left{
        	text-align: left;
        }
				.ts-screenxl-text-right{
        	text-align: right;
        }
        //text-position
        .ts-screenxl-text-xs{
				    font-size:@percentxs;
				}
				.ts-screenxl-text-sm{
				    font-size:@percentsm;
				}
				.ts-screenxl-text-md{
				    font-size:@percentmd;
				}
				.ts-screenxl-text-lg{
				    font-size:@percentlg;
				}
				.ts-screenxl-text-xl{
				    font-size:@percentxl;
				}
				.ts-screenxl-text-xx{
				    font-size:@percentxx;
				}
        //grid
        .ts-row,.ts-form-row,.ts-form .ts-form-row{
			    .ts-screenxl-col-span12{
			        width: percentage(12 / 12);
			    }
			    .ts-screenxl-col-span11{
			        width: percentage(11 / 12);
			    }
			    .ts-screenxl-col-span10{
			        width: percentage(10 / 12);
			    }
			    .ts-screenxl-col-span9{
			        width: percentage(9 / 12);
			    }
			    .ts-screenxl-col-span8{
			        width: percentage(8 / 12);
			    }
			    .ts-screenxl-col-span7{
			        width: percentage(7 / 12);
			    }
			    .ts-screenxl-col-span6{
			        width: percentage(6 / 12);
			    }
			    .ts-screenxl-col-span5{
			        width: percentage(5 / 12);
			    }
			    .ts-screenxl-col-span4{
			        width: percentage(4 / 12);
			    }
			    .ts-screenxl-col-span3{
			        width: percentage(3 / 12);
			    }
			    .ts-screenxl-col-span2{
			        width: percentage(2 / 12);
			    }
			    .ts-screenxl-col-span1{
			        width: percentage(1 / 12);
			    }
				}
				.ts-screenxl-height-max-100{
				    max-height: 100%;
				}
				.ts-screenxl-height-max-80{
				    max-height: 80%;
				}
				.ts-screenxl-height-max-50{
				    max-height: 50%;
				}
				.ts-screenxl-height-100{
				    height: 100%;
				}
				.ts-screenxl-height-90{
				    height: 90%;
				}
				.ts-screenxl-height-75{
				    height: 75%;
				}
				.ts-screenxl-height-66{
				    height: 66%;
				}
				.ts-screenxl-height-50{
				    height: 50%;
				}
				.ts-screenxl-height-33{
				    height: 33%;
				}
				.ts-screenxl-height-25{
				    height: 25%;
				}
				.ts-screenxl-height-10{
				    height: 10%;
				}
				.ts-screenxl-width-100{
				    width: 100%;
				}
				.ts-screenxl-width-90{
				    width: 90%;
				}
				.ts-screenxl-width-75{
				    width: 80%;
				}
				.ts-screenxl-width-66{
				    width: 66%;
				}
				.ts-screenxl-width-50{
				    width: 50%;
				}
				.ts-screenxl-width-33{
				    width: 33%;
				}
				.ts-screenxl-width-25{
				    width: 25%;
				}
				.ts-screenxl-width-10{
				    width: 10%;
				}
    }
}
//extra-huge screen
@media screen and (min-width: @screenxx) {
    .ts{
        .ts-screenxx-hidden{
            display: none;     
        }
        .ts-screenxx-clearfix{
        	.ts-clearfix;
        }
        //text-position
        .ts-screenxx-text-center{
        	text-align:center;
        }
				.ts-screenxx-text-left{
        	text-align: left;
        }
				.ts-screenxx-text-right{
        	text-align: right;
        }
        //text-size
        .ts-screenxx-text-xs{
				    font-size:@percentxs;
				}
				.ts-screenxx-text-sm{
				    font-size:@percentsm;
				}
				.ts-screenxx-text-md{
				    font-size:@percentmd;
				}
				.ts-screenxx-text-lg{
				    font-size:@percentlg;
				}
				.ts-screenxx-text-xl{
				    font-size:@percentxl;
				}
				.ts-screenxx-text-xx{
				    font-size:@percentxx;
				}
        .ts-row,.ts-form-row,.ts-form .ts-form-row{
			    .ts-screenxx-col-span12{
			        width: percentage(12 / 12);
			    }
			    .ts-screenxx-col-span11{
			        width: percentage(11 / 12);
			    }
			    .ts-screenxx-col-span10{
			        width: percentage(10 / 12);
			    }
			    .ts-screenxx-col-span9{
			        width: percentage(9 / 12);
			    }
			    .ts-screenxx-col-span8{
			        width: percentage(8 / 12);
			    }
			    .ts-screenxx-col-span7{
			        width: percentage(7 / 12);
			    }
			    .ts-screenxx-col-span6{
			        width: percentage(6 / 12);
			    }
			    .ts-screenxx-col-span5{
			        width: percentage(5 / 12);
			    }
			    .ts-screenxx-col-span4{
			        width: percentage(4 / 12);
			    }
			    .ts-screenxx-col-span3{
			        width: percentage(3 / 12);
			    }
			    .ts-screenxx-col-span2{
			        width: percentage(2 / 12);
			    }
			    .ts-screenxx-col-span1{
			        width: percentage(1 / 12);
			    }
				}
				.ts-screenxx-height-max-100{
				    max-height: 100%;
				}
				.ts-screenxx-height-max-80{
				    max-height: 80%;
				}
				.ts-screenxx-height-max-50{
				    max-height: 50%;
				}
				.ts-screenxx-height-100{
				    height: 100%;
				}
				.ts-screenxx-height-90{
				    height: 90%;
				}
				.ts-screenxx-height-75{
				    height: 75%;
				}
				.ts-screenxx-height-66{
				    height: 66%;
				}
				.ts-screenxx-height-50{
				    height: 50%;
				}
				.ts-screenxx-height-33{
				    height: 33%;
				}
				.ts-screenxx-height-25{
				    height: 25%;
				}
				.ts-screenxx-height-10{
				    height: 10%;
				}
				.ts-screenxx-width-100{
				    width: 100%;
				}
				.ts-screenxx-width-90{
				    width: 90%;
				}
				.ts-screenxx-width-75{
				    width: 80%;
				}
				.ts-screenxx-width-66{
				    width: 66%;
				}
				.ts-screenxx-width-50{
				    width: 50%;
				}
				.ts-screenxx-width-33{
				    width: 33%;
				}
				.ts-screenxx-width-25{
				    width: 25%;
				}
				.ts-screenxx-width-10{
				    width: 10%;
				}
    }
}