/*****bootstrap overrides***********/
:root {
	--CoB-blue: #0056ac;
	--CoB-Dark-Blue: #003c78;
	--CoB-Darkest-Blue: #00070f;
	--CoB-Blue-Semitransparent: rgb(0 68 136 / 79%);
	--CoB-Dark-Blue-Semitransparent: rgb(0 22 46 / 79%);
	--CoB-text-color: #000;
	--CoB-textLink-color: #36c;
	--CoB-linear-background: linear-gradient(0deg, rgb(0 22 46 / 86%) 30%, rgba(0,22,46,0) 100%);
		--bs-blue: #0056ac;
		--bs-indigo: #6610f2;
		--bs-purple: #6f42c1;
		--bs-pink: #d63384;
		--bs-red: #dc3545;
		--bs-orange: #fd7e14;
		--bs-yellow: #ffc107;
		--bs-green: #198754;
		--bs-teal: #20c997;
		--bs-cyan: #0dcaf0;
		--bs-black: #000;
		--bs-white: #fff;
		--bs-gray: #6c757d;
		--bs-gray-dark: #343a40;
		--bs-gray-100: #f8f9fa;
		--bs-gray-200: #e9ecef;
		--bs-gray-300: #dee2e6;
		--bs-gray-400: #ced4da;
		--bs-gray-500: #adb5bd;
		--bs-gray-600: #6c757d;
		--bs-gray-700: #495057;
		--bs-gray-800: #343a40;
		--bs-gray-900: #212529;
		--bs-primary: #0d6efd;
		--bs-secondary: #6c757d;
		--bs-success: #198754;
		--bs-info: #0dcaf0;
		--bs-warning: #ffc107;
		--bs-danger: #c00000;
		--bs-light: #f8f9fa;
		--bs-dark: #212529;
		--bs-primary-rgb: 13, 110, 253;
		--bs-secondary-rgb: 108, 117, 125;
		--bs-success-rgb: 25, 135, 84;
		--bs-info-rgb: 13, 202, 240;
		--bs-warning-rgb: 255, 193, 7;
		--bs-danger-rgb: 220, 53, 69;
		--bs-light-rgb: 248, 249, 250;
		--bs-dark-rgb: 33, 37, 41;
		--bs-white-rgb: 255, 255, 255;
		--bs-black-rgb: 0, 0, 0;
		--bs-body-color-rgb: 33, 37, 41;
		--bs-body-bg-rgb: 255, 255, 255;
  }
 .sr-only{ position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border-width: 0;
}
  #pageLayout  a:not(.btn){color:var(--CoB-textLink-color);}
  #pageLayout  a:not(.btn):hover{color:var(--CoB-text-color)}
  #pageLayout .alert a{color:var(--CoB-text-color)}
  
  #pageLayout  h1,
  #pageLayout  h2,
  #pageLayout  h3,
  #pageLayout  h4{
	  color:var(--CoB-text-color)
  }

  #pageLayout .btn-primary {
	   background-color: var(--CoB-blue);
	   color: #fff;
	   font-size: inherit;
	 }
  #pageLayout .ms-rtestate-field .btn{
   border-radius:30px
  }
  #pageLayout .btn-primary:hover{
	  background-color: var(--CoB-Dark-Blue);
  }

#SystemMaster *,
#SystemMaster *::before,
#SystemMaster *::after {
  box-sizing: content-box;
}
#SystemMaster #pageTitle a,
#SystemMaster #DeltaPlaceHolderMain a{
 text-decoration:none
}
#SystemMaster #pageTitle a:hover,
#SystemMaster #DeltaPlaceHolderMain a:hover{
 text-decoration:underline
}

/****Ribbon overrides****/
#O365_MainLink_Help,
#RibbonContainer-TabRowRight,
#O365_SubLink_SuiteMenu_ctl00_SiteActionsMenuMainData_ctl00_wsaDesignEditor,
#O365_SubLink_SuiteMenu_zz2_ID_PersonalInformation,
#O365_SubLink_SuiteMenu_zz4_ID_PersonalizePage,
#O365_SubLink_SuiteMenu_zz2_ID_PersonalInformation,
#O365_SubLink_SuiteMenu_ctl00_SiteActionsMenuMainData_ctl00_MenuItem_EditPage,
#O365_SubLink_SuiteMenu_zz6_MenuItem_ShareThisSite,
#O365_SubLink_SuiteMenu_ctl00_ctl50_SiteActionsMenuMainData_ctl00_wsaDesignEditor{display:none!important}

/************************Rich Text Editor (HTML Editor, Content Editor)*************************/
/*sample HTML markup dropdown**** add tag name in front of .ms-rte...****/
/*div.ms-rteElement-MyNormal{  -ms-name: "My Normal";  font-size: 12px;  color: #5a5a5a !important;  font-weight: normal;}*/
#pageTitle,
.ms-core-pageTitle,.ms-core-pageTitle a,
.ms-rtestate-field h1,
.ms-rtestate-field h2,
h2.ms-rteElement-H2,
h1, h2, h3, h4, h5, h6, 
.h1, .h2, .h3, .h4, .h5, .h6,
.ms-h1,.ms-h2,.ms-h3,.ms-h4,.ms-h5,.ms-h6,.ms-headerFont,
.ms-WPBody h1, .ms-WPBody h2, .ms-WPBody h3, .ms-WPBody h4, .ms-WPBody h5, .ms-WPBody h6 {
	font-family:"Segoe UI","Segoe","Open Sans",Tahoma,Helvetica,Arial,sans-serif;
    line-height: 1.25;
}

#pageTitle,
.ms-core-pageTitle,    
h1,.h1,.ms-h1{
  font-size:230%; 
}

h2,.h2,.ms-h2,.ms-rtestate-field h2,
h2.ms-rteElement-H2, h2.ms-webpart-titleText{
  font-size: 170%;
  color:var(--CoB-text-color);
  /* margin-top: 0; */
  /* margin-bottom: 0.5rem; */
  font-weight: 500;
}

h3,.h3,.ms-h3,.ms-WPBody h3,.ms-rtestate-field h3,
h3.ms-rteElement-H3
{
  font-size: 140%;
  color:var(--CoB-text-color);
  margin-top: 0;
  margin-bottom: 0.5rem;
  font-weight: 500;
}
.ms-formlabel .ms-h3{
	font-size:100%
}
h4,.h4,.ms-h4,.ms-WPBody h4,.ms-rtestate-field h4,
h4.ms-rteElement-H4{
  font-size: 115%;
  margin-top:20px;
  color:var(--CoB-text-color);
  margin-bottom: 0.5rem;
  font-weight: 500;
}
h5,h6,.h5,.h6,.ms-h5,.ms-rtestate-field h5,
.ms-h6,.ms-WPBody h5,.ms-WPBody h6,
.ms-rtestate-field h6{
  font-size: 100%;
}

#SystemMaster .ms-rtestate-field .btn,
#SystemMaster .ms-rtestate-field .btn::before,
#SystemMaster .ms-rtestate-field .btn::after {
  box-sizing: border-box;
}

#SystemMaster .ms-rtestate-field .btn{
  border-radius: 50px;
  padding: 4px 12px 8px;
  line-height: 1.5;
  font-size: 1rem;
  font-weight: 400;
  text-decoration:none;
  display: inline-block;
  text-align: center;
}
#SystemMaster .ms-rtestate-field .btn-primary{
   background-color:var(--CoB-blue);
   color: var(--bs-white);
}

#SystemMaster .ms-rtestate-field .btn-dark{
   background-color:var(--bs-black);
   color: var(--bs-white);
}

/**************************ribbon page elements styles*************************/
#ms-rte-styleGalleryMenu,
#ms-rte-styleGalleryMenu *,
#ms-rte-styleGalleryMenu *:before,#ms-rte-styleGalleryMenu *:after
{
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}

#Ribbon\.EditingTools\.CPEditTab\.Styles .ms-cui-groupTitle:before{
	content:"Markup "
}

/*** remove OOB styles from the RTE styles tab dropdown ***/
/**** important, do not remove ***************************/
 
 #Ribbon\.EditingTools\.CPEditTab\.Font-Large-0-0,
 #Ribbon\.EditingTools\.CPEditTab\.Font-Medium-0-0,
 #Ribbon\.EditingTools\.CPEditTab\.Font\.Fonts-Medium,
 #Ribbon\.EditingTools\.CPEditTab\.Font\.FontSize-Medium,
 #Ribbon\.EditingTools\.CPEditTab\.Font\.Strikethrough-Small,
 #Ribbon\.EditingTools\.CPEditTab\.Font\.Underline-Small,
 #Ribbon\.EditingTools\.CPEditTab\.Font\.FontBackgroundColor-Small,
 #Ribbon\.EditingTools\.CPEditTab\.Font\.FontColor-Small,
 #Ribbon\.EditingTools\.CPEditTab\.Paragraph-Large-0-0-1,
 #Ribbon\.EditingTools\.CPEditTab\.Paragraph-Medium-0-0-1,
 #Ribbon\.EditingTools\.CPEditTab\.Paragraph-Large-0-0-2,
 #Ribbon\.EditingTools\.CPEditTab\.Paragraph-Medium-0-0-2,
 #Ribbon\.EditingTools\.CPEditTab\.Paragraph-Large-0-1-0,
 #Ribbon\.EditingTools\.CPEditTab\.Paragraph-Medium-0-1-0,
 #Ribbon\.EditingTools\.CPEditTab\.Paragraph-Medium-0-2-0,
 #Ribbon\.EditingTools\.CPEditTab\.Markup-LargeMedium-1-2,
 #Ribbon\.EditingTools\.CPEditTab\.Markup\.Html\.Menu\.Html\.MakeXHTML-Medium,
 #Ribbon\.EditingTools\.CPEditTab\.Markup\.LanguagesLabel-Medium,
 #Ribbon\.EditingTools\.CPEditTab\.Markup\.Languages-Medium,
 #Ribbon\.EditingTools\.CPInsert\.WebParts,
 #Ribbon\.Ribbon\.EditingTools\.CPInsert\.Tables,
 #Ribbon\.EditingTools\.CPInsert\.Media\.Media\.Menu\.Section\.FromComputer-Menu,
 #Ribbon\.EditingTools\.CPInsert\.Media\.Media\.Menu\.Section\.FromSharePoint-Menu,
 #Ribbon\.EditingTools\.CPInsert\.Media\.Media\.Menu\.Section\.FromAddress-Menu,
 #Ribbon\.EditingTools\.CPInsert\.Media\.CloudVideo-Large,
 #Ribbon\.EditingTools\.CPInsert\.Media\.CloudVideo_ToolTip,
 #Ribbon\.EditingTools\.CPInsert\.Tables,
 #ShortPoint\.CPInsert\.Group
 {display:none}
/****hide elements from the style block****/
#Ribbon\.EditingTools\.CPEditTab\.Styles\.Styles\.Menu\.Styles,
#Ribbon\.EditingTools\.CPEditTab\.Styles\.RibbonStyle1-Large,
#Ribbon\.EditingTools\.CPEditTab\.Paragraph\.ElementWithStyle\.Menu\.Styles\.Gallery tr:nth-child(2),
#Ribbon\.EditingTools\.CPEditTab\.Paragraph\.ElementWithStyle\.Menu\.Styles\.Gallery tr:nth-child(1) td:nth-child(2){
	display:none
}
/******hide create a workspace for document***********/
#Ribbon\.Document\.All\.SendTo\.Menu\.Items\.CreateDocumentWorkspace-Menu16{
	display:none
}

/***** paste flyout on rich content field on pages *********/
div.ms-rteElement-ClearSpace /*do not remove this element, when hiding the ribbon styles, an extra one needed to be added to the second row to properly allocate the custom styles on the grid below*/
{-ms-name:"ClearSpace";
clear:both;
}

p.ms-rteElement-Tagline
{
    -ms-name:"Tagline";
    color: var(--bs-gray-600);
    font-style:normal;
    font-weight:400;
    font-style: italic;
}
.ms-rtestate-field p.ms-rteElement-Tagline{
  	font-size:120%;
}
header .ms-rteElement-Tagline {/*first tagline in content goes inside the header (cobinit.js)*/ 
	margin-top:-12px;
}
h2 > .ms-rteElement-Tagline {/*first tagline in content goes inside the header (cobinit.js)*/ 
	margin-top:-4px;
	font-size:75%;
}
h2 + .ms-rteElement-Tagline{margin-top:-12px;}

aside.ms-rteElement-Callout1Left{-ms-name:"Callout - Float Left";-ms-element:"true"}
aside.ms-rteElement-Callout1Right{-ms-name:"Callout - Float Right";-ms-element:"true"}
aside.ms-rteElement-CalloutFull{-ms-name:"Callout - Full Width";-ms-element:"true"}
.ms-rteElement-Callout1Right,
.ms-rteElement-Callout1Left,
.ms-rteElement-CalloutFull
{
	width:100%;
	background-color: var(--bs-gray-200);
	border-left: 6px solid var(--CoB-blue);
	padding:14px 20px 20px;
	margin-top:16px;
	margin-bottom:16px;
}

#pageLayout .ms-rteElement-Callout1Right a,
#pageLayout .ms-rteElement-Callout1Left a,
#pageLayout .ms-rteElement-CalloutFull a{
	color: var(--bs-black);
	text-decoration:underline;
}

@media (min-width:768px){
	.ms-rteElement-Callout2Right, 
	.ms-rteElement-Callout2Left,
	.ms-rteElement-Callout1Right,
	.ms-rteElement-Callout1Left{
		width:45%!important;
	}

	.ms-rteElement-Callout2Left, 
	.ms-rteElement-Callout1Left,
	.ms-rtestate-write p.ms-rteElement-Callout1Left,
    .ms-rtestate-read p.ms-rteElement-Callout1Left{
		float:left;
		margin-right:16px;
		margin-top:8px;
		margin-bottom:0px;
	}
	.ms-rteElement-Callout2Right, 
	.ms-rteElement-Callout1Right,
	.ms-rtestate-write p.ms-rteElement-Callout1Right,
    .ms-rtestate-read p.ms-rteElement-Callout1Right{
		float:right;
		margin-left:16px;
		margin-top:8px;
		margin-bottom:0px;
	}
}
blockquote.ms-rteElement-Quotation{
	-ms-name:"Quotation";
	color:var(--bs-black);
}
blockquote,
.fr-view blockquote.ms-rteElement-Quotation{
	font-family:"Times New Roman", Times, serif!important;
    color:#000;
	font-style:italic;
	font-size:130%;
	margin:16px 0px;
	background-color:var(--bs-gray-200);
    padding: 18px 20px 20px;
	border:none; 
}

footer.ms-rteElement-cobFooter{
	-ms-name:"Article Footer";
}
.ms-rteElement-cobFooter{ 
    color:#1b1b1b!important;
    border-top:6px solid #eee;
    width:100%;
    padding-top:8px;
    padding:14px 0px 20px;
    margin-top:60px;
    height:auto;
}
.ms-rtestate-field footer.ms-rteElement-cobFooter{
	display:table;/*do not remove*/
}
.ms-rtestate-write.ms-rtestate-field footer.ms-rteElement-cobFooter{
	    display:block;/*do not remove*/
}

hr.ms-rteElement-cobHR{
	-ms-name:"Horizontal Rule";
	border-top-color:var(--bs-gray-300);
}
hr	{
	border-top-color:var(--bs-gray-300);
}

p.ms-rteElement-cobHighlight{
	background-color: #fff7ba;
	-ms-name:"Highlight";
}
.ms-rteElement-cobHighlight{
	background-color: #fff7ba;
	padding:12px
}

p.ms-rteElement-cobCaption{
	-ms-name:"Image Caption";
	font-size:85%;
}
.ms-rte-border-field p.ms-rteElement-cobCaption{
	border:2px dotted silver;
	padding:6px;
}
.ms-rte-border-field p.ms-rteElement-cobCaption:before{
	content:"Drag your image \A or click here to insert one -->  \A save your page to preview    ";
	white-space: pre;
	color:#ccc;
}
.ms-rte-border-field p.ms-rteElement-cobCaption img{
	float:none;
	vertical-align:text-top;
	margin:3px;
	}
figure.ms-rteElement-cobCaption{
	display: table;
	width: 1px;
    font-size:85%;
    line-height:0;
}
figure.ms-rteElement-cobCaption img{
	float:none!important;
}
figcaption.ms-rteElement-cobCaption{
	background-color:#f0f0f0;
	padding:10px 4px 4px 4px;
	margin-top:1px;
	line-height:1.45;
	background-position:97% -2px;	
}


/***formatting on the preview panel of page element styles********/
.ms-rte-stylePreviewHolder blockquote.ms-rteElement-Quotation{
	padding:0px;
}	
.ms-rte-stylePreviewHolder blockquote.ms-rteElement-Quotation:before{
	margin-left: -10px;
	margin-right: 0px;
}
.ms-rte-stylePreviewHolder aside.ms-rteElement-Callout1Left,
.ms-rte-stylePreviewHolder aside.ms-rteElement-Callout1Right,
.ms-rte-stylePreviewHolder aside.ms-rteElement-CalloutFull
{
	float:none;
	padding:3px;
	padding-top:8px;
	padding-bottom:8px;
	border-left-width:4px;
}
.ms-rte-stylePreviewHolder .ms-rteElement-cobFooter{
	padding:0px;
	padding-top:4px;
}
/*****end of formatting on the preview panel of page element styles*/


/*******Ribbon Image Styles************/
img.ms-rteImage-1 {	
	BORDER: #1b1b1b 1px solid!important;	
	BACKGROUND-COLOR: #f6f6f6!important;
}
img.ms-rteImage-2 {
		BORDER:1px solid #C7D1E0!important;	
		padding:7px;
}
img.ms-rteImage-3{
		padding:8px!important;
		background-color:#1b1b1b;
}
img.ms-rteImage-4{
	background-image:none;
	background-color:#eee;
	padding:8px!important
}
.ms-rtePosition-1 {/*for images floated to the left*/
    margin:5px 10px 10px 0px; 
}

.ms-rtePosition-2 {/*for images floated to the right*/
 margin:5px 0px 10px 10px; 	
}

.ms-rtePosition-6 {
	-ms-name:"Center Aligned";
	margin-right: auto!important;
    margin-left: auto!important;
	display: block!important;
}
img.ms-rteImage-5{
	-ms-name:"Responsive Image (full width)";
	width:100%;
	display: block;
	height: auto;
	max-width: 100%;
	float:none!important;
}
img.ms-rteImage-6{
	-ms-name:"Responsive Image (auto)";
	max-width: 100%;
	height: auto;
}

/*****utils*******/
#rtePasteFlyout,
#rtePasteFlyout *{
-webkit-box-sizing:content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}