h1{font-size:36px;} h2 {font-size:32px;}h3 {font-size:30px;}h4 {font-size:28px;}h5 {font-size:26px;}h6 {font-size:20px;}p {font-size:18px;}


/*new enhancement message*/
.message-box{position:fixed; bottom:250px; right: 20px; z-index: 100; width:160px;}
.new-message{position:relative; margin-bottom: 20px;}
.message-box p{background:#fff; border-radius: 15px; color: #000; padding:20px 5px 20px;text-align: center; font-size:16px; box-shadow: 0px 0px 10px rgb(0 0 0 / 20%);}
.arrow-down{width: 0;height: 0;border-style: solid;border-width: 25px 20px 0 20px;border-color: #fff transparent transparent transparent;position: absolute; bottom: -15px; right: 15px;}
.btn-new{border-radius:50%; background:#64be00; color:#fff; width: 50px; height: 50px; font-size:13px; text-align: center; position: absolute; right: 0;border: none; display: none; padding: 0;}
.btn-close {border-radius:50%; background:#64be00; width: 35px; height: 35px;position: absolute; right: 0;border: none;}
.btn-close:before, .btn-close:after {position: absolute;left: 0; right:0; margin: 0 auto; top: 5px; content: ' ';height: 25px;width: 1px; background-color: #fff;}
.btn-close:before {transform: rotate(45deg);}
.btn-close:after {transform: rotate(-45deg);}
.new-message .btn { min-width: 120px!important;}
.new-message .btn-lg {border-radius: 35px;font-size: 14px;background-color:#000!important;}

@media (max-width: 1440px) {
.message-box{bottom:200px;}
}

@media (max-width: 991px) {
.message-box{bottom:100px;}
}

@media (max-width: 450px) {
.message-box{bottom:80px;}
}

/* Additions */
.btn.btn-lg {padding: 0 20px; }

.container.maxwid {
    max-width: 1320px !important;
}

.page-node-type-product .btn.btn-lg,
.page-node-type-product .btn.btn-lg:hover {
    background-color: #64be00;
}

.text-color {
    color: #64be00 !important;
}

.spec-note{
	padding-top:20px;
}

.spec-note ol{
	list-style: none;
}

.spec-note ol li{
  text-indent: -20px;
  padding-left: 18px;
}

/* start */

.astra-banner{
	 background:url('/sites/zyxel/files/library/assets/products/astra/banner_Astra_1920x765.jpg') no-repeat 50% center;
	 height:650px;
	 background-size:cover;
	 position:relative;
}

.astra-box {
	display: flex;
    flex-direction: column;
    width: 50%;
    height: 100%;
    padding-left: 15%;
    padding-top: 20%;
}

.astra-box h2{
	color:#f3f5f2;
}

@media screen and (max-width: 1700px) {
.astra-box {
    padding-top: 21%;
}
}

@media screen and (max-width: 1601px) {
.astra-box {
	padding-left: 15%;
    padding-top: 24%;
}
}

@media screen and (max-width: 1440px) {
.astra-banner{
	 height:500px;
}
.astra-box {
    width: 55%;
	padding-left: 15%;
	padding-top: 20%;
}
}

@media screen and (max-width: 1300px) {
.astra-box {
    padding-top: 22%;
}
}

@media screen and (max-width: 1025px) {
.astra-banner{
	 height:500px;
}
.astra-box {
	padding-left: 10%;
	width: 55%;
	padding-top: 28%;
}
}

@media screen and (max-width: 991px) {
.astra-box {
    padding-top: 15%;
}
}

@media screen and (max-width: 800px) {
.astra-banner{
	background:url('/sites/zyxel/files/library/assets/products/astra/banner_Astra_1000x765.jpg') no-repeat 70% center; 
	height:600px;
	background-size:cover; 
	position:relative;
}

.astra-box {
    justify-content: center;
    width: 70%;
}
}


@media screen and (max-width: 450px) {
.astra-banner{
	 height:300px;
}
.astra-box h2{
	font-size: 14px;
}
.astra-box {
    width: 60%;
}
}

/* start */

.NetworkProtection{
	position:relative;
	overflow:hidden;
	height:40vw; 
	background:url('/sites/zyxel/files/library/assets/products/astra/why_need_endpoints.jpg'); 
	background-repeat:no-repeat;
	background-size:cover; 
	background-position:50% top;	
}

.NetworkProtection_area{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 50%;
    height: 100%;
    margin: 0 auto;
    text-align: center;
}

.NetworkProtection_area .text h3{
    font-weight: bold;
    padding-bottom: 30px;
}

.NetworkProtection_area .features{
	display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 30px;
	flex-direction: row;
	width: 90%;
}

.NetworkProtection_area .features .card{
	background-color: #fff;
    border-radius: 10px;
    padding: 20px;
    border: 1px solid #e9e7e8;
	margin: 10px;
	width: 100%;
}

.NetworkProtection_area .features .card p{
	font-weight:bold;
}

.NetworkProtection_area .features .card h6{
	font-size: 70px;
    color: #64be00;
}

.NetworkProtection_area .features .card sub{
	font-size: 20px;
}

@media screen and (max-width: 1700px){
.NetworkProtection{
	height:50vw; 
}
}

@media screen and (max-width: 1601px){
.NetworkProtection_area {
    width: 60%;
}
.NetworkProtection_area .features{
	width: 90%;
}
}

@media screen and (max-width: 1440px){
.NetworkProtection_area{
    width: 70%;
}
}

@media screen and (max-width: 1300px){
.NetworkProtection{
	height:60vw; 
}
}

@media screen and (max-width: 1025px){
.NetworkProtection{
	height:80vw; 
}
.NetworkProtection_area .features{
	width: 100%;
}
}

@media screen and (max-width: 991px){
.NetworkProtection {
	height:120vw; 
}
.NetworkProtection_area {
    width: 90%;
}
}

@media screen and (max-width: 450px){
.NetworkProtection {
    height: 1400px;
}
.NetworkProtection_area .text {
    width: 90%;
}
.NetworkProtection_area .features {
    flex-direction: column;
	width: 80%;
}
}


/* start */

.Bubble_1{
	position: absolute;
    bottom: 0;
    left: 10%;
    z-index: 99;
}

.Bubble_1 img{
    width: 250px!important;
}

.overview-section{
	display: flex;
    flex-direction: row-reverse;
    position: relative;
}


.overview-section .text{
	width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 60px;
}

.overview-section .text h3{
	font-weight:bold;
	padding-bottom:30px;
}

.overview-section img{
	width: 50%!important;
}

@media screen and (max-width: 1601px) {
.Bubble_1{
    left: 0%;
}	
.overview-section{
	width: 90%;
	margin:0 auto;
}
}

@media screen and (max-width: 1025px) {
.Bubble_1 img{
    width: 150px!important;
}	
}

@media screen and (max-width: 991px) {
.overview-section {
    display: flex;
    flex-direction: column;
	width: 100%;
}
.overview-section .text {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 0px;
	padding-bottom: 10px;
}
.overview-section img {
    width: 100%!important;
}
}

/* start */

.Bubble_2{
	position: absolute;
    bottom: -100px;
    right: 5%;
    z-index: 99;	
}

.Bubble_2 img{
    width: 300px!important;
}

.branch-office-section{
	display: flex;
    flex-direction: row;
}


.branch-office-section .text{
	width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
	padding-right: 60px;
}

.branch-office-section .text h3{
	font-weight:bold;
	padding-bottom:30px;
}

.branch-office-section img{
	width: 50%!important;
}

@media screen and (max-width: 1440px) {
.Bubble_2{
    right: 0%;
}

.Bubble_2 img{
    width: 250px!important;
}
}

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

.Bubble_2 img{
    width: 200px!important;
}
}

@media screen and (max-width: 991px) {
.branch-office-section {
    display: flex;
    flex-direction: column;
}
.branch-office-section .text {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 0px;
	padding-bottom: 10px;
}
.branch-office-section img {
    width: 100%!important;
}
}

@media screen and (max-width: 1601px) {
.branch-office-section {
	width: 90%;
	margin:0 auto;
}
}

@media screen and (max-width: 991px) {
.branch-office-section {
	width: 100%;
}
}

@media screen and (max-width: 450px) {
.branch-office-section .text{
	padding-right: 0px;
}
}


/* start */

.best-practice .frame .text{
	text-align: center;
    width: 70%;
    margin: 0 auto;
}

.best-practice .frame .text h3{
    font-weight: bold;
    padding-bottom: 30px;
}

@media screen and (min-width: 1200px) {
  .best-practice .frame .title {
    max-width: 970px;
    margin: auto;
  }
}
.best-practice .frame p {
  margin-top: 10px;
}
@media screen and (min-width: 1200px) {
  .best-practice .frame p {
    margin-top: 20px;
  }
}

.best-practice .frame .box-wrap .box {
  text-align: center;
  margin-top: 20px;
}
.best-practice .frame .box-wrap .box .img {
  width: 100%;
  max-width: 462px;
  height: 165px;
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
}
.best-practice .frame .box-wrap .box .img img{
	width: 100px;
}

.best-practice .frame .box-wrap .box .benifit {
  font-family: galano_grotesquesemibold, Helvetica, Arial, sans-serif !important;
  font-size: 20px;
}
@media screen and (min-width: 769px) {
  .best-practice .frame .box-wrap .box {
    flex: 1;
    padding: 0 10px;
    border-left: 2px solid #64be00;
  }
  .best-practice .frame .box-wrap .box:last-child {
    border-right: 2px solid #64be00;
  }
}
@media screen and (min-width: 769px) {
  .best-practice .frame .box-wrap {
    display: flex;
  }
}
@media screen and (min-width: 769px) and (min-width: 1200px) {
  .best-practice .frame .box-wrap {
    margin-top: 40px;
  }
}
@media screen and (min-width: 992px) {
  .best-practice {
    padding: 40px 0;
  }
}

@media screen and (max-width: 450px) {
.best-practice .frame .text{
    width: 95%;
}
}

/* start */

.AstraFeatures .text{
	width: 80%;
    margin: 0 auto;
    text-align: center;
}

.AstraFeatures h3{
	text-align: center;
	font-weight: bold;
    padding-bottom: 30px;
}

.AstraFeatures .panel-body {
    padding: 40px 20px 50px!important;
}

.AstraFeatures .table-responsive{
	font-size: 18px;
}

.AstraFeatures .table-responsive .table .item{
	 width: 40%;
	 font-weight:bold;
}

.AstraFeatures .table-responsive .table .subitem{
	 width: 10%;
	 font-weight:bold;
	 text-align: center;
}

.AstraFeatures .table-responsive .table .box{
	text-align: center;
    vertical-align: middle;
}

.AstraFeatures .table-responsive .table tr th{
    vertical-align: text-top;
}

.AstraFeatures .table-responsive .table .subitem span{
	 font-weight:400;
	 font-size: 12px;
}

.AstraFeatures .table-responsive .table span i{
    position: relative;	
}

.AstraFeatures .table-responsive .table span sup{
    right: 0px;
}

.AstraFeatures .table-responsive .table .box .checkpos{
	position: relative;
    left: -5px;
}

@media screen and (max-width: 768px){
.AstraFeatures .table-responsive {
    border: none;
}
}

@media screen and (max-width: 767px){
.AstraFeatures .panel-body {
    padding: 30px 10px 30px 10px !important;
}
}

@media screen and (max-width: 450px){
.AstraFeatures .text{
	width: 95%;
}
}


.AstraFeatures .panel-default:first-child {
    border-top: none !important;
	border-bottom: none!important;
}

/* start */


/*# sourceMappingURL=style.css.map */



/* .AstraApp {
  padding: 20px 0;
  background-color: #f7f7f7;
}
.AstraApp .frame {
	width: 90%;
	max-width: 1324px;
	display: flex;
	margin:0 auto;
	flex-direction: row;
	align-items: center;
	justify-content: center;
}

.AstraApp .frame .text{
	width: 60%;
}

.AstraApp .frame .title {
  line-height: 1.2em;
  text-align: center;
}
.AstraApp .frame p {
  margin-top: 10px;
  text-align: center;
}

.AstraApp .frame .area {
	display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-left: 60px;
}

.AstraApp .frame .area .icon-wrap{
	width:150px;
}

.AstraApp .frame .search{
    border: 2px solid black;
    display: inline-block;
    padding: 8px 25px 8px 15px;
    border-radius: 30px;    
	margin-top: 15px;
}

@media screen and (min-width: 1200px) {
  .AstraApp .frame p {
    margin-top: 20px;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .AstraApp .frame p {
    margin-top: 40px;
  }
}

@media screen and (min-width: 992px) {
  .AstraApp {
    padding: 40px 0;
  }
}
@media screen and (min-width: 992px) and (min-width: 1200px) {
  .AstraApp {
    padding: 60px 0;
  }
}

@media screen and (max-width: 450px){
.AstraApp .frame {
    flex-direction: column;
}
.AstraApp .frame .text {
    width: 80%;
}
.AstraApp .frame .area {
    flex-direction: column;
    padding-left: 0px;
	padding-top: 15px;
}
} */



.Astra-App{
	display: flex;
    flex-direction: row-reverse;
    width: 100%;
    align-items: center;
}

.Astra-App .text{
	width: 45%!important;
}

.Astra-App .easy_app{
	width: 55%!important;
}

.Astra-App .text h3{
	font-weight:bold;
	padding-bottom:30px;
}

.Bubble_3{
	position: absolute;
    top: 10px;
    left: 8%;
    z-index: 99;	
}

.Bubble_3 img{
	width:250px!important;
}

@media screen and (max-width: 1440px) {
.Bubble_3{
    left: 5%;
}
.Bubble_3 img{
	width:200px!important;
}
}

@media screen and (max-width: 1025px) {
.Bubble_3{
    left: 2%;
}
.Bubble_3 img{
	width:150px!important;
}
}

@media screen and (max-width: 991px) {
.Astra-App {
    flex-direction: column;
}
.Astra-App .text {
    width: 100%!important;
}
.Astra-App .easy_app {
    width: 100%!important;
}
.Bubble_3{
    display: none;
}
}

.Astra-Mobile-App{
	background:url('/sites/zyxel/files/library/assets/products/astra/Astra_app.jpg') no-repeat 50% center; height:800px; background-size:cover; position:relative;	
}

.Astra-Mobile-App .area{
	display: flex;
    align-items: center;
    height: 100%;
	justify-content: flex-end;
    padding-right: 4%;
}

.Astra-Mobile-App .area .box{
	width:40%;
}

.Astra-Mobile-App .area .box .text ul{
	list-style: none;
	line-height: 2em;
    padding-left: 0px;
}

.Astra-Mobile-App .area .box .text ul li{
	text-indent: -10px;
    padding-left: 20px;
}

.Astra-Mobile-App .area .box .text h2{
	padding-bottom:20px
}

.Astra-Mobile-App .area .box .text .fa-check{
	color:#ff8900;
}

.Astra-Mobile-App .Watch{
    position: absolute;
    display: flex;
    justify-content: center;
    width: 100%;
	bottom:-10px;
}

.app_icon{
	width:60%;
}


@media screen and (max-width: 1440px) {
.Astra-Mobile-App{
	height:600px;
}
}

@media screen and (max-width: 1025px) {
.Astra-Mobile-App{
	height:550px;
}
.Astra-Mobile-App .Watch{
	display:none;
}
}


@media screen and (max-width: 991px) {
.Astra-Mobile-App {
    background: url(/sites/zyxel/files/library/assets/products/astra/Astra_app_mobile.png) no-repeat bottom center;
    height: 1000px;
    background-size: contain;
    position: relative;
}

.Astra-Mobile-App .area {
	align-items: flex-start;
    justify-content: flex-end;
}
.Astra-Mobile-App .area .box {
    width: 95%;
}
}


@media screen and (max-width: 450px) {
.Astra-Mobile-App {
    height: 650px;
}
}


.Astra-App .AstraAppIcon{
	display: flex;
	align-items: center;
}

.Astra-App .AstraAppIcon .astra_logo{
	width: 25%;

}

.Astra-App .AstraAppIcon .icon_search{
	display: flex;
    flex-direction: column;
	width: 50%;
}

.Astra-App .AstraAppIcon .iconapp{
	display: flex;
}


/* start */

.Bubble_4{
	position: absolute;
    top: 0px;
    right: 10%;
    z-index: 99;	
}

.Bubble_4 img{
    width: 250px!important;
}

.TrialSection{
	display: flex;
    flex-direction: row;
}


.TrialSection .text{
	width: 80%;
    display: flex;
    flex-direction: column;
    justify-content: center;
	padding-right: 60px;
}

.TrialSection .text h3{
	font-weight:bold;
	padding-bottom:30px;
}

.TrialSection .AstraAppIcon{
	display: flex;
	align-items: center;
	padding-top: 20px;
}

.TrialSection .AstraAppIcon .astra_logo{
	width: 25%;
}

.TrialSection .AstraAppIcon .icon_search{
	display: flex;
    flex-direction: column;
	width: 50%;
}

.TrialSection .AstraAppIcon .iconapp{
	display: flex;
	margin-bottom: -10px;
}

.TrialSection .AstraAppIcon .astra_logo img, .TrialSection .AstraAppIcon .icon_search img, .TrialSection .AstraAppIcon .iconapp img{
	width:100%;
}

@media screen and (max-width: 1601px) {
.TrialSection {
	width: 90%;
	margin:0 auto;
}
}

@media screen and (max-width: 1440px) {
.Bubble_4{
    right: 0%;
}

.Bubble_4 img{
    width: 250px!important;
}
}

@media screen and (max-width: 1025px) {
.TrialSection .text{
	width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
	padding-right: 0px;
}
.Bubble_4 img{
    width: 200px!important;
}
}

@media screen and (max-width: 991px) {
.TrialSection {
    display: flex;
    flex-direction: column;
	width: 100%;
}
.TrialSection .text {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 0px;
	padding-bottom: 10px;
}
.TrialSection .astra_laptop img {
    width: 100%!important;
}
.Bubble_4{
	display:none;	
}
}

@media screen and (max-width: 450px) {
.TrialSection .text{
	padding-right: 0px;
}
}

/* start */

.Trial-section{
	background-color:#64bd00;
}

.Trial-section .text{
	text-align:center;
	width:65%;
	margin:0 auto;
}

.Trial-section h3{
	font-weight:bold;
	padding-bottom:10px;
	color:#fff;	
}

.Trial-section p{
	color:#fff;	
}

.Trial-section .text .btn-call-to-action{
	background-color: #fff!important;
    color: #64be00!important;
}


.AstraAboutrelated{
	width: 85%;
    text-align: center;
    margin: 0 auto;
}

.AstraAboutrelated h3{
	font-weight:bold;
	padding-bottom:30px;	
}

.AboutAstraArea{
	display: flex;
    justify-content: space-between;
	padding-top:20px;
}

.AboutAstraArea .area{
	width: 32%;
}

.AboutAstraArea .area .text{
	padding:10px 15px 10px 0px;
}


.Trial-section .text {
    text-align: center;
    width: 100%;
    margin: 0 auto;
}

@media screen and (max-width: 450px) {
.AstraAboutrelated{
	width: 100%;
    text-align: center;
    margin: 0 auto;
}
.AboutAstraArea {
    flex-direction: column;
}
.AboutAstraArea .area{
	width: 100%;
}
}

.note{
	text-align: left;
    width: 85%;
}

.note .word{
    padding: 20px 0px;
    font-weight: bold;
	font-style: italic;
}

.note .word ol{
	list-style: none;
}

/* .panel.panel-default {
    border:none !important;
} */

/* .panel-body {
    padding: 0 !important;
} */

.app_text ul li a {
    padding: 20px 5%;
}

.app_text .nav-tabs > li {
    margin: 0 !important;
}

#app-section .tab-content .nav.nav-tabs li a:hover {
    background: #ddd;
}

#app-section .tab-content .nav.nav-tabs li.active a:hover {
    background: #64be00;
}

.btn {
    padding:  0 20px;
}

.area .text a:hover {
    color: #64be00;
}


/* start */

.ManageEndpoints{
	text-align:center;
	width:85%;
	margin:0 auto;
}

.ManageEndpoints h3 {
	font-weight:bold;
	padding-bottom:30px;
}

.ManageEndpointsButton a:hover{
	color:#fff!important;
}

.ManageEndpointsButton .btn.btn-lg{
    font-size: 18px;
}

.astra-features{
	display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width: 50%;
	padding-top: 30px;
}

.Astra_GUI{
	position: absolute;
    display: flex;
    width: 100%;
    height: 100%;
    right: -650px;
    top: 0px;
    align-items: center;
    justify-content: center;
}

.astra-features .box{
	width: 90%;
	position: relative;
}

.astra-features .panel-heading {
    padding: 0;
    position: relative;
    cursor: pointer;
    background-color: #fff!important;
}

.astra-features  .panel-title{
	color: #000;
	font-size: 18px;
}

.astra-features .panel-body p{
	width:95%;
}

.astra-features .panel {
/*     border-top: 1px solid #64be00; */
    padding: 10px 0;
}

.astra-features .accordion .panel-heading [data-toggle=collapse]:after {
font-family: FontAwesome;
    content: "\f106";
    font-size: 25px;
    line-height: 12px;
    position: absolute;
    right: 5px;
    top: 15px;
    border-radius: 99px;
    border: 1px solid #64be00;
    width: 25px;
    height: 25px;
    padding: 4px;
}

.astra-features .accordion .panel-heading [data-toggle=collapse].collapsed:after {
    content: "\f105";
	padding: 5px 8px;
}

.Astra_GUI_mobile{
	display:none;
}

@media screen and (max-width: 1025px) {
.astra-features .box{
	width: 100%;
	position: relative;
}
.Astra_GUI {
    right: -500px;
}
}

@media screen and (max-width: 991px) {
.astra-features {
    flex-direction: column;
	width: 100%;
}
.Astra_GUI{
	display:none;
}
.Astra_GUI_mobile{
	display:block;
}
}

@media screen and (max-width: 450px) {
.ManageEndpoints{
	width:95%;
}
}