
.services{
        margin-bottom:50px;
      }
      .section-header{text-align: center; margin-bottom:2em;}
      
      .services-graphic-outer{height:900px; position: relative;}
      .triangle-outer{width:500px; height:430px; position: absolute; left:50%; top:44%; margin:-215px 0 0 -250px;}
      .base-triangle{border-bottom: solid 430px #00344a;border-right:solid transparent 250px;border-left:solid transparent 250px;height:1px;width:1px;position: absolute;/*left:50%; top:50%; margin:-215px 0 0 -250px;*/}
      .traingle-sticks-holder{width:0px; height:0px; position: absolute; left:50%; top: 288px; margin: -2px 0 0 -2px; background: #000;}
      .triangle-stick{width:5px; height:300px; background: #48c1c5; position: absolute; bottom:0; -webkit-transform-origin: 50% 100%; -ms-transform-origin: 50% 100%; transform-origin: 50% 100%;}
      .triangle-stick:before{content:" "; width:14px; height:14px; border-radius:50%; background: #48c1c5; position: absolute; top:-4px; left:-4px;}
      .triangle-stick.yellow, .triangle-stick.yellow:before{background:#ffcc66;}
      .triangle-stick.green, .triangle-stick.green:before{background:#38cc5d;}
      .triangle-stick.red, .triangle-stick.red:before{background:#e26749;}
      .triangle-stick.stick1{-webkit-transform: rotate(0deg);-ms-transform: rotate(0deg);transform: rotate(0deg);}
      .triangle-stick.stick2{-webkit-transform: rotate(60deg);-ms-transform: rotate(60deg);transform: rotate(60deg);}
      .triangle-stick.stick3{-webkit-transform: rotate(120deg);-ms-transform: rotate(120deg);transform: rotate(120deg);}
      .triangle-stick.stick4{-webkit-transform: rotate(180deg);-ms-transform: rotate(180deg);transform: rotate(180deg);}
      .triangle-stick.stick5{-webkit-transform: rotate(238deg);-ms-transform: rotate(238deg);transform: rotate(238deg);}
      .triangle-stick.stick6{-webkit-transform: rotate(300deg);-ms-transform: rotate(300deg);transform: rotate(300deg);}
      
      .main-circle{position: absolute; width:250px; height:250px; left:125px; top:161px;/*width:380px; height:380px; left:60px; top:96px;*/ box-sizing: border-box; z-index: 5; opacity: 1; filter:alpha(opacity=100);}
      .main-circle .circle{width:250px;height:250px;border:solid 0px #fff;background: #101d35;border-radius:50%;position: absolute;left:50%;top:50%;margin:-125px 0 0 -125px;box-shadow:0 0 0 rgba(0,0,0,.0);-webkit-transition:all .3s .5s;transition:all .3s .5s;}
      
      /*.main-circle .circle:before{content:" "; border-radius:50%; box-sizing: border-box; width:230px; height:230px; border:solid 4px transparent; border-right:solid 4px #9fc0e1; position:absolute; left:50%; top:50%; margin: -115px 0 0 -115px; -webkit-animation:rotate-anticlockwise 4s linear infinite; animation:rotate-anticlockwise 4s linear infinite; -webkit-transition:all .3s .5s; transition:all .3s .5s;}*/
      .main-circle .circle span:first-child{display:block;border-radius:50%;box-sizing: border-box;width:200px;height:200px;border: solid 15px #00cdff;border-right:solid 15px transparent;position:absolute;left:50%;top:50%;margin: -100px 0 0 -100px;-webkit-animation:rotate-clockwise 4s linear infinite;animation:rotate-clockwise 4s linear infinite;-webkit-transition:all .3s .5s;transition:all .3s .5s;}
      .main-circle .circle span:last-child{display:block;border-radius:50%;box-sizing: border-box;width:230px;height:230px;border:solid 4px transparent;border-right: solid 4px #00cdff;position:absolute;left:50%;top:50%;margin: -115px 0 0 -115px;-webkit-animation:rotate-anticlockwise 4s linear infinite;animation:rotate-anticlockwise 4s linear infinite;-webkit-transition:all .3s .5s;transition:all .3s .5s;}
      
      .main-circle .circle h2{text-align: center; text-transform: lowercase; margin: 100px 0 0;}
      
      .main-circle:hover .circle{/*transform:scale(1.6);*/width:380px;height:380px;margin:-190px 0 0 -190px;box-shadow:0 0 20px rgba(0,0,0,.0);border: solid 5px #00cdff;-webkit-transition:all .3s;transition:all .3s;}
      /*.main-circle:hover .circle:before{opacity:0;filter:alpha(opacity=0); -webkit-transition:all .3s; transition:all .3s;}*/
      .main-circle:hover .circle span{opacity:0; filter:alpha(opacity=0); -webkit-transition:all .3s; transition:all .3s;}
      
      .main-circle .service-content{text-align:center;position:absolute;width:270px;top: 15px;left:50%;margin-left:-130px;}
      .main-circle .service-content h2{position: absolute;width: 65%;font-size: 24px;top:70px;text-transform:uppercase;-webkit-transition:all .5s .3s;transition:all .5s .3s;font-weight: 300;color: #fff;left: 45px;}
      .main-circle .service-content p{margin: 0 0 1em; opacity: 0; filter:alpha(opacity=0); -webkit-transition:all .5s .0s ease-out; transition:all .5s .0s ease-out;}
      .main-circle .service-content ul{list-style:none;margin: 25px 0 0;padding:0;font-size: 14px;opacity: 0;filter:alpha(opacity=0);-webkit-transition:all .5s 0s ease-out;transition:all .5s 0s ease-out;line-height: 18px;font-family: "Open Sans", sans-serif;}
      .main-circle .service-content ul a{font-weight: normal;margin-bottom: 10px;display: block;color:#fff;}
      .main-circle .service-content ul a:hover{color: #00cdff;text-decoration: none;}
      .main-circle:hover .service-content h2{width:100%;top:-25px;font-size: 28px;color: #ffffff;-webkit-transition:all .5s .0s;transition:all .5s .0s;font-weight: 300;font-family: "Open Sans", sans-serif;left:0;}
      .main-circle:hover .service-content p{opacity: 1;filter:alpha(opacity=100); -webkit-transition:all .5s .3s ease-in; transition:all .5s .3s ease-in;}
      .main-circle:hover .service-content ul{opacity:1;filter:alpha(opacity=100); -webkit-transition:all .5s .5s ease-in; transition:all .5s .5s ease-in;}
      
      
      
      
      .service-circle{position: absolute;-webkit-transition:all .5s .5s;transition:all .5s .5s;z-index: 1;width: 126px;height:126px;cursor: default;}
      .service-circle .circle{background: #101d35;border-radius:50%;box-sizing: border-box;width:126px;height:126px;border:solid 2px #e26749;position:absolute;left:50%;top:50%;margin: -63px 0 0 -63px;-webkit-transition: all .3s ease-out;transition: all .3s ease-out;}
      .service-circle .circle div{position:absolute; z-index: 1; border-radius:50%; box-sizing: border-box; width:118px; height:118px; border:solid 10px #e26749; left:50%; top: 50%; margin: -59px 0 0 -59px; -webkit-transition: all .3s ease-out; transition: all .3s ease-out;}
      /*.service-circle .circle div:before{content:" "; position:absolute; z-index: 1; border-radius:50%; box-sizing: border-box; width:118px; height:118px; left:50%; top:50%; margin:-59px 0 0 -59px; background: url(../images/service-circle-triangle-small-red.png) no-repeat 55% center; -webkit-animation:rotate-clockwise 3s linear infinite; animation:rotate-clockwise 3s linear infinite;  -webkit-transition: all .3s ease-out;  transition: all .3s ease-out;}*/
      .service-circle .circle div span{display:block; position:absolute; z-index: 1; border-radius:50%; box-sizing: border-box; width:118px; height:118px; left:50%; top:50%; margin:-59px 0 0 -59px;   -webkit-animation:rotate-clockwise 3s linear infinite; animation:rotate-clockwise 3s linear infinite;  -webkit-transition: all .3s ease-out;  transition: all .3s ease-out;}
      
      .service-circle.green .circle{border: solid 2px #38cc5d;}
      .service-circle.green .circle div{border: solid 10px #38cc5d;}
      /* .service-circle.green .circle div span{background: url(../images/service-circle-triangle-small-green.png) no-repeat 55% center;} */
      .service-circle.red .circle{border:solid 2px #e26749;}
      .service-circle.red .circle div{border:solid 10px #e26749;}
      /* .service-circle.red .circle div span{background: url(../images/service-circle-triangle-small-red.png) no-repeat 55% center;} */
      .service-circle.yellow .circle{border:solid 2px #ffcc66;}
      .service-circle.yellow .circle div{border:solid 10px #ffcc66;}
      /* .service-circle.yellow .circle div span{background: url(../images/service-circle-triangle-small-yellow.png) no-repeat 55% center;} */
      .service-circle.service1{left:190px; top:-90px;}
      
      .service-circle.service2{left:445px; top:70px;}
      .service-circle.service3{left:445px; top:390px;}
      .service-circle.service4{left:190px; top:515px;}
      .service-circle.service5{left:-65px; top:390px;}
      .service-circle.service6{left:-65px; top:70px;}
      
      .service-circle .service-content{position: absolute;width: 235px;height:65px;left: 50%;top:30px;margin-left: -119px;text-align: center;z-index: 5;}
      .service-circle h3{position: absolute;top: 106px;width:180px;position: absolute;left:50%;margin-left:-90px;text-align: center; opacity: 1;filter:alpha(opacity=100);-webkit-transition: all .2s;transition: all .2s;font-size: 16px;font-weight:normal;color: #fff;}
      .service-circle.service1 h3{top: -100px;}
      .service-circle .service-content p{font-size: 14px;opacity: 0;filter:alpha(opacity=0);-webkit-transition:all .3;transition:all .3;margin-top:10px;}
      
      
      .service-circle:hover .circle{width: 320px;height: 320px;margin: -160px 0 0 -160px;}
      .service-circle:hover .circle div{width:300px;height:300px;margin: -150px 0 0 -150px;border-width:17px;}
      .service-circle:hover .circle div span{opacity: 0;filter:alpha(opacity=0);}
     
      .service-circle:hover .service-content h3{top: -55px;}
      .service-circle:hover .service-content p{opacity:1;filter:alpha(opacity=100);}
      
      .service-circle.pull-in{left:190px; top:225px; -webkit-transition:all .7s .2s; transition:all .7s .2s;}
      
      .service-circle .service-content p a,.service-circle .service-content p a:hover {
        color: #969696;
        text-decoration: none;
    }
    .common_section{min-height: 662px;}
    .icn-gears{margin:25px;}
    .service-circle:hover .service-content h3 a:hover{text-decoration: none;color:#00cdff}
    .service-circle.service6 .service-content p {margin-top:25px}
    /* .service-circle.service2:hover .service-content h3{top:-65px;}
    .service-circle.service2:hover .service-content p{margin-top:-5px;} */
      @-webkit-keyframes rotate-clockwise{
        0%{
          -webkit-transform-origin:center;
                  transform-origin:center;
          -webkit-transform:rotate(0deg);
                  transform:rotate(0deg);
        }
      
        100%{
          -webkit-transform-origin:center;
                  transform-origin:center;
          -webkit-transform:rotate(360deg);
                  transform:rotate(360deg);
        }
      }
      
      @keyframes rotate-clockwise{
        0%{
          -webkit-transform-origin:center;
                  transform-origin:center;
          -webkit-transform:rotate(0deg);
                  transform:rotate(0deg);
        }
      
        100%{
          -webkit-transform-origin:center;
                  transform-origin:center;
          -webkit-transform:rotate(360deg);
                  transform:rotate(360deg);
        }
      }
      @-webkit-keyframes rotate-anticlockwise{
        0%{
          -webkit-transform-origin:center;
                  transform-origin:center;
          -webkit-transform:rotate(0deg);
                  transform:rotate(0deg);
        }
      
        100%{
          -webkit-transform-origin:center;
                  transform-origin:center;
          -webkit-transform:rotate(-360deg);
                  transform:rotate(-360deg);
        }
      }
      @keyframes rotate-anticlockwise{
        0%{
          -webkit-transform-origin:center;
                  transform-origin:center;
          -webkit-transform:rotate(0deg);
                  transform:rotate(0deg);
        }
      
        100%{
          -webkit-transform-origin:center;
                  transform-origin:center;
          -webkit-transform:rotate(-360deg);
                  transform:rotate(-360deg);
        }
      }
      @media (max-width: 767px) { 
        .triangle-outer {
                position: relative;
                top: 0;
                left: 0;
                height: auto;
                width: 100%;
                margin: 0 auto;
                text-align: center;
            } 
            .services-graphic-outer , .common_section{height: auto;min-height: inherit;margin-bottom:20px;}
      .services-graphic-outer .service-circle{
        position: relative;
        top: 0;
        left: 0;
        width: 98%;
        height: auto;
        display: inline-block;
        vertical-align: top;
        margin-bottom: 5px;}
      .services-graphic-outer .service-circle .circle{ 
                
                width:auto;                
                height: 250px;                
                margin: 0;                
                left: 0;                
                top: 0;                
                position: relative;                
                border-radius: 0;                
                border: solid 2px transparent;                
                padding:10px;                
                background-color: #101d35;                
                margin-bottom: 0;                
                background:#2a3240;
                /* linear-gradient(to right, #101d35 0%, #2a3240 20%, #2a3240 49%, #2a3240 50%, #2a3240 80%, #101d35 100%) */
                background: -moz-linear-gradient(left, #101d35 0%, #2a3240 20%, #2a3240 49%, #2a3240 50%, #2a3240 80%, #101d35 100%);
                background: -webkit-gradient(left top, right top, color-stop(0%, #101d35), color-stop(20%, #2a3240), color-stop(49%, #2a3240), color-stop(50%, #2a3240), color-stop(80%, #2a3240), color-stop(100%, #101d35));
                background: -webkit-linear-gradient(left, #101d35 0%, #2a3240 20%, #2a3240 49%, #2a3240 50%, #2a3240 80%, #101d35 100%);
                background: -o-linear-gradient(left, #101d35 0%, #2a3240 20%, #2a3240 49%, #2a3240 50%, #2a3240 80%, #101d35 100%);
                background: -ms-linear-gradient(left, #101d35 0%, #2a3240 20%, #2a3240 49%, #2a3240 50%, #2a3240 80%, #101d35 100%);
                background: linear-gradient(to right, #101d35 0%, #2a3240 20%, #2a3240 49%, #2a3240 50%, #2a3240 80%, #101d35 100%);
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#101d35', endColorstr='#101d35', GradientType=1 );
                box-shadow: -5px -5px 9px 0px #101d35;
                
        }
      .services-graphic-outer .service-circle .circle div{
        width:auto;
        height: 227px;
        top:0;
        left:0;
        position: relative;
        margin: 0;
        border-radius: 15px;
        border: solid 10px transparent;
        } 
        /* .service-circle.service2{top:-50px;}
        .service-circle.service3{top:-100px;}
        .service-circle.service4{top:-150px;}
        .service-circle.service5{top:-200px;}
        .service-circle.service6{top:-250px;} */
        .service-circle .service-content {
                height: auto;
                width: 80%;
                margin: 0 auto;
                left: 50%;
                top: 45px;
                margin-left: -40%;
            }
      .service-circle .service-content p {opacity: 1;color:#b2bfd2;}
 
      .service-circle .service-content h3 {
        position: relative;
        top: 0;
        margin: 0;
        left: 0;
        width: auto;
        
      }
      .service-circle .service-content h3 a{color:#b2bfd2;}
      .base-triangle, .main-circle,  svg.icn-gears {display: none;}
      .service-circle:hover .service-content h3{top:0;}
      .service-circle:hover .service-content h3 a{color:#00cdff;}
      .pamSolutionWrap .container{padding-right: 0;}
}
@media (max-width:527px) { 
  
      
        .services-graphic-outer .service-circle{width:98%;display: block; }
        .services-graphic-outer .service-circle .circle{ height:215px;}
         .services-graphic-outer .service-circle .circle div{ height:195px;}
         .service-circle .service-content {top:65px;}
}
@media (max-width: 320px) { 
        .service-circle .service-content {top:45px;}
  
}