@charset "utf-8";
/* CSS Document */

html,body { height:100%; }
body { 
	font-family: 'Ubuntu', sans-serif;
	color:#000000; font-size:0.85em; line-height:1.5em;
}
p { margin:0;}
a, a:visited { text-decoration:none; color:#f36f21;}
a:active, a:hover { text-decoration:underline; color:#f36f21;}
.clearing { clear:both;}
.left { float: left;}
.right { float: right;}
.img_left { float: left; margin:0 2em 1em 0; }
.img_right { float: right; margin:0 0 1em 2em; }

.table {display:table;border-collapse:separate;border-spacing:0.25em;}
.row {display:table-row;}
.cell {display:table-cell;padding:0.5em;}

h1 { font-size: 2.3em; color: #fff; margin:0; padding:0; font-weight:normal;}

#logo {display:inline-block; position:absolute; z-index:99; top:1em; left:1em;}
#logo a img { border:0;}
#logo img { max-width:200px;}
a.menu_icon, #my-icon {position:absolute; z-index:99; top:0; right:0; color:#fff;}

a.btn {
	font-size:1.15em; margin-top:0.85em; width:auto; line-height:1.5em; background:#0c4da2; border:0; padding:0.5em 1.5em; 
	color:#ffffff; display:inline-block;
}
a.btn:hover {background:#f36f21; text-decoration:none}

a.qbtn {
	margin-top:0.85em; width:auto; line-height:1.5em; background:#0c4da2; border:0; padding:0.75em 3.5em; border-radius: 2em;
	color:#ffffff; display:inline-block;
}
a.qbtn:hover {background:#f36f21; text-decoration:none}

/* Overwriting styles for mmenu
* --------------------------------------- */
nav#menu li, nav#menu li a {color:#000;}
nav#menu li:hover, nav#menu li a:hover {color:#f36f21;}
.mm-navbar { background:#2e3192;}
.mm-title { color:#fff !important;}
.mm-menu .mm-btn:after,.mm-menu .mm-btn:before{border-color:rgba(255,255,255,.6)}

/* Overwriting styles for hamburger
* --------------------------------------- */
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after { background-color: #fff; width: 30px; height: 2px;}

.header { height:269px; background-size: cover; background-color:#7a7a7a;}
.header h1 { position:relative; top:0; left:0; clear:both; padding:4.5em 2.5em 0; line-height:normal;}
/*
#about .header { background-image:url(../images/banners/banner_01.jpg);}
#compSys .header { background-image:url(../images/banners/banner_02.jpg);}
#network .header { background-image:url(../images/banners/banner_03.jpg);}
#app .header { background-image:url(../images/banners/banner_04.jpg);}
#web .header { background-image:url(../images/banners/banner_05.jpg);}
#unified .header { background-image:url(../images/banners/banner_06.jpg);}
#contactCenter .header { background-image:url(../images/banners/banner_07.jpg);}
#dataCenterInfra  .header { background-image:url(../images/banners/banner_08.jpg);}
#outsourcing .header { background-image:url(../images/banners/banner_09.jpg);}
#supportCenter .header { background-image:url(../images/banners/banner_10.jpg);}
#endUser .header { background-image:url(../images/banners/banner_11.jpg);}
#callCenter .header { background-image:url(../images/banners/banner_12.jpg);}
#relocation .header { background-image:url(../images/banners/banner_13.jpg);}
#dataCenterMain .header { background-image:url(../images/banners/banner_14.jpg);}
#partners .header { background-image:url(../images/banners/banner_15.jpg);}
#contact .header { background-image:url(../images/banners/banner_16.jpg);}
*/

#about .header { background-image:url(../images/banners/banner_01.jpg);}
#compSys .header, #network .header, #dataCenterInfra .header, #cloudBasedCallCent .header, #pbxTelephony .header, #ipTelephony .header { background-image:url(../images/banners/banner_03.jpg);}
#videoConf .header { background-image:url(../images/banners/banner_03a.jpg);}
#outsourcing .header, #supportCenter .header, #endUser .header, #callCenter .header, #relocation .header, #dataCenterMain .header { background-image:url(../images/banners/banner_04.jpg);}
#partners .header { background-image:url(../images/banners/banner_05.jpg);}
#contact .header { background-image:url(../images/banners/banner_06.jpg);}

#Contents { margin:2.6em 0;}
#Contents section { margin-bottom:3em;}
/*
#Contents img.actual { max-width: 50% !important;}

#Contents img.actual {
  -webkit-transform: scale(0.8); /* Saf3.1+, Chrome *
     -moz-transform: scale(0.8); /* FF3.5+ *
      -ms-transform: scale(0.8); /* IE9 *
       -o-transform: scale(0.8); /* Opera 10.5+ *
          transform: scale(0.8);
             /* IE6–IE9 *
             filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.9999619230641713, M12=-0.008726535498373935, M21=0.008726535498373935, M22=0.9999619230641713,SizingMethod='auto expand');
}​*/

#about #Contents section {width:48%; display:inline-block; float:left; margin-right:3em;}
#about #Contents section:first-child { width:100%; display:block; float:none;}
#about #Contents section:nth-child(odd) { margin-right:0}
#about #Contents section:last-child, #about #Contents section:nth-child(2) { margin-bottom:0;}

#pbxTelephony #Contents section {width:48%; display:inline-block; float:left; margin-right:3em;}
#pbxTelephony #Contents section:first-child, #pbxTelephony #Contents section:nth-child(4) { width:100%; display:block; float:none; clear:both;}
#pbxTelephony #Contents section:nth-child(odd) { margin-right:0}

#pbxTelephony #Contents section h2 { margin-top:0;}

#ipTelephony #Contents #yeastar section {width:47%; display:inline-block; float:left; margin-right:5em;}
#ipTelephony #Contents #yeastar section:nth-child(2) { margin-right:0}
#ipTelephony #Contents #yeastar section:nth-child(3) { width:100%; display:block; float:none; clear:both;}

#ipTelephony #Contents #yealink section {width:30%; display:inline-block; float:left; margin-right:4em;}
#ipTelephony #Contents #yealink section:nth-child(3n+1) { margin-right:0}
#ipTelephony #Contents #yealink section:nth-child(5) { width:100%; display:block; float:none; clear:both;}

.nav > li > a { background-color: #f8f8f8; color:#003471;}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    color: #f26522 !important; 
}
.nav > li > a:hover,
.nav > li > a:focus { 
	background-color: #fff !important; border-bottom-color: #fff !important; color:#f26522;
}

#videoConf .contentBox { padding:3em;}
#videoConf #vmr { /*background:#fcfcfc;*/}
#videoConf #vcc22 { background:#252525; color:#cccccc;}
#videoConf #vcc22 h3 { color:#58ccf8;}

.v-container { text-align:center; margin:0 auto;}
#v-imgs { margin:3em auto; padding:0; width:96%;}
#v-imgs li { margin:0; padding:0; display:inline-block; float:left; list-style:none;}
#v-imgs li img { max-height:230px;}

#contact #Contents section) { width:100%; display:block; float:none;}
/*
#contact #Contents section {width:30%; display:inline-block; float:left; margin-right:3em; margin-bottom:1.5em;}
#contact #Contents section:nth-child(3) { clear:both; width:100%; display:block; float:none;}*/

#contact #Contents section .highlight { font-size:2em; line-height:normal; color:#F30;}

#Contents h2 { color:#0c4da2; font-size:1.4em; font-style:italic; letter-spacing:0.1em; margin:2em 0 1.1em; padding:0;}
#Contents h3 { color:#0c4da2; font-size:1.2em; font-weight:normal; letter-spacing:0.05em; margin:2em 0 1.1em; padding:0;}
#Contents p { margin-bottom:1.5em;}

.list1 { margin:0; padding:0; list-style: none; margin-bottom:1.5em;}
.list1 li { margin:0; padding:0; padding-left: 1em; background:url(../images/list1_icon.jpg) 0 7px no-repeat;}

.list2 { margin:0; padding:0; list-style: none; margin-bottom:1.5em;}
.list2 li { margin:0; padding:0; margin-right:1em; padding-left: 1em; background:url(../images/list1_icon.jpg) 0 7px no-repeat; display:inline-block; float:left; width:28.5%;}

.boxlist, .boxlist-2col, .boxlist-3col, .borderlist { margin:0; padding:0; list-style: none; margin-bottom:1.5em;}
.boxlist li, .boxlist-2col li, .boxlist-3col li { padding:1.5em 2em; display:inline-block; float:left; background:#e4eaed;}
.borderlist li { padding:1.5em 2em; display:inline-block; float:left; background:#e4eaed;}

.boxlist li, .borderlist li { margin:0 1em 1em 0;}
.boxlist-2col li { width:42%; margin:0 2em 1em 0;}
.boxlist-3col li { width:30%; margin:0 2em 1em 0;}
.boxlist-2col li:nth-child(even), .boxlist-3col li:nth-child(3n) { margin-right:0;}
.boxlist-2col li:nth-child(odd), .boxlist-3col li:nth-child(3n+1) { clear:both;}
/*
.boxlist strong, .boxlist-2col strong, .boxlist-3col strong, .borderlist strong {color:#0c4da2;}*/

.benefit-list { margin:0; padding:0;}
.benefit-list li { margin:0.5em 2em 0.5em 0; padding:1em 0; list-style:none; display:inline-block; float:left; text-align:center; border:1px dashed #aaa; width:45%;/* font-weight:bold;*/ letter-spacing:0.1em; text-transform:uppercase;}
.benefit-list li:nth-child(even) { margin-right:0;}
.benefit-list li img { max-width: 51px; margin-bottom:0.25em;}

/* tooltips */
.tooltip { position: relative; display: inline-block; border-bottom: 1px dotted black;}
.tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: left;
  border-radius: 6px;
  padding: 0.5em;

  /* Position the tooltip */
  position: absolute;
  left:1em;
  z-index: 1;
}
.tooltip .tooltiptext ul { margin:0; padding:0; font-size:0.9em; line-height:1.25em;}
.tooltip .tooltiptext li { margin:0; padding:0; margin-left:1.5em; display:list-item; float:none; border:none; letter-spacing:0; text-transform:none; list-style:disc !important; width:auto; text-align:left;}
.tooltip:hover .tooltiptext { visibility: visible;}

.features-list { margin:0; padding:0; width:100%;}/*
.features-list li { list-style:none; margin:0.25em 0;}*/
.features-list li span { /*display:inline-block; background:#f2f2f2; */width:47%; padding:0.5em 1em; /*margin-right:0.125em;*/}
.features-list li span:nth-child(odd) { background:#e7f6fc;}
.features-list li span:nth-child(even) { background:#f1f1f1;}

.vc-borderlist { margin:0 auto; padding:0; list-style: none; /*margin-bottom:1.5em;*/ display:inline-block;}
.vc-borderlist li { display:inline-block; float:left; margin:0 3em 1em 0; /*padding:1.5em 5em; background:#ddf3fb; background:url(../images/btn_bg.jpg) center; text-transform:uppercase; font-weight:bold; /*border:4px double #00aeef; border-radius: 3em;*/}
.vc-borderlist li:last-child { margin-right:0;}

.product-list { margin:0; padding:0;}
.product-list li { margin:0.5em 2em 0.5em 0; padding:1em 0; list-style:none; display:inline-block; float:left; text-align:center; width:18%;}
.product-list li:nth-child(5n) { margin-right:0;}
.product-list li:nth-child(5n+1) { clear:both;}
.product-list li .img-frame { width:18%; height:150px; display:table-cell; vertical-align:middle; text-align: center; padding-bottom:1em;}
.product-list li .img-frame img { max-width:100%; max-height:100%; display:block; margin:0 auto;}

.certified { margin:3em 0 2em 0;}

.partnerlist { margin:0; padding:0;}
.partnerlist li { margin:0.5em 1em; padding:0; list-style:none; display:inline-block; float:left;}
.partnerlist li img { max-width:100px; max-height:50px; line-height:50px;}

.contactform {}
.contactform ul { margin:0; padding:0;}
.contactform li { margin:0 6.5% 0 0; padding:0; list-style:none; width:43.5%; float:left; text-align:left;}
.contactform li.right { float:right;}
.contactform li input, .contactform li textarea { 
	width:100%; padding:0.75em 1.35em; font-size:1.12em; color:#9b96a4; border:1px solid #9b96a4; margin-bottom:0.45em;
}
.contactform li.code img { margin:0.75em 0.5em}
.contactform input.btn {
	font-size:1.15em; margin-top:0.85em; width:auto; line-height:1.5em; background:#0c4da2; border:0; padding:0.5em 1.5em; 
	color:#ffffff; display:inline-block;
}
.contactform input.btn:hover {background:#f36f21;}

.mark { color:#F00;}
.error {color:#F00; padding-bottom:0.5em;}
.msg {  padding-bottom:1em; color:#0c4da2; font-weight:bold;}
.msgbox { padding-top:20px;}

#Footer { color:#acacac; background:#000; padding-top:3em;}
#Footer section { width:30%; display:inline-block; float:left; margin-right:3em;}
#Footer section:nth-child(3n) { margin-right:0;}
#Footer section:nth-child(3n+1) { clear:both;}

#Footer h3 { 
	margin:0; padding:0; color:#58ccf8; font-style:italic; font-size:1.2em; letter-spacing:0.03em; font-weight:normal;
	margin-bottom:1.6em;
}
#Footer span { color:#fff;}

.foot-menu { margin:0; padding:0;}
.foot-menu li { margin:0; padding:0; list-style:none; padding-bottom:0.8em;}
.foot-menu li:last-child { padding-bottom:0;}
.foot-menu li a {color:#acacac;}

#copyright { text-align:center; font-size:0.8em; padding:2.3em 0; border-top:1px solid #707070; margin-top:6.5em;}


@media only screen and ( max-width: 86em ) /* 1376 */
{
#v-imgs li img { max-height:220px;}
}

@media only screen and ( max-width: 64em ) /* 1024 */
{
#pbxTelephony #Contents section {width:47%; }

#ipTelephony #Contents #yeastar section {width:45%;}
#ipTelephony #Contents #yeastar section img { display:block; float:none;}
#ipTelephony #Contents #yeastar section .list2 li { width:42%;}

#ipTelephony #Contents #yealink section {width:28%;}
/*
#ipTelephony #Contents #yeastar section:nth-child(even) { margin-right:0}

#ipTelephony #Contents #yealink section {width:30%; display:inline-block; float:left; margin-right:4em;}
#ipTelephony #Contents #yealink section:nth-child(3n+1) { margin-right:0}
#ipTelephony #Contents #yealink section:nth-child(5) { width:100%; display:block; float:none; clear:both;}
	*/
.product-list li { margin:0.5em 1.5em 0.5em 0; padding:0.5em 0; width:22%;}
.product-list li:nth-child(4n) { margin-right:0;}
.product-list li:nth-child(4n+1) { clear:both;}
.product-list li:nth-child(5n) { margin:0.5em 1.5em 0.5em 0;}
.product-list li:nth-child(5n+1) { clear:none;}
.product-list li .img-frame { height:130px; padding-bottom:0.5em;}

#v-imgs li img { max-height:170px;}
}

@media only screen and ( max-width: 62.5em ) /* 1000 */
{
#about .header, #partners .header { background-position: center;}

#about #Contents section {margin-right:1.5em;}
#contact #Contents section {width:100%; display:block; float:none; margin-right:0; margin-bottom:3em;}
#pbxTelephony #Contents section {width:100%; display:block; float:none; margin-right:0;}
#ipTelephony #Contents section {width:100%; display:block; float:none; margin-right:0;}

#ipTelephony #Contents #yeastar section, #ipTelephony #Contents #yealink section {width:100%;}
#ipTelephony #Contents #yeastar section img { display:inline-block; float:left;}

.vc-borderlist { display:block;}
.vc-borderlist li { padding:0.25em; width:100%; display:block; float:none; margin:0;}
a.qbtn { margin:0; width:50%;}

#v-imgs { margin:1em auto;}
#v-imgs li { margin:1em 0; display:block; float:none;}

.boxlist-2col li { width:38%; margin:0 1em 1em 0;}
.boxlist-3col li { width:25%; margin:0 1em 1em 0;}

.list2 li { width:42.5%;}
/*
.product-list li { margin:0.5em 1.5em 0.5em 0; padding:0.5em 0; width:22%;}
.product-list li:nth-child(4n) { margin-right:0;}
.product-list li:nth-child(4n+1) { clear:both;}
.product-list li:nth-child(5n) { margin:0.5em 1.5em 0.5em 0;}
.product-list li:nth-child(5n+1) { clear:none;}
.product-list li .img-frame { height:130px; padding-bottom:0.5em;}
*/

.panel-title { font-size: 1em; font-weight:normal;}
.panel-title a { display:block;}
.panel-title a:hover { text-decoration:none; color: #f26522;}
.panel-default > .panel-heading { color: #003471 !important; background-color: #f8f8f8 !important;}
.panel-default > .panel-heading:hover, .panel-default > .panel-heading:active { background:#ffffff !important; color: #f26522 !important;}

.certified { margin:2em 0 1em 0;}

.contactform li { margin:0; padding:0; list-style:none; width:90%; float:none; text-align:left;}
.contactform li.right { float:none;}
.contactform li.code {}
.contactform li.code img { margin:0.25em 0;}
.contactform input.btn { margin-top:0;}

#Footer section { width:45%; display:inline-block; float:left; margin-right:3em; margin-bottom:3em;}
#Footer section:nth-child(even) { margin-right:0;}
#Footer section:nth-child(odd) { clear:both;}
}

@media screen and (max-width: 40em) /* 640 */
{
h1 { font-size: 1.6em;}

#logo {display:block; position:absolute; top:1.0em; left:0; text-align:center;}
#logo img { width:80%; margin-left:-1.9em;}

#compSys .header, #network .header, #dataCenterInfra .header, #cloudBasedCallCent .header, #pbxTelephony .header, #ipTelephony .header {
	 background-position: 30%;
}
#videoConf .header { background-position: 40%;}
#outsourcing .header, #supportCenter .header, #endUser .header, #callCenter .header, #relocation .header, #dataCenterMain .header { background-position: 20%;}

#about .header h1 { padding:6.5em 0 0;}
#compSys .header h1 { padding:6.5em 0 0;}
#network .header h1 { padding:6.5em 0 0;}
#dataCenterInfra .header h1 { padding:5.5em 0 0;}
#videoConf .header h1 { padding:5.5em 0 0;}
#cloudBasedCallCent .header h1 { padding:6.5em 0 0;}
#pbxTelephony .header h1 { padding:6.5em 0 0;}
#ipTelephony .header h1 { padding:6.5em 0 0;}
#outsourcing .header h1 { padding:5.5em 0 0;}
#supportCenter .header h1 { padding:5.5em 0 0;}
#endUser .header h1 { padding:6.5em 0 0;}
#callCenter .header h1 { padding:5.5em 0 0;}
#relocation .header h1 { padding:6.5em 0 0;}
#dataCenterMain .header h1 { padding:5.5em 0 0;}
#partners .header h1 { padding:6.5em 0 0;}
#contact .header h1 { padding:6.5em 0 0;}

#Contents p { text-align:justify;}

#about #Contents section {width:100%; display:block; float:none; margin-right:0;}
#about #Contents section:nth-child(2) { margin-bottom:3em;}

.benefit-list li { letter-spacing:0; font-size:0.95em;}
.benefit-list li:nth-child(odd) { margin-right:1em;}

.features-list li span { display:block; width:90%; padding:0.5em 1em;/* margin-right:0.125em;*/}

.boxlist li, .boxlist-2col li, .boxlist-3col li, .borderlist li, .vc-borderlist li { 
	padding:1em; width:90%; display:block; float:none; margin-right:0;
}
.vc-borderlist li { margin:0; padding:0.25em; width:100%;}
a.qbtn { margin:0; width:70%;}

.list2 li { width:90%;}

.product-list li { padding:1em 0; display:block; float:none; width:100%;}

.certified { text-align:center;}

.partnerlist li { margin:0.5em;}
.partnerlist li img { line-height:normal;}

.contactform li { margin:0; padding:0; list-style:none; width:85%; float:none; text-align:left;}
.contactform li.right { float:none;}
.contactform li.code { text-align:center;}
.contactform li.code img { margin:0.25em 0;}
.contactform input.btn { margin-top:0; display:block; padding:0.5em auto; width:100%;}

#Footer section { width:100%; display:block; float:none; margin:0; margin-bottom:3em;}
#Footer h3 { margin-bottom:1em;}
.foot-menu li { padding-bottom:0.5em;}

#copyright {margin-top:0;}
}