.inner-top-banner {
    min-height: 315px;
    background: url("/sites/default/files/log360/gartner-siem-mq-2018-banner.jpg") no-repeat center top;
      background-size: cover;
    overflow: hidden;
    padding: 35px 0px 45px;
    position: relative;
}
.page-title-wrapper {
    padding: 50px 0px;
}
.product-detail .container {
    max-width: 1200px;
        width: 100%;
    margin: 0 auto;
    transition: all 0.2s ease-in 0s;
}
.page-title-wrapper h1 {
    color: #ffffff;
    margin-bottom: 10px;
    font-weight: bold;
}
.page-title-wrapper h2 {
    color: #ffffff !important;
    margin: 10px 0px 30px 0px;
    font-size: 17px;
}
#material-download {
    margin-bottom: 40px;
}
.page-title-wrapper a.btn-style {
    font-size: 14px;
}
a.orange-btn {
    background: #dd8b2b !important;
}
.gart-text {
    float: left;
    width: 70%;
    display: inline-block;
    margin-top: 30px;
}

.o360-why {
    padding: 40px 0;
    display: inline-block;
    width: 100%;
}
.wam-container {
    margin: 0 auto;
    max-width: 1200px;
}
.o360-why-left {
    float: left;
    width: 60%;
    box-sizing: border-box;
    color: #fff;
    padding-right: 100px;
}
.o360-why-left p {
    color: #000;
    font-size: 14px;
    line-height: 28px;
}
.lhs-box {
    border-left: 5px solid #6eb09e;
    padding-left: 35px;
    margin: 35px 0px;
}
.o360-why-right {
    float: left;
    width: 40%;
    box-sizing: border-box;
}

/*why use sec css*/
.why-use-sec {
    display: inline-block;
    width: 100%;
    background: #fff;
    padding: 40px 0 0px;
    margin-top: -10px;
    min-height: 885px;
}
.why-use-3 h4 {
    margin-bottom: 0;
    line-height: 1;
}

.why-use-5 {
    width: 225px;
    height: 225px;
    background: #fff;
    position: absolute;
    margin: 260px 0 0 452px;
    border-radius: 50%;
    z-index: 2;
}


.why-use-5-arr {
    width: 400px;
    height: 400px;
    background: #fff;
    border-radius: 50%;
    /* border: 3px dashed #e6e6e6; */
    -webkit-animation-name: spin;
    -webkit-animation-duration: 10000ms;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: spin;
    -moz-animation-duration: 10000ms;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: spin;
    -ms-animation-duration: 10000ms;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    animation-name: spin;
    animation-duration: 10000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
/*    background: none*/
    background-size: 500px;
    background-position: -136px -353px;
    margin-left: -57px;
    margin-top: -60px;
}
@-ms-keyframes spin {
from{-ms-transform:rotate(0deg)}
to{-ms-transform:rotate(-360deg)}
}
@-moz-keyframes spin {
from{-moz-transform:rotate(0deg)}
to{-moz-transform:rotate(-360deg)}
}
@-webkit-keyframes spin {
from{-webkit-transform:rotate(0deg)}
to{-webkit-transform:rotate(-360deg)}
}
@keyframes spin {
from{transform:rotate(0deg)}
to{transform:rotate(-360deg)}
}
.why-use-5-icon {
    width: 220px;
    height: 108px;
    position: absolute;
    border-radius: 0;
    margin-top: -265px;
    margin-left: 38px;
    /* background: none; */
    /* background-size: 270px; */
    /* background-position: -93px -195px; */
}
.form-link-wrapper img {
    display: block;
    margin: 25px auto;
}
.gardner-form-btn {
        background: #fd0018;
    color: #fff;
    font-weight: 600;
    font-size: 16px;
    padding: 16px 30px;
    border-radius: 4px;
    text-decoration: none;
    display: inline-block;
}
#log360-feature-page h4 {
    color: #fff;
    line-height: 1.5;
}
.why-use-sec h2 {
    text-align: center;
    font-size: 30px;
    margin-bottom: 40px;
    font-weight: 400;
    line-height: 40px;
}
.why-use-com {
    /* border: 1px solid #e3e3e3; */
    width: 350px;
    float: left;
    /* height: 275px; */
    /* margin: 50px 75px; */
    /* padding: 35px; */
    border-radius: 2px;
    /* border-bottom: 4px solid #3e82f8; */
    position: absolute;
}
table {
    display: none;
}

.why-use-1 {
    margin-left: 200px;
}

.why-use-com:before {
    content: '';
    position: absolute;
    margin-left: -2px;
    margin-top: -5px;
    width: 65px;
    height: 50px;
/*    background: none;*/
    display: inline-block;
    background-size: 325px;
    background-position: 0px -43px;
}
.why-use-com h4 {
    text-align: left;
    font-size: 16px;
    font-weight: 700;
    margin-top: 50px;
    color: #000 !important;
}
.why-use-com p {
    font-size: 14px;
    color: #000;
}
.why-use-2 {
    margin-left: 706px;
}
.why-use-2:before {
    background-position: 0px -181px;
}
.why-use-3 {
    margin: 270px 0px 0px 0px;
}
.why-use-3:before {
    background-position: 0 2px;
}
.why-use-4 {
    margin: 270px 0px 0px 848px;
}
.why-use-4:before {
    background-position: 0px -134px;
}
.why-use-6 {
    margin: 578px 0px 0px 200px;
}
.why-use-6:before {
    background-position: 0px -183px;
}
.why-use-7 {
    margin: 578px 0px 0px 706px;
}
.why-use-7:before {
    background-position: 0px -232px;
}

@-moz-keyframes fadeInUp {
0%{opacity:0;-moz-transform:translateY(20px)}
100%{opacity:1;-moz-transform:translateY(0)}
}
@-o-keyframes fadeInUp {
0%{opacity:0;-o-transform:translateY(20px)}
100%{opacity:1;-o-transform:translateY(0)}
}
@keyframes fadeInUp {
0%{opacity:0;transform:translateY(20px)}
100%{opacity:1;transform:translateY(0)}
}

.animated {
    visibility: visible;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -ms-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -ms-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-play-state: running;
    -moz-animation-play-state: running;
    -ms-animation-play-state: running;
    -o-animation-play-state: running;
    animation-play-state: running;
}
.animated.fadeInUp {
    -webkit-animation-name: fadeInUp;
    -moz-animation-name: fadeInUp;
    -o-animation-name: fadeInUp;
    animation-name: fadeInUp;
}

/* popup style */
.l_c_h {
    width: 300px;
    position: fixed;
    bottom: -350px;
    right: 15px;
    background: #fff;
    border-radius: 4px 0 0 0;
    z-index: 5000;
    display: block;
    -webkit-animation: l_c_h 0.5s forwards;
    -webkit-animation-delay: 2s;
    animation: l_c_h 0.5s forwards;
    animation-delay: 2s
}

@-webkit-keyframes l_c_h {
    100% {
        bottom: 0
    }
}

@keyframes l_c_h {
    100% {
        bottom: 0
    }
}

.l_c_h .c_h {
    cursor: pointer;
    border-radius: 4px 0 0 0;
    background: #2b9c17;
    line-height: 34px;
    position: relative;
    padding: 5px
}

.l_c_h .left_c {
    color: #ebebeb;
    width: 150px;
    font-size: 16px;
    font-family: Arial, Helvetica, sans-serif
}

.l_c_h .right_c {
    text-align: center;
    background: #2b9c17;
    line-height: 30px;
    position: absolute;
    right: 0;
    bottom: 12px
}

.l_c_h .right_c a {
    color: #ebebeb;
    border-radius: 3px;
    cursor: pointer !important;
    font-size: 16px;
    line-height: normal !important;
    margin-top: 0 !important;
    padding: 1px 0px !important;
    text-align: center !important;
    text-decoration: none;
    font-weight: normal;
    font-size: 16px;
    vertical-align: bottom
}

.clear {
    clear: both
}

.chat_container {
    padding: 10px;
    background: #2b9c17
}

.left {
    float: left
}

.right {
    float: right
}

.left_icons {
    width: 35px;
    height: auto;
    text-align: center;
    color: #999;
    /*background:#DE4A4A;*/
    background: #ff8f32;
    font-size: 15px
}

.left_icons a {
    color: #fff;
    font-weight: normal
}

.center_icons {
    text-align: center;
    padding: 2px 0px 0px 5px
}

.logout img {
    margin-top: 8px
}

.video-lg-txt {
    margin: 15px 0 0 0;
    font-size: 16px;
    color: #fff;
    font-weight: bold;
    text-align: center
}

.video-sm-txt {
    margin: 5px 0 0 0;
    color: #fff;
    text-align: center
}

.video-sm-txt a, .video-sm-txt a:hover, .video-lg-txt a, .video-lg-txt a:hover {
    color: #fff !important;
    cursor: pointer
}
/* popup style ends */

@media screen and (max-width: 1225px) {
    .why-use-sec {
    height: auto;
}
    .wam-container {
    margin: 0 auto;
    max-width: 90%;
}
    .why-use-5 {
    display: none;
}
    .why-use-com {
    position: relative;
    margin: 0px;
    width: 50%;
    padding: 20px 30px;
    margin-bottom: 25px;
}
}

@media screen and (max-width: 992px) {
    .wam-container {
    margin: 0 auto;
    max-width: 100%;
    width: 90%;
}
    .why-use-5 {
    margin: 0 auto;
    position: relative;
    margin-top: 35px;
}
    .why-use-com {
    width: 100%;
    margin-bottom: 0px;
        height: auto;
}
    .o360-why-left, .o360-why-right {
    width: 100%;
    padding-right: 0;
    margin-bottom: 40px;
}
    .product-detail .container {
        max-width: 100%;
        width: 90%;
    }
    .gart-text {
        width: 100%;
        
    }
}
@media screen and (max-width: 768px) {
     .inner-top-banner {
    min-height: 315px;
    background: #022c21 !important;
}
    .why-use-com {
        padding: 0;
        margin-bottom: 40px;
    }
    .why-use-sec {
        padding: 0 0 20px;
    }
    .o360-why {
        padding: 30px 0;
    }
    #log360-feature-page h4 {
        margin: 0 0 40px 0;
        line-height: 1.5;
    }
}