/* start reset browser default styling */
html, body,
    div, h1, h2, h3, p, pre, blockquote, ul, ol, li, address,
    dl, dt, dd,
    td, th, tfoot,
    form, fieldset, label, select, input, legend, textarea {
    margin: 0;
    padding: 0;
    font-family: "Times New Roman", Times, serif;
}

br {
    letter-spacing: 0;
}

fieldset, img, table {
    border: 0;
}

ul {
    list-style: none;
}

body {
    font-size: 62.5%;
}

/* end reset browser default styling */

/* start invisible */
div.enclosing {
    clear: both;
}

p, img, object, div.popupLayer {
    cursor: auto;
}

a img {
    cursor: pointer;
}

a.anchor {
/* invisible anchor for correct placement of the section */
    display: block;
    position: relative;
    float: left;
    top: -15em;
    left: -10.5em;
    height: 1em;
    width: 1px;
}

a.fixedAnchor {
/* invisible anchor for correct placement of image anchors */
    display: block;
    position: relative;
    top: -15em;
    width: 0;
    height: 0;
}

:-moz-any-link:focus {
/** hides the marking frame that appears on links in ff **/
    outline: none;
}

/* end invisible */

/* start navigation */
div.nav {
    position: fixed;
    top: 0; /** Fix to center navigation initially **/
    left: 50%;
    width: 840px;
    margin-left: -420px; /** End **/
    text-align: center;
    margin-top: 10px;
    z-index: 3;
}

div.nav img {
    margin-bottom: 32px;
    clear: both;
}

div.nav ul.mainNav,
    div.nav ul.secondNav {
    width: 100%;
    margin: auto;
    overflow: visible;
    text-align: center;
    line-height: 1.6;
}

div.nav ul.mainNav {
    position: relative;
}

div.nav ul.secondNav {
    position: absolute;
    top: 22px;
    left: 0;
    visibility: hidden;
    display: inline;
    line-height: 1.9;
}

div.nav ul.mainNav {
    background: url(../images/bgNav.png) repeat-x left -2px;
    height: 22px;
    width: 100.00%;
}

div.nav ul.mainNav li,
    div.nav ul.secondNav li {
    float: left;
    background: url(../images/bgNav.png) repeat-x left -2px;
    height: 22px;
    width: 20%;
    text-transform: uppercase;
}

div.nav ul.mainNav li a,
    div.nav ul.secondNav li a {
    font-size: 14px;
}

div.nav ul.secondNav li {
    background: url(../images/bgNav.png) repeat-x top left;
    height: 24px;
}

div.nav ul.mainNav li.first,
    div.nav ul.secondNav li.first {
    height: 22px;
}

div.nav ul.spaces li {
    width: 16.6%;
}

ul.mainNav li.current {
    text-decoration: none;
}

/**div.nav ul.mainNav li:hover ul.secondNav{
visibility:visible;
}**/
div.nav ul li a {
    color: #757679;
    text-decoration: none;
    height: 25px; /*Do not effect height - inline element*/
    letter-spacing: 0.5px;
}

div.nav ul li.loadMenuItem {
    color: #f1f2f2;
    letter-spacing: 0.5px;
    font-size: 12px;
}

div.nav ul.mainNav li a:hover,
    div.nav ul.secondNav li a:hover {
    font-weight: bold;
}

div.nav ul.topNav {
    float: right;
    margin-bottom: 20px;
}

div.nav ul.topNav li {
    float: left;
    font-size: 1.2em;
    font-style: italic;
    font-weight: bold;
    margin-left: 13px;
}

/**top left navigation**/
div.nav ul.first {
    float: left;
}

div.nav ul.first a {
    display: none;
}

div.nav ul.first li {
    margin-left: 0;
}

/**end top left navigation**/

ul.topNav li.current a {
    text-decoration: underline;
}

/* end navigation */

/* start framework */
div.container {
    width: 601em; /*ONLY FOR ARKET*/
    font: 1em;
}

/* The total width of  the div.section is: 80 + 11.2 + 11.2 =  102.4
   If we move the container Div to the center of the body (no width set on body)
   and then set a negativ left margin to 102.4/2=51.2 the first section will be
   positioned in the center of the window. */
#start div.container {
    background-color: white;
    left: 50%;
    position: relative;
    margin-left: -51.2em;
}

div.section {
    width: 80em;
    float: left;
    padding-top: 15em;
    padding-right: 11.2em;
    padding-left: 11.2em;
    padding-bottom: 4em;
}

div.first.section {
    padding-left: 44em;
}

div.last.section {
    padding-right: 44em;
}

div.module {
    width: 100%;
    text-align: center;
    position: relative;
}

.regular div.module,
    .spaces div.module {
    margin-bottom: 1.9em;
}

.mag div.module {
/**  text-align: center; NOT USED??**/
}

div.twoCol /** div.threeColNOT USED??**/
{
    float: left;
    text-align: center;
    width: 35em;
}

/**collections (Men, Women, Looks)**/
div.threeCol {
/**   width: 25em; NOT USED??**/
}

div.threeCol p {
/**  text-align: center;  NOT USED??**/
/**  width: auto;         NOT USED??**/
/**   letter-spacing: 0;   NOT USED??**/
}

div.twoCol.left {
    margin: 0 1em 0 3.5em;
}

div.twoCol.right {
    margin: 0 0 0 1em;
}

div.threeCol.left {
/**  margin: 0 2em 0 5px;     NOT USED??**/
}

div.threeCol.right {
/**  margin: 0 5px 0 2em;     NOT USED??**/
}

div.webMatch {
    margin-bottom: 4.4em;
}

div.blogEntry {
    margin-bottom: 4.4em;
}


/**fix to make the margin between archive link and non-floated elements**/
.campaignMarginBottom {
    height: 1px;
}

#homeSection table, #thingsSection table, #magazineSection table, #spacesSection table {
    margin-left: auto;
    margin-right: auto;
}

#thingsSection table td {
    font-size: 0px;
    text-align: center;
    padding-left: 8px;
    padding-right: 8px;
}

/* end framework */

/* start paragraphs */
p,
    span,
    fieldset.terms label {
    font-size: 13px;
    margin-bottom: 15px;
    line-height: 1.5;
    letter-spacing: 1px;
}

.mag p /**.mag h3 NOT USED**/
{
    width: 600px;
    margin: 0 auto 15px auto;
    text-align: justify; /**  letter-spacing: 1px; ALREADY IN CSS FOR p**/
}

.mag h3 {
/**  font-size: 1.2em;  NOT USED**/
/**  font-weight: normal;     NOT USED**/
/**  text-decoration: underline;  NOT USED**/
/**  margin-bottom: 0;  NOT USED**/
}

div. p.Column {
/**    float: left;    NOT USED??**/
/**    width: 39em;     NOT USED??**/
/**    line-height: 1.5;   NOT USED??**/
/**    margin-left: 2em;    NOT USED??**/
/**    text-align: justify;  NOT USED??**/
}

div. p.Column.first {
/**    margin-left: 0;   NOT USED??**/
}

div.module p.ingress {
/**  text-align: center;   MOVED TO .mag div.module p.ingress**/
/**   text-transform: uppercase;  MOVED TO .mag div.module p.ingress**/
}

.regular p.ingress {
/** width: 50em; NOT USED?? ingress only on magazine??**/
/**   margin: 0 auto 1.5em auto;  NOT USED?? ingress only on magazine??**/
}

.mag div.module p.ingress {
    font-size: 1.5em;
    line-height: 20px;
    margin-bottom: 25px;
    text-align: center;
    text-transform: uppercase;
}

div.module p.imageText {
    text-transform: uppercase;
}

.mag div.module p.imageText,
    .regular div.module p.imageText {
/**   font-size: 400px;           NOT USED??**/
/**   text-align: center;       NOT USED??**/
/**   text-transform: none;     NOT USED??**/
}

div.threeCol p {
/**     font-size: 1.1em;  NOT USED??**/
/**    margin: 5px 0 2.5em 0;  NOT USED??**/
}

p.items {
    font-size: 1.5em;
    line-height: 2em;
    margin: 4px 4em 5px 4em;
}

div.module p.items {
    margin: 4px 4px 5px 4px;
}

#thingsSection p {
/**margin-bottom:15px; ALREADY IN MAIN.CSS for p**/
}

/* end paragraphs */

/* start links */
div.links {
    clear: both; /* margin-bottom: 4.4em;*/
}

div.twoCol.left div.links,
    div.twoCol.right div.links {
    margin-bottom: 4.4em;
}

#spacesSection div.links, #thingsSection div.links {
    margin-top: 15px;
}

.mag div.module div.links {
/**  margin: 1.5em 0 4.4em 0; NOT USED**/
}

a {
    color: #000;
    font-size: 12px;
    text-decoration: none;
}

div.links a,
    div.links span,
    a.readMore,
    p.toTopLink a, p.archiveLink a {
    font-size: 1em;
    text-transform: uppercase;
    letter-spacing: 1px;
    border-bottom: 1px solid #757679;
    cursor: pointer;

}

.mapLink {
    font-size:1em;
}

span.second {
    margin: 0 0 0 15px;
}

div.links a.bracketed {
    border-bottom: 0;
}

a.second {
    margin-left: 1em;
}

a.readMore {
    float: right;
    display: block;
    margin-bottom: 2em;
    position: relative;
    z-index: 5;
    margin-top: 15px;
    font-size:10px;
}

/* end links */

/* start headlines */
h1, h2 {
    font: 2.4em "Times New Roman", Times, serif;
    font-weight: normal;
    text-transform: uppercase;
    text-align: center;
    padding: 50px 0 23px 0;
    margin: 0 auto;
}

h2 {
    padding-top: 0;
}

div.section div.module h1 img, div.section div.module h2 img {
    margin: 0;
    padding: 0;
}

div.section div.module h1 {
    padding-top: 49px;
    padding-bottom: 30px;
}

div.section div.module h2 {
    padding-top: 11px;
    padding-bottom: 30px;
}

.spaces .module h2 {
/** font: 1.2em "Times New Roman", Times, serif; CHANGED TO SAME AS FOR H1**/
/** font-weight: bold;    CHANGED TO SAME AS FOR H1**/
/** padding: 0;           CHANGED TO SAME AS FOR H1**/
/** margin-bottom: 1.5em;    CHANGED TO SAME AS FOR H1**/
}

/* end headlines */

/* start images */
div.section img, .regular div.module img {
    margin-bottom: 1.5em;
}

div.section img.withImgtext {
    margin: 0 0 1.1em 0;
}

#thingsSection table img {
    margin-bottom: 15px;
}

/* end images */

/* start popup layers */
div.popupLayer {
    width: 80em;
    height: 48em;
    background-color: #f1f2f2;
    opacity: 0.97;
    filter: alpha(opacity = 97); /*ie*/
    z-index: 10;
    position: fixed;
    margin-top: 3em;
    left: 50%;
    margin-left: -40em;
}

div.popupLayer div.module {
    float: left;
    width: 16em;
    margin-right: 1em;
    margin-left: 1em;
}

div.popupLayer div.first {
    margin-left: 0.5em;
    margin-right: 0.5em;
}

div.popupLayer div.module img {
    margin-bottom: 1em;
    width: 150px;
}

div.popupLayer h1 {
    padding: 30px 0 20px 0;
}

div.popupLayer ul {
    font-size: 1em;
    text-transform: uppercase;
    text-align: left;
    letter-spacing: 1px;
    line-height: 1.5;
    margin-right: 2em;
}

div.popupLayer h2 {
    font: 1.5em "Times New Roman", Times, serif;
    padding: 0;
    margin-bottom: 1.5em;
    text-align: left;
    border-bottom: 1px solid #000;
}

div.close {
    position: absolute;
    top: 1.2em;
    right: 1.2em;
    background: url(../images/close.gif) no-repeat top left;
    width: 1.2em;
    height: 1.2em;
    cursor: pointer;
}

/* subscribe */
div.popupLayer p {
    text-align: center; /*    width: 680px; */
}

div.popupLayer fieldset {
    float: left;
    display: inline;
    margin-left: 2em;
    width: 37.5em;
    padding: 0;
    margin: 0;
}

div.popupLayer fieldset.first {
    margin: 0 2em 0 2.5em;
    width: 36em;
}

div.popupLayer fieldset label,
    div.popupLayer fieldset h3 {
    float: left;
    display: inline;
    width: 170px;
    padding: 0;
    margin: 4px 0 0 0;
    clear: left;
    font-size: 1.5em;
    text-transform: uppercase;
    font-weight: normal;
}

select {
    border: 0;
    font-size: 15px;
    text-transform: uppercase;
}

div.popupLayer fieldset.first label,
    div.popupLayer fieldset h3 {
    width: 150px;
}

div.popupLayer fieldset input,
    div.popupLayer fieldset select {
    float: left;
    display: inline;
    width: 196px;
    border: 0;
    padding: 2px;
    margin: 0 0 10px 0;
    height: 18px;
}

div.popupLayer fieldset select {
    padding: 0;
    height: 22px;
    width: 200px;
}

div.subscribe fieldset input.noLabel {
    clear: both;
    margin-left: 150px;
}

input.radio,
    input.checkbox,
    div.popupLayer fieldset input.checkbox,
    div.popupLayer fieldset input.radio {
    width: 20px;
    height: 20px;
}

div.popupLayer fieldset.gender {
    width: 346px;
    padding: 0;
    margin: 0 2em 10px 2.5em;
}

div.popupLayer fieldset.gender label,
    div.popupLayer fieldset.terms label {
    clear: none;
    margin-right: 3px;
    text-align: right;
}

div.popupLayer fieldset.gender label {
    width: 18%;
}

div.popupLayer fieldset.gender label.second {
    width: 21%;
}

div.subscribe p {
    width: 680px;
    margin: 0 auto 20px auto;
}

div.subscribe h2 {
    border-bottom: 0;
    text-align: center;
}

div.subscribe fieldset.terms {
    clear: both;
    margin-left: 170px;
    width: 500px;
}

div.subscribe fieldset.terms label,
    div.subscribe fieldset.terms span {
    text-transform: none;
    font-size: 13px;
    width: auto;
    white-space: nowrap;
}

div.subscribe fieldset.terms a {
    font-size: 13px;
    margin-left: 2px;
    text-decoration: underline;
}

div.subscribe fieldset.terms .checkbox,
    div.subscribe fieldset.terms .checkboxChecked {
    margin-top: 3px;
}

div.subscribe fieldset input.error {
    border: 1px solid #cc0000;
}

div.subscribe fieldset div.error label,
    div.subscribe fieldset div.error a {
    color: #cc0000;
}

div.about p {
    text-align: justify;
}

div.popupLayer a.button {
    display: block;
    text-align: center;
    text-transform: uppercase;
    text-decoration: underline;
    margin-top: 15px;
}

fieldset.terms span {
    line-height: 2.2;
}

div.small {
/* smaller popup layer */
    width: 500px;
    height: 400px;
}

#subscribePrivacyPolicyPopup {
    left: 0;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
    margin-top: 0;
    position: absolute;
    top: 0;
    z-index: 200;
}

div.small h1 {
    padding: 60px 0 40px;
}

div.small div.links {
    margin: 0 auto 0 auto;
    text-align: center;
}

div.small div.links a {
    font-size: 15px;
}

div.small fieldset {
    margin: 20px 0;
}

div.small textarea {
    border: 0;
    width: 196px;
    height: 50px;
    padding: 2px;
    overflow: hidden;
}

div.small ul {
    width: 325px;
    margin: 0 auto 0 auto;
    font-size: 1.5em;
}

div.small ul li {
    float: left;
    width: 140px;
    padding: 6px 0 0 22px;
}

div.small ul li.reddit {
    background: url(../images/logosShare.gif) no-repeat top left;
}

div.small ul li.facebook {
    background: url(../images/logosShare.gif) no-repeat left -24px;
}

div.small ul li.delicious {
    background: url(../images/logosShare.gif) no-repeat left -49px;
}

div.small ul li.friendfeed {
    background: url(../images/logosShare.gif) no-repeat left -76px;
}

div.small ul li.digg {
    background: url(../images/logosShare.gif) no-repeat left -102px;
}

div.small ul li.myspace {
    background: url(../images/logosShare.gif) no-repeat left -126px;
}

div.small ul li.stumbleupon {
    background: url(../images/logosShare.gif) no-repeat left -151px;
}

div.small ul li.magnolia {
    background: url(../images/logosShare.gif) no-repeat left -177px;
}

div.small h2 {
    width: auto;
    border-bottom: 0;
    text-transform: none;
    margin: 20px 0 10px 0;
    letter-spacing: 1px;
}

/* end popup layers */
/* start hiding inputs and showing background images instead */
div.radio,
    div.radioChecked,
    div.checkbox,
    div.checkboxChecked {
    float: left;
    width: 22px;
    height: 22px;
    background: transparent url(../images/bgCheckRadio.gif) no-repeat top left;
    opacity: 1.0;
    filter: alpha(opacity = 100); /*ie*/
    padding: 0;
    margin: 0 5px 0 0;
    cursor: pointer;
}

div.radioChecked,
    div.checkboxChecked {
    background: transparent url(../images/bgCheckRadio.gif) no-repeat -22px top;
    opacity: 1.0;
    filter: alpha(opacity = 100); /*ie*/
}

div.radio input,
    div.radioChecked input,
    div.checkbox input,
    div.checkboxChecked input {
/* also see ie6.css & ie7.css */
    opacity: .0;
    filter: alpha(opacity = 0); /*ie*/
    margin: 0;
    height: 22px;
    width: 22px;
}

/* end hiding inputs and showing background images instead */
span.uppercase,
    div.submodule span.uppercase /* press login */
{
    text-transform: uppercase;
    margin: 0;
}

/* storelocator styling */
#storesPopup {
    height: 480px; /**Needed for IE although already in main.css through popupLayer in em sizes**/
    width: 800px; /**Needed for IE although already in main.css through popupLayer in em sizes**/
}

#storelocatorpanel h1 {
    padding: 60px 0 80px 0;
}

#storelocatorpanel ul.store li.current,
    #storelocatorpanel ul.country li.current {
    text-decoration: underline;
}

#storelocatorpanel div.column {
    float: left;
    display: inline;
    margin-right: 2em;
}

#storelocatorpanel #countryCol {
    width: 20%;
    margin-left: 2em;
}

#storelocatorpanel #storeCol {
    width: 30%;
}

#storelocatorpanel #detailsCol {
    width: 40%;
}

#storelocatorpanel ul.details li {
    margin-bottom: 1em;
}

#subscribePopup {
/**   height: 480px; ALREADY IN MAIN.CSS THROUGH popupLayer in em sizes**/
/**    width: 800px;     ALREADY IN MAIN.CSS THROUGH popupLayer in em sizes**/

}

/* Blog styling */

.cmnodelink {
    text-decoration: underline
}

/* View the look styling */

div.viewTheLook h1 {
    padding: 60px 0 80px 0;
}

/* Image viewer */
.viewTheLook table {
    width: 100%;
}

.viewTheLookViewer td.previous,
    .viewTheLookViewer td.next {
    text-align: left;
    width: 30px;
}

.viewTheLookViewer td.previous img,
    .viewTheLookViewer td.next img {
    margin-bottom: 1em;
}

div.priceModule p.items {
    margin: 0;
}

/* start drop down*/

.dropDown {
    float: left; /*MOVED FROM PRESS.CSS and CAREERS.CSS*/
    height: 18px;
    background-color: #ffffff;
    margin: 0 0 14px 170px;
    padding: 2px;
    width: 196px;
    position: relative;
    white-space: nowrap;
}

div.popupLayer .dropDown {
    float: none; /*MOVED FROM PRESS.CSS and CAREERS.CSS*/
}

.dropDownList {
    margin: 3px -2px 0;
    background-color: #fff;
    height: 260px;
    width: 200px;
    overflow: hidden;
    overflow-x: hidden;
}

.dropDownList a {
    display: block;
    font-size: 15px;
    text-transform: uppercase;
    color: #000000; /*Moved from common.css*/
    margin-top: 0; /*Move from common.css*/
    text-align: left; /*Move from common.css*/
    text-decoration: none; /*Move from common.css*/
    margin-left: 0; /*Move from common.css*/
}

.dropDownSelectLinkImage {
    float: right;
    margin: -18px 2px 0 0;
}

.dropDownSelectLinkText {
    overflow: hidden;
    width: 175px;
}

.dropDownItemSelected {
    background-color: #cccccc;
    width: 100%; /*MOVED FROM COMMON.CSS*/
}

div.dropDownSelectLinkText a {
    font-size: 15px;
    text-transform: uppercase;
    color: #000000; /** MOVED FROM COMMON.CSS**/
    text-decoration: none; /**    MOVED FROM COMMON.CSS**/
    margin-top: 0; /**  MOVED FROM COMMON.CSS**/
    text-align: left; /**   MOVED FROM COMMON.CSS**/
    margin-left: 0; /**  MOVED FROM COMMON.CSS**/
}

div.popupLayer .dropDownListScroll {
    background-color: #fff;
    height: 240px;
    width: 24px;
    float: left;
    padding-top: 10px;
    padding-bottom: 10px;
    position: relative;
}

div.popupLayer .dropDownListScrollTrack {
    height: 240px;
    width: 1px;
    background-color: #757679;
    position: absolute;
    z-index: 0;
    left: 12px;
}

div.popupLayer .dropDownListScrollHandle {
    width: 7px;
    height: 20px;
    background-color: #757679;
    position: absolute;
    z-index: 10;
    left: 9px;

}

div.popupLayer .dropDownListContent {
    background-color: #fff;
    height: 260px;
    width: 176px;
    float: left;
    overflow: hidden;
}

/*end drop down*/

/*start back-to-top-link and archive links*/
p.toTopLink,
    #magazineSection p.archiveLink,
    #fashionSection p.archiveLink,
    #thingsSection p.archiveLink {
    position: relative;
    text-align: center;
}

#magazineSection p.archiveLink {
    margin-top: 70px;
    margin-bottom: 85px;
}

#fashionSection p.archiveLink {
    margin-top: 20px;
    margin-bottom: 50px;
}

#thingsSection p.archiveLink {
    margin-top: 70px;
    margin-bottom: 100px;
}

/*end archive links*/
.adminReadMoreSeparator {
    display:none;
}

/*Makes sure the error message is centered even when it is reached from the start page*/
.error {
    left: 0;
    margin-left:auto;
}

.errorPageLogo{
    margin-top: 40px;
}

.clear:after {
    content: ".";
    height: 0;
    visibility: hidden;
    display: block;
    clear: both;
}

