/*
Theme Name:     cobalt
Theme URI:		https://cobaltrobotics.com/
Description:	Cobalt Robotics WP-Theme
Version:		1.0
Author:			The Agency Orange
Author URI:	    https://theagencyorange.com/
*/

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

/* -- @MASTERHEAD/NAVIGATION -- */
header {width:100%;position:fixed;top:0;left:0;z-index:99;}
.header-inner {z-index:10;padding-top:15px;padding-bottom:12px;background:#fff;}
header.sticky {background:rgba(255,255,255,1);}

.cd-auto-hide-header {transition: transform .5s;}
.cd-auto-hide-header.is-hidden {transform: translateY(-100%);}

.logo {width:170px;float:left;}
.logo img {display:block;}

/* Main Menu */
.mainNav {float:right;}
.mainNav > li {display:inline-block;font-weight:500;padding:0 10px 10px;font-size:1.4rem;line-height:40px;position:relative;}
.mainNav > li:last-child {padding-right:0;}
.mainNav > li > a {display:inline-block;color:#313133;text-transform:uppercase;position:relative;}
.mainNav > li > a:after {content:"";position:absolute;bottom:-15px;left:0;width:100%;height:0;border-bottom:5px solid #E20110;opacity:0;transition:all 0.4s;}
.mainNav > li:hover > a:after,
.mainNav > li.current-menu-item > a:after {opacity:1;}

/* Subnav */
.subnav-container {display:none;position:absolute;width:100%;top:100%;left:0;z-index:-2;height:200px;background:rgba(49,49,49,0.7);}
.subnav-container.active {display:block;}

.subnav-col {display:none;min-width:150px;height:200px;position:absolute;top:100%;left:0;}
.subnav-col.active {display:block;}
.subnav-col ul {padding:20px 0 0 0;}
.subnav-col ul li {display:block;font:1.4rem/1.4 'Open Sans', sans-serif;padding:5px 0 5px 20px;font-weight:500;}
.subnav-col ul li a {color:#fff;}
.subnav-col ul li a:hover {color:#E20110;}
.subnav-col > ul > li {font-weight:700;}

.sub-subnav-col {display:none;position:absolute;top:0;left:100%;width:1000px;height:100%;padding-left:20px;}
.subnav-col .default .sub-subnav-col,
.subnav-col .sub-subnav-col.active {display:block;}


/* Responsive Menu */
.mainNav {display:none;}

.mobile-nav-trigger-outter {float:right;width:30px;height:30px;z-index:99}
.mobile-nav-trigger {display:block;}
.mobile-nav-trigger .cd-menu-icon {margin-top:15px;margin-left:15px;display: block;-webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); width: 30px; height:2px;-webkit-transition: background-color 0.3s; -moz-transition: background-color 0.3s; transition: background-color 0.3s;}
.mobile-nav-trigger .cd-menu-icon::before,
.mobile-nav-trigger .cd-menu-icon:after { content: ''; width: 100%; height: 100%; position: absolute;top:0;left:0;z-index:9;-webkit-transition: -webkit-transform .3s, top .3s, background-color 0s; -moz-transition: -moz-transform .3s, top .3s, background-color 0s; transition: transform .3s, top .3s, background-color 0s; }
.mobile-nav-trigger .cd-menu-icon::before { top: -9px; }
.mobile-nav-trigger .cd-menu-icon::after { top: 9px; }
.mobile-nav-trigger .cd-menu-icon.is-clicked::before { top: 0; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg);}
.mobile-nav-trigger .cd-menu-icon.is-clicked::after { top: 0; -webkit-transform: rotate(225deg); -moz-transform: rotate(225deg); -ms-transform: rotate(225deg); -o-transform: rotate(225deg); transform: rotate(225deg); }
.mobile-nav-trigger .cd-menu-icon.is-clicked { background: none !important }
.mobile-nav-trigger .cd-menu-icon,
.mobile-nav-trigger .cd-menu-icon::before,
.mobile-nav-trigger .cd-menu-icon:after,
.mobile-nav-trigger .cd-menu-icon.is-clicked::before,
.mobile-nav-trigger .cd-menu-icon.is-clicked::after {background:#06063D;}

.mobile-nav {position: fixed;visibility:hidden;opacity:0; left: 0; top: 65px; height:calc(100% - 65px);width:100%;background:rgba(6, 6, 61,0.98); z-index:98;transition:all 0.3s ease;overflow:scroll;}
.mobile-nav.is-visible {visibility:visible;opacity:1;}
.mobile-nav-inner {padding:80px 20px 20px;}

.mobileNav {margin-bottom:30px;}
.mobileNav li,
.mobileNav li a {display:block;line-height:1;color:#fff;}
.mobileNav li a:hover {color:#A5BAC9;}

/* Level 0 */
.mobileNav li.level-0 > a {border-top:1px solid #A5BAC9;height:50px;font-size:2.0rem;line-height:50px;padding:0 10px;text-transform:uppercase;}
.mobileNav li.level-0:first-child > a {border-top:0;}

/* Level 2 */
.mobileNav li ul.sub-menu {margin-bottom:20px;position:relative;}
.mobileNav li.level-1 > a {display:block;font-size:1.8rem;line-height:1.6;margin:10px 0 0 20px;}
.mobileNav li.level-1.menu-item-has-children > a {padding-bottom:0;}

/* Level 3 */
.mobileNav li ul.sub-menu {margin-bottom:20px;}
.mobileNav li.level-2 > a {display:block;font-size:1.6rem;line-height:1.6;margin:10px 0 0 40px;}
.mobileNav li.level-2.menu-item-has-children > a {padding-bottom:0;}

.submenu-toggle {display:block;width:50px;height:50px;line-height:50px;float:right;top:0;right:0;font-size:2rem;text-align:center;color:#fff;z-index:9}
.submenu-toggle:after {content:"\f107";font-family:"Font Awesome 5 Free"; font-weight: 900;}

.mobileNav li.level-0 > ul,
.mobileNav li.level-1 > ul{display:none;}
.mobileNav li.level-0 > ul.show-subnav,
.mobileNav li.level-1 > ul.show-subnav{display:block;}

.post-edit-link {display:block;position:fixed;top:360px;right:0;padding:10px;z-index:99999999;background:#1C1B4A;}
.post-edit-link:before {font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f085";color:#fff;}

/*.demo-cta {transform:rotate(-90deg);position:fixed;top:188px;right:-122px;z-index:100;}*/
.demo-cta {width:100%;position:fixed;top:65px;left:0;z-index:100;}
.demo-cta .button {display:block;float:left;margin:0;width:49%;padding:0 10px;height:30px;line-height:30px;font-size:1.4rem;box-sizing:border-box;text-align:center;}
.demo-cta .button:last-child {float:right;}

/* -- @CONTENT ---------------- */
body {padding-top:65px;}

.banner {width:100%;overflow:hidden;}
.banner-overlay {position:absolute;width:100%;height:100%;top:0;left:0;background:rgba(0,0,0,0.15)}
.banner-content {position:absolute;width:100%;bottom:10px;left:0;}

.banner video{ position:absolute; top:50%; left:50%; z-index:0; min-width:100%; min-height:100%; width:auto; height:100%; -webkit-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); transform:translate(-50%, -50%); }


.home-banner,
.page-banner {height:350px;}
.banner-title {text-transform:uppercase;line-height:1;}
.banner-title span {display:block;line-height:1;}
.banner-title .f-title{font-size:3.5rem;margin-left:7%;}
.banner-title .f-subtitle {font-size:2.5rem;font-weight:700;}

.page-subnav {padding:15px 0;position: -webkit-sticky;position: sticky;top: 65px;z-index:90;border-bottom:1px solid rgba(255,255,255,0.1)}
.page-subnav ul li {display:inline-block;width:48%;margin:5px 0.5%;box-sizing: border-box;}
.page-subnav ul li a {display:block;padding:7px 2px;background:#fff;color:#06063D;text-transform:uppercase;font-size:1.2rem;line-height:1.2;font-weight:600;}
.page-subnav ul li a:hover,
.page-subnav ul li.current_page_item a {background:#DD0210;color:#fff;}

.page-section h2:first-child,
.page-section h3:first-child {text-transform:uppercase;}

.page-section.bg-blue {color:#fff;}

.video-thumb {max-width:750px;margin:0 auto;overflow: hidden;position:relative;}
.video-thumb img {display:block;width: 100%;margin: -10% 0;}
.video-thumb .video-play {position:absolute;bottom:20px;right:20px;color:rgba(255,255,255,0.6);font-size:6.0rem;transition:all 0.4s;}
.video-thumb:hover .video-play {color:rgba(255,255,255,1);}

.content-column {max-width:300px;margin:0 auto 30px;}
.content-column ul {text-align:left;}
.page-id-340 .content-column ul {margin-left:25%;}
ul.cert-list {text-align:center;list-style:none;margin:0;}

.anim-anchor {fill:transparent;}
.anim-content h3 {margin-bottom:5px;}

/* Blog */
.blog-categories {margin:40px 0 60px;}
.blog-categories li {display:inline-block;margin:0 5px 5px 0;font-size:1.2rem;}
.blog-categories li a {display:inline-block;padding:5px;border:2px solid #D3FF19;background:rgba(211,255,25,0.25);}
.blog-categories li a:hover,
.blog-categories li.current {background:#D3FF19;color:#003057;}

.post-block {margin-bottom:40px;}
.post-block p,
.post-meta {margin-bottom:10px;}
.post-block h3 {font-size:2.0rem;margin:0;}

.post-block a,
.post-meta a {color:#06063D;}
.post-block a:hover,
.post-meta a:hover {text-decoration: underline;}

.post-archive-row {padding-bottom:40px;margin-bottom:40px;border-bottom:1px solid #ccc;}
.post-archive-row-content-inner h3 {margin-bottom:5px;}
.post-archive-row-content-inner p {font-size:16px;}
.post-meta {font-size:13px;font-style:italic;}

.post-single-banner {margin-bottom:40px;}
.post-single-banner img {display:block;width:100%;}

.author-block {padding:20px;background:#fafafa;}
.author-pic {width:15%;float:left;}
.author-bio {width:80%;float:right;}
.author-bio p {margin:0;}

.careers-wrap table,
.resources-wrap table {width:100%;}
.careers-wrap table td,
.resources-wrap table td {background:#fff;}
.careers-wrap table td span,
.resources-wrap table td span {display:inline-block;padding:10px 15px;}
.careers-wrap table thead td {text-transform:uppercase;background:#06063D;}
.careers-wrap table thead td span {color:#fff;font-size:1.8rem;padding:20px 15px;}
.careers-wrap table tbody tr.even td,
.resources-wrap table tbody tr.even td {background:rgba(105,105,108,0.3)}
.careers-wrap table tbody tr td:first-child {width:30%;}
.careers-wrap table tbody tr td:nth-child(2) {width:15%;}
.careers-wrap table tbody tr td:nth-child(3) {width:15%;}
.careers-wrap table tbody tr td:nth-child(3) {width:15%;}
.careers-wrap table tbody tr td:nth-child(4) {width:15%;}
.careers-wrap table tbody tr td:nth-child(5) {width:25%;text-align:right;}
.careers-wrap table td .button,
.resources-wrap table table td .button {font-size:1.6rem;}

.resources-nav {border-bottom:1px solid #ccc;margin-bottom:40px;}
.resources-nav li {display:inline-block;margin:0 20px;padding-bottom:10px;border-bottom:2px solid transparent;transition:all 0.4s;}
.resources-nav li:hover,
.resources-nav li.active {border-color:#06063D}

.resources-wrap table tbody tr td:first-child {width:65%;}
.resources-wrap table tbody tr td:nth-child(2) {width:35%;text-align:right;}
.resource-row .file-icon {color: #e2988a;font-size:3.0rem;display:inline-block;margin-right:5px;}

.resource-row {display:none;}
.resource-row.active {display:table-row;}

/* -- @BLOG ------------------- */




/* -- @FOOTER ----------------- */
footer {margin-top:40px;}
.footer-top {padding:30px 0;}
.footer-logo {width:170px;margin:0 auto 30px;}
.footerNav,
.social-links {text-align:center;}
.footerNav li,
.social-links li {display:inline-block;margin:0 10px;line-height:40px;text-transform:uppercase;}
.footerNav li a,
.social-links li a {color:#fff;}

.footer-copy {padding:15px 0;background:#050505;}
.footer-copy span {display:block;font-size:1.4rem;font-weight:500;margin-bottom:10px;}
.footer-copy span a {color:#fff;}

.footer-signup {margin-bottom:40px;}
.footer-signup .gform_wrapper,
.footer-signup .gform_wrapper .gform_body,
.footer-signup .gform_wrapper .gform_body li,
.footer-signup .gform_wrapper .gform_body li input,
.footer-signup .gform_wrapper .gform_footer,
.footer-signup .gform_wrapper .top_label div.ginput_container {padding:0 !important;margin:0 !important;}
.footer-signup .gform_wrapper .gform_body,
.footer-signup .gform_wrapper .gform_footer {float:left;clear:none;}
.footer-signup .gform_wrapper .gform_body {width:60% !important;}
.footer-signup .gform_wrapper .gform_body li label {display:none !important;}
.footer-signup .gform_wrapper .gform_body li input {border:none !important;height:40px !important;line-height:40px !important;padding:0 10px !important;}
.footer-signup .gform_wrapper .gform_footer {width:40% !important;}
.footer-signup .gform_wrapper .gform_footer .button {margin:0 0 0 15px !important;}
/* #Clearer
================================================== */
.clearer:after,
.container:after,
.row:after,
.mainNav:after,
.subnav-col:after,
.mobileNav ul:after,
.mobileNav ul li:after,
.footer-signup:after,
.demo-cta:after {content: ""; display: table; clear: both;}
