/*
---

name: AccountDesktop

description: Styles for MyAccount pages

provides: CSS.AccountDesktop

===================================
IMPORTANT:
Do *NOT* edit the compiled CSS file
Only edit the equivalent LESS file
===================================

...
*/
#content .recentItems .tabbedblocks .content {
  margin-left: -100%;
  width: 620px;
}
/*
---

name: A-ZDesktop

description: Styles for A-Z pages - contributors, previous issues, subjects

requires: [CSS.AZListDesktop]

provides: [CSS.AZItemsDesktop]

===================================
IMPORTANT:
Do *NOT* edit the compiled CSS file
Only edit the equivalent LESS file
===================================

...
*/
.az_items .column {
  width: 220px;
}
.publicationIndex .block ul {
  margin-bottom: 15px;
}
.publicationIndex .block li {
  width: 193px;
}
.publicationIndex .publicationsList {
  width: 620px;
}
.publicationIndex .publicationsList ul {
  width: 728px;
}
.publicationIndex .publicationsList li {
  width: 180px;
}
/*
---

name: Navigation (style 2)

description: Navigation.

requires: [CSS.Main, CSS.Structure, CSS.Layout]

provides: [CSS.Navigation.Style2]

...
*/
.navStyle2 {
  /* LATEST WIDTHS */
  /* FEATURED / HTML BLOCK WIDTHS */
  /* LATEST AND FEATURED / HTML BLOCK */
  /* LATEST AND FEATURED AND HTML BLOCK */
  /* LATEST AND FEATURED AND HTML BLOCK */
}
.navStyle2 li div ul li {
  width: auto;
}
.navStyle2 li div .showLatest {
  width: auto;
}
.navStyle2 li div .showStory {
  width: auto;
}
.navStyle2 li div .showBlock {
  width: auto;
}
.navStyle2 li div .showStory div {
  width: auto;
}
.navStyle2 li div .showBlock div {
  width: auto;
}
.navStyle2 li.onewide > div {
  width: 227px;
}
.navStyle2 li.onewide > div .subnav {
  width: 100%;
}
.navStyle2 li.onewide.twoColumn > div {
  width: 454px;
}
.navStyle2 li.onewide.twoColumn > div .subnav {
  width: 50%;
}
.navStyle2 li.onewide.threeColumn > div {
  width: 681px;
}
.navStyle2 li.onewide.threeColumn > div .subnav {
  width: 33.33333333%;
}
.navStyle2 li.onewide.fourColumn > div {
  width: 908px;
}
.navStyle2 li.onewide.fourColumn > div .subnav {
  width: 25%;
}
.navStyle2 li.onewide.latestStories > div {
  width: 241px;
}
.navStyle2 li.twowide.oneColumn.latestStories > div {
  width: 469px;
}
.navStyle2 li.twowide.oneColumn.latestStories > div .subnav {
  width: 227px;
}
.navStyle2 li.twowide.oneColumn.latestStories > div .showLatest {
  width: 241px;
}
.navStyle2 li.twowide.twoColumn.latestStories > div {
  width: 696px;
}
.navStyle2 li.twowide.twoColumn.latestStories > div .subnav {
  width: 227px;
}
.navStyle2 li.twowide.twoColumn.latestStories > div .showLatest {
  width: 241px;
}
.navStyle2 li.twowide.threeColumn.latestStories > div {
  width: 923px;
}
.navStyle2 li.twowide.threeColumn.latestStories > div .subnav {
  width: 227px;
}
.navStyle2 li.twowide.threeColumn.latestStories > div .showLatest {
  width: 241px;
}
.navStyle2 li.onewide.featuredStory > div,
.navStyle2 li.onewide.htmlBlock > div {
  width: 241px;
}
.navStyle2 li.twowide.oneColumn.featuredStory > div,
.navStyle2 li.twowide.oneColumn.htmlBlock > div {
  width: 469px;
}
.navStyle2 li.twowide.oneColumn.featuredStory > div .subnav,
.navStyle2 li.twowide.oneColumn.htmlBlock > div .subnav {
  width: 227px;
}
.navStyle2 li.twowide.oneColumn.featuredStory > div .showStory,
.navStyle2 li.twowide.oneColumn.htmlBlock > div .showStory {
  width: 241px;
}
.navStyle2 li.twowide.oneColumn.featuredStory > div .showBlock,
.navStyle2 li.twowide.oneColumn.htmlBlock > div .showBlock {
  width: 241px;
}
.navStyle2 li.twowide.twoColumn.featuredStory > div,
.navStyle2 li.twowide.twoColumn.htmlBlock > div {
  width: 696px;
}
.navStyle2 li.twowide.twoColumn.featuredStory > div .subnav,
.navStyle2 li.twowide.twoColumn.htmlBlock > div .subnav {
  width: 227px;
}
.navStyle2 li.twowide.twoColumn.featuredStory > div .showStory,
.navStyle2 li.twowide.twoColumn.htmlBlock > div .showStory {
  width: 241px;
}
.navStyle2 li.twowide.twoColumn.featuredStory > div .showBlock,
.navStyle2 li.twowide.twoColumn.htmlBlock > div .showBlock {
  width: 241px;
}
.navStyle2 li.twowide.threeColumn.featuredStory > div,
.navStyle2 li.twowide.threeColumn.htmlBlock > div {
  width: 923px;
}
.navStyle2 li.twowide.threeColumn.featuredStory > div .subnav,
.navStyle2 li.twowide.threeColumn.htmlBlock > div .subnav {
  width: 227px;
}
.navStyle2 li.twowide.threeColumn.featuredStory > div .showStory,
.navStyle2 li.twowide.threeColumn.htmlBlock > div .showStory {
  width: 241px;
}
.navStyle2 li.twowide.threeColumn.featuredStory > div .showBlock,
.navStyle2 li.twowide.threeColumn.htmlBlock > div .showBlock {
  width: 241px;
}
.navStyle2 li.twowide.latestStories.featuredStory > div,
.navStyle2 li.twowide.latestStories.htmlBlock > div {
  width: 484px;
}
.navStyle2 li.twowide.latestStories.featuredStory > div .showLatest,
.navStyle2 li.twowide.latestStories.htmlBlock > div .showLatest {
  width: 241px;
}
.navStyle2 li.twowide.latestStories.featuredStory > div .showStory,
.navStyle2 li.twowide.latestStories.htmlBlock > div .showStory {
  width: 241px;
}
.navStyle2 li.twowide.latestStories.featuredStory > div .showBlock,
.navStyle2 li.twowide.latestStories.htmlBlock > div .showBlock {
  width: 241px;
}
.navStyle2 li.threewide.oneColumn.latestStories.featuredStory > div,
.navStyle2 li.threewide.oneColumn.latestStories.htmlBlock > div {
  width: 711px;
}
.navStyle2 li.threewide.oneColumn.latestStories.featuredStory > div .subnav,
.navStyle2 li.threewide.oneColumn.latestStories.htmlBlock > div .subnav {
  width: 227px;
}
.navStyle2 li.threewide.oneColumn.latestStories.featuredStory > div .showLatest,
.navStyle2 li.threewide.oneColumn.latestStories.htmlBlock > div .showLatest {
  width: 241px;
}
.navStyle2 li.threewide.oneColumn.latestStories.featuredStory > div .showStory,
.navStyle2 li.threewide.oneColumn.latestStories.htmlBlock > div .showStory {
  width: 241px;
}
.navStyle2 li.threewide.oneColumn.latestStories.featuredStory > div .showBlock,
.navStyle2 li.threewide.oneColumn.latestStories.htmlBlock > div .showBlock {
  width: 241px;
}
.navStyle2 li.threewide.twoColumn.latestStories.featuredStory > div,
.navStyle2 li.threewide.twoColumn.latestStories.htmlBlock > div {
  width: 938px;
}
.navStyle2 li.threewide.twoColumn.latestStories.featuredStory > div .subnav,
.navStyle2 li.threewide.twoColumn.latestStories.htmlBlock > div .subnav {
  width: 227px;
}
.navStyle2 li.threewide.twoColumn.latestStories.featuredStory > div .showLatest,
.navStyle2 li.threewide.twoColumn.latestStories.htmlBlock > div .showLatest {
  width: 241px;
}
.navStyle2 li.threewide.twoColumn.latestStories.featuredStory > div .showStory,
.navStyle2 li.threewide.twoColumn.latestStories.htmlBlock > div .showStory {
  width: 241px;
}
.navStyle2 li.threewide.twoColumn.latestStories.featuredStory > div .showBlock,
.navStyle2 li.threewide.twoColumn.latestStories.htmlBlock > div .showBlock {
  width: 241px;
}
.navStyle2 li.threewide.latestStories.featuredStory.htmlBlock > div {
  width: 725px;
}
.navStyle2 li.threewide.latestStories.featuredStory.htmlBlock > div .showLatest {
  width: 241px;
}
.navStyle2 li.threewide.latestStories.featuredStory.htmlBlock > div .showStory {
  width: 241px;
}
.navStyle2 li.threewide.latestStories.featuredStory.htmlBlock > div .showBlock {
  width: 241px;
}
.navStyle2 li.fourwide.oneColumn.latestStories.featuredStory.htmlBlock > div {
  width: 953px;
}
.navStyle2 li.fourwide.oneColumn.latestStories.featuredStory.htmlBlock > div .subnav {
  width: 227px;
}
.navStyle2 li.fourwide.oneColumn.latestStories.featuredStory.htmlBlock > div .showLatest {
  width: 241px;
}
.navStyle2 li.fourwide.oneColumn.latestStories.featuredStory.htmlBlock > div .showStory {
  width: 241px;
}
.navStyle2 li.fourwide.oneColumn.latestStories.featuredStory.htmlBlock > div .showBlock {
  width: 241px;
}
.navStyle2 li.twowide.featuredStory.htmlBlock > div {
  width: 483px;
}
.navStyle2 li.twowide.featuredStory.htmlBlock > div .showStory {
  width: 241px;
}
.navStyle2 li.twowide.featuredStory.htmlBlock > div .showBlock {
  width: 241px;
}
.navStyle2 li.threewide.oneColumn.featuredStory.htmlBlock > div {
  width: 711px;
}
.navStyle2 li.threewide.oneColumn.featuredStory.htmlBlock > div .subnav {
  width: 227px;
}
.navStyle2 li.threewide.oneColumn.featuredStory.htmlBlock > div .showStory {
  width: 241px;
}
.navStyle2 li.threewide.oneColumn.featuredStory.htmlBlock > div .showBlock {
  width: 241px;
}
.navStyle2 li.threewide.twoColumn.featuredStory.htmlBlock > div {
  width: 938px;
}
.navStyle2 li.threewide.twoColumn.featuredStory.htmlBlock > div .subnav {
  width: 227px;
}
.navStyle2 li.threewide.twoColumn.featuredStory.htmlBlock > div .showStory {
  width: 241px;
}
.navStyle2 li.threewide.twoColumn.featuredStory.htmlBlock > div .showBlock {
  width: 241px;
}
/*
---

name: Layout Desktop

requires: [CSS.MainDesktop, CSS.StructureDesktop]

provides: [CSS.LayoutDesktop]

===================================
IMPORTANT:
Do *NOT* edit the compiled CSS file
Only edit the equivalent LESS file
===================================

...
*/
#colmain {
  width: 620px;
}
#rightcolumn {
  width: 300px;
  clear: none;
}
/* Basic Two Column Structure */
.twocolumn .column1,
.twocolumn .column2 {
  width: 300px;
}
/* Section 2 Styling */
.articleWrapper .relatedContent {
  width: 140px;
}
.articleWrapper .relatedContent .twocolumn .column1,
.articleWrapper .relatedContent .twocolumn .column2 {
  /* Two Column in Section 2 Styling */
  width: auto;
}
.articleWrapper .articleContent .twocolumn .column1,
.articleWrapper .articleContent .twocolumn .column2 {
  /* Two Column in Section 2 Styling */
  width: 220px;
}
#rightcolumn .style2 .column1 {
  width: 140px;
}
#rightcolumn .style2 .column2 {
  width: 140px;
}
.M2-master #content {
  width: 460px;
  float: left;
}
.M2-master #secondary_content {
  width: 140px;
}
#StoryBlog #content,
#blogSection #content {
  width: 440px;
}
/*
---

name: Story Desktop

provides: CSS.StoryDesktop

===================================
IMPORTANT:
Do *NOT* edit the compiled CSS file
Only edit the equivalent LESS file
===================================

...
*/
#story .articleWrapper {
  overflow: visible;
}
#story .articleWrapper .relatedContent {
  border-left: 20px solid #ffffff;
}
#story .articleWrapper .articleContent {
  margin-left: 0;
  width: auto;
  float: none;
}
#story .articleWrapper .question,
#story .articleWrapper .answer {
  overflow: hidden;
}
#story .articleWrapper .question:after,
#story .articleWrapper .answer:after {
  clear: none;
}
#story .articleWrapper .story_small,
#story .articleWrapper .story_large {
  clear: none;
}
#story .articleWrapper .story_small,
#story .articleWrapper .story_large,
#story .articleWrapper .video_story_large {
  overflow: hidden;
}
#story .articleWrapper .table-story {
  overflow: auto;
}
#story .articleWrapper .inlineFull,
#story .articleWrapper .inline_image {
  overflow: hidden;
  clear: none;
}
#story .articleWrapper .factfile {
  clear: right;
  overflow: hidden;
}
/* RELATED CONTENT */
.subscribe_options .subscribe_box {
  width: 220px;
}
#story .table-full {
  width: auto;
}
#story .abacus-popup .table-full {
  width: 576px;
}
#columns #colmain {
  margin-bottom: 0;
}
.image_size_small {
  width: 140px;
}
.image_size_med {
  width: 220px;
}
/*
---

name: Gallery Desktop

provides: CSS.GalleryDesktop

===================================
IMPORTANT:
Do *NOT* edit the compiled CSS file
Only edit the equivalent LESS file
===================================

...
*/
/* Gallery style2 */
.galleryStyle2 {
  width: 620px;
}
.galleryStyle2 .controls {
  width: 620px;
}
#top .oneColumn .columnOne .slideshowStyle1 .display,
#foot .oneColumn .columnOne .slideshowStyle1 .display {
  height: 597px;
}
#top .twoColumns .slideshowStyle1 .display,
#foot .twoColumns .slideshowStyle1 .display {
  height: 432px;
}
#top .twoColumnsSmallLeft .columnOne .slideshowStyle1 .display,
#foot .twoColumnsSmallLeft .columnOne .slideshowStyle1 .display,
#top .twoColumnsSmallRight .columnTwo .slideshowStyle1 .display,
#foot .twoColumnsSmallRight .columnTwo .slideshowStyle1 .display {
  height: 313px;
}
#top .twoColumnsSmallLeft .columnTwo .slideshowStyle1 .display,
#foot .twoColumnsSmallLeft .columnTwo .slideshowStyle1 .display,
#top .twoColumnsSmallRight .columnOne .slideshowStyle1 .display,
#foot .twoColumnsSmallRight .columnOne .slideshowStyle1 .display {
  height: 552px;
}
#top .threeColumns .slideshowStyle1 .display,
#foot .threeColumns .slideshowStyle1 .display {
  height: 313px;
}
#top .threeColumnsWideLeft .columnOne .slideshowStyle1 .display,
#foot .threeColumnsWideLeft .columnOne .slideshowStyle1 .display,
#top .threeColumnsWideRight .columnThree .slideshowStyle1 .display,
#foot .threeColumnsWideRight .columnThree .slideshowStyle1 .display {
  height: 390px;
}
#top .threeColumnsWideLeft .columnTwo .slideshowStyle1 .display,
#foot .threeColumnsWideLeft .columnTwo .slideshowStyle1 .display,
#top .threeColumnsWideRight .columnTwo .slideshowStyle1 .display,
#foot .threeColumnsWideRight .columnTwo .slideshowStyle1 .display {
  height: 293px;
}
#top .threeColumnsWideLeft .columnThree .slideshowStyle1 .display,
#foot .threeColumnsWideLeft .columnThree .slideshowStyle1 .display,
#top .threeColumnsWideRight .columnOne .slideshowStyle1 .display,
#foot .threeColumnsWideRight .columnOne .slideshowStyle1 .display {
  height: 312px;
}
#main .oneColumn .columnOne .slideshowStyle1 .display {
  height: 552px;
}
#main .twoColumns .slideshowStyle1 .display {
  height: 313px;
}
#main .twoColumnsSmallLeft .columnOne .slideshowStyle1 .display,
#main .twoColumnsSmallRight .columnTwo .slideshowStyle1 .display {
  height: 293px;
}
#main .twoColumnsSmallLeft .columnTwo .slideshowStyle1 .display,
#main .twoColumnsSmallRight .columnOne .slideshowStyle1 .display {
  height: 390px;
}
#mainright .slideshowStyle1 .display {
  height: 312px;
}
.slideshowStyle2 .display {
  width: 390px;
}
.slideshowStyle2 .thumbs {
  margin-top: 0;
  width: 230px;
}
#top .oneColumn .columnOne .slideshowStyle2 .thumbs,
#foot .oneColumn .columnOne .slideshowStyle2 .thumbs {
  width: 300px;
}
#top .oneColumn .columnOne .slideshowStyle2 .display,
#foot .oneColumn .columnOne .slideshowStyle2 .display {
  width: 640px;
}
/*
---

name: Slider (style 1) Desktop

requires: [CSS.MainDesktop, CSS.StructureDesktop, CSS.LayoutDesktop, CSS.GalleryDesktop, CSS.SPIN2Desktop]

provides: [CSS.Slider.Style1Desktop]

===================================
IMPORTANT:
Do *NOT* edit the compiled CSS file
Only edit the equivalent LESS file
===================================

...
*/
.sliderStyle1 .thumbs {
  width: 640px;
}
.sliderStyle1 .thumbs li {
  width: 140px;
}
#top .oneColumn .sliderStyle1 .thumbs,
#foot .oneColumn .sliderStyle1 .thumbs {
  overflow: hidden;
  width: 950px;
}
#top .oneColumn .sliderStyle1 .thumbs li,
#foot .oneColumn .sliderStyle1 .thumbs li {
  width: 220px;
}
#top .twoColumnsSmallLeft .sliderStyle1 .thumbs,
#foot .twoColumnsSmallLeft .sliderStyle1 .thumbs,
#top .twoColumnsSmallRight .sliderStyle1 .thumbs,
#foot .twoColumnsSmallRight .sliderStyle1 .thumbs {
  overflow: hidden;
}
#top .twoColumnsSmallLeft .sliderStyle1 .thumbs li,
#foot .twoColumnsSmallLeft .sliderStyle1 .thumbs li,
#top .twoColumnsSmallRight .sliderStyle1 .thumbs li,
#foot .twoColumnsSmallRight .sliderStyle1 .thumbs li {
  width: 140px;
}
#main .oneColumn .sliderStyle1 .thumbs {
  overflow: hidden;
}
#main .oneColumn .sliderStyle1 .thumbs li {
  width: 140px;
}
#mainright.area .oneColumn .column .slideshowStyle1 img,
#mainright.area .oneColumn .column .slideshowStyle1 .caption {
  float: none;
  position: absolute;
  width: 100%;
}
/*
---

name: Forms Portrait

requires: [CSS.Main, CSS.Buttons]

provides: [CSS.FormsPortrait]

===================================
IMPORTANT:
Do *NOT* edit the compiled CSS file
Only edit the equivalent LESS file
===================================

...
*/
.formbox .text {
  width: 69.1%;
}
.formbox select,
.formbox select.text {
  width: 70.7%;
}
.formbox .text,
.formbox select {
  width: 44%;
}
.formbox label,
.formbox .label {
  width: 149px;
}
.formbox .text_field {
  width: 510px;
}
.formbox .formsmall {
  width: 23.4%;
}
.formbox .formmedium {
  width: 43.4%;
}
.formbox .formlarge {
  width: 63.4%;
}
.formbox select.formsmall {
  width: 23.4%;
}
.formbox select.formmedium {
  width: 43.4%;
}
.formbox select.formlarge {
  width: 63.4%;
}
.formbox select.dategroup_day {
  width: 65px;
}
.formbox select.dategroup_month {
  width: 105px;
}
.formbox select.dategroup_year {
  width: 65px;
}
.formbox .field div {
  margin-left: 167px;
}
.human_test .text {
  margin-left: 167px;
}
.human_test label {
  width: 100%;
}
.human_test .fieldtips {
  width: 430px;
}
.formOptions label,
.formOptions + label {
  width: 100%;
}
/*
---

name: SPIN 2 Grids Desktop

description: Provides grid layout for SPIN2

requires: [CSS.SPIN2Desktop]

provides: [CSS.SPIN2GridsDesktop]

===================================
IMPORTANT:
Do *NOT* edit the compiled CSS file
Only edit the equivalent LESS file
===================================

...
*/
#colmain {
  width: 620px;
}
#rightcolumn {
  width: 300px;
}
/* GRIDS */
.grid .column {
  margin-right: 20px;
  margin-bottom: 0;
}
.grid .column.columnTwo {
  margin-right: 0;
}
.grid .column .twocolumn {
  width: auto;
}
.grid .threeColumns .columnTwo,
.grid .threeColumnsWideLeft .columnTwo,
.grid .threeColumnsWideRight .columnTwo {
  margin-right: 20px;
}
.grid .threeColumns .columnThree,
.grid .threeColumnsWideLeft .columnThree,
.grid .threeColumnsWideRight .columnThree {
  margin-right: 0;
}
.grid .twocolumn.left {
  margin-right: 20px;
}
/* TOP/FOOT ONE COLUMN */
#top.area .grid .oneColumn .column,
#foot.area .grid .oneColumn .column {
  width: 100%;
}
#top.area .grid .oneColumn .twocolumn,
#foot.area .grid .oneColumn .twocolumn {
  width: 460px;
}
#top.area .grid .oneColumn .half.twocolumn .picture,
#foot.area .grid .oneColumn .half.twocolumn .picture {
  width: 220px;
}
/* MAIN ONE COLUMN */
#main.area .grid .oneColumn .column {
  width: 100%;
}
#main.area .grid .oneColumn .twocolumn {
  width: 300px;
}
#main.area .grid .oneColumn .half.twocolumn .picture {
  width: 220px;
}
/* MAINRIGHT ONE COLUMN */
#mainright.area .grid .oneColumn .twocolumn {
  width: 140px;
}
/* TOP/FOOT TWO COLUMN (EQUAL) */
#top.area .twoColumns .column,
#foot.area .twoColumns .column {
  width: 460px;
}
#top.area .twoColumns .twocolumn,
#foot.area .twoColumns .twocolumn {
  width: 220px;
}
/* MAIN TWO COLUMN (EQUAL) */
#main.area .twoColumns .column {
  width: 300px;
}
#main.area .twoColumns .twocolumn {
  width: 140px;
}
/* MAINRIGHT TWO COLUMN (EQUAL) */
#mainright.area .twoColumns .column {
  width: 140px;
  margin-right: 20px;
}
/* TOP/FOOT TWO COLUMN (SMALL LEFT) */
#top.area .twoColumnsSmallLeft .columnOne,
#foot.area .twoColumnsSmallLeft .columnOne {
  width: 300px;
}
#top.area .twoColumnsSmallLeft .columnOne .half .picture,
#foot.area .twoColumnsSmallLeft .columnOne .half .picture {
  width: 140px;
}
#top.area .twoColumnsSmallLeft .columnOne .twocolumn,
#foot.area .twoColumnsSmallLeft .columnOne .twocolumn {
  width: 140px;
}
#top.area .twoColumnsSmallLeft .columnTwo,
#foot.area .twoColumnsSmallLeft .columnTwo {
  width: 620px;
}
#top.area .twoColumnsSmallLeft .half.twocolumn .picture,
#foot.area .twoColumnsSmallLeft .half.twocolumn .picture {
  width: 220px;
}
#top.area .twoColumnsSmallLeft .columnTwo .twocolumn,
#foot.area .twoColumnsSmallLeft .columnTwo .twocolumn {
  width: 300px;
}
/* MAIN TWO COLUMN (SMALL LEFT) */
#main.area .twoColumnsSmallLeft .columnOne {
  width: 220px;
}
#main.area .twoColumnsSmallLeft .columnOne .twocolumn {
  width: 100px;
}
#main.area .twoColumnsSmallLeft .columnTwo {
  width: 380px;
  margin-right: 0;
}
#main.area .twoColumnsSmallLeft .columnTwo .twocolumn {
  width: 180px;
}
/* TOP/FOOT TWO COLUMN (SMALL RIGHT) */
#top.area .twoColumnsSmallRight .columnOne,
#foot.area .twoColumnsSmallRight .columnOne {
  width: 620px;
}
#top.area .twoColumnsSmallRight .columnOne .twocolumn,
#foot.area .twoColumnsSmallRight .columnOne .twocolumn {
  width: 300px;
}
#top.area .twoColumnsSmallRight .columnTwo,
#foot.area .twoColumnsSmallRight .columnTwo {
  width: 300px;
}
#top.area .twoColumnsSmallRight .columnTwo .half .picture,
#foot.area .twoColumnsSmallRight .columnTwo .half .picture {
  width: 140px;
}
#top.area .twoColumnsSmallRight .half.twocolumn .picture,
#foot.area .twoColumnsSmallRight .half.twocolumn .picture {
  width: 220px;
}
#top.area .twoColumnsSmallRight .columnTwo .twocolumn,
#foot.area .twoColumnsSmallRight .columnTwo .twocolumn {
  width: 140px;
}
/* MAIN TWO COLUMN (SMALL RIGHT) */
#main.area .twoColumnsSmallRight .columnOne {
  width: 380px;
}
#main.area .twoColumnsSmallRight .columnOne .twocolumn {
  width: 180px;
}
#main.area .twoColumnsSmallRight .columnTwo {
  width: 220px;
  margin-right: 0;
}
#main.area .twoColumnsSmallRight .columnTwo .twocolumn {
  width: 100px;
}
/* TOP/FOOT THREE COLUMN (EQUAL) */
#top.area .threeColumns .columnOne,
#foot.area .threeColumns .columnOne {
  width: 300px;
}
#top.area .threeColumns .columnOne .twocolumn,
#foot.area .threeColumns .columnOne .twocolumn {
  width: 140px;
}
#top.area .threeColumns .columnTwo,
#foot.area .threeColumns .columnTwo {
  width: 300px;
  margin-right: 20px;
}
#top.area .threeColumns .columnTwo .twocolumn,
#foot.area .threeColumns .columnTwo .twocolumn {
  width: 140px;
}
#top.area .threeColumns .columnThree,
#foot.area .threeColumns .columnThree {
  width: 300px;
}
#top.area .threeColumns .columnThree .twocolumn,
#foot.area .threeColumns .columnThree .twocolumn {
  width: 140px;
}
#top.area .threeColumns .half .picture,
#foot.area .threeColumns .half .picture {
  width: 140px;
}
/* TOP/FOOT THREE COLUMN (WIDE RIGHT) */
#top.area .threeColumnsWideRight .columnOne,
#foot.area .threeColumnsWideRight .columnOne {
  width: 300px;
}
#top.area .threeColumnsWideRight .columnOne .half .picture,
#foot.area .threeColumnsWideRight .columnOne .half .picture {
  width: 140px;
}
#top.area .threeColumnsWideRight .columnOne .twocolumn,
#foot.area .threeColumnsWideRight .columnOne .twocolumn {
  width: 140px;
}
#top.area .threeColumnsWideRight .columnTwo,
#foot.area .threeColumnsWideRight .columnTwo {
  width: 220px;
  margin-right: 20px;
}
#top.area .threeColumnsWideRight .columnTwo .twocolumn,
#foot.area .threeColumnsWideRight .columnTwo .twocolumn {
  width: 100px;
}
#top.area .threeColumnsWideRight .columnThree,
#foot.area .threeColumnsWideRight .columnThree {
  width: 380px;
}
#top.area .threeColumnsWideRight .columnThree .twocolumn,
#foot.area .threeColumnsWideRight .columnThree .twocolumn {
  width: 180px;
}
/* TOP/FOOT THREE COLUMN (WIDE LEFT) */
#top.area .threeColumnsWideLeft .columnOne,
#foot.area .threeColumnsWideLeft .columnOne {
  width: 380px;
}
#top.area .threeColumnsWideLeft .columnOne .twocolumn,
#foot.area .threeColumnsWideLeft .columnOne .twocolumn {
  width: 180px;
}
#top.area .threeColumnsWideLeft .columnTwo,
#foot.area .threeColumnsWideLeft .columnTwo {
  width: 220px;
  margin-right: 20px;
}
#top.area .threeColumnsWideLeft .columnTwo .twocolumn,
#foot.area .threeColumnsWideLeft .columnTwo .twocolumn {
  width: 100px;
}
#top.area .threeColumnsWideLeft .columnThree,
#foot.area .threeColumnsWideLeft .columnThree {
  width: 300px;
}
#top.area .threeColumnsWideLeft .columnThree .half .picture,
#foot.area .threeColumnsWideLeft .columnThree .half .picture {
  width: 140px;
}
#top.area .threeColumnsWideLeft .columnThree .twocolumn,
#foot.area .threeColumnsWideLeft .columnThree .twocolumn {
  width: 140px;
}
/* MAIN THREE COLUMN (EQUAL) */
#main.area .threeColumns .column {
  width: 193px;
}
#main.area .threeColumns .column.columnTwo {
  margin-right: 20px;
}
#main.area .threeColumns .column.columnThree {
  margin-right: 0;
}
#main.area .threeColumns .columnTwo {
  width: 193px;
}
/*
---

name: SPIN 2 STYLES COLOURS Desktop

description: Provides SPIN2 color and colour grids

requires: [CSS.SPIN2GridsDesktop]

provides: [CSS.SPIN2VisualsDesktop]

===================================
IMPORTANT:
Do *NOT* edit the compiled CSS file
Only edit the equivalent LESS file
===================================

...
*/
/* =========================== COLOUR GRIDS =========================== */
/* TOP/FOOT (COLOUR3) */
#top.area .oneColumn .colour3 .twocolumn,
#foot.area .oneColumn .colour3 .twocolumn {
  width: 447px;
}
#top.area .twoColumns .colour3 .twocolumn,
#foot.area .twoColumns .colour3 .twocolumn {
  width: 207px;
}
#top.area .twoColumnsSmallLeft .columnOne .colour3 .twocolumn,
#foot.area .twoColumnsSmallLeft .columnOne .colour3 .twocolumn,
#top.area .twoColumnsSmallRight .columnTwo .colour3 .twocolumn,
#foot.area .twoColumnsSmallRight .columnTwo .colour3 .twocolumn {
  width: 127px;
}
#top.area .twoColumnsSmallLeft .columnTwo .colour3 .twocolumn,
#foot.area .twoColumnsSmallLeft .columnTwo .colour3 .twocolumn,
#top.area .twoColumnsSmallRight .columnOne .colour3 .twocolumn,
#foot.area .twoColumnsSmallRight .columnOne .colour3 .twocolumn {
  width: 287px;
}
#top.area .threeColumns .colour3 .twocolumn,
#foot.area .threeColumns .colour3 .twocolumn {
  width: 127px;
}
#top.area .threeColumnsWideLeft .columnTwo .colour3 .twocolumn,
#foot.area .threeColumnsWideLeft .columnTwo .colour3 .twocolumn,
#top.area .threeColumnsWideRight .columnTwo .colour3 .twocolumn,
#foot.area .threeColumnsWideRight .columnTwo .colour3 .twocolumn {
  width: 87px;
}
#top.area .threeColumnsWideLeft .columnThree .colour3 .twocolumn,
#foot.area .threeColumnsWideLeft .columnThree .colour3 .twocolumn,
#top.area .threeColumnsWideRight .columnOne .colour3 .twocolumn,
#foot.area .threeColumnsWideRight .columnOne .colour3 .twocolumn {
  width: 127px;
}
#top.area .threeColumnsWideLeft .columnOne .colour3 .twocolumn,
#foot.area .threeColumnsWideLeft .columnOne .colour3 .twocolumn,
#top.area .threeColumnsWideRight .columnThree .colour3 .twocolumn,
#foot.area .threeColumnsWideRight .columnThree .colour3 .twocolumn {
  width: 167px;
}
/* MAIN (colour3) */
#main.area .oneColumn .colour3 .twocolumn {
  width: 287px;
}
#main.area .twoColumns .colour3 .twocolumn {
  width: 127px;
}
#main.area .twoColumnsSmallLeft .columnTwo .colour3 .twocolumn,
#main.area .twoColumnsSmallRight .columnOne .colour3 .twocolumn {
  width: 167px;
}
/* MAIN RIGHT (colour3) */
#mainright.area .oneColumn .colour3 .twocolumn {
  width: 127px;
}
/*
---

name: SPIN Desktop

provides: [CSS.SPINDesktop]

===================================
IMPORTANT:
Do *NOT* edit the compiled CSS file
Only edit the equivalent LESS file
===================================

...
*/
.colour2 .twocolumn .column1,
.colour2 .twocolumn .column2 {
  width: 290px;
}
.section_twocolumn .section_column1 .colour2 .twocolumn .column1,
.section_twocolumn .section_column1 .colour2 .twocolumn .column2 {
  width: 210px;
}
/*
---

name: Spin Galleries Desktop

requires: [CSS.GalleryDesktop]

provides: CSS.SPIN2GalleriesDesktop

===================================
IMPORTANT:
Do *NOT* edit the compiled CSS file
Only edit the equivalent LESS file
===================================

...
*/
#top.area .twoColumnsSmallLeft .columnOne .slideshowStyle1 img,
#foot.area .twoColumnsSmallLeft .columnOne .slideshowStyle1 img,
#top.area .twoColumnsSmallRight .columnTwo .slideshowStyle1 img,
#foot.area .twoColumnsSmallRight .columnTwo .slideshowStyle1 img,
#top.area .threeColumns .column .slideshowStyle1 img,
#foot.area .threeColumns .column .slideshowStyle1 img,
#top.area .threeColumnsWideLeft .columnThree .slideshowStyle1 img,
#foot.area .threeColumnsWideLeft .columnThree .slideshowStyle1 img,
#top.area .threeColumnsWideRight .columnOne .slideshowStyle1 img,
#foot.area .threeColumnsWideRight .columnOne .slideshowStyle1 img,
#top.area .twoColumnsSmallLeft .columnOne .slideshowStyle1 .caption,
#foot.area .twoColumnsSmallLeft .columnOne .slideshowStyle1 .caption,
#top.area .twoColumnsSmallRight .columnTwo .slideshowStyle1 .caption,
#foot.area .twoColumnsSmallRight .columnTwo .slideshowStyle1 .caption,
#top.area .threeColumns .column .slideshowStyle1 .caption,
#foot.area .threeColumns .column .slideshowStyle1 .caption,
#top.area .threeColumnsWideLeft .columnThree .slideshowStyle1 .caption,
#foot.area .threeColumnsWideLeft .columnThree .slideshowStyle1 .caption,
#top.area .threeColumnsWideRight .columnOne .slideshowStyle1 .caption,
#foot.area .threeColumnsWideRight .columnOne .slideshowStyle1 .caption {
  float: none;
  position: absolute;
  width: auto;
}
#top.area .oneColumn .columnOne .slideshowStyle1 img,
#foot.area .oneColumn .columnOne .slideshowStyle1 img,
#top.area .twoColumnsSmallLeft .columnTwo .slideshowStyle1 img,
#foot.area .twoColumnsSmallLeft .columnTwo .slideshowStyle1 img,
#top.area .twoColumnsSmallRight .columnOne .slideshowStyle1 img,
#foot.area .twoColumnsSmallRight .columnOne .slideshowStyle1 img,
#top.area .oneColumn .columnOne .slideshowStyle1 .caption,
#foot.area .oneColumn .columnOne .slideshowStyle1 .caption,
#top.area .twoColumnsSmallLeft .columnTwo .slideshowStyle1 .caption,
#foot.area .twoColumnsSmallLeft .columnTwo .slideshowStyle1 .caption,
#top.area .twoColumnsSmallRight .columnOne .slideshowStyle1 .caption,
#foot.area .twoColumnsSmallRight .columnOne .slideshowStyle1 .caption {
  width: 100%;
}
/*
---

name: SPIN 2 Grid Layout Desktop

description: Provides grid layout for SPIN2

requires: [CSS.SPIN2Desktop]

provides: CSS.SPIN2GridLayoutDesktop

===================================
IMPORTANT:
Do *NOT* edit the compiled CSS file
Only edit the equivalent LESS file
===================================

...
*/
.gridLayout li {
  display: inline-block;
  vertical-align: top;
  width: 220px;
  margin-right: 20px;
}
.gridLayout li:nth-child(2n) {
  margin-right: 20px;
}
.twoColumns .column .gridLayout li {
  width: 140px;
}
.twoColumnsSmallRight .columnOne .gridLayout li,
.twoColumnsSmallLeft .columnTwo .gridLayout li {
  width: 140px;
}
#main.area .gridLayout ul li {
  width: 140px;
}
#top.area .oneColumn .gridLayout li,
#foot.area .oneColumn .gridLayout li {
  width: 220px;
}
/*
---

name: WebSubs Desktop

description: webSubs class styles

provides: [CSS.WebSubsDesktop]

===================================
IMPORTANT:
Do *NOT* edit the compiled CSS file
Only edit the equivalent LESS file
===================================

...
*/
#register #columns {
  padding: 0;
}
/* SUBS CONTENT */
.subs_wrapper1 .col1,
.subs_wrapper2 .col1 {
  width: 620px;
  margin-bottom: 0;
}
.subs_wrapper1 .col2,
.subs_wrapper2 .col2 {
  width: 300px;
}
.subs_wrapper1 .col2 {
  width: 271px;
}
/*
---

name: Fixed Width Overrides

provides: [CSS.DesktopFixedWidth]

===================================
IMPORTANT:
Do *NOT* edit the compiled CSS file
Only edit the equivalent LESS file
===================================

...
*/
#story #colmain,
#story_custom #colmain,
#StoryBlog #colmain,
#blogSection #colmain {
  width: 603px;
}
#main.area .twoColumns .column.columnTwo,
#mainright.area .twoColumns .column.columnTwo {
  margin-right: 0;
}
.oneColumn .gridLayout ul {
  width: 960px;
}
.twoColumns .columnOne .gridLayout ul {
  width: 480px;
}
.twoColumns .columnTwo .gridLayout ul {
  width: 480px;
}
.twoColumnsSmallRight .columnOne .gridLayout ul {
  width: 640px;
}
.twoColumnsSmallLeft .columnTwo .gridLayout ul {
  width: 640px;
}
#main.area .gridLayout ul {
  width: 640px;
}
#content .tabbedblocks .content {
  margin-left: -620px;
  width: 620px;
}
.tabbedblocks.spin .content,
#content .grid .tabbedblocks .content {
  width: 100%;
  margin-left: -100%;
}
#top.area .twoColumns .tabbedblocks.spin .content,
#foot.area .twoColumns .tabbedblocks.spin .content {
  margin-left: -460px;
  width: 460px;
}
#top.area .twoColumnsSmallRight .columnOne .tabbedblocks.spin .content,
#foot.area .twoColumnsSmallRight .columnOne .tabbedblocks.spin .content {
  margin-left: -620px;
  width: 620px;
}
#top.area .twoColumnsSmallRight .columnTwo .tabbedblocks.spin .content,
#foot.area .twoColumnsSmallRight .columnTwo .tabbedblocks.spin .content {
  margin-left: -300px;
  width: 300px;
}
#top.area .twoColumnsSmallRight .half.twocolumn .picture,
#foot.area .twoColumnsSmallRight .half.twocolumn .picture {
  width: auto;
}
#top.area .twoColumnsSmallLeft .columnOne .tabbedblocks.spin .content,
#foot.area .twoColumnsSmallLeft .columnOne .tabbedblocks.spin .content {
  margin-left: -300px;
  width: 300px;
}
#top.area .twoColumnsSmallLeft .columnTwo .tabbedblocks.spin .content,
#foot.area .twoColumnsSmallLeft .columnTwo .tabbedblocks.spin .content {
  margin-left: -620px;
  width: 620px;
}
#top.area .twoColumnsSmallLeft .half.twocolumn .picture,
#foot.area .twoColumnsSmallLeft .half.twocolumn .picture {
  width: auto;
}
#top.area .threeColumns .tabbedblocks.spin .content,
#foot.area .threeColumns .tabbedblocks.spin .content {
  margin-left: -300px;
  width: 300px;
}
#top.area .threeColumns .colour3 .half .picture,
#foot.area .threeColumns .colour3 .half .picture {
  width: auto;
}
#top.area .threeColumnsWideLeft .columnOne .tabbedblocks.spin .content,
#foot.area .threeColumnsWideLeft .columnOne .tabbedblocks.spin .content {
  margin-left: -380px;
  width: 380px;
}
#top.area .threeColumnsWideLeft .columnTwo .tabbedblocks.spin .content,
#foot.area .threeColumnsWideLeft .columnTwo .tabbedblocks.spin .content {
  margin-left: -220px;
  width: 220px;
}
#top.area .threeColumnsWideLeft .columnThree .tabbedblocks.spin .content,
#foot.area .threeColumnsWideLeft .columnThree .tabbedblocks.spin .content {
  margin-left: -300px;
  width: 300px;
}
#top.area .threeColumnsWideLeft .columnThree .half .picture,
#foot.area .threeColumnsWideLeft .columnThree .half .picture {
  width: auto;
}
#top.area .threeColumnsWideRight .columnOne .tabbedblocks.spin .content,
#foot.area .threeColumnsWideRight .columnOne .tabbedblocks.spin .content {
  margin-left: -300px;
  width: 300px;
}
#top.area .threeColumnsWideRight .columnOne .half .picture,
#foot.area .threeColumnsWideRight .columnOne .half .picture {
  width: auto;
}
#top.area .threeColumnsWideRight .columnTwo .tabbedblocks.spin .content,
#foot.area .threeColumnsWideRight .columnTwo .tabbedblocks.spin .content {
  margin-left: -220px;
  width: 220px;
}
#top.area .threeColumnsWideRight .columnThree .tabbedblocks.spin .content,
#foot.area .threeColumnsWideRight .columnThree .tabbedblocks.spin .content {
  margin-left: -380px;
  width: 380px;
}
#main.area .oneColumn .tabbedblocks.spin .content {
  margin-left: -620px;
  width: 620px;
}
#main.area .grid .oneColumn .half.twocolumn .picture {
  width: auto;
}
#main.area .twoColumns .tabbedblocks.spin .content {
  margin-left: -300px;
  width: 300px;
}
#main.area .twoColumnsSmallLeft .columnOne .tabbedblocks.spin .content {
  margin-left: -220px;
  width: 220px;
}
#main.area .twoColumnsSmallLeft .columnTwo .tabbedblocks.spin .content {
  margin-left: -380px;
  width: 380px;
}
#main.area .twoColumnsSmallRight .columnOne .tabbedblocks.spin .content {
  margin-left: -380px;
  width: 380px;
}
#main.area .twoColumnsSmallRight .columnTwo .tabbedblocks.spin .content {
  margin-left: -220px;
  width: 220px;
}
#main.area .threeColumns .tabbedblocks.spin .content {
  margin-left: -193px;
  width: 193px;
}
#mainright.area .oneColumn .tabbedblocks.spin .content {
  margin-left: -300px;
  width: 300px;
}
.options_dropdown .options_dropdown_sleeve {
  width: 150px;
}
.mobileNav {
  display: none;
}
#footer .sleeve + .sleeve + .sleeve {
  margin-right: 0;
}
#newsletter_block .text {
  width: 74%;
}
#top .twoColumnsSmallLeft .columnOne #newsletter_block .text,
#foot .twoColumnsSmallLeft .columnOne #newsletter_block .text,
#top .twoColumnsSmallRight .columnTwo #newsletter_block .text,
#foot .twoColumnsSmallRight .columnTwo #newsletter_block .text,
#top .threeColumns .column #newsletter_block .text,
#foot .threeColumns .column #newsletter_block .text {
  width: 58%;
}
#top .threeColumnsWideLeft .columnOne #newsletter_block .text,
#foot .threeColumnsWideLeft .columnOne #newsletter_block .text,
#top .threeColumnsWideRight .columnThree #newsletter_block .text,
#foot .threeColumnsWideRight .columnThree #newsletter_block .text {
  width: 64%;
}
#top .threeColumnsWideLeft .columnTwo #newsletter_block .text,
#foot .threeColumnsWideLeft .columnTwo #newsletter_block .text,
#top .threeColumnsWideRight .columnTwo #newsletter_block .text,
#foot .threeColumnsWideRight .columnTwo #newsletter_block .text {
  width: 42%;
}
#top .threeColumnsWideLeft .columnThree #newsletter_block .text,
#foot .threeColumnsWideLeft .columnThree #newsletter_block .text,
#top .threeColumnsWideRight .columnOne #newsletter_block .text,
#foot .threeColumnsWideRight .columnOne #newsletter_block .text {
  width: 58%;
}
#main .twoColumns .column #newsletter_block .text {
  width: 58%;
}
#main .twoColumnsSmallLeft .columnOne #newsletter_block .text,
#main .twoColumnsSmallRight .columnTwo #newsletter_block .text {
  width: 42%;
}
#main .twoColumnsSmallLeft .columnTwo #newsletter_block .text,
#main .twoColumnsSmallRight .columnOne #newsletter_block .text {
  width: 64%;
}
#main .threeColumns .column #newsletter_block .text {
  width: 32%;
}
#mainright .oneColumn .column #newsletter_block .text {
  width: 58%;
}
#rightcolumn #newsletter_block .text {
  width: 58%;
}
.jobOfTheWeek .text {
  width: 157px;
}
#top .oneColumn .column .jobOfTheWeek .text,
#foot .oneColumn .column .jobOfTheWeek .text {
  width: 70%;
}
#top .twoColumns .column .jobOfTheWeek .text,
#foot .twoColumns .column .jobOfTheWeek .text {
  width: 70%;
}
#top .twoColumnsSmallLeft .columnOne .jobOfTheWeek .text,
#foot .twoColumnsSmallLeft .columnOne .jobOfTheWeek .text,
#top .twoColumnsSmallRight .columnTwo .jobOfTheWeek .text,
#foot .twoColumnsSmallRight .columnTwo .jobOfTheWeek .text,
#top .threeColumns .column .jobOfTheWeek .text,
#foot .threeColumns .column .jobOfTheWeek .text {
  width: 53%;
}
#top .twoColumnsSmallLeft .columnTwo .jobOfTheWeek .text,
#foot .twoColumnsSmallLeft .columnTwo .jobOfTheWeek .text,
#top .twoColumnsSmallRight .columnOne .jobOfTheWeek .text,
#foot .twoColumnsSmallRight .columnOne .jobOfTheWeek .text {
  width: 78%;
}
#top .threeColumnsWideLeft .columnOne .jobOfTheWeek .text,
#foot .threeColumnsWideLeft .columnOne .jobOfTheWeek .text,
#top .threeColumnsWideRight .columnThree .jobOfTheWeek .text,
#foot .threeColumnsWideRight .columnThree .jobOfTheWeek .text {
  width: 64%;
}
#top .threeColumnsWideLeft .columnTwo .jobOfTheWeek .text,
#foot .threeColumnsWideLeft .columnTwo .jobOfTheWeek .text,
#top .threeColumnsWideRight .columnTwo .jobOfTheWeek .text,
#foot .threeColumnsWideRight .columnTwo .jobOfTheWeek .text {
  width: 42%;
}
#top .threeColumnsWideLeft .columnThree .jobOfTheWeek .text,
#foot .threeColumnsWideLeft .columnThree .jobOfTheWeek .text,
#top .threeColumnsWideRight .columnOne .jobOfTheWeek .text,
#foot .threeColumnsWideRight .columnOne .jobOfTheWeek .text {
  width: 53%;
}
#main .oneColumn .jobOfTheWeek .text {
  width: 78%;
}
#main .twoColumns .column .jobOfTheWeek .text {
  width: 53%;
}
#main .twoColumnsSmallLeft .columnOne .jobOfTheWeek .text,
#main .twoColumnsSmallRight .columnTwo .jobOfTheWeek .text {
  width: 42%;
}
#main .twoColumnsSmallLeft .columnTwo .jobOfTheWeek .text,
#main .twoColumnsSmallRight .columnOne .jobOfTheWeek .text {
  width: 64%;
}
#main .threeColumns .column .jobOfTheWeek .text {
  width: 32%;
}
#mainright .oneColumn .column .jobOfTheWeek .text {
  width: 53%;
}
#rightcolumn .jobOfTheWeek .text {
  width: 53%;
}