﻿/***********************
 * SP authoring styles.
 * Indepedent of .dccw-boxu. Some degree of copy-paste - must be kept in sync. This is by design.
 * NOTE: The unusual ordering and important rules and not very specific selectors are deliberate.
 * It has to be this way because of the way SP rather crudely uses the first selector with a custom style as
 * the class in the ribbon's preview (aside: if you use descendent selectors it will mess this up).
 **********************/


/*======================
 .SP level: Authoring styles.
/*----------------------
 Anchors
 NOTE: SP does not apply a class to this element. This might cause problems with nested WPs.
 ----------------------*/
/*.ms-rtestate-field a:link,
.ms-rtestate-field a:visited {
    color: #fa4b2a !important;
}

.ms-rtestate-field a:hover {
    text-decoration: underline !important;
}*/

/*----------------------
 Paragraphs
 NOTE: SP does not apply a class to this element. This might cause problems with nested WPs.
 ----------------------*/
/* Don't like this - is needed when 'clear formatting' is used in authoring as in some cases tags around text are completely removed*/
.dccw .three-column .ms-rtestate-field {
    display: block !important;
    padding: 0 55px;
    font-family: ProximaNova, "Arial", sans-serif !important;
    font-size: 15px !important;
    line-height: 1.4em !important;
    color: black !important;
}

html[data-is-being-edited="True"] .dccw .three-column .ms-rtestate-field .ms-rtestate-field {
    padding: 0;
}

/* */
.dccw-boxu .ms-rtestate-field p,
.dccw .three-column .ms-rtestate-field p,
.dccw .guidance .intro span {
    line-height: 1.4em !important;
    font-size: 15px !important;
}

.dccw-boxu p { 
    margin-top: 1.607em;
    margin-bottom: 1.607em;
    line-height: 1.271em !important;
}

/*----------------------
 Lists
 NOTE: SP does not apply a class to this element. This might cause problems with nested WPs.
 ----------------------*/
.ms-rtestate-field ul,
.ms-rtestate-field ol  {
    margin-top: 1.25em;
    margin-bottom: 1.25em;
    padding: 0;
}


.ms-rtestate-field ul ul,
.ms-rtestate-field ol ol {
    padding-left: 0;
    margin: 0;
} 

.ms-rtestate-field ol.related-guidance-sections {
    float: left;
    margin-bottom: 10px;
}

.ms-rtestate-field ol.related-guidance-sections li a {
    display: block;
    color:#54698d;
    margin-top: 8px;
    margin-bottom: 8px;
} 

.ms-rtestate-field ul li,
.ms-rtestate-field ol li {
    line-height: 1.4em !important;
    color: black;
}

.ms-rtestate-field ul li {
    background-repeat: no-repeat;
    background-position: left 5px;
    list-style: none;
    padding-left: 36px;
}

.ms-rtestate-field > ul ul,
.ms-rtestate-field > div ul ul {
    margin-left: 36px;
}

.ms-rtestate-field > ul > li,
.ms-rtestate-field > div ul > li {
    background-image: url("/Style%20Library/ADM/Images/bullet-triangle.png");
}


.ms-rtestate-field > ul ul li,
.ms-rtestate-field > div ul ul li {
    background-image: url("/Style%20Library/ADM/Images/bullet-dot.png");
    background-position: left 7px;
}


.ms-rtestate-field > ul ul ul li,
.ms-rtestate-field > div ul ul ul li {
    background-image: url("/Style%20Library/ADM/Images/bullet-arrow.png");
}

.dccw .three-column .ms-rtestate-field p > img, 
.dccw .three-column .ms-rtestate-field span > img,
.dccw .three-column .ms-rtestate-field li img {
    margin: 0 0 20px 0 !important;
    width: 100% !important;
}

.dccw .three-column .ms-rtestate-field li img {
    margin-left: -95px !important;
}

.dccw .three-column .ms-rtestate-field ul ul li img {
    margin-left: -135px !important;
}

.dccw .three-column .ms-rtestate-field ul ul ul li img {
    margin-left: -175px !important;
}

.dccw .three-column .ms-rtestate-field ul ul ul ul li img {
    margin-left: -215px !important;
}

.dccw .three-column .ms-rtestate-field ul ul ul ul ul li img {
    margin-left: -255px !important;
}




/*----------------------
 Headings
----------------------*/
h2.dccw-authoringElement-H2 {
    -ms-name: "Carousel Heading Border Top";
    margin-top: 0;
    padding-top: 25px;
    font-size: 4em !important; /* 48px */
    line-height: 1em;
    color: white !important;
    text-transform: uppercase;
    border-top: 5px solid white;
}

h2.dccw-authoringElement-H2B {
    -ms-name: "Carousel Heading";
    font-size: 2.571em !important; /* 36px */
    color: white !important;
}

h3.dccw-authoringElement-H3 {
    -ms-name: "Heading 3";
    font-size: 2.143em !important; /* 30px */
    color: black !important;
}

h4.dccw-authoringElement-H4 {
    -ms-name: "Heading 4";
    font-size: 1.714em !important; /* 24px */
    color: black !important;
}

h5.dccw-authoringElement-H5 {
    -ms-name: "Heading 5";
    font-size: 1.286em !important; /* 18px */
    color: black !important;
}

.dccw-authoringStyle-LeftCallout {
    -ms-name: "Left Call-Out";
    float: left;
    display: block;
    position: relative;
    left: -30px;
    width: 250px;
    margin: 20px 20px 20px 0;
    padding: 10px 0;
    border-top: 2px solid red;
    border-bottom: 1px solid red;
    color: gray !important;
    font-style: italic;
}

.dccw-authoringStyle-RightCallout {
    -ms-name: "Right Call-Out";
    float: right;
    display: block;
    position: relative;
    left: 30px;
    width: 250px;
    margin: 20px 0 20px 20px;
    padding: 10px 0;
    border-top: 2px solid red;
    border-bottom: 1px solid red;
    color: gray !important;
    font-style: italic;
}

.dccw .sites-and-buildings .guidance .dccw-authoringStyle-LeftCallout,
.dccw .sites-and-buildings .guidance .dccw-authoringStyle-RightCallout {
    border-color: #F69E91;
}

.dccw .streets-and-parks .guidance .dccw-authoringStyle-LeftCallout,
.dccw .streets-and-parks .guidance .dccw-authoringStyle-RightCallout {
    border-color: #9FD199;
}

.dccw .design-subjects .guidance .dccw-authoringStyle-LeftCallout,
.dccw .design-subjects .guidance .dccw-authoringStyle-RightCallout {
    border-color:  #BCAAB5;
}

.dccw .regulations .guidance .dccw-authoringStyle-LeftCallout,
.dccw .regulations .guidance .dccw-authoringStyle-RightCallout {
    border-color: #79BAD6;
}

.dccw .resources .guidance .dccw-authoringStyle-LeftCallout,
.dccw .resources .guidance .dccw-authoringStyle-RightCallout {
    border-color: #A5BCCD;
}

.dccw .about-the-adm .guidance .dccw-authoringStyle-LeftCallout,
.dccw .about-the-adm .guidance .dccw-authoringStyle-RightCallout {
    border-color: #A5BCCD;
}

.dccw .three-column .editable,
.dccw-boxu.better-design-practice .editable {
    padding: 0;
}


/*----------------------
 Other custom styles
 ----------------------*/
.dccw-authoringStyle-Body {
    -ms-name: "Body Text";
    color: black !important;
}

/* Colours */
.dccw-authoringForeColor-1 {
    color: darkred;
    -ms-name: "";
    -ms-color: "Dark Red";
}

.dccw-authoringForeColor-2 {
    color: red;
    -ms-name: "";
    -ms-color: "Red";
}

.dccw-authoringForeColor-3 {
    color: orange;
    -ms-name: "";
    -ms-color: "Gold";
}

.dccw-authoringForeColor-4 {
    color: yellow;
    -ms-name: "";
    -ms-color: "Yellow";
}

.dccw-authoringForeColor-5 {
    color: lightgreen;
    -ms-name: "";
    -ms-color: "Light Green";
}

.dccw-authoringForeColor-6 {
    color: green;
    -ms-name: "";
    -ms-color: "Dark Green";
}

.dccw-authoringForeColor-7 {
    color: lightblue;
    -ms-name: "";
    -ms-color: "Sky Blue";
}

.dccw-authoringForeColor-8 {
    color: blue;
    -ms-name: "";
    -ms-color: "Blue";
}

.dccw-authoringForeColor-9 {
    color: darkblue;
    -ms-name: "";
    -ms-color: "Dark Blue";
}

.dccw-authoringForeColor-10 {
    color: purple;
    -ms-name: "";
    -ms-color: "Dark Purple";
}

.dccw-authoringBackColor-1 {
    background-color: darkred;
    -ms-name: "";
    -ms-color: "Dark Red";
}

.dccw-authoringBackColor-2 {
    background-color: red;
    -ms-name: "";
    -ms-color: "Red";
}

.dccw-authoringBackColor-3 {
    background-color: orange;
    -ms-name: "";
    -ms-color: "Gold";
}

.dccw-authoringBackColor-4 {
    background-color: yellow;
    -ms-name: "";
    -ms-color: "Yellow";
}

.dccw-authoringBackColor-5 {
    background-color: lightgreen;
    -ms-name: "";
    -ms-color: "Light Green";
}

.dccw-authoringBackColor-6 {
    background-color: green;
    -ms-name: "";
    -ms-color: "Dark Green";
}

.dccw-authoringBackColor-7 {
    background-color: lightblue;
    -ms-name: "";
    -ms-color: "Sky Blue";
}

.dccw-authoringBackColor-8 {
    background-color: blue;
    -ms-name: "";
    -ms-color: "Blue";
}

.dccw-authoringBackColor-9 {
    background-color: darkblue;
    -ms-name: "";
    -ms-color: "Dark Blue";
}

.dccw-authoringBackColor-10 {
    background-color: purple;
    -ms-name: "";
    -ms-color: "Dark Purple";
}

/* Fonts */
.dccw-authoringFontFace-1 {
    -ms-name: "Tahoma";
    font-family: tahoma;
}

.dccw-authoringFontFace-2 {
    -ms-name: "Courier";
    font-family: courier,monospace;
}

.dccw-authoringFontFace-3 {
    -ms-name: "Times New Roman";
    font-family: "Times New Roman",Times,serif;
}

.dccw-authoringFontFace-4 {
    -ms-name: "Comic Sans";
    font-family: "Comic Sans","Comic Sans MS",cursive;
}

.dccw-authoringFontFace-5 {
    -ms-name: "Calibri";
    font-family: Calibri;
}

.dccw-authoringFontFace-6 {
    -ms-name: "Georgia";
    font-family: Georgia;
}

.dccw-authoringFontFace-7 {
    -ms-name: "Impact";
    font-family: Impact;
}

.dccw-authoringFontFace-8 {
    -ms-name: "Trebuchet MS";
    font-family: "Trebuchet MS",helvetica;
}

.dccw-authoringFontFace-9 {
    -ms-name: "Palatino Linotype";
    font-family: "Palatino Linotype",Palatino,serif;
}

.dccw-authoringFontFace-10 {
    -ms-name: "Lucida Console";
    font-family: "Lucida Console",monaco,sans-serif;
}

.dccw-authoringFontFace-11 {
    -ms-name: "Garamond";
    font-family: garamond;
}

.dccw-authoringFontFace-12 {
    -ms-name: "Segoe UI";
    font-family: "Segoe UI",Tahoma;
}

/* Font Sizes */
.dccw-authoringFontSize-1 {
    font-size: 9pt;
}

.dccw-authoringFontSize-2 {
    font-size: 11pt;
}

.dccw-authoringFontSize-3 {
    font-size: 13pt;
}

.dccw-authoringFontSize-4 {
    font-size: 18pt;
}

.dccw-authoringFontSize-5 {
    font-size: 24pt;
}

.dccw-authoringFontSize-6 {
    font-size: 36pt;
}

.dccw-authoringFontSize-7 {
    font-size: 48pt;
}

.dccw-authoringFontSize-8 {
    font-size: 72pt;
}



/*----------------------
 Images
 ----------------------*/
img.dccw-authoringPosition-0 {
    -ms-name: "Full";
    width: 100% !important;
    margin: 20px 0 !important;
}

/*.dccw .three-column img.dccw-authoringPosition-0 {
    width: 714px !important;
    margin-left: -80px !important;
}*/

/*----------------------
 Shared styles for most of the above
----------------------*/
h3.dccw-authoringElement-H3, 
h4.dccw-authoringElement-H4, 
h5.dccw-authoringElement-H5 {
    margin-top: 1em;
    margin-bottom: 0.5em;
    line-height: 1.1; /* This is the IE8 default */
    font-family: ProximaNova, Tahoma, Arial, sans-serif !important;
    font-weight: 600;
}


.dccw-boxu.wrapper.header-carousel .rich-text-container h3.dccw-authoringElement-H3,
.dccw-boxu.wrapper.header-carousel .rich-text-container h4.dccw-authoringElement-H4,
.dccw-boxu.wrapper.header-carousel .rich-text-container h5.dccw-authoringElement-H5,
.dccw-boxu.wrapper.header-carousel .rich-text-container .dccw-authoringStyle-Body
.dccw-boxu.wrapper.header-carousel .rich-text-container .dccw-authoringElement-Body {
    color: white !important;
}




/*======================
 .SP level: Ribbon customisation
======================*/
#Ribbon\.EditingTools\.CPInsert\.Tables,
#Ribbon\.EditingTools\.CPInsert\.Embed,
#Ribbon\.EditingTools\.CPInsert\.Content,
#Ribbon\.EditingTools\.CPInsert\.Media\.Media-Large,
#Ribbon\.EditingTools\.CPInsert\.Media\.Media-Medium,
#Ribbon\.EditingTools\.CPInsert\.Media\.Media-Small,
#Ribbon\.EditingTools\.CPInsert\.WebParts\.ExistingList-Large,
#Ribbon\.EditingTools\.CPEditTab\.Markup-LargeMedium-0,
#Ribbon\.Image\.Image\.Styles,
#Ribbon\.Image\.Image\.Space,
#Ribbon\.Table\.Layout\.Properties,
#Ribbon\.Table\.Layout\.Summary,
#Ribbon\.Table\.Design\.StyleOptions-MediumMedium-1,
#Ribbon\.Table\.Design\.StyleOptions-MediumMedium-0-1,
#Ribbon\.Image\.Image\.Size {
    display: none;   
}
