/* Base HTML Element Overrides */

/* Add this to anchors to ensure they are visibile and not under the top nav when linked to */

.anchor-link {
	padding-top: 80px;
	margin-top: 80px;
}

.ms-rtePosition-1 {
	float:left;
}

.ms-rtePosition-2 {
	float:right;
}

.ms-rtePosition-3 {
	vertical-align:text-top;
}

.ms-rtePosition-4 {
	vertical-align:middle;
}

.ms-rtePosition-5 {
	vertical-align:text-bottom;
}

.ToC {
background-color: #D3D3D3;} 

div[id^=ctl00_] #mystationtables table {
    width: 100%;
}
div[id^=ctl00_] table,
div[id^=ctl00_] table > tbody > tr > th,
div[id^=ctl00_] table > tbody > tr > td {
    border: 1px solid #ddd;
}
div[id^=ctl00_] table > thead > tr > th,
div[id^=ctl00_] table > thead > tr > td {
    border: 1px solid #ddd;
    border-bottom-width: 2px;
}
div[id^=ctl00_] table > tbody > tr > td,
div[id^=ctl00_] table > tbody > tr > th,
div[id^=ctl00_] table > tfoot > tr > td,
div[id^=ctl00_] table > tfoot > tr > th,
div[id^=ctl00_] table > thead > tr > td,
div[id^=ctl00_] table > thead > tr > th {
    padding: 8px;
}
.img-wrap{ 
        overflow:hidden; 
        margin-block:1rem; 
    } 
    .img-wrap .img-left{ 
        float:left; 
        margin-inline:1rem; 
    } 
    .img-wrap .img-right{ 
        margin-inline: 1rem; 
        float:right; 
    } 

    .img-nowrap{ 
      display:flex; 
    } 

    .img-nowrap-right{ 
      flex-direction:row-reverse; 
      justify-content:space-between; 
      margin-block:1rem; 
    } 

    .img-nowrap img{ 
      margin-inline:1rem; 
    } 

    @media (max-width:520px) { 
      .img-wrap .img-left, .img-wrap .img-right{ 
         float:none; 
         margin:1rem 0; 
      } 


      .img-nowrap, .img-nowrap-right{ 
         flex-direction: column; 
      } 
      .img-nowrap img, .img-nowrap-right img{ 
         margin:1rem 0; 
      } 
    }

/* Top Nav Overrides */

.or-navbar {
    background: #293352;
}
/* Header Overrides */

.or-header-logo {
    background: url(/ODOT/style%20library/odot%20logo.png);
    background-size: contain;
    background-repeat: no-repeat;
}
.or-header {
    background-color: #1b223a;
    background-image: url('/odot/Style%20Library/construction1280x300.jpg');
    background-attachment: scroll;
}
.or-header .or-header-overlay {
    background: transparent;
    opacity: 0;
}
.regions .or-header {
    background-image: url('/ODOT/style%20library/TablerockMtn_RobinMarshburn.jpg');
}
.procurement .or-header {
    background-image: url('/ODOT/style%20library/GoldBeachBridge.png');
}
.rail-and-public-transit .or-header {
    background-image: url('/ODOT/style%20library/RPTDHeader3.jpg');
}
.orego .or-header {
    background-image: url('/ODOT/style%20library/forestroad.jpg');
}
.get-involved .or-header {
    background-image: url('/ODOT/style%20library/StreetView.png');
}
.about-us .or-header {
    background-image: url('/ODOT/style%20library/RogueRiverBridge-GrantsPass_RickHart.png');
}
.geo-environmental .or-header {
    background-image: url('/ODOT/style%20library/RainbowinEOregon.png');
}
.oregon-real-time-gnss-network .or-header {
    background-image: url('/ODOT/style%20library/ORGNsunrise.png');
}
.statewide-transportation-improvement-program .or-header {
    background-image: url('/ODOT/style%20library/STIP-header.jpg');
}
.technology-transfer-center .or-header {
    background-image: url('/ODOT/style%20library/T2-header.jpg');
}
.planning-technical-guidance .or-header {
    background-image: url('/ODOT/style%20library/planning-header.jpg');
}
.local-government .or-header {
    background-image: url('/ODOT/style%20library/localgov-header.jpg');
}
.data-maps .or-header {
    background-image: url('/ODOT/style%20library/data-header.jpg');
}
.fuels-tax .or-header {
    background-image: url('/ODOT/style%20library/Terminal1BLUE.jpg');
}
.safety .or-header {
    background-image: url('/ODOT/style%20library/TSO_Banner.jpg');
}
.programs .or-header {
    background-image: url('/ODOT/style%20library/1280X380px_Woodburn-Lights.png');
}
.waterfall-corridor-permits .or-header {
    background-image: url('/odot/waterfall-corridor-permits/PublishingImages/waterfallweb.jpg');
}
.oregon-infrastructure-investment-and-jobs-act .or-header {
background-image: url('/odot/Style%20Library/1280x300px_DSC_0197_1.png');
}
.congestion-pricing .or-header {
background-image: url('/ODOT/style%20library/MtHoodatnight.jpg');
}
.hydraulics .or-header {
background-image: url('/ODOT/style%20library/hydro.jpg');
}
.oregon-driver-motor-vehicle-services .or-header {
    background-image: url('/ODOT/style%20library/MtHood.jpg');
}
.50plus .or-header {
    background-image: url('/ODOT/style%20library/MtHood.jpg');
}
.teen .or-header {
    background-image: url('/ODOT/style%20library/MtHood.jpg');
}
.oregon-tolling .or-header {
    background-image: url('/ODOT/style%20library/TollingHeader.jpg');
}
.state-of-the-system .or-header {
    background-image: url('/odot/Style%20Library/sots_header.jpg');
}
.online-open-house-index .or-header {
	background-image: url('/odot/style%20library/cherryblossomheader.jpg');
}

.mobilePhoneLink {
                display: inline-block;
}

@media only screen and (min-width: 768px) {
                .desktopPhoneLink {
                                display: inline-block;
                }
                .mobilePhoneLink {
                                display: none;
                }
}
a[href^="tel:"] {
 background-color:#f9f9f9;
 border: 1px solid #efefef;
 border-radius: 4px;
 padding: 0 5px;
 display: inline-block;

}

a[href^="tel:"]:before {
  content: "\260e";
  margin-right: 5px;
}
.or-navbar-search-wrapper {
    background: #1b223a;
}
.or-navbar-search-submit-button,
.or-navbar-search-submit-button:hover,
.or-navbar-search-submit-button:focus {
    background: #293352;
}
.or-navbar-search-wrapper.or-navbar-search-open {
    box-shadow: -10px 0px 10px -5px #1b223a;
}
/* Off-Canvas Overrides */

@media screen and (max-width: 767px) {
    .navbar-offcanvas {
        background-color: rgba(41, 51, 82, 0.9);
    }
}
/* Left Nav Overrides */

.or-side-navigation ul .or-side-navigation-current > a {
    border-left: solid 3px #1b223a;
    color: #1b223a;
    padding-left: 12px;
}
html .or-side-navigation {
    background-color: #efefef;
    padding: 10px;
    border-top: 4px solid #43526C;
}
/* Breadcrumb Overrides */

.or-breadcrumbs {
    /* background-color: rgba(41,51,82,0.25); */
    
    background-color: rgba(0, 0, 0, 0.25);
}
/* Calendar Overrides */

.or-calendar-month-view .or-calendar-event-link,
.or-calendar-agenda-view .or-calendar-event {
    background: #1b223a;
}
/* Helpful Page Poll Overrides */

.helpfulPollQuestion .btn-primary {
    background-color: #293352;
    border-color: #1b223a;
}
/* Accordion Styles */

.or-accordion-list .or-accordion-panel > a,
.or-accordion-list .or-accordion-panel > a:link,
.or-accordion-list .or-accordion-panel > a:visited,
.or-accordion-list .or-accordion-panel > a:active,
.or-accordion-list .or-accordion-panel > a:hover {
    color: #555;
    text-decoration: none;
}
.or-accordion-heading-title > .panel-title {
    font-size: 18px;
}
.or-accordion-heading-title h4 {
    font-weight: normal;
}
/* Task Box Overrides */

.or-taskbox-title {
    background: rgba(41, 51, 82, 0.9);
}
.or-taskbox .list-group-item {
    border: 0 solid transparent;
    padding: 5px 15px
}
.or-taskbox .list-group-item:first-of-type {
    padding-top: 10px;
}
.or-taskbox .list-group-item:last-of-type {
    padding-bottom: 10px;
}
.or-taskbox-image .or-taskbox-title {
    font-size: 20px;
}
/* File Extension CSS Library Overrides */

main a[href*=".com"]::before,
main li a[href*=".com"]::after {
    content: none !important;
}

/* Standard Page and Standard Page with Aside - Header Override */
/* Project Details Overrides */

.s4-wpTopTable,
.ms-WPSelected {
    border: solid 0 transparent !important;
    border-radius: 0;
    background: #fff;
}
/* RIBBON OVERRIDES */

#Ribbon\2e EditingTools\2e CPEditTab\2e Paragraph-Large-0-0-1 {
    display: none;
}



/* Station Camera Custom Tables */
.odot-orgn-stations-pages-stationslist-aspx div[id^=ctl00_] #mystationtables table {
    width: 100%;
}
.odot-orgn-stations-pages-stationslist-aspx div[id^=ctl00_] table,
.odot-orgn-stations-pages-stationslist-aspx div[id^=ctl00_] table > tbody > tr > th,
.odot-orgn-stations-pages-stationslist-aspx div[id^=ctl00_] table > tbody > tr > td {
    border: 0px solid transparent;
}
.statodot-orgn-stations-pages-stationslist-aspxions div[id^=ctl00_] table > thead > tr > th,
.odot-orgn-stations-pages-stationslist-aspx div[id^=ctl00_] table > thead > tr > td {
    border: 0px solid transparent;
    border-bottom-width: 0
}
.odot-orgn-stations-pages-stationslist-aspx div[id^=ctl00_] table > tbody > tr > td,
.odot-orgn-stations-pages-stationslist-aspx div[id^=ctl00_] table > tbody > tr > th,
.odot-orgn-stations-pages-stationslist-aspx div[id^=ctl00_] table > tfoot > tr > td,
.odot-orgn-stations-pages-stationslist-aspx div[id^=ctl00_] table > tfoot > tr > th,
.odot-orgn-stations-pages-stationslist-aspx div[id^=ctl00_] table > thead > tr > td,
.odot-orgn-stations-pages-stationslist-aspx div[id^=ctl00_] table > thead > tr > th {
    padding: 0;
}

/* formats funding-programs page so discription column is wider than it is long */
.odot-if-pages-funding-programs-aspx data-tables-web-part th[aria-label="Description"] {
    width: 600px !important;
    display: inline-table;
}

/*for accessible buttons using odot-btn class */
.odot-btn {
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background-color:White;
	border-radius:6px;
	border:1px solid #1C355E;
	display:inline-block;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:15px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffffff;
	text-align:Left;
	color:#1C355E !important;
	margin-right: 1% !important;
	margin-top: 10px !important;
	margin-bottom: 10px !important;
}

.odot-btn:hover {
	color:#1C355E;
	Background-color:Whitesmoke;
	text-decoration:none !important;
}

.odot-btn-alt {
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background-color:Whitesmoke;
	border-radius:6px;
	border:1px solid #1C355E;
	display:inline-block;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:15px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffffff;
	text-align:Left;
	color:#1C355E !important;
	margin-right: 10px !important;
}

.odot-btn-alt:hover {
	color:#1C355E;
	Background-color:White;
	text-decoration:none !important;
}

.three {
	width:30%;
	
}

.two {
	width:48%;
	
}

.block {
	width:100%;
}

.previous {
	width:100px;
	float:left;
	text-align:center !important;
}

.next {
	width:100px;
	float:right;
	text-align:center !important;
}

.previous:before {
	content: "<<";
	margin-right:6px;
}	

.next:after {
	content: ">>";
	margin-left:6px
}

.simple {
	padding:5px !important;
}
/* To create a simple container around elements */
.flex-container {
	display: flex;
	flex-direction: column;
	padding: 10px;
	width: 100%;
	border-radius:6px;
	Background-color:transparent;
	border:1px solid #1C355E;
}
.flex-container-alt {
	display: flex;
	flex-direction: column;
	border:1px solid #1C355E;
	padding: 10px;
	width: 100%;
	border-radius:6px;
	Background-color:Whitesmoke;
}
.flex-container-half {
	display: flex;
	flex-direction: column;
	padding: 10px;
	width: 48%;
	border-radius:6px;
	Background-color:transparent;
	border:1px solid #1C355E;
	text-align: Left !important;
}
.box100 {
	height: 100px;
}
.box200 {
	height: 200px;
}
.box300 {
	height: 300px;
}
.box400 {
	height: 400px;
}
.box500 {
	height: 500px;
}

.box550 {
	height: 550px;
}
.box600 {
	height: 600px;
}
.box700 {
	height: 700px;
}
.box800 {
	height: 800px;
}


/* Thumbnail (gallery) Formatting */
/* Small Gallery Thumbnails */
div.gallery {
	margin: 5px;
	border: 1px solid #ccc;
	width: 180px;
	border-radius: 4px;
	display: inline-block;
}

div.gallery img {
  width: 100%;
  height: auto;
  border-radius: 4px;
}

div.gallery:hover {
  border: 1px solid #1C355E;
}

div.desc {
  padding: 15px;
  text-align: center;
}

/* Wide Gallery Image */
div.gallery-wide {
	margin: 5px;
	border: 1px solid #ccc;
	width: 600px;
	border-radius: 4px;
	display: inline-block;
}

div.gallery-wide:hover {
  border: 1px solid #1C355E;
}

div.gallery-wide img {
  width: 100%;
  height: auto;
  border-radius: 4px;
}
/* Medium Gallery Image */
div.gallery-med {
	margin: 5px;
	border: 1px solid #ccc;
	width: 400px;
	border-radius: 4px; 
	display: inline-block;
} 

div.gallery-med:hover {
  border: 1px solid #1C355E;
}

div.gallery-med img {
  width: 100%;
  height: auto;
  border-radius: 4px;
}
/* 100% width adaptive Gallery Image */
div.gallery-free {
	margin: 5px;
	border: 1px solid #ccc;
	border-radius: 4px; 
	display: inline-block;
} 

div.gallery-free:hover {
  border: 1px solid #1C355E;
}

div.gallery-free img {
  width: 100%;
  height: auto;
  border-radius: 4px;
}

/* End Gallery Style */

/* formats the data cells on the State of the System website home page so they are aligned in the center */

body.odot-state-of-the-system-pages-default-aspx [class*='ExternalClassA6CDBDB2D5CE4066B516694E5511C280'] { display: block;}
body.odot-state-of-the-system-pages-default-aspx [class*='ExternalClassCFBB18F7333E46508F200DCDEF010C96'] { display: block;}

/*

.or-small-header .or-header{
	box-shadow: 0 0 0 transparent;
}

.or-small-header .or-header-content {
	padding-left: 15px;
	padding-top:10px;
}

.or-small-header .or-header-logo-wrapper, .or-small-header .or-header-title small {
	display: none;
}

.or-small-header header, .or-small-header .or-breadcrumbs {
	background: none;
}

.or-small-header .or-header-overlay {
	background: transparent;
}

.or-small-header .or-header-title {
	color: #333;
	padding: 10px 10px 10px 0;
}

.or-small-header .or-breadcrumbs > li, .or-breadcrumbs > li + li:before, .or-small-header .or-breadcrumbs > li.active, .or-small-header .or-breadcrumbs a {
	color: #333;
}
.iframe-container {
  position: relative; /* Essential for absolute positioning of the iframe */
  width: 100%; /* Ensures the container takes full available width */
  height: 0; /* Sets initial height to zero */
  padding-bottom: 56.25%; /* Creates the responsive aspect ratio (e.g., 16:9) */
  overflow: hidden; /* Hides any content that overflows the container */
}

.iframe-container iframe {
  position: absolute; /* Positions the iframe relative to its container */
  top: 0;
  left: 0;
  width: 100%; /* Makes the iframe fill the container's width */
  height: 100%; /* Makes the iframe fill the container's height */
  border: none; /* Removes default iframe border */
} 

*/
/* Markup Styles Menu Options
h2.ms-rteElement-Heading2 {}
h3.ms-rteElement-Heading3 {-ms-name: "H3";}
h4.ms-rteElement-Heading4 {-ms-name: "H4";}
h5.ms-rteElement-Heading5 {-ms-name: "H5";}
h6.ms-rteElement-Heading6 {-ms-name: "H6";}
blockquote.ms-rteElement-BlockQuote {-ms-name: "Block Quote";}
div.ms-rteElement-DivPullLeft {-ms-name: "Pull Text Left"; float: left;}
div.ms-rteElement-DivPullRight {-ms-name: "Pull Text Right"; float: right;}



.ms-rtePosition-PullLeft {-ms-name:"Pull Image Left"; float:left;}
.ms-rtePosition-PullRight {-ms-name:"Pull Image Right"; float:right;}



.ms-rteImage-Rounded {-ms-name: "Rounded"; border-radius: 2px; transition: all .2s ease-in-out;}
.ms-rteImage-Circle {-ms-name: "Circular"; border-radius: 50%; transition: all .2s ease-in-out;}
.ms-rteImage-Thumbnail {-ms-name: "Thumbnail"; display: inline-block; max-width: 100%; height: auto; padding: 4px; line-height: 1.42857143; background-color: #fff; border: 1px solid #ddd; border-radius: 4px; transition: all .2s ease-in-out;}
*/