@charset "utf-8";
/* CSS Document */
.jira {color: #2B2B2B!important;padding-top: 90px;}
.jira .main-content p, .jira .main-content ul li{font-family: o-regular;
  font-size: 18px;}
.jira .banner{margin: 0px 0px 50px;background-image: url("../img/microsoft-banner-back.png");background-repeat: no-repeat;background-size: cover;min-height: 600px;text-align: center;}
.jira .banner img{margin: 95px 0px 40px;}
.jira .banner .banner-title{font-family: o-semibold;font-size: 44px;color: #2B2B2B;margin-bottom: 30px;}
.jira .banner .banner-title span{color: #2684FF;}
.jira .banner .banner-para{font-size: 18px;color: #2B2B2B;font-family: o-regular;}
/*Why integrated*/
.jira .micro-why{background-color: #F7F5FC;padding: 40px 0px;}
.jira .micro-why .micro-why-title{font-family: o-semibold;font-size: 44px;text-align: center;margin: 30px 0px 40px;}
.jira .micro-why .micro-grid-title{margin-left: 30px;font-size: 24px;font-family: l-bold}
.jira .micro-why .micro-grid img{width: 70px;}
.jira .micro-why .micro-grid {display: flex;align-items: center;}
.jira .micro-why .micro-grid-para {margin-top: 25px;font-size: 18px;font-family: l-regular;line-height: 30px;}
.jira .micro-why .why-grid {min-height: 285px;background-color: #FFFFFF;border-radius: 25px;padding: 25px;margin-bottom: 25px;border: 1px solid #fff;}
.jira .micro-why .why-in .col-md-6:first-child .why-grid:hover {border: 1px solid rgba(242, 178, 96);box-shadow: rgba(242, 178, 96, 0.2) 0px 20px 25px -5px, rgba(242, 178, 96, 0.04) 0px 10px 10px -5px;}
.jira .micro-why .why-in-one .col-md-6:first-child .why-grid:hover {border: 1px solid rgba(171, 106, 254);box-shadow: rgba(171, 106, 254, 0.2) 0px 20px 25px -5px, rgba(242, 178, 96, 0.04) 0px 10px 10px -5px;}
.jira .micro-why .why-in .col-md-6:nth-child(2) .why-grid:hover {border: 1px solid rgba(101, 234, 210);box-shadow: rgba(101, 234, 210, 0.2) 0px 20px 25px -5px, rgba(242, 178, 96, 0.04) 0px 10px 10px -5px;}
.jira .micro-why .why-in-one .col-md-6:nth-child(2) .why-grid:hover {border: 1px solid rgba(164, 215, 119);box-shadow: rgba(164, 215, 119, 0.2) 0px 20px 25px -5px, rgba(242, 178, 96, 0.04) 0px 10px 10px -5px;}
/*Left content*/
.jira .table-content{font-family: o-semibold;font-size: 18px;margin-bottom: 20px;}
.jira .side-menu a span{font-family: o-semibold;font-size: 16px;}
.jira .side-menu a {font-family: o-regular;color: #2B2B2B;font-size: 16px;text-decoration: none;float: left;line-height: 33px;margin-bottom: 20px;}
.jira .js-sticky-sidebar {position: sticky;top: 120px;}
.jira .js-sticky-sidebar.is-fixed {position: fixed;top: 130px;width: 260px;}
.jira .js-sticky-sidebar.is-stopped {position: absolute;top: auto;bottom: 0;width: 260px;}
.jira .js-sticky-sidebar {
  position: sticky;
  top: 140px;
}
[id] {
  scroll-margin-top: 140px;
}
/*Right content*/
.jira .main-content{margin:60px 0px 30px;}
.jira .main-content .enable{margin-bottom: 60px;}
.jira .right-content img{width: 100%;margin: 30px 0px;}
.jira .right-content h3{color: #5A4D9F;font-size: 32px;font-family: o-semibold;}
.jira .right-content .okr-must-title{margin-bottom: 40px;}
.jira .right-content .first-must span, .jira .right-content span{color: #5A4D9F;font-family: o-semibold;}
.jira .right-content ul li{line-height: 35px;}
.jira .right-content .step-3{margin-top: 40px;}
.jira .right-content .access-title{margin: 40px 0px 40px;font-family: o-semibold;font-size: 24px;}
@media (min-width: 320px) and (max-width:767px) {
	.jira .container, .jira .micro-why .container, .jira .main-content .container{width: 100%;max-width: 100%;padding: 0px 30px;}
	.jira .micro-why .col-md-6, .jira .main-content .col-md-3, .jira .main-content .col-md-9{width: 100%;}
	.jira .micro-why .why-grid {min-height: auto;}
	.jira .banner img {width: 100%;}
	.jira .banner .banner-title, .jira .micro-why .micro-why-title {font-size: 36px;}
	.jira .js-sticky-sidebar {position: unset !important;}
	.jira .side-menu a {float: none;display: block;}
}
@media (min-width: 768px) and (max-width:991px) {
.jira .micro-why .why-in .why-grid {min-height: 340px;}
.jira .micro-why .why-in-one .why-grid{min-height: 285px;}
.jira .js-sticky-sidebar {top: 120px;margin-bottom: 208px;}
/*.js-sticky-sidebar {position: relative;margin-top:  120px;}*/
.jira .js-sticky-sidebar.is-fixed {width: 155px;}
}
@media (min-width: 992px) and (max-width:1199px) {
.jira .js-sticky-sidebar.is-fixed {width: 210px;}
}