html, body{
  background-color:#e6e6e6;
  -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
  font-size:16px;
  scroll-behavior: smooth;

}


.mytop60{
  margin-top:60px;
}

#chovchov-menu a:hover{
  color:#E4AC18;
}

#chovchov-menu li.active a {
    color:#E4AC18;
    /*border-bottom: 3px solid #8DA1A2;*/
    /*color: #333;*/
}


.headinghead{
  color:#EA3788;
}

.definitionhead{
  color:#0CC066;
}



.ideationhead{
  color:#EC2D0F;
}


.prototypinghead{
  color:#2C8ED6;
}


.testinghead{
  color:#8F2CE6;
}



.reprohead{
  color:#F7760B;
}






.bg-purple {
  background-color: #8E44AD!important;
}

.bg-pink{
  background-color: #E91E63!important;
}

.bg-indigo{
  background-color: #0AB2D8!important;
}


.bg-bluegrey{
  background-color: #6E8AAD!important;
}
s
.bg-secondary2{
  background-color: #646C73!important;
}

.bg-orange{
  background-color: #D35400!important;
}

.bg-lime{
  background-color: #2ECC71!important;
}


img:hover{
  cursor: pointer;
}




h1,h2,h3,h4,h5,h6,p{
font-family: "Open Sans", sans-serif;
color: white;

}


.mySideLogo{
  background-color:#f9f9f9;
}

p{
  line-height:120%;
}


._sidebar {


  background: #f9f9f9;
  padding:10px;
  height:100%;

}
.myPanelA{
  background-color:red;
}

.myPanelB{
  background-color:green;
  padding:30px;
}


.list-group-item {
    position: relative;
    display: block;
    padding: .75rem 1.25rem;
    margin-bottom: -1px;
    background-color: #f9f9f9;
    border: 0 solid rgba(0,0,0,.125);

}


.uxmethodsObject h5{
  color:#495057;


  font-weight: 900;
  font-family: 'Roboto', sans-serif;
  line-height: 100%;
  margin-bottom: 0;
  font-size: 140%;
  text-transform: uppercase;


}


.uxmethodsObject a{
  color:#495057!Important;
  font-weight: 400;
  font-family: 'Roboto', sans-serif;
  line-height: 100%;
  margin-bottom: 0;
  font-size: 150%;



}


.chovchov{
  font-weight:700;
  font-family: 'Open Sans ', sans-serif;
  color: #f14905;
  line-height: 100%;
  margin-bottom:0;
  font-size:700%;
  padding:0 0 50px 0;
  }

  



.empathyObject h3, .ideateObject h3, .defineObject h3, .prototypeObject h3, .testObject h3 {

padding:20px;



font-weight: 700;
    font-family: 'Open Sans Condensed', sans-serif;
    color: #fff;
    line-height: 100%;
    margin-bottom: 0;
    font-size: 300%;
    text-transform: uppercase;


}


.myMargin{
  margin-top:150px;
}


.myCardList {
    padding: 18px 30px;
    margin-bottom: 0;
    background-color: rgba(0,0,0,.03);
    border-bottom: 1px solid rgba(0,0,0,.125);
    font-size:120%;
}

.mycard-body {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 0;
}

.mycard-body a{
  color:#fff;

}

.decisionObject{
  padding:50px 40px;
}



.uxlObject{
  padding:50px 40px;
}

.uiObject{
  padding:50px 40px;
}


.requirementsObject{
  padding:50px 40px;
}


.mobileObject{
  padding:50px 40px;
}

.mobileObjectX{
  padding:50px 40px;
}



.accessibilityObject{
  padding:50px 40px;
}

.designThinkingObject{
  padding:50px 40px;
}

.psychoObject{
  padding:50px 40px;
}


.empathyObject{
  padding:50px 40px;
}

.defineObject{
  padding:50px 40px;
}

.ideateObject{
  padding:50px 40px;
}


.prototypeObject{
  padding:50px 40px;
}

.testObject{
  padding:50px 40px;
}



.technologyObject{
  padding:50px 40px;
}



.uxmethodsObject{
  padding:50px 40px;
}


.deliverleanObject{
  padding:50px 40px;
}





.informationvisualisationObject{
  padding:50px 40px;
}


.mitObject{
  padding:50px 40px;
}


.priorityObject{
  padding:50px 40px;
}

.aestheticObject{
  padding:50px 40px;
}

.scamperObject{
  padding:50px 40px;
}


.compositionObject{
  padding:50px 40px;
}


.designstudioObject{
  padding:50px 40px;
}

.maslowsObject{
  padding:50px 40px;
}

.leanObject{
  padding:50px 40px;
}


.TOOLSoftheTRADEObject{
  padding:50px 40px;
}

.heuristicsObject{
  padding:50px 40px;
}


.darkText {
color:#333;
}


.lightText {
  color:#fff;
  }

  .mycard-body a {
    color: #fff;
}


.mar20below{
  margin-bottom:20px;
}
.dirtyShadow {
  /*  -webkit-box-shadow: 0 1px 4px rgba(0,0,0,0.3), 0 0 40px rgba(0,0,0,0.1) inset;
    -moz-box-shadow: 0 1px 4px rgba(0,0,0,0.3),0 0 40px rgba(0,0,0,0.1) inset;
    box-shadow: 0 1px 4px rgba(0,0,0,0.6), 0 0 40px rgba(0,0,0,0.5) inset; */

    -webkit-box-shadow: 0 0 0  rgba(0,0,0,0.3), 0 0 40px rgba(0,0,0,0.1) inset;
    -moz-box-shadow: 0 0 0   rgba(0,0,0,0.3),0 0 40px rgba(0,0,0,0.1) inset;
    box-shadow: 0 0 0   rgba(0,0,0,0.6), 0 0 40px rgba(0,0,0,0.5) inset;
}


.list-group-item.active {
  z-index: 2;
  color: #495057;
  background-color: #f9f9f9;
  border-color: #007bff;
  /* text-decoration: line-through; */
  border-right: 5px solid #28a745
}



.stickySide .list-group-item {
  border-radius:0;
}








.mycard-header-blue {
  padding: .75rem 1.25rem;
  margin-bottom: 0;
  background-color: #007bff;
  border-bottom: 1px solid rgba(0,0,0,.125);
}



.mycard-header {
    padding: 30px;
    margin-bottom: 0;
    background-color: rgba(0,0,0,.03);
    border-bottom: 1px solid rgba(0,0,0,.125);
    padding: 30px;
}



p.strong{
  font-family: 'Lato', sans-serif;
  color: #666;
  line-height: 100%;
  margin-bottom:0;
  font-size:200%;
  padding:20px 0 20px;
  font-weight:800;
}


h1{
font-weight: 700;
font-family: 'Open Sans Condensed', sans-serif;
color: #5f6d6e;
line-height: 100%;
margin-bottom:0;
font-size:900%;
}



h2{
font-weight: 700;
font-family: 'Open Sans Condensed', sans-serif;
color: #fff;
line-height: 100%;
margin-bottom:0;
font-size:400%;
text-transform: uppercase;
}

.mainHead{
font-weight: 700;
font-family: 'Open Sans Condensed', sans-serif;
color: #3f92e4;
line-height: 100%;
margin-bottom: 0;
font-size: 500%;
margin-bottom:60px;
display:block;
}

.mainHead-Black{
  font-weight: 700;
  font-family: 'Open Sans Condensed', sans-serif;
  color: #3F3844;
  line-height: 100%;
  font-size: 500%;
  margin-bottom:60px;
  display:block;

  }



.myHiddenContainer-Grey
h2{
font-weight: 700;
font-family: 'Open Sans Condensed', sans-serif;
color: #666;
line-height: 100%;
margin-bottom:0;
font-size:400%;
text-transform: uppercase;
}

.myHiddenContainer-Problem
h2{
font-weight: 700;
font-family: 'Open Sans Condensed', sans-serif;
color: #666;
line-height: 100%;
margin-bottom:0;
font-size:400%;
text-transform: uppercase;
}

.myHiddenContainer-Prioritize
h2{
font-weight: 700;
font-family: 'Open Sans Condensed', sans-serif;
color: #666;
line-height: 100%;
margin-bottom:0;
font-size:400%;
text-transform: uppercase;
}

.myHiddenContainer-Define
h2{
font-weight: 700;
font-family: 'Open Sans Condensed', sans-serif;
color: #666;
line-height: 100%;
margin-bottom:0;
font-size:400%;
text-transform: uppercase;
}

.myHiddenContainer-Ideas
h2{
font-weight: 700;
font-family: 'Open Sans Condensed', sans-serif;
color: #666;
line-height: 100%;
margin-bottom:0;
font-size:400%;
text-transform: uppercase;
}


.myHiddenContainer-Define
h2{
font-weight: 700;
font-family: 'Open Sans Condensed', sans-serif;
color: #666;
line-height: 100%;
margin-bottom:0;
font-size:400%;
text-transform: uppercase;
}

.myHiddenContainer-Testing
h2{
font-weight: 700;
font-family: 'Open Sans Condensed', sans-serif;
color: #666;
line-height: 100%;
margin-bottom:0;
font-size:400%;
text-transform: uppercase;
}


.myHiddenContainer-Data-Visualisation
h2{
font-weight: 700;
font-family: 'Open Sans Condensed', sans-serif;
color: #666;
line-height: 100%;
margin-bottom:0;
font-size:400%;
text-transform: uppercase;
}
.myHiddenContainer-Looking-Forward
h2{
font-weight: 700;
font-family: 'Open Sans Condensed', sans-serif;
color: #666;
line-height: 100%;
margin-bottom:0;
font-size:400%;
text-transform: uppercase;
}

.myHiddenContainer-Looking-Forward
p{

font-family: 'Lato', sans-serif;
color: #666;
line-height: 100%;
margin-bottom:0;
font-size:200%;
padding:20px 0 20px;

}





.myHiddenContainer-Grey
p{
font-weight: 700;
font-family: 'Open Sans Condensed', sans-serif;
color: #666;
line-height: 100%;
margin-bottom:0;
font-size:400%;
text-transform: uppercase;
}

.myFooterCard p{

font-family: 'Lato', sans-serif;
color: #949494;
line-height: 120%;
margin-bottom:0;
font-size:120%;
}

.myMenu-level2 a{
font-weight: 700;
font-family: 'Open Sans Condensed', sans-serif;
color: #B5B5B5;
line-height: 100%;
margin-bottom:0;
font-size:150%;
text-transform: uppercase;
}



.myTenL{
  padding-left:30px;
}


.myTenLR{
  padding-left:30px;
  padding-right:30px;
}


.myHero{
  height:auto;
  background-color:#22A5D3;
  z-index:2;
  padding:70px 50px 50px;
  border-left:1px solid #3C8CA5;
  border-right:1px solid #3C8CA5;
}

.myHero-level{
  height:auto;
  background-color:#52B3D5;
  z-index:2;
  padding:30px 50px 50px;
/*border-top:1px solid #3097BB;*/
  border-left :1px solid #3C8CA5;
  border-right:1px solid #3C8CA5;
  border-bottom:1px solid #F7F7F7;
}



.myHero  h1{
font-weight: 700;
font-family: 'Open Sans Condensed', sans-serif;
color: white;
line-height: 100%;
margin-bottom: 36px;
font-size:900%;
}

.myHero p{
/*font-family: "Open Sans", sans-serif;*/
font-family: 'Lato', sans-serif;
color: white;
line-height: 120%;
margin-bottom: 36px;
font-size:200%;
}


.myBusiness{
  height:auto;
  background-color:#AF69D7;
  z-index:2;
  padding:50px;
  border-left:1px solid #9050B5;
  border-right:1px solid #9050B5;
}

.myBusiness-level{
  height:auto;
  background-color:#BC7AE2;
  z-index:2;
  padding:30px 50px 50px;
  border-top:1px solid #9050B5;
  border-left :1px solid #9050B5;
  border-right:1px solid #9050B5;
  border-bottom:1px solid #F7F7F7;
}



.myBusiness  h1{
font-weight: 700;
font-family: 'Open Sans Condensed', sans-serif;
color: white;
line-height: 100%;
margin-bottom: 36px;
font-size:900%;

}

.myBusiness p{

color: white;
line-height: 120%;
margin-bottom: 36px;
font-size:200%;
font-family: 'Lato', sans-serif;
font-weight: 400;
}




.myData{
  height:auto;
  background-color:#57CB89;
  z-index:2;
  padding:50px;
  border-left:1px solid #4AB477;
  border-right:1px solid #4AB477;
}

.myData-level{
  height:auto;
  background-color:#6FDA9D;
  z-index:2;
  padding:30px 50px 50px;
  border-top:1px solid #4AB477;
  border-left :1px solid #4AB477;
  border-right:1px solid #4AB477;
  border-bottom:1px solid #F7F7F7;
}



.myData  h1{
font-weight: 700;
font-family: 'Open Sans Condensed', sans-serif;
color: white;
line-height: 100%;
margin-bottom: 36px;
font-size:900%;
}

.myData p{

color: white;
line-height: 120%;
margin-bottom: 36px;
font-size:200%;
font-family: 'Lato', sans-serif;
font-weight: 400;
}


.myFooterCard{
  background-color:#585A5C;
  z-index:0;
  /*padding:50px;*/
  height:auto;
  position:relative;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}



.myProblem{
  height:auto;
  background-color:#f2f2f2;
  z-index:2;
  padding:50px;
  border-left:2px solid #E1E1E1;
  border-right:2px solid #E1E1E1;
}

.myProblem-level{
  height:auto;
  background-color:#EAEAEA;
  z-index:2;
  padding:30px 50px 50px;
border-top:1px solid #E1E1E1;
border-left :2px solid #E1E1E1;
  border-right:2px solid #E1E1E1;
    border-bottom:1px solid #E1E1E1;
}

.myProblem  h1{

font-weight: 700;

font-family: 'Open Sans Condensed', sans-serif;
color: #FF9105;
line-height: 100%;
margin-bottom: 36px;
font-size:900%;

}

.myProblem p{
  font-family: 'Lato', sans-serif;
  font-weight: 400;
color: #FF9105;
line-height: 120%;
margin-bottom: 36px;
font-size:200%;
}






.myProcess{
  height:auto;
  background-color:#f2f2f2;
  z-index:2;
  padding:50px;
    border-left:2px solid #E1E1E1;
        border-right:2px solid #E1E1E1;
}

.myProcess-level{
  height:auto;
  background-color:#EAEAEA;
  z-index:2;
  padding:30px 50px 50px;
/*border-top:1px solid #3097BB;*/
    border-left :2px solid #E1E1E1;
      border-right:2px solid #E1E1E1;
        border-bottom:1px solid #E1E1E1;
}


.myProcess  h1{

font-weight: 700;

font-family: 'Open Sans Condensed', sans-serif;
color:#666666;
line-height: 100%;
margin-bottom: 36px;
font-size:900%;

}





.myProcess p{
color:#666666;
line-height: 120%;
margin-bottom: 36px;
font-size:200%;
font-family: 'Lato', sans-serif;
font-weight: 400;
}





.myLookingFoward{
  height:auto;
  background-color:#f2f2f2;
  z-index:2;
  padding:50px;
    border-left:2px solid #E1E1E1;
        border-right:2px solid #E1E1E1;
}

.myLookingFoward-level{
  height:auto;
  background-color:#EAEAEA;
  z-index:2;
  padding:30px 50px 50px;
/*border-top:1px solid #3097BB;*/
    border-left :2px solid #E1E1E1;
      border-right:2px solid #E1E1E1;
        border-bottom:1px solid #E1E1E1;
}


.myLookingFoward  h1{

font-weight: 700;

font-family: 'Open Sans Condensed', sans-serif;
color:#666666;
line-height: 100%;
margin-bottom: 36px;
font-size:900%;

}

.myLookingFoward p{
color:#666666;
line-height: 120%;
margin-bottom: 36px;
font-size:200%;
font-family: 'Lato', sans-serif;
font-weight: 400;
}






.myShadow{
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
}

.restrict-line-width {
    max-width:800px;
}

.myMenu-level1{
    background-color:#333333;
   height:auto;
  /*height:100vh;*/
  padding-bottom:40px;


}

.mea h1{
  line-height:80%;
  font-size:250%;


}




.myIntro {
  height:auto;
  padding:0;
  text-align:center;
}


.myMenu-level2{
    background-color:#4d4d4d;
    height:auto;
    padding: 10px 20px;

}

.myHiddenDiv{
  height:auto;
/*background-color:orange;
  padding:50px;*/



}

.myHiddenContainer{
  height:auto;
  padding:50px;
background-image: linear-gradient(to right top, #245297, #0082c5, #00aebd, #00d37f, #a8eb12);
}



.myHiddenContainer-Human{
  height:auto;
  padding:50px;
/*background-image: linear-gradient(to right top, #245297, #0082c5, #00aebd, #00d37f, #a8eb12);*/
background-color:#3199BD;
}

.myHiddenContainer-Business{
  height:auto;
  padding:50px;
  background-color:#9358AD;
}

.myHiddenContainer-Data{
  height:auto;
  padding:50px;
  background-color:#53B17C;

}


.myHiddenContainer-Grey{
  height:auto;
  padding:50px;
background-color: #ffffff;

}


.myHiddenContainer-Problem{
  height:auto;
  padding:50px;
background-color: #EA9528;

}

.myHiddenContainer-Prioritize{
  height:auto;
  padding:50px;
background-color: #ffffff;

}


.myHiddenContainer-Define{
  height:auto;
  padding:50px;
background-color: #ffffff;

}



.myHiddenContainer-Ideas{
  height:auto;
  padding:50px;
background-color: #ffffff;

}



.myHiddenContainer-Testing{
  height:auto;
  padding:50px;
background-color: #ffffff;

}



.myHiddenContainer-Data-Visualisation{
  height:auto;
  padding:50px;
background-color: #ffffff;

}


.myHiddenContainer-Looking-Forward{
  height:auto;
  padding:50px;
background-color: #ffffff;

}


.myLeftPadding{
  padding-left:50px;
}

.myRightPadding{
    padding-right:50px;
}


.myLeftPadding2{
  padding-left:60px;
}

.myRightPadding2{
    padding-right:60px;
}




.whiteBack{
  background-color:white;
}


.greenBack{
  background-color:green;
}

.orangeBack{
  background-color:orange;
}

.pinkBack{
  background-color:pink;
}



.myBridge{
  margin-top:-20px;
  background-color:white;
  z-index:-1;
  padding:30px;
  height:200px;
}


.myCard{
  margin-top:-20px;
  background-color:white;
  z-index:100;
  padding:50px;
  height:300px;
  border:2px solid #3C8CA5;
}



.btn-link {
color: #fff;
border-radius:0;
border: solid 1px #fff;
text-align: center;
padding: 10px 32px;
font-size: 180%;
display: inline-block;
vertical-align: middle;
    margin-right: 20px;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
  margin-top:30px;

}

.btn-link:hover {
color: #fff;
border-radius:0;
border: solid 1px #fff;
text-align: center;
padding: 10px 32px;
font-size: 180%;
display: inline-block;
vertical-align: middle;
    margin-right: 20px;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
  margin-top:30px;

}





.myFooterCard .btn-link {
color: #949494;
border-radius:0;
border: solid 1px #949494;
text-align: center;
padding: 10px 16px;
font-size: 100%;
display: inline-block;
vertical-align: middle;
    margin-right: 20px;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
  margin-top:15px;

}

hr {
  margin-top: 20px;
  margin-bottom: 20px;
  border: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}



.myFooterCard .btn-link:hover {
text-decoration: none;
background-color: #949494;
color:#585A5C;

}


#myHUMANlayer .myHiddenContainer .btn-link {
color: #fff;
border-radius:0;
border: solid 1px #fff;
text-align: center;
padding: 10px 32px;
font-size: 180%;
display: inline-block;
vertical-align: middle;
margin-right: 20px;
border-left: solid 6px #31DE15;
font-family: 'Lato', sans-serif;
font-weight: 400;

}


.myHiddenContainer-Grey .myHiddenDiv .btn-link {
  color: #666666;
  border-radius: 0;
  border: solid 1px #666666;
  text-align: center;
  padding: 10px 32px;
  font-size: 180%;
  display: inline-block;
  vertical-align: middle;
  margin-top: 15px;
  font-family: 'Lato', sans-serif;
  font-weight: 400;
}


.myHiddenContainer-Problem .myHiddenDiv .btn-link {
  color: #666666;
  border-radius: 0;
  border: solid 1px #666666;
  text-align: center;
  padding: 10px 32px;
  font-size: 180%;
  display: inline-block;
  vertical-align: middle;
  margin-top: 15px;
  font-family: 'Lato', sans-serif;
  font-weight: 400;
}

.myHiddenContainer-Define .myHiddenDiv .btn-link {
  color: #666666;
  border-radius: 0;
  border: solid 1px #666666;
  text-align: center;
  padding: 10px 32px;
  font-size: 180%;
  display: inline-block;
  vertical-align: middle;
  margin-top: 15px;
  font-family: 'Lato', sans-serif;
  font-weight: 400;
}


.myHiddenContainer-Ideas .myHiddenDiv .btn-link {
  color: #666666;
  border-radius: 0;
  border: solid 1px #666666;
  text-align: center;
  padding: 10px 32px;
  font-size: 180%;
  display: inline-block;
  vertical-align: middle;
  margin-top: 15px;
  font-family: 'Lato', sans-serif;
  font-weight: 400;
}

.myHiddenContainer-Testing .myHiddenDiv .btn-link {
  color: #666666;
  border-radius: 0;
  border: solid 1px #666666;
  text-align: center;
  padding: 10px 32px;
  font-size: 180%;
  display: inline-block;
  vertical-align: middle;
  margin-top: 15px;
  font-family: 'Lato', sans-serif;
  font-weight: 400;
}

.myHiddenContainer-Data-Visualisation .myHiddenDiv .btn-link {
  color: #666666;
  border-radius: 0;
  border: solid 1px #666666;
  text-align: center;
  padding: 10px 32px;
  font-size: 180%;
  display: inline-block;
  vertical-align: middle;
  margin-top: 15px;
  font-family: 'Lato', sans-serif;
  font-weight: 400;
}

.myHiddenContainer-Looking-Forward .myHiddenDiv .btn-link {
  color: #666666;
  border-radius: 0;
  border: solid 1px #666666;
  text-align: center;
  padding: 10px 32px;
  font-size: 180%;
  display: inline-block;
  vertical-align: middle;
  margin-top: 15px;
  font-family: 'Lato', sans-serif;
  font-weight: 400;
}

.myProblem-level .btn-link {
color: #FF9105;
border-radius:0;
border: solid 1px #FF9105;
text-align: center;
padding: 10px 32px;
font-size: 180%;
display: inline-block;
vertical-align: middle;
font-family: 'Lato', sans-serif;
font-weight: 400;
}

.myProcess-level .btn-link {
color: #666666;
border-radius:0;
border: solid 1px #666666;
text-align: center;
padding: 10px 32px;
font-size: 180%;
display: inline-block;
vertical-align: middle;
margin-top:15px;
font-family: 'Lato', sans-serif;
font-weight: 400;
}

.myData-level .btn-link {
color: #fff;
border-radius:0;
border: solid 1px #fff;
text-align: center;
padding: 10px 32px;
font-size: 180%;
display: inline-block;
vertical-align: middle;
margin-top:15px;
font-family: 'Lato', sans-serif;
font-weight: 400;
}

.myHiddenDiv .btn-link {
color: #fff;
border-radius:0;
border: solid 1px #fff;
text-align: center;
padding: 10px 32px;
font-size: 180%;
display: inline-block;
vertical-align: middle;
margin-top:15px;
font-family: 'Lato', sans-serif;
font-weight: 400;
}



.myLookingFoward-level .btn-link {
  color: #666;
  border-radius:0;
  border: solid 1px #666;
  text-align: center;
  padding: 10px 32px;
  font-size: 180%;
  display: inline-block;
  vertical-align: middle;
  margin-top:15px;
  font-family: 'Lato', sans-serif;
  font-weight: 400;
}

 .separator {
    font-weight: bold;
    text-align: center;
    font-size: 36px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
        color: #fff;
}

.fa{
  color:#79D2F1;
      vertical-align: middle;
      padding:0 10px;
}

.fa{
  color:#79D2F1;
      vertical-align: middle;
      padding:0 10px;
}

.myProblem-level .fa{
  color:#DEDEDE;
      vertical-align: middle;
      padding:0 10px;
}


.myProcess-level .fa{
  color:#D0CFCF;
      vertical-align: middle;
      padding:0 10px;
}


.myGrey{
  color:#5F6D6C;
}


.myData-level .fa{
  color:#91E8B6;
      vertical-align: middle;
      padding:0 10px;
}

.myBusiness-level .fa{
  color:#CD93EF;
      vertical-align: middle;
      padding:0 10px;
}



.myMargin-Top{
  margin-top:20px;
}

.myMargin-Top50{
  margin-top:50px;
}

.myMargin-Bottom30{
  margin-bottom:30px;
}



.hidden{
  display:none;
}
.myHideRevealSpacing{
  /*margin-left: -40px;*/
margin-top: 30px;
}

p.darkhumor{

font-family: 'Lato', sans-serif;
color: #7E7E7E;
line-height: 110%;
font-size:90%;
text-align: center;

}

.myFooterCard h3{

  font-weight: 700;
  font-family: 'Open Sans Condensed', sans-serif;
  color: #7E7E7E;
  line-height: 100%;
  margin-bottom: 20px;
  font-size: 200%;

}

.myFooterCard hr{
  margin-top: 8px;
  margin-bottom: 5px;
  border: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.leftFooter hr{
  margin-top: 8px;
  margin-bottom: 5px;
  border: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.rightFooter hr{
  margin-top: 25px;
  margin-bottom: 20px;
  border: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}



.leftFooter{
  background-color:#505254;
  padding:120px 30px;
    border-right: 1px solid rgba(0, 0, 0, 0.1);
}


.rightFooter{
  padding:120px;
}

.darkhumor .fa {
    color: #7E7E7E;
    vertical-align: middle;
    padding: 0 2px;
}

.scale-in-ver-top {
	-webkit-animation: scale-in-ver-top 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: scale-in-ver-top 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

.scale-out-ver-top {
	-webkit-animation: scale-out-ver-top 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
	        animation: scale-out-ver-top 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}


.slide-in-bck-center {
	-webkit-animation: slide-in-bck-center 0.7s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: slide-in-bck-center 0.7s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

.slide-out-bck-center {
	-webkit-animation: slide-out-bck-center 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
	        animation: slide-out-bck-center 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

.vibrate-2 {
	-webkit-animation: vibrate-2 0.3s linear infinite both;
	        animation: vibrate-2 0.3s linear infinite both;
}








/*==================================================
 * Effect 8
 * ===============================================*/
 .effect8
 {
     position:relative;
     -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
        -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
             box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
 }
 .effect8:before, .effect8:after
 {
     content:"";
     position:absolute;
     z-index:-1;
     -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
     -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
     box-shadow:0 0 20px rgba(0,0,0,0.8);
     top:10px;
     bottom:10px;
     left:0;
     right:0;
     -moz-border-radius:100px / 10px;
     border-radius:100px / 10px;
 }
 .effect8:after
 {
     right:10px;
     left:auto;
     -webkit-transform:skew(8deg) rotate(3deg);
        -moz-transform:skew(8deg) rotate(3deg);
         -ms-transform:skew(8deg) rotate(3deg);
          -o-transform:skew(8deg) rotate(3deg);
             transform:skew(8deg) rotate(3deg);
 }






 /*==================================================
 * Effect 6
 * ===============================================*/
.effect6
{
    position:relative;
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.effect6:before, .effect6:after
{
    content:"";
    position:absolute;
    z-index:-1;
    -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
    box-shadow:0 0 20px rgba(0,0,0,0.8);
    top:50%;
    bottom:0;
    left:10px;
    right:10px;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
}
.effect6:after
{
    right:10px;
    left:auto;
    -webkit-transform:skew(8deg) rotate(3deg);
       -moz-transform:skew(8deg) rotate(3deg);
        -ms-transform:skew(8deg) rotate(3deg);
         -o-transform:skew(8deg) rotate(3deg);
            transform:skew(8deg) rotate(3deg);
}

/*==================================================
 * Effect 7
 * ===============================================*/
.effect7
{
    position:relative;
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.effect7:before, .effect7:after
{
    content:"";
    position:absolute;
    z-index:-1;
    -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
    box-shadow:0 0 20px rgba(0,0,0,0.8);
    top:0;
    bottom:0;
    left:10px;
    right:10px;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
}
.effect7:after
{
    right:10px;
    left:auto;
    -webkit-transform:skew(8deg) rotate(3deg);
       -moz-transform:skew(8deg) rotate(3deg);
        -ms-transform:skew(8deg) rotate(3deg);
         -o-transform:skew(8deg) rotate(3deg);
            transform:skew(8deg) rotate(3deg);
}


/*==================================================
 * Effect 2
 * ===============================================*/
 .effect2
 {
   position: relative;
 }
 .effect2:before, .effect2:after
 {
   z-index: -1;
   position: absolute;
   content: "";
   bottom: 15px;
   left: 10px;
   width: 50%;
   top: 80%;
   max-width:300px;
   background: #777;
   -webkit-box-shadow: 0 15px 10px #777;
   -moz-box-shadow: 0 15px 10px #777;
   box-shadow: 0 15px 10px #777;
   -webkit-transform: rotate(-3deg);
   -moz-transform: rotate(-3deg);
   -o-transform: rotate(-3deg);
   -ms-transform: rotate(-3deg);
   transform: rotate(-3deg);
 }
 .effect2:after
 {
   -webkit-transform: rotate(3deg);
   -moz-transform: rotate(3deg);
   -o-transform: rotate(3deg);
   -ms-transform: rotate(3deg);
   transform: rotate(3deg);
   right: 10px;
   left: auto;
 }

 .sticky-topB {
  position: -webkit-sticky;
  position: sticky;
  top: 66px;
  z-index: 1020;
}


.stickySide{

position: fixed;
    z-index: 2;
    top: 0;
    bottom: 0;
    left: 0;
    overflow-x: hidden;
    overflow-y: scroll;

    background: #f9f9f9;
    background-clip: content-box;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: none;
    padding:0;
}

.myContent{
  position: relative;
  height: 100%;
  max-height: 100%;
  overflow-y: scroll;

  pointer-events: auto;
  -webkit-overflow-scrolling: touch;

}

/* ----------------------------------------------
 * Generated by Animista on 2018-3-23 0:14:28
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation scale-in-ver-top
 * ----------------------------------------
 */
@-webkit-keyframes scale-in-ver-top {
  0% {
    -webkit-transform: scaleY(0);
            transform: scaleY(0);
    -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
    -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
    opacity: 1;
  }
}
@keyframes scale-in-ver-top {
  0% {
    -webkit-transform: scaleY(0);
            transform: scaleY(0);
    -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
    -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
    opacity: 1;
  }
}



/* ----------------------------------------------
 * Generated by Animista on 2018-3-23 0:15:25
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation scale-out-ver-top
 * ----------------------------------------
 */
@-webkit-keyframes scale-out-ver-top {
  0% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
    -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(0);
            transform: scaleY(0);
    -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
    opacity: 1;
  }
}
@keyframes scale-out-ver-top {
  0% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
    -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(0);
            transform: scaleY(0);
    -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
    opacity: 1;
  }
}



/* ----------------------------------------------
 * Generated by Animista on 2018-3-24 22:38:10
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation slide-in-bck-center
 * ----------------------------------------
 */
@-webkit-keyframes slide-in-bck-center {
  0% {
    -webkit-transform: translateZ(600px);
            transform: translateZ(600px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
    opacity: 1;
  }
}
@keyframes slide-in-bck-center {
  0% {
    -webkit-transform: translateZ(600px);
            transform: translateZ(600px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
    opacity: 1;
  }
}


/* ----------------------------------------------
 * Generated by Animista on 2018-3-24 22:44:8
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation slide-out-bck-center
 * ----------------------------------------
 */
@-webkit-keyframes slide-out-bck-center {
  0% {
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(-1100px);
            transform: translateZ(-1100px);
    opacity: 0;
  }
}
@keyframes slide-out-bck-center {
  0% {
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(-1100px);
            transform: translateZ(-1100px);
    opacity: 0;
  }
}



/* ----------------------------------------------
 * Generated by Animista on 2018-3-25 15:57:40
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation vibrate-2
 * ----------------------------------------
 */
@-webkit-keyframes vibrate-2 {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
  20% {
    -webkit-transform: translate(2px, -2px);
            transform: translate(2px, -2px);
  }
  40% {
    -webkit-transform: translate(2px, 2px);
            transform: translate(2px, 2px);
  }
  60% {
    -webkit-transform: translate(-2px, 2px);
            transform: translate(-2px, 2px);
  }
  80% {
    -webkit-transform: translate(-2px, -2px);
            transform: translate(-2px, -2px);
  }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
}
@keyframes vibrate-2 {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
  20% {
    -webkit-transform: translate(2px, -2px);
            transform: translate(2px, -2px);
  }
  40% {
    -webkit-transform: translate(2px, 2px);
            transform: translate(2px, 2px);
  }
  60% {
    -webkit-transform: translate(-2px, 2px);
            transform: translate(-2px, 2px);
  }
  80% {
    -webkit-transform: translate(-2px, -2px);
            transform: translate(-2px, -2px);
  }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
}



/* ========================== CONTROL CARD COUNT =============================== */
.card-columns {
  width:100%;
}


@media (min-width: 34em) {
  .card-columns {
      -webkit-column-count: 2;
      -moz-column-count: 2;
      column-count: 2;
  }
}

@media (min-width: 48em) {
  .card-columns {
      -webkit-column-count: 2;
      -moz-column-count: 2;
      column-count: 2;
  }
}

@media (min-width: 62em) {
  .card-columns {
      -webkit-column-count: 4;
      -moz-column-count: 4;
      column-count: 4;
  }
}

@media (min-width: 75em) {
  .card-columns {
      -webkit-column-count: 3;
      -moz-column-count:3;
      column-count: 3;
  }
}


@media (min-width: 75em) {
  .mobileObjectX .card-columns {
      -webkit-column-count: 3;
      -moz-column-count:3;
      column-count: 3;
  }
}



/* ========================== SMARTPHONES =============================== */

/* Smartphones (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {
/* Styles */
}

/* Smartphones (landscape) ----------- */
@media only screen
and (min-width : 321px) {

  .myIntro h1{
    font-size:150%;
    line-height:80%;
  }

  .mea h1{
    line-height:80%;
    font-size:80%;
        text-align:center;
  }

}

/* Smartphones (portrait) ----------- */
@media only screen
and (max-width : 320px) {

  .myIntro h1{
    font-size:150%;
    line-height:80%;
  }

  .mea h1{
    line-height:80%;
    font-size:80%;
        text-align:center;
  }

}



/* ========================== SMARTPHONES =============================== */





/* ========================== IPADS =============================== */

/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
  .myIntro h1{
    font-size:200%;
    line-height:80%;
  }
  .mea h1{
    line-height:80%;
    font-size:150%;
        text-align:center;
  }

}

.card-columns {
  @include media-breakpoint-only(md) {
    column-count: 2;
  }
  @include media-breakpoint-only(xl) {
    column-count: 5;
  }
}


/* iPads (landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
  .myIntro h1{
    font-size:200%;
    line-height:80%;
  }
  .mea h1{
    line-height:80%;
    font-size:150%;
        text-align:center;
  }
}

/* iPads (portrait) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
  .myIntro h1{
    font-size:200%;
    line-height:80%;
  }
  .mea h1{
    line-height:80%;
    font-size:15%;
        text-align:center;
  }
}

/* ========================== IPADS =============================== */




/* ========================== LAPTOPS & DESKTOPS =============================== */

/* ----------- Non-Retina Screens ----------- */
@media screen
  and (min-device-width: 1200px)
  and (max-device-width: 1600px)
  and (-webkit-min-device-pixel-ratio: 1) {

.myIntro h1{
  font-size:300%;
  line-height:80%;
}

.mea h1{
  line-height:80%;
  font-size:250%;
      text-align:center;
}

column-count: 4;


}

/* ----------- Retina Screens ----------- */
@media screen
  and (min-device-width: 1200px)
  and (max-device-width: 1600px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (min-resolution: 192dpi) {

    .myIntro h1{
      font-size:300%;
      line-height:80%;
    }
    .mea h1{
      line-height:80%;
  font-size:250%;
      text-align:center;
    }
    column-count: 4;

}

/* ----------- Desktop Screens ----------- */

@media only screen
and (min-width : 1224px) {
  .myIntro h1{
    font-size:300%;
    line-height:80%;
  }

  .mea h1{
    line-height:80%;
  font-size:250%;
    text-align:center;
  }

  column-count: 4;

}

/* ========================== LAPTOPS & DESKTOPS =============================== */










/* ========================== LARGE SCREENS =============================== */
/* Large screens ----------- */
@media only screen
and (min-width : 1824px) {
  .myIntro h1{
    font-size:300%;
    line-height:80%;
  }
  .mea h1{
    line-height:80%;
  font-size:250%;
  text-align:center;
  color:#22A5D3;
  margin-top:10px;
  }

  column-count: 4;
}

/* ========================== LARGE SCREENS =============================== */