/*
Theme Name: Code Nation
Theme URI: https://wordpress.org/themes/codenation/
Author: Saksham Balyan
Description: Custom theme development for Code Nation.
Version: 1.3
Tags: Custom Theme, CodeNation
Requires PHP: 7.0
*/
@import url('css2.css');
@import url('css21.css');
@import url(bootstrap.min.css);@import url(font-awesome.min.css);


body {
    margin: 0px;
    padding: 0px;
    font-family: 'Work Sans', sans-serif;
    font-size: 16px;
    line-height: 1.6;
    background: #002A57;
    font-weight: 400;
    color: #333333;
	overflow-x: hidden;
}
:is(h1, h2, h3, h4){
	position: relative;
}
:is(h1, h2){
	font-family: 'Space Mono', monospace;
}
p{
	font-family: 'Work Sans', sans-serif;
}
p::selection{
	background: #315AF7;
	color: white;
}

a {	text-decoration: none;color: #fff;}
a:hover, a:focus {
	color: #F69125;
	text-decoration: none;
}
.home{
	background: #002A57;
}
.banner-heading-cn {
	letter-spacing: 14px;
	line-height:65px;
	font-weight: 600;
}
.side-heading-cn{
	letter-spacing:4px;
	text-transform: uppercase;
	color: #F69125;
	font-family: 'Space Mono', monospace;
}
.side-heading-h{
	font-family: 'Space Mono', monospace;
	letter-spacing: 4px; 
	text-transform: uppercase;
	color: white;
	font-weight: 600;
	display: inline-block; 
	background-color: #315AF7;
	padding-left: 4px;
}
nav {
	  position: -webkit-sticky;
	  position: sticky;
	  top: 0;
	  height: 69px;
	  width: 100%;
	  background: linear-gradient(to bottom, #000, #0003 70%,#0000); /* background when scroll is in the top */
	  transition: background .5s; /* control how smooth the background changes */
}
#masthead.site-header {
    background: #00152B;
	font-family: 'Space Mono', monospace;
    position: sticky;
	top: 0px;
    display: block;
    width: 100%;
    height: auto; 
    z-index: 99;
	justify-content: space-between;
	border-bottom: 1px solid transparent;
}
.header-nav {
	background-color: transparent;
	-webkit-transition: all .2s ease-in-out 0s;
    -moz-transition: all .2s ease-in-out 0s;
    -ms-transition: all .2s ease-in-out 0s;
    -o-transition: all .2s ease-in-out 0s;
    transition: all .2s ease-in-out 0s;
}
.header-nav .header-logo img {padding: 13px 0px; margin: 0; -webkit-transition: all .4s ease-in-out 0s;
    -moz-transition: all .4s ease-in-out 0s;
    -ms-transition: all .4s ease-in-out 0s;
    -o-transition: all .4s ease-in-out 0s;
    transition: all .4s ease-in-out 0s; }
.navbar-scroll .header-nav {position: fixed;
    width: 100%;
    z-index: 99;
	background-color: #ffffff;
    top: 0; -webkit-box-shadow: 1px 2px 9px 0 rgba(47,44,44,.1);
	-moz-box-shadow: 1px 2px 9px 0 rgba(47,44,44,.1);
	box-shadow: 1px 2px 9px 0 rgba(47,44,44,.1);
    margin-top: 0px;
}
.navbar-scroll .header-nav img {
	max-height: 70px;
	padding-top: 3px;
} 
@media (max-width: 991px){
.banner-heading-cn{
	letter-spacing: 6px;
	line-height:65px;
	font-weight: 600;
	font-size: 36px !important;
}
#mega-menu-wrap-primary {
	width: 100%;
	position: relative;
}
#mega-menu-wrap-primary .mega-menu-toggle {
	height: 0px !important;
}
    .mega-toggle-blocks-left, .mega-toggle-blocks-center {display: none !important;}
    .mega-toggle-blocks-right { height: 0px; }
    .mega-toggle-block {
        height: 140px !important;
        position: absolute;
        padding-bottom: 63px;
    }
}

/* Footer */
footer { 
	background: #00152B;
    display: block;
    overflow: hidden;
    margin-top: 50px;
   }
.footer-top {
    font-size: 13px;
    background: #00152B;
	padding: 55px 0px 0px 0px;
    font-weight: 500;
    color: #ffffff;
    overflow: hidden;
    position: relative;
    line-height: 30px;
}
.footer-top h3 {     
	color: #FFFFFF;
	font-family: 'Space Mono', monospace;
    letter-spacing: 4px;
	font-weight: 600;
    padding: 0px;
    margin: 15px 0px;
    font-size: 19px;
    position: relative;
    margin-bottom: 45px;
    text-transform: uppercase;
}
.footer-top ul {
	padding-left: 0px;
    list-style: none; 
	margin-bottom: 15px;
}
.footer-top ul li strong {
	font-weight: 400;
    letter-spacing: 0.5px;
}
.footer-top a {color: #E4E4E4;}
.footer-top a:hover {color: #F69125;}
.footer-copyright {
	background: #00152B;
	color: #fff;
	padding: 10px 0px;
	font-size: 14px;
}
.social-link {
    margin: 5px;
    display: inline-block;
    font-size: 20px;
    background: #FFFFFF;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    color: #262626 !important;
    text-align: center;
    padding-top: 5px;
}
.copyright-cn{ color: #929292;}
.hr-cn{background: #929292;}
#border{color: transparent;} 
.copyright-text{
	font-weight: 400; 
	letter-spacing: 1px;
}

.cta-heading{
	font-family: 'Space Mono', monospace;
	font-weight: 700;
	color:white;
	text-transform: uppercase;
	letter-spacing:4px;
}
.mega-menu-bg{
	background-color: #F69125; 
	color: #022A57;
	max-height: 535px;
}
.mega-menu-hr{
	background-color: #fff;
}
.megamenu-title-cn h2{
	font-family: 'Space Mono', monospace;
	font-weight: 600;
	text-transform: uppercase;
	font-size: 27px;
	letter-spacing: 4px;
	color: #022A57;
}
.megamenu-title-cn  h2:hover{
	font-family: 'Space Mono', monospace; 
	font-weight: 600; 
	text-transform: uppercase;
	font-size: 27px;
	letter-spacing: 4px;
	color: white;
}
.megamenu-title-cn p{color: #022A57;}
.imgArea{position:relative;}
.imgArea img{position: absolute; top:0; left:0;}

.menu{position: relative;}
.menu img{position: absolute; top:0; left:0;}
.mega-menu-no{font-size: 10px; color: #022A57;}
.mega-menu-nos{font-size: 10px; color: #f69125;}
.mega-menu-no:hover{color: white;}

.ti-number-title { 
	font-size: 95px;
	color: #ffffff; 
	text-align: right;
	border-top: 1px solid white;
}
.ti-number-title-two{
	font-size: 95px;
	color: #ffffff;
	margin: -10px auto 0;
	border-top: 1px solid white;
    display: inline-block;
}
.ti-number-text{ 
	font-size: 16px;
	color: white;
}
.ti-number-text-one{
	font-size: 16px; 
	color: white;
	margin: -35px auto 0;
}
.ti-home-img{margin:-90px auto 0;}

@media only screen and (max-width: 600px) {
  .ti-number-title, .ti-number-title-two{
     font-size: 57px;
	 padding-top: 10px;
	 margin: -10px auto 0;border-top: 1px solid white;
     display: block;
  }
	.ti-home-img{ margin-top: 70px;}
}

.cta-border{
	border-bottom: 1px solid white;
	display: inline;
	font-family: 'Space Mono'; 
	font-weight: bold;
    letter-spacing: 4px;
	text-transform: uppercase;
}

.cuttingimg {border-bottom: 1.5px solid white;width: 100%;}
.arrow:hover img{transform: translateY(-6px);transition: all 0.3s ease-in-out;}

.btn-default {
	  font-family: 'Space Mono', monospace;
	  text-transform: uppercase;
	  font-weight: 700;
	  font-size: 18px;
	  color: #01152B;
	  letter-spacing: 4px;
	  padding: 15px 30px 15px 30px;
	  border-radius: 50px;
	  background: #F69125;
	  transition: all 0.3s ease 0s;
 }

/*.btn-default:hover {
  color: #FFF;
  background: rgba(108, 88, 179, 0.75);
  border: 2px solid rgba(108, 89, 179, 0.75);
} */

@media (max-width: 1550px){
	.vc_tta-color-blue.vc_tta-style-modern.vc_tta-tabs .vc_tta-panels .vc_tta-panel-body{	  
    background: #00152B !important;
    padding: 20px;
	margin-top: 15px;
    border: 1px solid white !important;
}}

.parallax {
	  background-image: url("../image/Full-text.png");
	  /* Set a specific height */
	  height: 100%; 
	  /* Create the parallax scrolling effect */
	  background-attachment: fixed;
	  background-position: center;
	  background-repeat: no-repeat;
	  background-size: cover;
 }
.parallax-one {
	  background-image: url("../image/CodeAgon.png");
	  /* Set a specific height */
	  height: 100%; 
	  /* Create the parallax scrolling effect */
	  background-attachment: fixed;
	  background-position: center;
	  background-repeat: no-repeat;
	  background-size: cover;
 }
.video-play-button {
	  position: absolute;
	  z-index: 10;
	  top: 35%;
	  left: 74%;
	  transform: translateX(-50%) translateY(-50%);
	  box-sizing: content-box;
	  display: block;
	  width: 32px;
	  height: 44px;
	  border-radius: 50%;
	  padding: 27px 20px 18px 32px;
 }

.video-play-button:before {
	  content: "";
	  position: absolute;
	  z-index: 0;
	  left: 50%;
	  top: 50%;
	  transform: translateX(-50%) translateY(-50%);
	  display: block;
	  width: 80px;
	  height: 80px;
	  background: #315AF7;
	  border-radius: 50%;
	  animation: pulse-border 1500ms ease-out infinite;
 }

.video-play-button:after {
	  content: "";
	  position: absolute;
	  z-index: 1;
	  left: 50%;
	  top: 50%;
	  transform: translateX(-50%) translateY(-50%);
	  display: block;
	  width: 80px;
	  height: 80px;
	  background: #315AF7;
	  border-radius: 50%;
	  transition: all 200ms;
 }

.video-play-button:hover:after {
      background-color: darken(#fa183d, 10%);
 }

.video-play-button img {
	  position: relative;
	  z-index: 3;
	  max-width: 100%;
	  width: auto;
	  height: auto;
 }

.video-play-button span {
	  display: block;
	  position: relative;
	  z-index: 3;
	  width: 0;
	  height: 0;
	  border-left: 27px solid #fff;
	  border-top: 17px solid transparent;
	  border-bottom: 16px solid transparent;
 }

@keyframes pulse-border {
  0% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}

.video-overlay {
	  z-index: -1;
	  top: 0;
	  bottom: 0;
	  left: 0;
	  right: 0;
	  background: rgba(0,0,0,0.80);
	  opacity: 0;
	  transition: all ease 500ms;
 }

.video-overlay.open {
	  position: fixed;
	  z-index: 1000;
	  opacity: 1;
 }

.video-overlay-close {
	  position: absolute;
	  z-index: 1000;
	  top: 15px;
	  right: 20px;
	  font-size: 36px;
	  line-height: 1;
	  font-weight: 400;
	  color: #fff;
	  text-decoration: none;
	  cursor: pointer;
	  transition: all 200ms;
 }

.video-overlay-close:hover {
     color: #fa183d;
}

.video-overlay iframe {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translateX(-50%) translateY(-50%);
	  /* width: 90%; */
	  /* height: auto; */
	  box-shadow: 0 0 15px rgba(0,0,0,0.75);
 }

@media (max-width: 768px){
	#two-column input[type="email"]{width:275px !important;}
	#two-column #left input[type="text"]{width:275px !important;}
	#two-column{width: 313px !important;}
    #two-column textarea {
		position: relative;
		padding: 10px;
		border:1px solid #022A57;
		background:#F69125;
		width: 275px !important;
		height: 140px;
  }
	.vc_tta-color-grey.vc_tta-style-flat .vc_tta-panel .vc_tta-panel-title>a{color: white !important;}
	.vc_tta-color-grey.vc_tta-style-flat .vc_tta-panel .vc_tta-panel-heading {background-color: #022A57             !important; border: 1px solid white; margin-left: 5%; display: inline-block;}
	.vc_tta.vc_tta-gap-35 .vc_tta-panel:not(:last-child):not(.vc_active) .vc_tta-panel-heading {
     margin-bottom: 0px !important;}
	.vc_tta.vc_tta-spacing-35 .vc_tta-panel.vc_active .vc_tta-panel-heading, .vc_tta.vc_tta-spacing-35 .vc_tta-      panel:not(:last-child) .vc_tta-panel-heading{margin-bottom: 0px !important;}
	.arrow-ti{width: 26px; float: right; margin-top: -20px;}
 }

@media (max-width: 1024px){
	.tabs-methodology.vc_tta-color-blue.vc_tta-style-modern .vc_tta-panel .vc_tta-panel-title>a {
    color: #fff;
    background: #022A57;
    border-radius: 50px;
    border: 1px solid white;
}}

.vc_tta-color-grey.vc_tta-style-flat .vc_tta-tab>a {
    background-color: #022A57 !important;
    color: #fff !important;
	font-size: 21px;
}
.vc_tta-color-grey.vc_tta-style-flat .vc_tta-tab:hover>a {color: #F69125 !important;}
.years-count .vc_tta-color-grey.vc_tta-style-flat .vc_tta-tab.vc_active>a {
    background-color: #022A57 !important;
    color: #F69125 !important;
	border: 1px solid #F69125 !important;
}
@media (min-width: 210px){
.vc_tta-color-grey.vc_tta-style-flat.vc_tta-tabs .vc_tta-panels .vc_tta-panel-body {
    background-color: #022A57 !important;
	}}
@media (min-width: 768px){
.vc_tta-color-grey.vc_tta-style-flat.vc_tta-tabs .vc_tta-panels {background-color: #022A57 !important;}
}
.image-cn-social:hover {background: black;}
.mega_team_case_4 i {
    font-size: 20px !important;
	color: #F69125;
}
.mega_team_case_4 {
    max-width: 100%;
    position: relative;
    overflow: hidden;
    box-shadow: 0px 0px 12px transparent !important;
}
.cn-number-title-ti {
    font-size: 75px;
    color: #F69125;
    text-align: left;
	border-bottom: 1px solid white;
    width: 200px;
}
.platform-title{letter-spacing: 4px;}
.platform-download{text-decoration: underline;}

#two-column{width: 650px;}
#two-column #left{width: 325px;	float: left;}
#two-column #right{	width: 315px;float: right;}
#two-column p{margin-bottom: 16px;}
#two-column input[type="text"]{
	border:none;
	border:1px solid #022A57;
	background:#F69125;
	font-size :14px;
	width: 540px;
	padding: 10px;
}
#two-column input[type="email"]{
	border:none;
	border:1px solid #022A57;
	background:#F69125;
	font-size :14px;
	width: 315px;
	padding: 10px;
}
#two-column #right input[type="text"], #two-column #left input[type="text"]{width:315px;}
#two-column textarea {
    position: relative;
    padding: 10px;
    border:1px solid #022A57;
	background:#F69125;
    width: 650px;
	height: 140px;
}
#two-column input[type="submit"]{
	color:#00152B;
	display: inline-block;
	border-bottom: 1px solid #022A57 !important;
	background:#F69125;
	border: transparent;
	font-size: 24px;
	font-weight: bold;
	letter-spacing: 3px;
}
#two-column input[type="text"]:focus, #two-column textarea:focus{background: #F69125;}
#two-column input[type="submit"]:hover{	background:#F69125;	color:#022A57;}
::-webkit-input-placeholder { color: #00152B;}

.tabs-methodology.vc_tta-color-blue.vc_tta-style-modern .vc_tta-tab a::before {content: "";width: 15px !important;height: 15px !important;display: block !important;background: #f69125;border-radius: 50%;top: 0;margin: auto;position: unset;}
.tabs-methodology.vc_tta-color-blue.vc_tta-style-modern .vc_tta-tab a {
		border-color: transparent;
		background-color: transparent;
		color: #666;
		background: transparent !important;
		color: #fff;
		position: relative;
		display: block;
  }

.tabs-methodology.vc_tta-color-blue.vc_tta-style-modern .vc_tta-tab a::after {
		content: "";
		width: 30px !important;
		height: 30px !important;
		display: block !important;
		background: #f691258a;
		border-radius: 50%;
		top: 0;
		margin: -77.5px auto 0;
		opacity: 0;
		transition: 0.4s all;
}

.tabs-methodology.vc_tta.vc_tta-spacing-35 .vc_tta-tab::before {content: "";position: absolute;width: 225px;height: 1px;background: #fff;left: auto;right: -128px;top: 22px;}
.tabs-methodology.vc_tta.vc_tta-spacing-35 .vc_tta-tab:last-child::before {display: none;}
.tabs-methodology.vc_tta-color-blue.vc_tta-style-modern .vc_tta-tab a span.vc_tta-title-text {
		margin-top: 30px;
		display: block;
  }

.tabs-methodology.vc_tta-color-blue.vc_tta-style-modern .vc_tta-tab.vc_active a::after {opacity: 1;}
.tabs-methodology.vc_tta.vc_tta-spacing-35 .vc_tta-tab {
		margin-top: 18px;
		margin-bottom: 17px;
		margin-left: 18px;
		margin-right: 17px;
		position: relative;
		max-width: 200px;
		width: 100%;
		text-align: center;
  }
.tabs-methodology.vc_tta.vc_general .vc_tta-tab.vc_active>a::after, .vc_tta.vc_general .vc_tta-tab.vc_active>a::before {
    display: none;
    content: '';
     position: unset !important; 
    /* border-width: inherit; */
    /* border-color: inherit; */
    /* border-style: inherit; */
    /* width: 100vw; */
    /* height: 200vw; */
}
.tabs-methodology.vc_tta-color-blue.vc_tta-style-modern .vc_tta-tab.vc_active>a {
    border-color: transparent !important;
    background-color: transparent;
    color: #666;
}
.tabs-methodology.vc_tta-color-blue.vc_tta-style-modern .vc_tta-tab>a {
    border-color: transparent !important;
    background-color: transparent;
    color: #fff;
}
.tabs-section-ti .vc_tta-tabs-list .vc_tta-tab {border-top: 1px solid white;}
.page-id-22 .ac-style .ui-accordion-header-icon {
    font-size: 12px;
    float: right !important;
    border: 1px solid #707070 !important;
    padding: 6px !important;
}
.pp-section .ac-style .ui-accordion-header-icon {
    font-size: 15px;
    border: 1px solid #707070 !important;
    padding: 6px !important;
    float: right !important;
}
.years-section{border-top: 1px solid white; display: inline-block; padding-top:10px;}
.years-count .vc_tta-color-grey.vc_tta-style-flat .vc_tta-tab>a{border: 1px solid white;}
.cd-timeline-content {
    position: relative;
    margin-left: 60px;
    background: white;
    border-radius: 0.25em;
    padding: 1em;
    box-shadow: 0 0px 0 #ddd !important;
}
.desc-ti {font-weight: 200;}
.page-id-174{overflow-x: hidden;}
.timeline-para{color: #cccccc;}
.form-arrow{margin-left: -60px;}


@media only screen and (min-width: 1024px)
.cd-timeline-block {
    margin: 2px !important;
}
#cd-timeline .timeline-line {
    content: '';
    position: absolute;
    top: 0;
    left: 18px;
    height: 100%;
    width: 1px !important;
    background: #d7e4ed;
}
.cd-timeline-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    box-shadow: 0 0 0 7px #f691258a, inset 0 0px 0 rgb(0 0 0 / 8%), 0 3px 0 4px rgb(0 0 0 / 5%) !important;
}
@media only screen and (min-width: 1024px){
.cd-timeline-dot {
    width: 12px !important;
    height: 12px !important;
    margin-left: -7px !important;
	}}
@media only screen and (min-width: 1024px){
.cd-timeline-block {margin: 1em 0 !important;}
.top-right-border{border-top: 1px solid rgb(255, 255, 255,0.6);margin-left: -48px; display: block;}
.top-left-border{border-top: 1px solid rgb(255, 255, 255,0.6);margin-right: -48px; display: block;}
#cd-timeline .timeline-line { left: 50%;  margin-left: 0px !important;}
}

#cd-timeline .timeline-line {
    content: '';
    position: absolute;
    top: 64px !important;
    left: 18px;
    height: 96% !important;
    width: 4px;
    background: rgb(255, 255, 255,0.6) !important;
}
@media screen and ( max-width: 980px ) {
    .reverse {display: flex;flex-direction: column-reverse;}
 } 
.cd-timeline-content .timeline-arrow {
    content: '';
    position: absolute;
    top: 16px;
    right: 100%;
    height: 0;
    width: 0;
    border: 0px solid transparent !important; 
    border-right: 0px solid white !important;
}

.author-bottom-main {position: relative !important; height: 555px; }
.author-bottom{position: absolute; bottom: 20px;}


.header {
	position: absolute !important;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	-webkit-animation-name: kenburns-1;
	animation-name: kenburns-1;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
	-webkit-animation-duration: 20s;
	animation-duration: 20s;
	opacity: 1;
	-webkit-transform: scale(1);
	transform: scale(1);
	top: 0;
}

@keyframes kenburns-1 {
	0% {
		opacity: 1;
		-webkit-transform: scale(1.2);
		transform: scale(1.2)
	}
	1.5625% {
		opacity: 1
	}
	23.4375% {
		opacity: 1
	}
	26.5625% {
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1)
	}
	100% {
		opacity: 1;
		-webkit-transform: scale(1.2);
		transform: scale(1.2)
	}
	98.4375% {
		opacity: 1;
		-webkit-transform: scale(1.2117647059);
		transform: scale(1.2117647059)
	}
}
.position-relative { position: relative;}
.mw-100 { max-width: 100% !important;}
.overflow-hidden { overflow: hidden;}

.particles-js-canvas-el{
	height: 300px !important;
    margin-top: -313px !important;
}
.section-one-image-ti{
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  height: 100%; 
  width: 100%;
}
.bg-ti-1 {
  background-image: url('../image/Group-2696.jpg');
}
.bg-ti-2 {
  background-image: url('../image/ti-bg-scaled.jpg');
}


.scrollbar
{
	overflow-y: scroll;
	margin-bottom: 25px;
	max-height: 320px;
	background: #00152B;
	height: 55%;
}

#style-1::-webkit-scrollbar-track
{
	max-height: 50%; height: 50%;
}

#style-1::-webkit-scrollbar
{
	width: 6px;
	background-color: transparent;
}

#style-1::-webkit-scrollbar-thumb
{	
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
	background-color: #f69125;
}
.start-great-ti{
	text-transform: uppercase;
    font-size: 20px;
    font-weight: bold;
    letter-spacing: 2px;
}
.btn-learning {
    font-family: 'Space Mono', monospace;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 16px;
    color: #01152B;
    letter-spacing: 1px;
    padding: 15px 22px 15px 22px;
    border-radius: 50px;
    background: #F69125;
    transition: all 0.3s ease 0s;
}
.video-cover{
    text-transform: uppercase;
    color: #F69125 !important;
    font-family: 'Space Mono', monospace;
}