/*/

colors and backgrounds

/*/

body {
	font-family:"Poppins";
    color:#333;
    
}

.wbg {
    background:#fff;
        color: #333;
}

.bg1 {
    background:#f6f6f6;
  /*/  border-top:1px solid #e9e9e9;
    border-bottom:1px solid #e9e9e9; /*/
    color: #333;
}

.bg2 {
    background: #fff;
    border-top: 1px solid #f5f5f5;
    border-bottom: 1px solid #f5f5f5;
    color: #333;
}

.bg3 {background: #1e1e1e;}

.bg3, .bg3 .container .footer .col h2, .bg3 .col > p {color:#e7e7e7 !important;} 

.bg3 a, .bg3 a:active,.bg3 a:link,.bg3 a:hover, .bg3 a:visited{color:#e7e7e7 !important;} 

.bg4 {background: #f6f3ec;color: #000;}

.bg5 {background: #f9f9f9;}

.bg6, .bg6 > .container > .quote > q, .bg6 > .container > .quote > q a:link {background: #004945; color:#fff;}   /*/wafd bank color/*/

.bg7 {background: #3598dc; color:#fff;}

.bg8 {background: #dde3de}

.bgku {
background: #011520; color:#fff;
}


.bbg {
    background:#000;
    color:#efefef;
}

.bbg > .container{

}

.bbg a:link {
    color: #fff;
    text-decoration: none;
}

.bbg a:hover {

    color: #fff;

    text-decoration: underline;

}






/*/ bootstrap override /*/
.card, list-group{
border-radius: 0;
}




.border{

    border: 1px solid #e5e5e5;

}

/*  Fonts  */





.f1 {font-family: 'Roboto', sans-serif;}

.f2 {font-family: 'Spectral', serif;}

/* .f3 font-family: 'Playfair Display', serif;} */

/* .f4 font-family: 'Montserrat', sans-serif;} */



/* .f5 {font-family: 'Karla', sans-serif;} */

/* .f6 {font-family: 'Libre Franklin', sans-serif;} */

/* .f7 {font-family: 'Questrial', sans-serif;} */



.f8 {font-family: "Poppins"; font-style: normal;}



.fw100 {font-weight:100!important;}

.fw300 {font-weight:300!important;}

.fw500 {font-weight:500!important;}







.color-1-type {

color:#3598dc;

}  


.cw {color:#fff;}

.c1 {color:#e1c796;}

.c5 {color:#ffe89f;}

.c8 {color:#e6e4d7;}







.top{

margin-top:200px;

}





.padding{

padding:15px;

}

.p-t{

    padding-top: 15px;

}



/*

.hero,.col .service,.col .feature {

font-family:'Raleway', sans-serif;

}

*/

/* Headings */



h1, h2, h3, h4 {

font-family: "Poppins"

}



.col h1 {}



.col h2 {

font-size: 26px;

/* color: #464646;  #826838;  #3598dc;*/

}



h3 {

font-size: 21px;
line-height: 1.5;

}



h3 > a{

	text-decoration: none;

}



h4 {

font-size: 17px;

font-weight: 500 !important;

}



.heading-no-margin h1, .heading-no-margin h2, .heading-no-margin h3, .heading-no-margin h4{

    margin-top: 0;

}



q{

    font-size:21px;

    color: #8a8a8a;

    font-style: italic;

}



a:hover {

text-decoration:underline;

}



.section {

width:100%;

}



.container, .container-sm, .container-fl  {

position:relative;

font-size:17px;

/*/ overflow:hidden; /*/

margin:0 auto;

}





.section .container {

 padding:10px 10px 30px 15px; 

}



.section .container-sm {

padding:30px 0 10px 0;
position:relative;
font-size:17px;
}


.section .container-fl {

padding:  0 15px;
position:relative;
font-size:17px;
}






.hold {

min-height:70px;

}



.hold.small {

min-height:60px;

}



.header {
width:100%;
transition:line-height .2s linear, box-shadow .2s linear;
position:fixed;
top:0;
left:0;
z-index:100;
background-color:#000;
min-height:70px;
}

.header-white {
width:100%;
transition:line-height .2s linear, box-shadow .2s linear;
position:fixed;
top:0;
left:0;
z-index:100;
background-color:#fff;
min-height:70px;
}




.logomark{

    margin-right: 15px;

    height: 23px;

    top: -2px;

    position: relative;

}





.image-fit img{

width:100%;

}











/* scroll header small */

.header.small {

box-shadow:0 1px 6px 0 rgba(50,50,50,0.6);

min-height:60px;

}



.header.small > .container > #logo {

float:left;

font-size:24px;

}





.header.small > div.container > div#mainnav ul.nav {

margin: 22px 0 0;

}











 #logo {
position:relative;
font-size:30px;
float:left;
top:11px;
}



.header .container #logo a:link,
.header .container #logo a:hover, 
.header .container #logo a:visited 
{
/*  color:#e6e2d6 !important; */
 color:#fff !important; 
text-decoration:none;
}

.header-white .container #logo a:link,
.header-white .container #logo a:hover, 
.header-white .container #logo a:visited 
{
color:#000!important;
text-decoration:none;
}



.logo-box{
width:130px;
height:110px;

    border: 1px solid #efefef;
    border-radius: 8px;
    
margin:4px;
padding:10px;

display: inline-block;
overflow:hidden;
}



.ul-left ol, .ul-left ul {
padding-left: 15px;
}



/* #main nav  */


ul.nav {
font-family:'Roboto', sans-serif;
width:auto;
color:#7c786a;
list-style:none;
}


.nav>li>a{/* ? */
    padding: 10px ;
}

ul.nav li {
float:left;
position:relative;
}

ul.nav li a {
/* letter-spacing:1px; */
color:#fff;
text-decoration:initial;
}


#mainnav ul.nav {
text-align:right;
float:right;
position:relative;
margin:25px 0 0;
padding:0;
border-radius: 8px;

}


#mainnav ul.nav li {
display:inline-block;
/* border-right:1px solid #333; */
}

#mainnav ul.nav li a {
font-size:14px;
border-radius: 8px;
padding:10px;
}

#mainnav ul.nav li:last-child {
border-right:none;
}



#mainnav ul.nav li:hover a,#mainnav ul.nav li:visited a {
background:#1e1e1e;
}



#sidenav ul.nav li{
width:100%;
border-bottom: 1px solid #333;
}



#sidenav ul.nav li a {
font-size:23px;
    float: left;
    width: 100%;
}


#sidenav ul.nav li:hover a {
background:#333;
}

/* responsive sidebar */

.sidenav {
	display:none;
    height: 100%;
    max-width:100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: rgb(0,0,0,.90);
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
    
}



.sidenav .closeNav {
    position: absolute;
    top: 10px;
    right: 25px;
    color:#fff;
    font-size:28px;
    text-decoration:none;
}


.openNav{
	float: left; 
	font-size: 20px; 
	padding: 6px 20px 0 0;
}

.closeNav{
    float: left; 
    font-size: 20px;
	padding: 6px 20px 0 0;
}


/*/ portfolio nav /*/

.p-links {
    list-style: none;
    margin: 16px 0;
    padding: 0;
    font-size: 14px;
    display: inline-block;
}




.p-links li{
    list-style: none;
display: inline;
padding: 0 20px ;

}

.p-links li.active a{
border-bottom: 3px solid #d9edf7;
padding-bottom:4px;
}



.p-links li a:link,.p-links li a:visited, .p-links li a:hover{
        text-decoration: none;
}








q a:link, q a:visited, q a:hover{
        text-decoration: none;
        color:#8a8a8a;

    }

    

    

 ul.nav li a:visited {
color:#efefef;
}



ul.nav li.active a {

color:#ffe89f!important;

/* border-bottom:2px solid #666;  */

}





/* subnav links */



ul.navlinks {
font-size:30px;
list-style-type:none;
margin:0 3px;
color:#efefef;
}



ul.navlinks li {

display:inline-block;
margin:0 8px;

}

ul.navlinks li a, ul.navlinks li a:visited, ul.navlinks li a:hover  {

color:#efefef;
}


.uppercase {

text-transform:uppercase;

}



.picture {

border:9px solid #fff;

box-shadow:0 2px 4px 0 rgba(0,0,0,0.16), 0 2px 20px 0 rgba(0,0,0,0.12)!important;

}



.reference {

color:#717171!important;

font-style:italic;

}



.rounded {

border-radius:5px;

}



.rounded-top {

border-top-left-radius:5px;

border-top-right-radius:5px;

}



.section .slider {

background:#dde3de;

}







.hero {

color:#FFF;

font-weight:400;

letter-spacing:1px;

}



h1.hero {

font-size:54px;

}



h2.hero {

font-size:30px;

margin-bottom:60px;

}



h1.hero:after {

content:"";

width:300px;

position:relative;

border-bottom:1px solid #aaa;

text-align:center;

margin:15px auto auto;

}



.call {

color:#FFF;

display:block;

margin-bottom:20px;

}



.call span {

display:inline;

border:1px solid #FFF;

font-size:20px;

transition:background .15s linear;

padding:8px 13px;

}



.call span:hover {

background:#efefef;

cursor:pointer;

}



.col {

float:left;

position:relative;

margin:0;

padding:0;

}



.col.four {

width:23%;

margin:10px 0;

padding:5px 1%;

}



.col.three {

width:31%;

margin:10px 1%;

padding:5px 1%;

}



.col.two {

width:48%;

margin:10px 1%;

padding:10px 1%;

}



.col.one {

width:98%;

margin:10px 1%;

padding:10px 1%;

}



.col.one-plain {

padding:20px 0;

}



.col.extrapad {

padding-top:20px;

padding-bottom:20px;

}



.col .service,.col .feature {

font-size:21px;

font-weight:300;

}



.col .service:after {

content:"";

width:50px;

position:relative;

border-bottom:1px solid #eee;

display:block;

text-align:center;

margin:15px auto auto;

}



.col .feature {

font-size:19px;

font-weight: 400;

}



.col h1.side,.col p.side,.col span.side:first-of-type {

margin-left:50px;

text-align:left;

}



.col .icon a {

color:#333;

}



.col .icon {

border-radius:50%;

height:85px;

width:85px;

line-height:85px;

text-align:center;

background:#efefef;

transition:background .25s linear, color .25s linear;

margin:0 auto;

}



.col .icon .glyphicons {

font-size:40px;

top:27%;

}



.col .icon.side {

position:absolute;

top:-15px;

height:50px;

width:50px;

margin:0;

padding:0;

}



.col:hover > .icon {

background:#8dcdc1;

color:#FFF;

}



.col:hover > .icon.side {

background:initial;

color:initial;

}



.col p,.col h1 {

/* text-align:center; */

text-decoration:none;

}



.margin {

margin-bottom:20px;

}



.col .imgholder {

height:300px;

width:100%;

border-bottom:1px solid #d5d5d5;

transition:background .3s linear;

background-size:cover;

background-repeat:no-repeat;

}





.col .wbg {

background:#FFF;

/*/ border:1px solid #e3e3e3;/*/

}













.col.pointer {

cursor:pointer;

}



.col.bg:hover .imgholder {

background-repeat:no-repeat;

}



.col span.feature {

font-size:20px;

}



.container > h1:not(.hero) {

margin-bottom:30px;

text-align:center;

}




.border-bottom{

    border-bottom:1px solid #eee;
}


.number{
padding:2px 6px;
border-radius:100%;
background:#ffe89f;
margin-right:3px;
display:inline-block;

}

.left,.left > h1,.left > p {

text-align:left;

}



.right,.right > h1,.right > p {

text-align:right;

}



.reset {

text-align:left!important;

}



.reset:after {

display:none!important;

}






.btn, button, .button{
border-radius:0;
padding:8px 24px;
}





.button {
background:#fff;
border:1px solid #e3e3e3;
font-weight:300;
letter-spacing:2px;
margin:0;
}

.button:hover {
text-decoration: none;
border:1px solid #999;
}

.button a:hover{
    text-decoration: none;
}


.button-primary{
background:#1a73e8;
color: #000 !important;
font-weight:bold;
letter-spacing:1px;
margin:0;
text-decoration: none;
}
 

a.button-primary:focus, a.button-primary:hover, a.button-primary:visited{
color: #fff;
text-decoration: none;
background:#84cfe4;
color: #000 !important;
}


.button-primary{
/*/background:#f4d161;/*/
background:#1a73e8;
color: #000 !important;
font-weight:bold;
letter-spacing:1px;
margin:0;
text-decoration: none;
}
 

a.button-primary:focus, a.button-primary:hover, a.button-primary:visited{
color: #fff;
text-decoration: none;
background:#84cfe4;
color: #000 !important;
}


.shadow {

box-shadow:0 1px 7px 0 rgba(50,50,50,0.1);

}



.shadow:hover {

box-shadow:0 1px 5px 0 rgba(50,50,50,0.2);

}



.tablet {

display:block;

}



.group:after {

content:"";

display:table;

clear:both;

}



div.c-wrapper {

width:80%;

margin:auto;

}



.carousel-inner > .item > img,.carousel-inner > .item > a > img {

width:100%;

margin:auto;

}



.carousel-indicators li{

    border:1px solid #333;

}



.carousel-indicators.active{

width:14px;

height:14px;

}



a.carousel-control{

      color:#333 !important;

    opacity:100;

    text-shadow:none;

}

.carousel-control:hover{

    color:#337ab7 !important;

}















/*  Pill List  */



ul.skill-list {

padding-left: 15px;



}



.skill-list li{

    padding: 4px 10px;

    margin: 2px 1px;

    background-color: #f4f3f6;

    display: inline;

    border-radius: 10px;

    float:left;

}



.skill-list:after {

    content: '';

    display: block;

    clear: both;

}











a:link,a:visited {

color:#0e4779;/* 337ab7 */

}



/* .white h1,.white h2,.white p,.white div,.white a */



ul.nav li a:hover, footer, footer a{

color:#fff;

}



.slidercontent,.center,.center > h1,.center > p {

text-align:center;

}



.responsivegroup,.mobile {

display:none;

}



.mobile-hide {

    display:block;

}



.font-weight-bold{
font-weight:bold;
}



@media only screen and (max-width: 768px) {



.container {

width:95%;

}



.col.four {

width:48%;

margin:1%;

}



.col.three, .col.two {

display:block;

width:95%;

float:none;

margin:0 auto 20px;

padding:5px 5%;

}



#logo {

position:initial;

display:block;

transform:none;

margin:10px auto 0;

}





.responsivegroup {

display:block;

}



.responsivegroup:after {

content:"";

display:table;

clear:both;

}







.header,.hold {

min-height:60px;

}



}

.keyword{
border: 1px solid #adb5bd;
background: #fff;
    font-size: smaller;
    padding: 4px 8px;
    border-radius: 14px;
    margin: 2px 0px;
    display: inline-block;
}

@media only screen and (min-width: 450px) {

/* Greater than */

.container {

	font-size:14px;

}

 .section .container,  .section .container-sm, .section .container-fl {

 padding:20px 5px 30px 15px;  

}





}



@media only screen and (min-width: 768px) {



   /* desktop only */

    

    .quote{
        width: auto;
    }

    

.container, .container-sm, .container-fl {

width:750px;

}



#logo {

font-size:30px;

}







.css2col {

columns:2;

-webkit-columns:2;

-moz-columns:2;

}

}











@media only screen and (min-width: 992px) {



.container, .container-sm, .container-fl {

width:970px;

}

}



@media only screen and (min-width: 1200px) {



.container, .container-sm, .container-fl {


width:1170px;

}

}













@media only screen and (max-width: 450px) {




.shadow , .shadow:hover {
    box-shadow:none;
}



/* responsive end */



.col,.col.four,.col.three,.col.two {

display:block;

width:95%;



}



.col.extrapad {

margin-bottom:10px;

padding:1%;

}







#logo {

width:100%;



}







ul.nav .fa {

font-size:27px;

}



.mobile {

display:block;

}



.mobile-hide{

display:none !important;

border:1px solid red;



}



.group, .tablet {

display:none;

}

}






.print {
    display: none;
}
.print-hide{

}



@media print {

.row{width:100%;s}

.print{
    display: block;
}
.print-hide{
    display: none;
    border:none;

}





#mainnav,.navlinks {display:none;}

* {border:none;}



.shadow {

    box-shadow:none;

}

}