*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body{
    background-color: #fff;
    font-family: Argentum sans, sans-serif;
}
:root {
	--primary:#0071bd;
	--secondary:#93268f;
	--light:#fff;
	--shadow:0 1px 5p rgba(104, 104, 104, 0.8);
}

html{
	box-sizing: border-box;
	font-family: Argentum sans regular, Arial, Helvetica, sans- serif;
    scroll-behavior: smooth;
}




#bc2{
    display: none;
}
.search-icon i{
    /* position: absolute;
    float: right; */
    /* right: 0%; */
    width: 15px;
    height: 15px;
    /* line-height: 100px; */
    color: #2d2d2d;
    font-size: 16px;
    /* text-align: center; */
    cursor: pointer;
    /* margin-top: 60px; */
}
.search-icon i:hover{
    color: var(--primary);
}
.search-box{
    position: absolute;
    float: right;
    background-color: #2d2d2d;
    right: 0%;
    top: -150px;
    width: 300px;
    height: 50px;
    padding: 5px;
    box-shadow: var(--shadow);
    transition: all .14s step-end;
}
.search-box::before{
    content: '';
    position: absolute;
    top: 0;
    width: 0;
    right: 10px;
    height: 0;
    border: 10px solid transparent;
    border-bottom-color: #2d2d2d;
    margin: -20px 0 0;
}
.nav-form{
    width: 100%;
    height: 38;
    right: 0;
    background-color: #9b9b9b08;
    overflow: hidden;
    display: flex;
    border: 1px solid #0071bd;

}
.search{
    width: 95%;
    background-color: #2d2d2d;
    color: #fff;
    padding: 0 10px;
    font-family: inherit;
    font-size: 18px;
    font-weight: 400;
    border: 0;
    outline: none;
    height: 38px;
}
.sub{
    font-size: 18px;
    padding: 0 13px;
    border: 0;
    background-color: var(--primary);
    color: #fff;
    cursor: pointer;
}
.sub:hover{
    background-color: #93268f;
}
#bc2:checked ~ .search-box{
    top: 150px;
}
@media(max-width:1052px){
    nav{
        width: 100%;
    }
    .nav-ul{
        position: fixed;
        width: 300px;
        background-color: #2d2d2d;
        height: 100vh;
        text-align: center;
        transition: all .5s;
        top: -800px;
    }
    .nav-ul li{
        display: block;
        padding: 5px 0;
    }
    .nav-ul li:hover{
        background: none;
    }
    .nav-ul li a:hover{
        color:  aqua;

    }
    label.logo{
        position: absolute;
        width: 100%;
        align-content: center;
    }
    .btn{
        position: absolute;
        display: block;
        width: 60px;
        height: 60px;
        left: 5%;
        color: #fff;
        font-size: 14px;
        font-weight: 600;
        text-align: center;
        line-height: 60px;
        cursor: pointer;
        z-index: 20;
    }
    #bc1:checked ~ ul{
        top: 60px;
    }
}
@media(max-width:652px){
    ul{
        width: 100%;
    }
}




  /*top container*/
.top-container{
	width: 100%;
    margin: auto;
    padding: 1px 5%;
    height: auto;
}

/*showcases*/
.showcase{
	grid-area: showcase;
	min-height: 500px;
	/* background: url('../img/Mask Group 1.png');
	background-size: cover;
	background-position: center; */
	display: flex;
	flex-direction: column;
	align-items: start;
	justify-content: center;
	box-shadow: var(--shadow);
    margin-top: auto;
    /* border: #2d2d2d solid 1px; */
}
#bgVid {
    position: absolute;
    /* right: 0;
    bottom: 0; */
    width: 90%;
    min-height: 400px;
    z-index: -1;
  }
  .vid_text{
      padding-left: 3rem;
      width: 100%;
      height: 100%;
  }

  @media screen and (max-width: 800px) {
    #bgVid {
        min-height: auto;
        /* top: 110px; */
        /* border: solid red 1px; */
      }
    .vid_text{
        padding-left: 1.5rem;
    }
  }

.showcase h1{
	font-size: 3rem;
	margin-bottom: 30px;
	color: var(--light);
    font: Agentum sans;
    font-weight: 300;
    width: 50%;
    word-wrap: break-word;
    text-transform: capitalize;
    /* padding: 3rem; */
}

.showcase p{
	font-size: 1.3rem;
	margin-top: 0;
	color: var(--light);
    font: Agentum sans;
}

.career-showcase{
	min-height: 500px;
	background-size: cover;
	background-position: center;
	padding: 8rem;
	display: flex;
	flex-direction: column;
	align-items: center;
    margin-top: auto;

}
.career-showcase h1{
    font: Agentum sans;
    letter-spacing: 4px;
    font-weight: 200;
    margin-top: 80px;
}

.c-showcase{
	grid-area: showcase;
	min-height: 500px;
	background: url('../img/Mask Group 13@2x.png');
	background-size: cover;
	background-position: center;
	padding: 1rem;
	display: flex;
	flex-direction: column;
	align-items: start;
	box-shadow: var(--shadow);
    margin-top: auto;
}
.contact-showcase{
	grid-area: showcase;
	min-height: 300px;
	background: url('../img/CC Group 6@2x.jpg');
	background-size: cover;
	background-position: center;
	padding: 1rem;
	display: flex;
	flex-direction: column;
	align-items: start;
    margin-top: auto;
}
.ts{
    background: url('../img/Mask Group 8@2x.png');
    background-position: center;
    background-size: cover;
}

.mkts{
    background: url('../img/Mask Group -1@2x.png');
    background-position: center;
    background-size: cover;
}
.cpbts{
    background: url('../img/Mask Group 6@2x.png');
    background-position: center;
    background-size: cover;
}
.carrs{
    background: url('../img/Mask Group 10@2x.png');
    background-position: center;
    background-size: cover;

}
.carrs h1{
    color: var(--primary) !important;
    font-size: 2rem;
}

.cs-textbox{
    width: 100%;
    padding-left: 2%;
}

.cs-textbox h1{
    padding-bottom: 40px;
}

.cs-textbox p{
    margin-bottom: 40px;
}


.c-showcase h1{
	font-size: 4rem;
	margin-bottom: 0;
	color: var(--light);
    font: Agentum sans;
    font-weight: 300;
    width: 50%;
    word-wrap: break-word;
    padding-top: 15px;

}

.c-showcase p{
	font-size: 16px;
	margin-top: 0;
	color: var(--light);
    font: Agentum sans;
    font-weight: 200;
    width: 50%;
    line-height: 25px;
}

.contact-showcase h1{
	font-size: 3rem;
	margin-bottom: 0;
	color: var(--primary);
    font: Agentum sans;
    font-weight: 300;
    width: 50%;
    word-wrap: break-word;
    padding-top: 15px;
}
.contact-showcase p{
    color: #6d6d6d;
}

@media screen and (max-width : 800px){
    .contact-showcase h1{
        font-size: 2rem;
    }
    .cs-textbox h1{
        font-size: 2.5rem;
    }
    .cs-textbox p{
        width: 100%;
    }
    .c-showcase h1{
        font-size: 2.5rem;
    }
    .c-showcase p{
        width: 100%;
    }
    .c-showcase{
        min-height: 350px;
    }
}

.sc-btn{
	color: var(--light);
	padding: 1rem 2rem;
	text-decoration: none;
	border:1px solid var(--light) ;
    text-transform: uppercase;
    margin-top: 40px;
}
.sc-btn:hover{
    background-color: #fff;
    color: var(--secondary);
}

.op-oc{
    grid-area: showcase;
	min-height: 200px;
	background: url('../img/White washed business woman.png');
	background-size: cover;
	background-position: center;
	flex-direction: column;
	align-items: start;
	justify-content: center;
    margin-top: 60px;
}
.op-con{
    width: 100%;
    display: flex;
    flex-direction: row;
    grid-gap: 20px;
    padding: 20px 5%;
}

.training-text-container{
    width: 50%;
    display: flex;
    flex-direction: column;
    grid-gap: 20px;
    padding: 20px 5%;
    margin: 0;
}
.training-text-container h1 {
    color: var(--primary);
    font-weight: 400;
}

.training-text-container h3{
    color: var(--primary);
    font-weight: 400;
}

.training-text-container p{
    color: #575555;
    line-height: 20px;
    font-weight: 300;
}

 

  .op-oc-header,
  .op-oc-desc{
      width: 100%;

  }
  .op-oc-header h2{
    font: Argentum Sans;
    font-weight: 300;
    font-size: 50px;
    letter-spacing: 1px;
    color: #262626;
  }
  .p-color h2{
    color: var(--primary);
    font-size: 40px !important;
  }
  .op-oc-desc{
    font-weight: 300;
    letter-spacing: 0px;
    color: rgb(100, 100, 100);
    word-wrap: break-word;
    line-height: 20px;
    padding-right: 5%;
    
}


.slider{
    margin: auto;
    height: 450px;
    position: relative;
    width: 100%;
    display: grid;
    place-items: center;
    overflow: hidden;
}
.slide-track{
    display: flex;
    width: calc(350px * 10);
    animation: scroll 40s linear infinite;
}
.slide-track:hover{
    animation-play-state: paused;
}
@keyframes scroll{
    0%{
        transform: translateX(0);
    }
    100%{
        transform: translateX(calc(-350px * 5));
    }
}
.slide{
    height: 450px;
    width: 350px;
    display: flex;
    align-items: center;
    padding: 25px;
    perspective: 100px;
}
.slide img{
    width: 100%;
    transition: transform 1s;
}
.slide img:hover{
    transform: translateZ(20px);
}

/* gradient */

.slider::before,
.slider::after{
    background: linear-gradient(to right, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
    content: '';
    height: 100%;
    position: absolute;
    width: 15%;
    z-index: 2;
}
.slider::before{
    left: 0;
    top: 0;
}
.slider::after{
    right: 0;
    top: 0;
    transform: rotate(180deg);
}

  /*-------------- ceo message section starts ----------*/
  
.ceo-sec{
    padding: 0px 5%;
    /* border: red solid 1px; */
    height: auto;
}
   .ceo-m-s{
    display: flex;
    flex-direction: row;
    height: auto;
    position: relative;
    margin-top: 160px;
    background: #f1f1f1;
    width: 100%;
   }

   
   @media screen and (max-width: 1000px) {
    .ceo-m-s{
      width: 100%;
      display: block;
      height: auto;
      margin-top: 10px;
    }
  }


  .ceo-m{
    padding: 10px;
    /* border: red solid 1px; */
    width: 50%;
  }
  .desc{
      padding-top: 150px;
      padding-bottom: 60px;
      position: relative;
      right: 0;
      float: right;
  }

  .ceo-m img{
      width: 100%;
  }
  .ceo-m-img{
    position: relative;
    z-index: 1;
    left: 0;
    bottom: 0;
    float: left;
  }
  .ceo-m h2{
    font: Argentum Sans;
    font-weight: 300;
    font-size: 40px;
    letter-spacing: 3px;
    color: var(--secondary);
}
.ceo-m h5{
    font: Argentum Sans;
    font-size: 15px;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-top: 80px;
    font-weight: 400;
}
.ceo-m p{
    padding-top: 0px;
    font-weight: 200;
    letter-spacing: 0px;
    color: rgb(100, 100, 100);
    font-style: italic;
    font-size: 16px;
    padding-right: 10%;
    line-height: 1.5;
}
.ceo-m-btn{
    text-decoration: none;
    color: var(--light);
    background: var(--primary);
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    cursor: pointer;
    display: inline-block;
    text-transform: uppercase;
    border-radius: 20px;
    margin-top: 40px;
    padding: 15px;
}
.ceo-m-btn:hover{
    filter: brightness(110%);
}

/* Contact page styles*/

.con-holder{
    width: 60%;
    margin: 0 20%;
    padding: 20px;
}
.con-info{
    margin-top: 50px;
}
.con-info h2{
    color: #0071bd;
    font-size: 1.5rem;
    font-weight: 100;
}
.con-info p{
    margin-top: 20px;
    color: #2d2d2d;
    font-size: 14px;
    line-height: 2;
}
.con-info a{
    margin-bottom: 50px;
}

.contact-roll-2{
    background-color: #0071bd;
    min-height: 500px;
}
.c-roll-container{
    width: 70%;
    margin: 0 15%;
    text-align: center;
    padding:60px;
}
@media screen and (max-width:800px) {
    .c-roll-container, .con-holder{
        width: 90%;
        margin: 0 5%;
        text-align: left;
        padding:20px;
    }
}
.c-roll-container h2{
    color: #fff;
    font-size: 1.5rem;
    font-weight: 100;
}
.c-roll-container p{
    margin-top: 20px;
    color: #fff;
    font-size: 16px;
    line-height: 2; 
    font-weight: lighter;
}
.sub-button{
    background-color: #fff;
    color: #93268f;
}

   /*-----------partner section starts-----------------*/
.partner{
    background: var(--secondary);
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 80px;
    height: auto;
    padding: 80px 5%;
}


.pj-s{
    color: var(--light);
    padding-top: 50px;
}
.pj-s h1{
    font: Argentum Sans;
    font-weight: 300;
    font-size: 40px;
    letter-spacing: 3px;
}
.pj-s h4{
    font: Argentum Sans;
    font-size: 20px;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-top: 80px;
    font-weight: 200;
}
.pj-s p{
    padding-top: 60px;
    font-weight: 200;
    letter-spacing: 1px;
    font-weight:smaller;
}
.text-2{
    font-size: 15px;
    text-align: left;
    font-weight: 200;
    line-height: 25px;
}
.pj-s-btn{
    text-decoration: none;
    color: var(--light);
    background: var(--primary);
    font-size: 14px;
    font-weight: 600;
    text-align: center;
    cursor: pointer;
    display: inline-block;
    text-transform: uppercase;
    border-radius: 20px;
    margin-top: 40px;
    padding: 20px;
}
.pj-s-btn:hover{
    filter: brightness(110%);
}
.pj-search-box{
    width: 80%;
}
.pj-s-form{
    width: 100%;
    height: 50px;
    overflow: hidden;
    display: flex;
    margin-top: 10px;

}
.pj-search{
    width: 95%;
    background-color: var(--light);
    color: #2d2d2d;
    padding: 0 10px;
    font-family: Argentum Sans;
    font-size: 18px;
    font-weight: 400;
    border: 0;
    outline: none;
    height: 50px;
}
.career-s-b{
    border: var(--primary) solid 2px;
}
.pj-sub{
    font-size: 18px;
    padding: 0 23px;
    border: 0;
    background-color: var(--primary);
    color: #fff;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
    cursor: pointer;
}
.pj-sub:hover{
    filter: brightness(110%);
}
@media screen and (max-width: 800px) {
    .pj-s-btn{
      height: auto;
      font-size: 16px;
      width: 100%;
    }
  }
  @media screen and (max-width: 600px) {
    .pj-s-btn{
        font-size: 14px;
    }
    .pj-s{
        padding: 20px;
    }
  }
 /*-----------partner section starts ENDS -----------------*/


 /*-------------containers--------------*/
 .con-1-bg{
	background: url('../img/Mask Group 2@2x.png');
}
.con-2-bg{
	background: url('../img/Leadership 2@2x.png');
}
.con-3-bg{
	background: url('../img/Mask Group 4@2x.png');
}
.con-6-bg{
	background: url('../img/tac/partners2.png');
}
.con-1-bg-ts{
    background: url('../img/Mask Group 15@2x.png');
    height: auto;
}
.con-2-bg-ts{
    background: url('../img/Mask Group 14@2x.png');
    height: auto;
}

.con-1-bg-ms{
	background: url('../img/Mask Group -2@2x.png');
}
.con-2-bg-ms{
	background: url('../img/Mask Group 16@2x.png');
}
.con-3-bg-ms{
	background: url('../img/Mask Group 17@2x.png');
}
.con-4-bg-ms{
	background: var(--light);
}
.con-5-bg-ms{
	background: url('../img/Mask Group 19@2x.png');
}
.con-6-bg-ms{
	background: url('../img/Mask Group 20@2x.png');
}
.con-7-bg-ms{
	background: url('../img/Mask Group 21@2x.png');
}
.con-8-bg-ms{
	background: url('../img/Mask Group 22@2x.png');
}
.con-9-bg-ms{
	background: url('../img/Mask Group 23@2x.png');
}
.con-10-bg-ms{
	background: url('../img/Mask Group 24@2x.png');
}
.con-1-bg-cap{
    /* min-height: 100px; */
    background-image: 
    linear-gradient(to left, transparent 30%, white 80%),
    url('../img/tac/CYBER OPERATIONS 1.jpg');
}

.con-2-bg-cap{
    /* min-height: 100px; */
    background-image: 
    linear-gradient(to right, transparent 20%, white 60%),
    url('../img/tac/DIGITAL MODERNIZATION 2.jpg');
}

.con-3-bg-cap{
    /* min-height: 100px; */
    background-image: 
    linear-gradient(to left, transparent 20%, white 60%),
    url('../img/tac/INTEGRATED SYSTEMS 1.jpg');
}

.con-4-bg-cap{
    /* min-height: 100px; */
    background-image: 
    linear-gradient(to right, transparent 20%, white 60%),
    url('../img/tac/MISSION OPERATIONS.jpg');
}

.con-5-bg-cap{
    /* min-height: 100px; */
    background-image: 
    linear-gradient(to left, transparent 20%, white 60%),
    url('../img/tac/MISSION SOFTWARE SYSTEMS.jpg');
}

.con-6-bg-cap{
    /* min-height: 100px; */
    background-image: 
    linear-gradient(to right, transparent 20%, white 60%),
    url('../img/tac/MISSION SOFTWARE SYSTEMS.jpg');
}

.con-7-bg-cap{
    /* min-height: 100px; */
    background-image: 
    linear-gradient(to right, transparent 20%, white 60%),
    url('../img/tac/MISSION OPERATIONS.jpg');
}

.con-8-bg-cap{
    /* min-height: 100px; */
    background-image: 
    linear-gradient(to right, transparent 20%, white 60%),
    url('../img/tac/MISSION OPERATIONS.jpg');
}
#core-values{
    background-image: 
    linear-gradient(to right, transparent 20%, var(--primary) 60%),
    url('../img/tac/core.png');
    background-repeat: no-repeat;
    background-size: cover;

}

@media screen and (max-width: 800px) {
    .con-1-bg-cap{
        background: linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,.99)),
        url('../img/tac/CYBER OPERATIONS 1.jpg');
    }
    .con-2-bg-cap{
        background: linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,.99)),
        url('../img/tac/DIGITAL MODERNIZATION 2.jpg');
    }
    .con-3-bg-cap{
        background: linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,.99)),
        url('../img/tac/INTEGRATED SYSTEMS 1.jpg');
    }
    .con-4-bg-cap{
        background: linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,.99)),
        url('../img/tac/MISSION OPERATIONS.jpg');
    }
}

.cap-1-bg{
    background: url('../img/Mask Group 24@2x.png');
}
.newsfeed{
    padding: 20px 5%;
}

.text {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    /* -webkit-line-clamp: 6; number of lines to show */
    -webkit-box-orient: vertical;
    line-height: 25px;

    font-weight: 450;
    letter-spacing: 0px;
    word-wrap: break-word;
    padding-right: 5%;
 }
 .text-partners > p{
     color: rgb(180, 177, 177) !important;
 }

.container-header{
    float: right;
    width: 90%;
}
@media screen and (max-width: 800px){
    .container-header{
        width: 100%;
    }
}
.container-header h1{
    color: var(--primary);
    font-weight: 400;
}
.color-sec{
    color: var(--secondary) !important;
}
.markets-topic{
    width: 100%;
    text-align: center;
    padding: 40px;
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
}
.markets-topic h1{
    font-size: 2.5rem;
	margin-bottom: 0;
	color: var(--secondary);
    font: Agentum sans;
    font-weight: 300;
    word-wrap: break-word;
    padding-top: 70px;
}
.markets-topic p{
    font: Agentum sans;
    padding: 20px;
    color: #2d2d2d;
    font-size: 1.2rem;
    padding-bottom: 70px;
}


.container, .container-r, .sec-row-awards{
	min-height: 400px;
    background-size: cover;
	background-position: center;
	padding: 3rem;
	display: flex;
	/* flex-direction: row; */
	align-items: start;
	justify-content: center;
    margin: 70px 5%;
    width: 90%;
    /* border: solid red 1px; */
}

.container h1{
	font-size: 30px;
	margin-bottom: 0;
	/* color: #2d2d2d; */
    font: Agentum sans;
    width: 100%;
    color: var(--primary);
    font-weight: 400;
    /* word-wrap: break-word; */
}

.container h3{
	font-size: 20px;
	margin-bottom: 0;
    font: Agentum sans;
    width: 100%;
    color: var(--primary);
    font-weight: 300;
    margin-top: 20px;
    /* word-wrap: break-word; */
}

.container p{
	font-size: 16px;
    font: Agentum sans;
    width: 100%;
    margin-top: 20px;

    color: #575555;
    line-height: 25px;
    font-weight: 300;
}
#m-head{
    color: var(--secondary);
}
.c-h-btn{
    text-decoration: none;
    color: var(--light);
    background: var(--secondary);
    font-size: 15px;
    font-weight: 600;
    text-align: center;
    cursor: pointer;
    display: inline-block;
    text-transform: uppercase;
    border-radius: 10px;
    margin-top: 40px;
    padding: 10px;
}
.button-btn{
    background-color: var(--secondary);
    border: none;
    color: var(--light);
    padding: 10px 12px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 15px;
    text-transform: uppercase;
}
#modal-btn-w{
    background-color: var(--light);
    color: var(--primary);
}
.color-2n{
    background: var(--primary);
}
.bt-stroke{
    border: var(--light) solid 1px;
    background: var(--primary);
}
.c-h-btn:hover{
    filter: brightness(110%);
}

.container-r h1,
.sec-row-awards h1{
    font-size: 30px;
	margin-bottom: 0;
    font: Agentum sans;
    width: 100%;
    color: var(--primary);
    font-weight: 400;
}
.container-r p{
	font-size: 16px;
    font: Agentum sans;
    width: 100%;
    margin-top: 20px;

    color: #575555;
    line-height: 25px;
    font-weight: 300; 
    
    height: auto;
}
.con-col {
    float: right;
    width: 50%;
    height: auto;
  }


@media screen and (max-width: 600px) {
    .container h1, .container p, .c-showcase h1{
      width: 100%;
      display: block;
      height: auto;
    }
  }
  @media screen and (max-width: 800px) {
    .container h1, .container p, .c-showcase h1{
      width: 100%;
      display: block;
      height: auto;
    }
  }

/*-------------containers   end--------------*/

.boxes{
	display: grid;
	grid-gap: 10px;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
}

.box{
	background: var(--light);
	text-align: left;
	padding: 1.5rem;
}
/* .sec-row{
    background: var(--primary);
    grid-gap: 30px;
    min-height: 600px;
} */

.values{
    color: #fff;
    text-align: center;
    padding-bottom: 40px;
}
.values h1,.pat-col-2 h1{
    font-size: 2.5rem;
	margin-bottom: 0;
    font: Agentum sans;
    font-weight: 150;
    word-wrap: break-word;
    padding: 50px;
}
.values p{
    font-size: 1rem;
    letter-spacing: 1px;
    font: Agentum sans;
    word-wrap: break-word;
    margin-left: 30%;
    margin-right: 30%;
}

.sec-row-awards{
    background: var(--light);
    display: flex;
    flex-direction: row;
    height: 600px;
    padding: 0;
    position: relative;
    width: 90%;
}
.rna-col{
    width: 50%;
}
.sec-row-awards p,
.pat-col-2 p
{
    font-size: 1.3rem;
	color: #2d2d2d;
    letter-spacing: 2px;
    font: Agentum sans;
    font-weight: 250;
    margin-top: 20px;
}


.award-img img{
    width: 100%;
}
.award{
    position: absolute;
    z-index: 1;
    bottom: 0;
    right: 0;
}
.award-text{
    left: 0;
    position: absolute;
}
@media screen and (max-width: 1000px) {
    .sec-row-awards{
      width: 100%;
      display: block;
      height: auto;
    }
  }

  .pat-row{
    background: var(--light);
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 0px;
    height: auto;
    margin-bottom: 60px;
    
}
.pat-col-2{
    text-align: center;
}
.c-build,.res-a{
 width: 90%;
 margin-left: 5%;
 margin-right: 5%;
}
.c-build h1, .res-a h1{
    color: var(--secondary);
    text-align: center;
    font: Agentum sans;
    font-weight: 200;
    padding: 60px;
    font-size: 2.5rem;
}

.c-build-grid{
    width: 90%;
    margin: auto;
    display: flex;
    grid-template-columns: repeat(3, 1fr);
    color: var(--primary);
    
}
.c-middle{
    border-right: var(--primary) solid 2px;
    border-left: var(--primary) solid 2px;
}
.c-b-box{
    padding: 80px;
    width: 100%;
    text-align: center;

}
.c-build-bt{
    text-align: center;
    margin-bottom: 60px;
}

.ref-sec{
    min-height: 500px;
	background: url('../img/Mask Group 11.png');
	background-size: cover;
	background-position: center;
	flex-direction: column;
	align-items: start;
	justify-content: center;
    margin-top: 60px;

}
.res-a-grid{
	display: grid;
	grid-gap: 10px;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

.res-a-box{
	text-align: left;
	padding: 1.5rem;
	box-shadow: var(--shadow);
    width: 100%;
}
.res-a-footer{
    text-align: center;
    border-top: var(--primary) solid 1px;
    margin-top: 70px;
    padding-top: 40px;
    padding-bottom: 100px;
}
.res-h{
    color: var(--primary);
    margin-bottom: 40px;
}
.res-c{
    color: #2d2d2d;
    margin-bottom: 60px;
}
.res-l{
    color: var(--secondary);
    margin-bottom: 40px;
}

.footer {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex-flow: row wrap;
    padding: 50px;
    color: #fff;
    background: #262626;
    background: url('../img/group-of-businesspeople EDIT@2x.png');
	background-size: cover;
	background-position: center;
}

.company{
    background: url('../img/Mask Group 5@2x.png');
    background-size: cover;
	background-position: center;
}

.training{
    background: url('../img/Mask Group 9@2x.png');
    background-size: cover;
	background-position: center;
}
.markets{
    background: url('../img/Mask Group -3@2x.png');
    background-size: cover;
	background-position: center;
}
.careers{
    background: url('../img/Mask Group 12@2x.png');
    background-size: cover;
	background-position: center;
}
.capabilities{
    background: url('../img/Mask Group 7@2x.png');
    background-size: cover;
	background-position: center;
}

.sec-col{
    display: flex;
    flex-direction:row;
    /* border: solid red 1px; */
}
.sec-col-box{
    width: 50%;
    min-height: 400px;
    /* border: solid blue 1px; */
}
.company-row,
.capabilities-row,
.training-row{
    display: flex;
    width: 100%;
}
.company-col-left,
.capabilities-col-left,
.training-col-left{
    flex-basis: 50%;
    height: auto;
    /* border: olive solid 1px; */
}
.company-col-right,
.capabilities-col-right,
.training-col-right{
    flex-basis: 50%;
    height: auto;
    /* border: orange solid 1px; */
}
@media screen and (max-width: 800px)  {
    .company-row,
    .capabilities-row,
    .training-row{
        display: block;
    }
}
.scb-mision{
    width: 100%;
    /* border: #2d2d2d solid 1px; */
    min-height: 300px;
    /* margin-left: -150px; */
}

.contact-wrapper{
    padding: 5% 0;
    display: flex;
    /* align-items: center; */
    flex-wrap: wrap;
    width: 90%;
    margin: 0 5%;
}

.contact-col-left{
    flex-basis: 50%;
}

.contact-col-left h1{
    color: var(--primary);
    margin-bottom: 20px;
    font-weight: 300;
}

.contact-col-left h3{
    color: var(--primary);
    margin-top: 20px;
    font-weight: 300;
}

.contact-col-left p{
    color: #575555;
    font-weight: 300;
}

.contact-col-right{
    flex-basis: 50%;
}

@media screen and (max-width: 800px) {
    .contact-col-right{
        flex-basis: 100%;
        margin-top: 20px;
    }
  }



.footer > *{
    flex: 1 100%;
}
.footer li{
    list-style: none;
}

.l-footer{
    margin-right: 1.25em;
    margin-bottom: 2em;
}


.a-footer{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 30px;
    height: 500px;
}
.a-footer-1{
    display: block;
}

.a-footer-1 a{
    display: block;
    margin-top: 20px;
    width: 90%;
    line-height: 50px;
    text-align: center;
    border-radius: 20px;
    border: solid 1px #fff;
}
.a-footer-1 a:hover{
    background: gray;
    text-decoration: none;
}

@media screen and (max-width: 1000px) {
    .a-footer{
      width: 100%;
      display: block;
      height: auto;
    }
  }
.a-footer-1 a{
    font: Argentum Sans;
    font-weight: 500;
    font-size: 20px;
    letter-spacing: 3px;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
}

/* .a-footer-1 ul{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 20px;
    height: 600px;
} */
@media screen and (max-width:600px) {
    .a-footer-1 ul{
        display: block;
        width: 100%;
        height: auto;
        margin-bottom: 40px;
        padding: 20px;
    }
    .a-footer-1 a{
        display: block;
        margin-top: 20px;
        width: 100%;
        line-height: 50px;
        text-align: center;
        border-radius: 50px;
        border: solid 1px #fff;
    }
    .a-footer-1 a:hover{
        background: gray;
        text-decoration: none;
    }
    .a-footer-2 p{
        width: 100%;
    }
    .a-footer-2-btn{
        width: 100%;
    }
}

.a-footer-2 h1{
    font: Argentum Sans;
    font-weight: 300;
    font-size: 50px;
    letter-spacing: 3px;
}
.a-footer-2 p{
    padding-top: 60px;
    font-weight: 400;
    letter-spacing: 2px;
    width: 100%;
}
.a-footer-2-btn{
    text-decoration: none;
    color: var(--light);
    border: #fff solid 1px;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    cursor: pointer;
    display: inline-block;
    text-transform: uppercase;
    border-radius: 20px;
    margin-top: 40px;
    padding: 10px;
}
.a-footer-2-btn:hover{
    background: #fff;
    color: #6d6d6d;
}


.h-box{
    column-count: 2;
    column-gap: 1.25em;
}

.b-footer{
    color: #fff;
    padding-top: 50px;
    border-top: #fff solid 1px;
    display:inline-flex;
    margin-top: 60px;
    gap: 20px;
    flex-direction: row;
    width: 100%;
    font-size: 15px;
}
.b-footer li{
    display: inline-flex;
}
.b-footer-c-info{
    flex: 1;
}
.b-footer-menu{
    flex: 1.5;
    align-content: center;
    text-align: center;
    
}
.b-footer-icon{
    flex: 0.5;
    align-content: center;
    width: 100%;
}
.b-footer-icon li{
    margin-left: 10px;
}
.b-footer-icon ul{
    float: right;
}

.b-footer-icon img{
    height: 20px;
}

@media screen and (max-width: 1000px) {
    .b-footer{
      width: 100%;
      display: block;
      height: auto;
    }
    .b-footer-c-info,
    .b-footer-menu,
    .b-footer-icon{
        margin-top: 20px;
        
    }
  }
  @media screen and (max-width: 600px){
    .b-footer-menu a{
        display: block;
        margin-top: 20px;
    }
  }
.b-footer-c-info a{
    color: #fff;
    text-decoration: none;
    font-weight: 300;
    letter-spacing: 1px;
    padding-right: 10px;
    font-size: 15px;
}
.b-footer-c-info a:hover{
    filter: brightness(120%);
}
.b-footer-c-info p{
    padding-top: 2px;
}

.l-footer p{
    padding-right: 20px;
    color: #fff;
}

.b-footer-menu a{
    color: #fff;
    text-decoration: none;
    font-weight: 450;
    letter-spacing: 1px;
    padding-right: 5px;
    margin: 0px 5px;
}
.b-footer-menu a:hover{
    filter: brightness(120%);
}
.b-footer-menu p{
    padding-top: 2px;
}
.b-footer-icon li{
    justify-content: space-between;
}

.l-footer p{
    padding-right: 20px;
    color: #fff;
}

/* forms */
/* The Modal (background) */
.modal {
    display: none; 
    position: fixed; 
    z-index: 300; 
    left: 0;
    top: 0;
    width: 100%; 
    height: 100%; 
    overflow: auto; 
    background-color: rgb(0,0,0); 
    background-color: rgba(0,0,0,0.4); 
  }

  
  /* Modal Content/Box */
  .modal-content {
    background-color: rgba(255,255,255,0.8);
    margin: 2% auto; 
    padding: 20px;
    border: 1px solid #888;
    width: 50%; 
    border-radius: 5px;
  }
  @media screen and (max-width:800px) {
    .modal-content {
        width: 90%; 
        margin: 30% auto;
      }
  }

  /* Hide scrollbar for Chrome, Safari and Opera */
  .modal::-webkit-scrollbar {
    display: none;
  }

  .modal {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
  }
  
  /* The Close Button */
  .close {
    color: #888;
    float: right;
    font-size: 20px;
    font-weight: bold;
  }
  
  .close:hover,
  .close:focus {
    color:#93268f;
    text-decoration: none;
    cursor: pointer;
  }

 
input[type=text], select, textarea {
    width: 100%; 
    padding: 12px;  
    /* border: 1px solid #ccc;  */
    /* border-radius: 4px;  */
    /* box-sizing: border-box;  */
    margin-top: 6px; 
    margin-bottom: 16px; 
    resize: vertical ;
    border: 0;
    border: 1px solid #b4becb;
    background: transparent; 
  }

  input:focus,
  textarea:focus{
      outline: none;
      background-color: #0071bd;
      color: #fff;
  }
  input:focus::placeholder,
  textarea:focus::placeholder {
    color: #fff;
  }


 input[required] + label {
    position: relative;
    left: 5px; /* move the label left and place it inside the input */
    top: -45px;
    color: #757575; /* placeholder color here */
}
input[required] + label:after {
    content:'*';
    color: red;
}
 
  input[type=submit] {
    background-color: #0071bd;
    color: white;
    padding: 12px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
  }
  
 
  input[type=submit]:hover {
    background-color: #93268f;
  }

  
  
  .contact-form-container {
    border-radius: 5px;
    background-color: #fff;
    padding: 20px;
  }
  .contact-form-container p{
      color: red;
  }

@media screen and (min-width:600px) {
    .r-footer > *{
        flex: 1;
    }
    .features {
        flex-grow: 2;
    }
    .l-footer{
        flex: 1 0px;
        padding: 20px;
    }
    .r-footer{
        flex: 2 0px;
    }
    
}

@media screen and (max-width: 800px){
    .top-container{
        padding-top: 100px;
        /* border: #0071bd solid 1px; */
        min-height: auto;
    }
    .showcase{
        /* min-height: 500px;
        padding: auto; */

        margin-top: 70px;
        margin-bottom: 0px;
        min-height: auto;
        padding: 0;
        justify-content: center;

    }
    .showcase h1{
        font-size: 1.5rem;
        width: 100%;
    }
    .ceo-m, .op-con, .op-oc{
        padding-left: 5%;
        padding-right: 5%;
        padding-bottom: 40px;
        width: 100%;
      }
    .desc{
        padding-top: 10px;
    }
      .op-oc-desc{
          padding: 0px;
          width: 100%;
      }
      .op-oc-header{
          width: 100%;
          padding-bottom: 40px;
      }
      .op-oc-header h2{
        width: 100%;
        font-size: 2em;
    }

    .op-con{
        width: 100%;
        display: block;
        height: auto;
      }
      .port-imgs img{
        width: 100%;
        display: block;
        flex-direction: row;
        padding: 30px 5%;
    }
    .port-imgs{
        display: block;

    }
    .partner{
        width: 100%;
        display: block;
        height: auto;
      }
      .con-col {
        float: 0;
        width: 100%;
      }
      /* .container, 
      .container-r, 
      .sec-row-awards{
          display: block;
          height: auto;
          padding: 0 15px;
      }
      .container, .container-r {
          padding-bottom: 50px;
      } */
      .c-build-grid{
        width: 100%;
        margin: auto;
        display: block;   
    }
    .c-middle{
        border-right: 0px;
        border-left: 0px;
    }
    .career-showcase{
        padding: 8rem 2rem;
        display: block;
    
    }
    .scroll-nav ul li .dot span{
        display: none;
        /* border: red solid 2px; */
        visibility: hidden;
    }
    .container h1,
    .container p{
        width: 100%;

    }
    .sec-col{
        display: block;
        flex-direction:row;
        
    }

    .sc-btn{
        padding: .5rem 1rem;
        font-size: 12px;
    }
    .sec-col-box,
    .pj-search-box{
        width: 100%;
        padding: 0;
        border: red solid 1px;
        height: auto;
        padding: 20px;
    }
    .company-mision-col-right{
        display: none;
    }
   
    .values p{
        margin: 0 5%;
    }
    .sec-row-awards{
        display: block;
        height: auto;
        width: 100%;
        position: relative;
        padding: 0;
        width: 90%;
        
    }
    .rna-col{
        width: 100%;
    }
    .award{
        position: relative;
        width: 100%;
    }

    .award-text{
        left: 0;
        position: relative;
    }
    .award-text header{
        padding-bottom: 40px;
    }
  
}

@media screen and (max-width: 500px) {
    .sec-col-box,
    .pj-search-box{
        min-height: 400px;
    }
    .company-mision-col-right{
        display: none;
    }
}

@media screen and (max-width: 400px) {
    .sec-col-box,
    .pj-search-box{
        min-height: 300px;
    }
    .company-mision-col-right{
        display: none;
    }
}

@media screen and (max-width: 300px) {
    .sec-col-box,
    .pj-search-box{
        min-height: 700px;
    }
    .company-mision-col-right{
        display: none;
    }
}