/* 
Theme Name: NOAA Theme
Author: New Phase
Description: Theme for SARSAT NOAA website. This is a DIVI child theme.
Author URI: https://newphase.com 
Template: Divi
Version: 1.0 
*/ 

/*
Note to the future developer or maintainer of this website.

The layouts in this website are built using DIVI Theme Builder and the custom CSS statement are in this file.

Many CSS related settings have been set visually (without code) using the properties available in the DIVI modules used for layouts.

Additionally, rarely, some minor CSS statemetns may be present in the DIVI module properties itself which may be accessed using the visual editor for the concerned page or the DIVI Builder template.
*/



/* ---------------------------------- */
/*      Header related CSS                  */

/* Reduce the height of the NOAA website menu section on top of website*/
.et_pb_fullwidth_menu--without-logo .et_pb_menu__menu>nav>ul {
    padding: 2px 0 0!important;
} 

/* Move the hamburger menu upwards. This is effective only in mobile view.*/
@media (max-width: 980px){
	.et_pb_fullwidth_menu .et_pb_row, .et_pb_menu .et_pb_row {
    min-height: 10px !important;
}
}

/* Change mobile menu of the NOAA website menu from just hamburger, to hamburger plus the words NOAA site menu */

#noaa-sites-menu .mobile_menu_bar:after {
    position: relative !important;
    content: 'NOAA Sites Menu';
    bottom: 10px;
    left: 2%;
    color: #222222;
    font-size: 12px;
}

/* Level 3 menu CSS - CSS related to the menu which shows in desktop view towards the left of the search box */


/* show dots between menu items */

.et_pb_menu.menu-with-dot-separator-shows-full-on-mobile .et-menu.nav li + li a:before {
	position: absolute;
	left:-11px;
	transform: translateX(-50%);
	content: ' • ';
	font-size: smaller;
}

/* show dots between menu items css ends */

/* hide the hamburger menu. Show full menu in tablets and mobile too */

.menu-with-dot-separator-shows-full-on-mobile.et_pb_menu .et_pb_menu__menu, .menu-with-dot-separator-shows-full-on-mobile.et_pb_fullwidth_menu .et_pb_menu__menu {
    display: flex!important;
}
 
.menu-with-dot-separator-shows-full-on-mobile .et_mobile_nav_menu {
    display: none;
}

/* css to hide the hamburger menu ends here. Show full menu in tablets and mobile too */

/* css to highlight the register menu item in orange color text */

#menu-item-2219 > a {
    color: #FF8305 !important;
}

#menu-item-2219 > a:hover {
    color: #ffe958 !important;
	opacity: 1;
}

/* css to highlight the register menu item in orange color text in level 3 menu ends here */
	
	
/* css to highlight the register menu item in level 3 menu in a white capsule design */

/* white capsule design commented out as it was not approved

#menu-item-2219 > a {
    background: #ffffff;
    border-radius: 25px;
    color: #fe5704 !important;
    border: 2px solid #fe5704;
    padding: 6px 10px 6px 10px;
    margin-top: -6px;
}

#menu-item-2219 > a:hover {
    background: #ffe958;
    border-radius: 25px;
    color: #fe5704 !important;
    border: 2px solid #fe5704;
    padding: 6px 10px 6px 10px;
    margin-top: -6px;
	opacity: 1;
}


/* css to highlight the register menu item in a white capsule design in level 3 menu ends here */


/* Level 3 menu CSS ends here */

/* ---------------------------------- */

/* Search form CSS */

/* Increase gap between search radio boxes and query input field of NOAA search form */
#query-field {
	margin-left: 5px;
    margin-top: 7px;}


/* Define style of the search submit button on NOAA search form */
input#searchsubmitbtn {
	appearance: auto;
    user-select: none;
    white-space: pre;
    align-items: flex-start;
    text-align: center;
    cursor: default;
    color: black;
    background-color: rgb(239, 239, 239);
    box-sizing: border-box;
    padding: 2px 6px;
    border-width: 2px;
    border-style: outset;
    border-color: rgb(118, 118, 118);
    border-image: initial;
}

/* Search form css ends here */



/* ---------------------------------- */
/*      General CSS                  */


/* Set up default link colors */

a {
  font-weight: bold;
  text-decoration:none;
}

a:link {
  color: #0057A5;
}

/* Remove the visited link functionality because it was not approved

a:visited {
  color: rgba(73,171,193,0.76);
  font-weight: normal;	
}

*/

a:hover {
  color: #ffbf00;
  text-decoration: underline;
}

/* TEASER BOX 3 on homepage */
/* Style the menu module used in Teaser box 3 of the homepage. The menu module has been used for showing the What you can do options */
/* hide the hamburger menu on mobile. Show full menu in tablets and mobile too */

.what-you-can-do-menu-shows-full-on-mobile.et_pb_menu .et_pb_menu__menu, .what-you-can-do-menu-shows-full-on-mobile.et_pb_fullwidth_menu .et_pb_menu__menu {
    display: flex!important;
}
 
.what-you-can-do-menu-shows-full-on-mobile .et_mobile_nav_menu {
    display: none;
}

/* css to hide the hamburger menu in Teaser box 3 ends here. Show full menu in tablets and mobile too */

/* show greater than sign between menu items */

.et_pb_menu.what-you-can-do-menu-shows-full-on-mobile .et-menu.nav li a:before {
	position: absolute;
	left: -5px;
	transform: translateX(-50%);
	content: ' > ';
	font-size: smaller;
}

/* show greater than sign between menu items css ends */

/*Teaser box 3 menu related CSS ends here */


/* ---------------------------------- */
/* CSS to reduce bottom margin of featured image in the blog module used to showcase videos on the homepage */

#homepg-video-blog-section .entry-featured-image-url {margin-bottom:5px!important;}

/* CSS to reduce bottom margin of featured image in the blog module used to showcase videos on the homepage ENDS here*/


/* CSS to reduce margin between video posts in the blog module used to showcase videos on the homepage */

/* homepg-video-blog-section .et_pb_post {margin-bottom:5px!important;} */

/* CSS to reduce bottom margin of featured image in the blog module used to showcase videos on the homepage ENDS here*/


/* CSS to show a video icon in front of video title */
#homepg-video-blog-section h2.entry-title:before {
	font-family: 'ETmodules';
	font-size:120%;
	position:relative;
	content:"\e0a3";
	padding-right: 5px;
}
/* CSS to show a video icon in front of video title ends here */



/* ---------------------------------- */
/* NEWS - FEATURED IMAGE - CSS to reduce bottom margin of featured image in the blog module used on the MORE NEW PAGE and homepage news section */

.sarsat-news-list-on-news-page .et_pb_post .entry-featured-image-url {margin-bottom:5px!important;}

#homepage-news-list .et_pb_post .entry-featured-image-url {margin-bottom:10px!important;}

/* NEWS - FEATURED IMAGE - CSS to reduce bottom margin of featured image in the blog module used on the MORE NEW PAGE and homepage news section ENDS here*/


/* ---------------------------------- */
/* CSS for the MORE NEWS page - the archive page for posts of category NEWS */
/* CSS to convert the full width layout of DIVI blog module from full width to a list layout with image on right and title on left*/
/*Full width view is fine for mobile, so add media query so that changes only affect tablet and desktop*/

@media (min-width: 767px) {
/*set the image width*/
.sarsat-news-list-on-news-page .entry-featured-image-url  {
width: 35%;
float: left;
margin-bottom: 0!important;
}

/*set the details width*/
.sarsat-news-list-on-news-page .entry-title,
.sarsat-news-list-on-news-page .post-meta,
.sarsat-news-list-on-news-page .post-content {
width: 65%;
float: right;
padding-left: 10px;
}
}
/* media query ends here */ 

/* Create a border around each news post in the More News Page*/
.sarsat-news-list-on-news-page .et_pb_post {
    border: 1px solid #D8D8D8;
    border-radius: 5px;
    padding: 10px 10px;
}

/* CSS for the MORE NEWS page ENDS HERE */


/* ---------------------------------- */


/* CSS for the NEWS section in the homepage */
/* CSS to convert the full width layout of DIVI blog module from full width to a list layout with image on right and title on left*/

/*set the image width*/

.sarsat-blog-list-in-homepage .entry-featured-image-url  {
width: 50%;
float: right;
margin-bottom: 0!important;
}

#homepage-news-list .et_pb_post {
	margin-bottom:30px!important;
}

/*set the details width*/

.sarsat-blog-list-in-homepage .entry-title,
.sarsat-blog-list-in-homepage .post-meta,
.sarsat-blog-list-in-homepage .post-content {
width: 50%;
float: left;
padding-right: 7px;
}
/* CSS for the NEWS section in the homepage ENDS HERE */


/* Remove the navigation dots showing below the GEOSAR coverap map animation created on Satellites page */
#geosar-coverage-map-gallery-animation .et-pb-controllers {display:none;}
/* Coverage map dot hiding CSS ends here */