/******************************************************************
Theme Name: Bones-AMMF
 Description: Theme Frame Work for Website development
Author: Alex Wells
 Version: 1.7
Tags: fluid-layout, responsive-layout, accessibility-ready, translation-ready, microformats, rtl-language-support
******************************************************************/

/*FRAMEWORK base - http://themble.com/bones/ */

/*Default CSS is found under library -> css -> style.css
its imported by the frame work*/
/*================================================================================General================================================================================*/
@import url(http://fonts.googleapis.com/css?family=Lato);
#wpadminbar { z-index: 9999999999999999999999999999; }
/*============================================================Links============================================================*/
a, a:visited { color: #00a5dd;/* on hover *//* on click *//* mobile tap color */ }
a { text-decoration: none; }
a:hover, a:focus, a:visited:hover, a:visited:focus { outline: none; text-decoration: underline; color: #543091; }
html, body, #container, #content { background-color: #c9c6e7; font-family: 'Lato', sans-serif; }
#container  { background-color: #fff; max-width:1040px; margin:0 auto; margin-top:20px; }
#content { margin:0px; background-color: #fff; max-width:1040px; margin:0 auto;}
#inner-content {padding:10px 10px;}

*, p, a{ -ms-word-break: normal;word-break: normal; word-break: normal; -webkit-hyphens: normal;  -moz-hyphens: normal;  hyphens: normal;white-space:normal; word-wrap:break-word;}

.textwhite { color: #ffffff; }
h1, h2, h3, h5, h5, h6, p, a, div, ul, li, span { font-family: 'Lato', sans-serif; }
.entry-content img { max-width: initial!important; }
.intense.row { margin-right: 0px!important; margin-left: 0px!important; }
#tophead .right { float: right; }
table.variations td[class="label"] { border: none; }
/*------------------------------<Temp>------------------------------*/

/*------------------------------</Temp>------------------------------*/
/*------------------------------<Shop>------------------------------*/
.quantity.buttons_added { height: 40px; }
.entry-content .woocommerce.product-columns-3 ul.products li.product, .woocommerce-page.product-columns-3 ul.products li.product{float: left; min-height: 294px; display: inline-block; margin: 0 3.8% 2.992em 0; position: static !important; clear: none !important; width: 29%;}
.woocommerce-page #content ul.products.grid li .gridlist-buttonwrap .quantity { float: left; height: 30px; width: 55px; line-height: 30px; margin-right: 10px; padding-right: 0px; }
/*------------------------------</Shop>------------------------------*/
/*------------------------------<Header>------------------------------*/
.header {background:none;}
#inner-header { width: 100%; background-color: #ffffff; max-width:1040px; margin:0 auto; }
#tophead {background-color: #ffffff; max-width: 1040px; padding: 0px 10px 0px 0px; margin: 0 auto; overflow: hidden; }
#tophead .left, #tophead .right, #tophead .left a { display: inline-block; }
#tophead .right {float: right; width: 370px; margin-right:10px; }
#tophead .left p {float: right; margin-top: 88px; display: inline-block; color: #543091;}
#social {float: right; margin-top: 20px; }
#social a:first-of-type, a.footerDonate { background-color: #543091; font-size: 24px; line-height: 30px; color: #ffffff; text-decoration: none; text-transform:capitalize; padding: 0px 5px 0px 5px; float: left; }
#social a { margin-left: 5px; float: right; }
#search { float: right; display: inline-block; margin-top: 10px; }
#search input[type="text"] { width: 250px; height: 35px; margin: 0px; border-radius: 0px; background-color: #ececec; float: left; }
#search input[type="submit"] { background-color: #543091; float: right; border: none; color: #ffffff; padding: 0px 5px 0px 5px; font-size: 20px; line-height: 35px; border-radius: 0px; }
#navwrap { background-color: #543091; width: 100%; }
#nav { font-size: 1em; max-width: 1040px; margin: 0 auto; }
#nav ul li { border-right: 2px solid #ffffff; direction: ltr; transition: background 0.3s, border 0.3s, color 0.3s, border-radius 0.3s; }
#nav ul li a { color: #fff; padding: 10px 12px 10px 12px; direction: ltr; transition: background 0.3s, border 0.3s, color 0.3s, border-radius 0.3s; }
.nav ul { background: #54398C; }
.nav ul a { color: #fff; }
.nav li ul.sub-menu, .nav li ul.children { width: 252px; }
#nav li ul.sub-menu li, .nav li ul.children li { border-right: 0px; }
.nav li ul.sub-menu li a, .nav li ul.children li a{ width: 250px; }
#slider { margin-top: 20px; }
#mission { width: 100%; font-size: 30px; color: #ffffff; text-align: center; background-color: #543091; margin-top: 0px; margin-bottom: 0px; max-width:1040px; margin:0 auto; }
#nav ul li:hover > a { color: #54398C; background-color: #ececec; }
#nav ul li a:hover, #nav ul li a:focus { color: #543091; text-decoration: none; }
ul.lof-main-wapper { width: 100%!important; }
ul.lof-main-wapper li:first-child { min-height: 250px; }
.mean-nav ul { font-size: 15px; color: #ffffff; border-bottom: 1px solid #543091; }
.mean-container .mean-bar { padding-bottom: 0px; background-color: #543091; }
.mean-container .mean-nav ul li { direction: ltr; transition: background 0.3s, border 0.3s, color 0.3s, border-radius 0.3s; }
.mean-container .mean-nav ul li:hover { background-color: #ffffff; }
.mean-container .mean-nav ul li a { direction: ltr; transition: background 0.3s, border 0.3s, color 0.3s, border-radius 0.3s; color: #543091; border-color: #543091; }
.mean-container .mean-nav { background-color: #DCD6EA; }
.mean-container .mean-nav ul { background: #DBD6E8; }
#primary-sidebar { margin-bottom: 15px; font-size: 18px; display: inline-block; float: left; }
#primary-sidebar input[type="button"] { background-color: #543091; color: #ffffff; border: none; height: 30px; width: 30px; border-radius: none; }
/*------------------------------</Header>------------------------------*/
/*------------------------------<twitter and news>------------------------------*/
#news, #fundraisernews, .twitterfeed { width: 33.33333%; display: inline-block; vertical-align: top; padding: 0px 5px 0px 5px; }
.twitterfeed {width:32.5%; float:right;}
#news ul, #fundraisernews ul, .twitterfeed ul { padding-left: 1em; text-indent: -1em; }
#news ul li, #fundraisernews ul li, .twitterfeed ul li { list-style: square; list-style-position: inside; }
#news ul li a, #fundraisernews ul li a, .twitterfeed ul li a { text-decoration: none; text-indent: -1em; }
#news ul li a:hover, #fundraisernews ul li a:hover, .twitterfeed ul li a:hover { text-decoration: underline; color: #00a5dd; }
#news ul li a:visited, #fundraisernews ul li a:visited, .twitterfeed ul li a:visited { color: purple; }
#news > a, #fundraisernews > a, .twitterfeed > a { background-color: #543091; padding: 2px 0px 2px 10px; color: #ffffff; margin-bottom: 5px; text-decoration: none; text-align: left; display: block; }
#news > a:hover, #fundraisernews > a:hover, .twitterfeed > a:hover { color: #ffffff; text-decoration: underline; }
/*------------------------------</twitter and news>------------------------------*/
/*------------------------------<footer>------------------------------*/
  .footer { background-color: #ffffff; width: 100%; max-width:1040px; margin:0 auto; background-color: #543091; display:block; min-height:200px; }
.footerMenu {margin-top:20px; padding-left:20px; }
 .footerMenu p a {color:#FFF; margin-right:25px; text-decoration:none; }
 .footerMenu p a:hover {color:#FFF; text-decoration:underline; }

img.cancer52Logo {padding:25px 20px; padding-bottom:0px; }
p.copyWriteFooter { font-style:italic; color:#fff; text-align:center; margin:0px; margin-top:10px;}
div.footerSM { padding:10px; margin-top:20px; padding-left:20px;}
div.footerSM a:hover { color:#FFF;}

div.socialNewFoot { padding-left:35px;}

div.socialNewFoot a.footerDonate:hover {color:#FFF;}
/*------------------------------</footer>------------------------------*/


/*------------------------------<Content>------------------------------*/
article.cf { border: none; }
.entry-content { padding: 0px; }
.entry-content a { color:
#552d95;}
h2 { font-size: 1.4em; color:#552d95; }
p, li { font-size: 1em; color: #232323; }

.entry-content ul {  margin-left:20px; margin-top:0px;}
.entry-content ul li  { list-style:disc; margin-bottom:5px;}
 .entry-content img { margin-bottom: 0px; }
section.entry-content img.attachment-full.wp-post-image:first-of-type { margin: 0px 10px 0px 0px; float: left; }
.single-post .entry-content h3 { color: #543091; }


#content h1 {color:#552D95; font-size:2em;}


/*------------------------------------------------------------<Advisors>------------------------------------------------------------*/
.infopage p strong img{margin-bottom: 5px;}
/*------------------------------------------------------------</Advisors>------------------------------------------------------------*/



/*------------------------------<Homepage>------------------------------*/
body.home.page #content { margin-top: 0px; }
#news .intense.col-lg-4 h2 { color: #543091; }
#news .intense.col-lg-4 p { margin-bottom: 10px; }
#news .intense.col-lg-4 p a { text-decoration: none; color: initial; }
#news .col-lg-8 { padding-top: 30px; }
#ctaboxes .col-lg-4 { padding-left: 5px; padding-right: 5px; }



#ctaboxes .col-lg-4:nth-of-type(1) { padding-left: 0px;  }
#ctaboxes .col-lg-4:nth-of-type(3) { padding-right: 0px;  }




#ctaboxes div h3 { background-color: #543091; padding: 2px 5px 2px 10px; width: 100%; color: #ececec; margin-bottom: 5px; }



.ctaboxes  h3 { background-color: #543091; padding: 2px 5px 2px 10px; width: 100%; color: #ececec; margin-bottom: 5px; }



#ctaboxes div img { width: 100%; height: initial; margin-bottom: 5px; }
.ctaboxes  img { width: 100%; height: initial; margin-bottom: 5px; }
#ctaboxes div p a, a.readMoreLink { text-decoration: none;   color: #ffffff; background-color: #543091; padding: 5px; }

.ctaboxes p a, a.readMoreLink { text-decoration: none;   color: #ffffff; background-color: #543091; padding: 5px; }
a.readMoreLink {padding:2px 5px; font-size:80%; margin:0px 10px;}

#ctaboxes div p:last-of-type a:hover, a.readMoreLink:hover { text-decoration: none;   color: #ffffff; }
.ctaboxes p a:hover, a.readMoreLink:hover { text-decoration: none;   color: #ffffff; }



/*------------------------------<Trustee>------------------------------*/
.entry-content .wp-image-4991{margin-bottom: 40px;}
/*------------------------------</Trustee>------------------------------*/

/*------------------------------</Homepage>------------------------------*/
/*------------------------------</Content>------------------------------*/

/*------------------------------<Pages>------------------------------*/
.infopage, #postscontainer, .newspage { width: 71%; display: inline-block; float: right; padding-left: 20px; }
.infopage h1, #postscontainer h1, .newspage h1 { color: #543091; font-size: 30px; margin-bottom: 25px; }


/*------------------------------</Pages>------------------------------*/
/*------------------------------<Infopages>------------------------------*/
.infopage .quote { color: #543091; font-weight: bold; }
.breadcrumbs { color: #543091; }
.breadcrumbs a { color: #543091; }
/*------------------------------</Infopages>------------------------------*/
/*------------------------------<Postspage>------------------------------*/
.indpost img { float: left; margin: 0px 10px 10px 0px; }
.indpost h3 { margin-top: 0px; }
.indpost h3 a { color: #543091; font-size: 20px; }
.indpost h3 a:hover { text-decoration: underline; color: #543091; }
.indpost { width: 100%; display: inline-block; margin: 20px 0px 20px 0px; }
/*------------------------------</Postspage>------------------------------*/
/*------------------------------<Pagination>------------------------------*/
nav.pagination { float: right; width: 100%; }
/*------------------------------</Pagination>------------------------------*/

/*------------------------------<Read More>------------------------------*/
a.readmore { text-decoration: none; background-color: #543091; color: #ececec; text-transform: uppercase; text-decoration: none; padding: 5px; padding-right: 10px; padding-left: 10px; }
a.readmore:hover { text-decoration: none!important; background-color: #ececec!important; color: #543091!important; }
/*------------------------------</Read More>------------------------------*/
/*------------------------------<Breadcrumbs>------------------------------*/
#breadcrumbs { color: #543091; margin-top: 0px; margin-bottom: 28px; }
#breadcrumbs a { color: #543091; text-decoration: none; }
/*------------------------------</Breadcrumbs>------------------------------*/
/*------------------------------<Sidebar>------------------------------*/
.sidebar { width: 29%; display: inline-block; border-right: 2px solid #543091; padding-right: 15px; color: #543091; margin-top:0px; }
.sidebar .widget_nav_menu { margin-top: 0px; margin-bottom: 0px; padding: 0px; }
.sidebar h4 { border: none; margin-top: 0px; font-size: 1.2em; line-height: 45px; }
.sidebar a { color: #543091; text-decoration: none; }
.sidebarcc ul#menu-menu-2 > li, .sidebarnews ul#menu-categories > li { list-style: none; font-weight: bold; margin-top: 30px; text-transform: uppercase; }
.sidebarcc ul.sub-menu { margin-top: 0px; margin-bottom: 0px; }
.sidebarcc ul#menu-menu-2 > li > ul.sub-menu { margin-top: 15px; padding-left: 0px; }
.sidebar li { list-style: initial; list-style-position: inside; font-weight: normal; text-transform: none; margin-bottom: 0px; font-size: 1em; }
.sidebarcc ul#menu-menu-2 li ul li:hover > a { text-decoration: underline; }
.sidebar ul.menu  { padding-left: 10px; }
.sidebar ul.menu ul.sub-menu { margin-top: 0px; padding-left: 10px; }
.sidebar ul.menu li { margin-bottom: 0.25em;     list-style-position: inside;
    text-indent: -1em;
    padding-left: 10px; }


.sidebar ul.menu a  { font-weight:bold;}
.sidebar ul.menu ul.sub-menu a { font-weight:normal; font-size:90%;}
li.menu-item-4291 ul li a { font-size:80%!important;}


/*------------------------------</Sidebar>------------------------------*/
#tophead .right { float: right; }
/*####### Slider Image CTA CSS code #########*/
#slider { position: relative; }
.sliderMsg, .sliderMsgTitle, .sliderMsgCopy, .sliderMsgLink { width: 300px; white-space: normal; }
.sliderMsg { background-color: #cfcadb; position: absolute; top: 100px; left: 50px; color: #FFF; }
.sliderMsgTitle, .sliderMsgLink { background-color: #543091; color: #ffffff; text-align: center; }
.sliderMsgCopy p { color: #543091; padding: 0px 10px; font-size: 18px; }
.sliderMsgLink { font-size: 25px; width: 100%; text-align: center; padding: 5px 0px; }
.sliderMsgLink a { color: #FFF; text-decoration: none; }
.sliderMsgLink a:hover { color: #ffffff; text-decoration: underline; }
div.ls-slide h1 { position: relative; }




/*=========================Contact Form ===========================*/
#responsive-form{ max-width:800px /*-- change this to get your desired form width --*/; width:100%;}
.form-row{width: 100%;}
.column-half, .column-full{float: left;position: relative;padding: 0.65rem;width:100%;
	-webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
}
.clearfix:after {content: "";display: table;clear: both;}
.wpcf7-submit{background-color: #543091; border:none; color: #fff; padding: 10px 10px;}
span.wpcf7-list-item { display: block; }

/**---------------- Media query ----------------**/
@media only screen and (min-width: 48em) {
	.column-half{width: 50%;}
}

/*=========================BBPRESS===========================*/
/*##### FORUM ######*/
 .bbp-submit-wrapper{float:left !important;}
.bbp-submit-wrapper button{background-color: #543091; border:none; color: #fff; padding: 10px 10px;}
#bbp_search_submit{background-color: #543091; border:none; color: #fff; line-height: 40px; font-size: 20px; padding-bottom: 0 !important;}

/*###### FORUM ######*/
	/*Menu*/
ul#menu-forum-pages-menu { display: block; font-size: 18px;  margin-bottom:10px; }
ul#menu-forum-pages-menu li { display: inline-block; margin-right: 10px; }
ul#menu-forum-pages-menu li a { color:#543091; padding:6px 10px; background-color:#fff; }
ul#menu-forum-pages-menu li a.att { color:#FFF; padding:6px 10px; background-color:#543091; }


/*General styles*/
#bbpress-forums a { color: #552D95; }

#bbpress-forums li.bbp-header { background-color:#552D95;  }
#bbpress-forums li.bbp-header, #bbpress-forums li.bbp-header  li {   color: #FFF; }
#subscription-toggle {float:right;}
/*body.page-id-4454 ul#menu-forum-pages-menu:first-of-type { display:none;}*/

ul.bbp-topic-revision-log {display:none;} /*Remove the 'edit' info from forum posts*/

.grantBlock{padding: 10px 0 !important;}
.grantBlock h2{margin-top: 0; font-size: 1.2em;}
/*.entry-content hr + h2{display: none;}*/

.grantBlock img {border:#552D95 solid 1px;}


/*disable reply form on some pages of the forum*/

body.postid-4445 .bbp-reply-form {display:none;}


.g-recaptcha {float:left;}


#bbpress-forums .status-closed, #bbpress-forums .status-closed a {color:#552D95;}

/*------------------------------------------------------------<Media Queries>------------------------------------------------------------*/
@media only screen and (min-width: 1060px) {
.wrap { width: 1040px; }
}
 @media (max-width: 1060px) {
#socialbar, #actionswrapper { width: 820px; }
}
@media (max-width: 960px) {
#search input[type="text"] { width: 178px; }
}
@media (max-width: 881px) {
#tophead .left p { float: none; margin-left: 95px; margin-top: 0px; display: block; }
}
@media (max-width: 850px) {
#actionswrapper #inneractions { width: 100%; }
#actionswrapper { height: initial; width: 100%; }
#socialbar #innersocial a p:first-child { display: none; }
#socialbar { width: 100%; }
#socialbar .facebook, #socialbar .twitter { width: 50px; }
#socialbar .ebay { width: 155px; }
#actions #donate { margin-top: 10px; margin-bottom: 0px; }
}
 @media (max-width: 787px) {
.mean-container .mean-nav ul li a.mean-expand { height: 25px; }
.nav ul a { color: #fff; }
.nav li ul.sub-menu,  .nav li ul.children { width: 100%; margin-top: 53px; }
#nav li ul.sub-menu li,  .nav li ul.children li { border-right: 0px; }
.nav li ul.sub-menu li a,  .nav li ul.children li a{ width: 100%; border-top: 1px #000 solid; }
.mean-container .mean-nav ul li a.mean-expand:hover { background: none; }
 }
 @media (min-width: 687px) {
.page-id-45 section { position: absolute; top: 23px; right: 0px; }
.page-id-45 article { position: relative; }
}
@media (max-width: 686px) {
.page-template-infopage section { width: 100%; display: block; }
.page-template-infopage .sidebarcc { display: none; }
.page-id-45 section { display: none; }
.page-id-45 .sidebarcc { width: 100%; display: block; }
.entry-content .woocommerce.product-columns-3 ul.products li.product, .woocommerce-page.product-columns-3 ul.products li.product{min-height: 302px;}
section.entry-content { width: 100%; }
.sidebar { width: 100%; }
.twitterfeedsidebar { display: none; }
}
@media (min-width: 751px) {
#tophead .right { float: right; }
#tophead { position: relative; }
#tophead .right { position: absolute; top: 0px; right: 0px; }
}
@media (max-width: 750px) {
#tophead .left { display: block; }
#tophead .left a { margin: 0 auto; display: block; width: 370px; }
#tophead .left p { display: block; width: 100%; text-align: center; margin-left: 0px; white-space: nowrap; }
#tophead .left p:focus, #tophead .left p:active, #tophead .left p:hover { color: #543091; }
#tophead .right { margin: 0 auto; float: none; display: block; }
#tophead .right input[type="text"] { margin-bottom: 10px; }


.footerMenu div.m-1of4 {width:50%;}

}
@media (max-width: 642px) {
.sidebarnews, #postscontainer { width: 100%; }
.sidebarnews { border-bottom: 2px solid #543091; border-right: none; }
.single-post article, .single-post .newspage { width: 100%; }
}
@media (max-width: 610px) {
#news, #fundraisernews, .twitterfeed { width: 100%; }
.twitterfeed iframe { margin: 0 auto!important; position: initial!important; }
.twitterfeed { margin-bottom: 20px; }
#socialbar #innersocial { width: 100%; }
#address p { font-size: 2.5vw; }
#address p:first-child { font-size: 3vw; }
}
@media (max-width: 488px) {
.sliderMsg { right: 20px; }
.entry-content .woocommerce.product-columns-3 ul.products li.product, .woocommerce-page.product-columns-3 ul.products li.product{width: 100%; display: block; margin: 0 0 20px 0;}
}
@media (max-width: 420px) {
.page-id-2763 .shop_table { font-size: 0.5em; }
}
@media (max-width: 410px) {
#tophead .left a img { width: 100%; height: auto; }
#tophead .left, #tophead .left a { width: 100%; }
.sliderMsg { position: initial; margin: 0 auto; margin-top: 100px; }
}
@media (max-width: 400px) {
section.newspage img, section.infopage img { display: block; margin: 0 auto; float: none; }
}
@media (max-width: 357px) {
#primary-sidebar { font-size: 4vw; float: none; display: block; }
#tophead .right { width: 300px; }
}




/*Shortcode CSS code*/
div.smallText {font-size:70%; font-style:italic; color:#000;}


/*HACKS*/
body.page-id-2772 #payment {display:none;}
body.page-id-2772 #payment.woocommerce-checkout-payment {display:inline;}
.wpcf7-list-item { margin-bottom:10px;}

.wc_payment_methods li {list-style:none!important;}

li.product .button {margin-top:0px!important;}



div.tintBox { background-color:#eeedf2; padding:5px;}


body.page-id-178 h1 {margin-bottom:0px;}


.ls-bottom-slidebuttons, .ls-nav-start ls-nav-start-active, .ls-nav-stop, .ls-gpuhack, .ls-nav-start-active {display:none!important;}


/*FORUM reg page CSS styles*/
body.page-id-7444 .entry-content ul li { list-style:none;}


/*http://ammf.org.uk/world-cholangiocarcinoma-day/*/
body.page-id-7288 h2:first-of-type { margin-top:-20px;}

/*http://ammf.org.uk/cc-awareness-month/*/
body.page-id-1450 h1 { margin-bottom: -15px!important;}
body.page-id-9993 h1 { margin-bottom: -15px!important;}

/*Clinical Trials styles*/
 .page-id-156 hr{margin: 24px 0 0 0;}
 .page-id-156 hr + p{margin: 0;}


 /*side bar nav tweaks*/
 .sidebar ul.menu ul.sub-menu li#menu-item-9995 a
  { font-weight:bold!important;}






  /**
   * GRID SYSTEM from SC- GRID 2017
   */



  * { box-sizing: border-box; }
.pad { padding-right: 0.5%; padding-left: 0.5%; background-clip: content-box; }
.row { display: block; float: left; width: 100%; }
.RI img, .ri img { width: 100%; height: auto; } /*Responsive Image*/
.tenforty, .cont { max-width:1040px; width:100%; margin:0 auto;  } /*Class to create a 1040 centred div*/
 .clear {clear:both;}
	/*Default*/
.d-1of12 { width: 8.33333333333%; float: left; }
.d-2of12 { width: 16.6666666667%; float: left; }
.d-3of12, .d-1of4 { width: 25%; float: left; }
.d-4of12, .d-1of3 { width: 33.3333333333%; float: left; }
.d-5of12 { width: 41.6666666667%; float: left; }
.d-6of12, .d-1of2 { width: 50%; float: left; }
.d-7of12 { width: 58.3333333333%; float: left; }
.d-8of12, .d-2of3 { width: 66.6666666667%; float: left; }
.d-9of12, .d-3of4 { width: 75%; float: left; }
.d-10of12 { width: 83.3333333333%; float: left; }
.d-11of12 { width: 91.6666666667%; float: left; }
.d-12of12, .d-all { width: 100%; float: left; }
.d-none { display: none;}


.left {float:left;}
.right {float:right;}
.d-left {float:left;}
.d-right {float:right;}


/*}*/

@media(max-width: 1029px) {
/*Tablet*/
.t-1of12 { width: 8.33333333333%; float: left; }
.t-2of12 { width: 16.6666666667%; float: left; }
.t-3of12, .t-1of4 { width: 25%; float: left; }
.t-4of12, .t-1of3 { width: 33.3333333333%; float: left; }
.t-5of12 { width: 41.6666666667%; float: left; }
.t-6of12, .t-1of2 { width: 50%; float: left; }
.t-7of12 { width: 58.3333333333%; float: left; }
.t-8of12, .t-2of3 { width: 66.6666666667%; float: left; }
.t-9of12, .t-3of4 { width: 75%; float: left; }
.t-10of12 { width: 83.3333333333%; float: left; }
.t-11of12 { width: 91.6666666667%; float: left; }
.t-12of12, .t-all { width: 100%; float: left; }
.t-none { display: none; }
.t-left {float:left;}
.t-right {float:right;}
}
 @media(max-width: 767px) {
/*Mobile*/
.m-1of6 { width: 16.666666666666664%; float: left; }
.m-2of6, .m-1of3 { width: 33.33333333333333%; float: left; }
.m-3of6, .m-1of2 { width: 50%; float: left; }
.m-4of6, .m-2of3 { width: 66.66666666666666%; float: left; }
.m-5of6 { width: 83.33333333333334%; float: left; }
.m-6of6, .m-all { width: 100%; float: left; }
.m-1of4 { width: 25%: float: left;}
.m-3of4 { width: 75%: float: left;}
.m-none { display: none; }
.m-left {float:left;}
.m-right {float:right;}
}
 @media(max-width: 480px) {
/*Small Mobile*/
.sm-1of3 { width: 33.33333333333333%; float: left; }
.sm-2of3, .sm-1of2 { width: 66.66666666666666%; float: left; }
.sm-3of3, .sm-all { width: 100%; float: left; }
.sm-1of4 { width: 25%; float: left; }
.sm-3of4 { width: 75%; float: left; }
.sm-1of2 { float: left; width: 50%; }
.sm-none { display: none; }
.sm-left {float:left;}
.sm-right {float:right;}
}