/* normal */
* { margin: 0px; padding: 0px; }
html, body { font-family: Arial; font-size: 12px; color: #fff; }
input, select, textarea { font-family: Arial; font-size: 12px; color: #fff; }
body { background: #fff; }
img { border: 0px; display: block; }
a, input { outline: none; }
.clear { clear: both; height: 0px; overflow: hidden; }
ul { list-style-type: none; }
.menuicon { width: 30px; display: block; text-align: right; }
/*
@keyframes animatedBackground {
from { background-position: 0 0; }
to { background-position: 100% 0; }
}
*/
video#bgvid {
position: fixed;
top: 50%;
left: 50%;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
z-index: -100;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
background: url(../images/backgroundimage1.jpg) no-repeat;
background-size: cover;
}
/* template */
#template { position: relative; display: block; width: 100%; min-height: 100%;}
/* layout */
#layout { margin: 0 auto; width: 100%; }
/* centering */
.centering { width: 1038px; margin: auto; }
/* header */
#header-part { padding: 6px 0px; position: relative; width: 100%; background-color: #00a4dd; overflow: hidden; position: fixed; top:0; z-index: 9999; }
#header-part .logo { float: left; width: 152px; }
#header-part .logo a { display: block; display: inline-block; margin-left: 57px; margin-top: 25px;}
/* nav bar */
.nav-bar { float: right; width: 886px; z-index: 9999; }
.nav-bar .responsivemenu { float: right; display: none;}
.nav-bar #menu { text-align: center; }
.nav-bar #menu li { padding: 0px 5px; display: inline-block; }
.nav-bar #menu li a { padding: 45px 20px 12px; display: block; text-decoration: none; color: #fff; font-size: 15px; font-family: 'arialregular'; background-position: center 12px; background-repeat: no-repeat; border-radius: 10px; }
.nav-bar #menu li a:hover, .nav-bar #menu li a.nav-active { background-color: #00b6ff; color: #00456a;}
.nav-bar #menu li:nth-child(1) a { background-image: url(../images/mimg1-white.png); }
.nav-bar #menu li:nth-child(1) a:hover, .nav-bar #menu li:nth-child(1) a.nav-active { background-image: url(../images/mimg1.png);}
.nav-bar #menu li:nth-child(2) a { background-image: url(../images/mimg2-white.png); }
.nav-bar #menu li:nth-child(2) a:hover, .nav-bar #menu li:nth-child(2) a.nav-active { background-image: url(../images/mimg2.png);}
.nav-bar #menu li:nth-child(3) a { background-image: url(../images/mimg3-white.png); }
.nav-bar #menu li:nth-child(3) a:hover, .nav-bar #menu li:nth-child(3) a.nav-active { background-image: url(../images/mimg3.png);}
.nav-bar #menu li:nth-child(4) a { background-image: url(../images/mimg4-white.png); }
.nav-bar #menu li:nth-child(4) a:hover, .nav-bar #menu li:nth-child(4) a.nav-active { background-image: url(../images/mimg4.png);}
.nav-bar #menu li:nth-child(5) a { background-image: url(../images/mimg5-white.png); }
.nav-bar #menu li:nth-child(5) a:hover, .nav-bar #menu li:nth-child(5) a.nav-active { background-image: url(../images/mimg5.png);}
/* content */
#content-part { overflow: hidden; width: 100%; position: relative; z-index: 10; }
/* center */
#center-part { width: 100%; }
/* section-bar */
.section-bar { width: 100%; overflow: hidden; min-height: 796px; background-attachment: fixed;}
/* first */
/* .first { background-image: url(../images/backgroundimage1.jpg); background-position: 0px 0px; background-repeat: repeat-x; animation: animatedBackground 30s linear infinite; }*/
.first .connect { width: 100%; min-height: 796px; background: rgba(255,255,255,0.5); }
.first .connect .headline { padding: 190px 0px 0px 50px; }
.first .connect .headline h1 span { float: left; font-family: 'open_sanslight'; font-size: 60px; color: #000; font-weight: 400;}
.first .connect .headline h1 img { padding: 10px 40px; float: left; }
.first .connect .content { padding-top: 20px; width: 100%; }
.first .connect .content .pannel { float: left; }
.first .connect .content .left { width: 400px; }
.first .connect .content .left h2 { padding: 1px 20px 20px; text-align: right; line-height: 32px; font-family: 'open_sansregular'; font-size: 18px; color: #00a4dd; font-weight: 200; }
.first .connect .content .right { width: 638px; }
.first .connect .content .right p { padding: 0 110px 0 33px; color: #000; font-family: 'arialregular'; font-size: 15px; line-height: 24px; border-left: solid 1px #000; }
.first .connect .sign { padding: 100px 70px 0px 0px; text-align: right; font-family: 'arialregular'; font-size: 13px; color: #00a4dd;}
/* second */
.second { background-image: url(../images/backgroundimage2.png); background-size: cover; background-color: #02669a; }
.second .network { width: 100%; min-height: 796px; }
.second .network .content { padding-top: 254px; }
.second .network .pannel { float: left; color: #fff; }
.second .network .left { width: 546px; text-align: right;}
.second .network .left p { padding: 0px 25px 0px 80px; line-height: 27px; border-right: solid 1px #fff; font-family: 'arialregular'; font-size: 14px; }
.second .network .right { width: 491px; }
.second .network .right h2 { padding-left: 20px; font-family: 'open_sanslight'; font-size: 60px; font-weight: 400; line-height: 58px; }
.second .network .right h3 { padding: 10px 160px 0px 20px; line-height: 30px; font-family: 'open_sansregular'; font-weight: 200; font-size: 18px; }
.second .network .right p { padding-left: 20px; line-height: 35px; font-family: 'arialregular'; font-size: 13px; }
.second .network .right ul { padding-left: 34px; list-style-type: disc; }
.second .network .right ul li { font-family: 'arialregular'; line-height: 27px; font-size: 13px; }
.second .network .right ul li a { padding-left: 5px; color: #fff; }
.second .network .right .sign { padding: 100px 70px 0px 0px; text-align: right; font-family: 'arialregular'; font-size: 13px; color: #009cdd; }
/* third */
.third { background-color: #fff; }
.third .hosting { width: 100%; min-height: 796px; }
.third .hosting .headline { }
.third .hosting .content { padding-top: 20px; }
.third .hosting .headline h2 { padding: 145px 195px 0px 0px; text-align: right; font-family: 'open_sanslight'; font-size: 60px; color: #009cdd; font-weight: 400; }
.third .hosting .content .left { float: left; width: 650px; border-right: solid 1px #000; }
.third .hosting .content .left p { padding: 10px 30px 10px 100px; line-height: 28px; text-align: right; font-size: 13px; font-family: arial; color: #000; }
.third .hosting .content .right { width: 379px; float: right; }
.third .hosting .content .right h3 { padding: 10px 85px 10px 20px; line-height: 30px; font-family: 'open_sanslight'; font-size: 18px; color: #009cdd; }
.third .hosting .content .right span { padding: 65px 0px 0px 20px; display: block; font-family: 'arialregular'; font-size: 13px; color: #009cdd; }
.third .hosting .content .right ul { padding: 40px 0px 0px 20px; }
.third .hosting .content .right ul li { display: inline-block; }
.third .hosting .content .right ul li a { display: block; padding: 10px; }
.third .hosting .sign { padding: 100px 70px 0px 0px; font-family: 'arialregular'; font-size: 13px; color: #009cdd; text-align: right; }
/* fourth */
.fourth { background-image: url(../images/backgroundimage3.png); background-size: cover; background-color: #00a4dd; }
.fourth .services { width: 100%; min-height: 796px; }
.fourth .services .content { padding-top: 140px; color: #fff; }
.fourth .services .content .left { float: left; width: 235px; text-align: right; }
.fourth .services .content .left h3 { padding: 0px 25px 0px 0px; font-family: 'open_sansregular'; font-weight: 200; line-height: 34px; font-size: 18px; }
.fourth .services .content .right { float: right; width: 800px; border-left: solid 1px #fff; }
.fourth .services .content .right p { padding: 0 100px 0 25px; line-height: 28px; font-family: 'arialregular'; font-size: 13px; }
.fourth .services .pannel { padding-top: 140px; color: #fff; }
.fourth .services .pannel .box { width: 258px; float: left; box-sizing: border-box; }
.fourth .services .pannel .box .innerbox { min-height: 200px; }
.fourth .services .pannel .box .innerbox .border { border-right: 1px solid #fff;}
.fourth .services .pannel .box .innerbox .last { border: none;}
.fourth .services .pannel .box .innerbox .parahtwo { padding-top: 20px; }
.fourth .services .pannel .box .show img { -webkit-transform: rotate(180deg); transform: rotate(180deg); }
.fourth .services .pannel .box h2{ padding: 0 38px 0 25px; font-family: 'open_sansregular'; font-weight: 200; font-size: 38px; }
.fourth .services .pannel .box h4{ padding: 0 38px 0 25px; line-height: 30px; font-family: 'open_sansregular'; font-weight: 200; font-size: 18px; }
.fourth .services .pannel .box p { padding: 0 38px 0 25px; line-height: 18px; font-family: 'arialregular'; font-size: 13px; }
.fourth .services .pannel .box .secondparah { display: none; }
.fourth .services .pannel .box .secondparah .border2 { border-right: 1px solid #fff; }
.fourth .services .pannel .box .secondparah .last { border: none; }
.fourth .services .pannel .box .secondparah .inner { min-height: 280px; }
.fourth .services .pannel .box .secondparah .sectionlogo ul { padding: 0px 20px; }
.fourth .services .pannel .box .secondparah .sectionlogo ul li { float: left; }
.fourth .services .pannel .box .secondparah span { display: block; padding: 20px 20px; }
.fourth .services .pannel .box .secondparah a { font-family: 'arialregular'; font-size: 13px; color: #fff; padding: 0px 3px; }
.fourth .services .pannel .box a { padding: 10px 0px 0px 25px; display: inline-block; }
.fourth .services .pannel .box .innerbox.last { border-right: none; }
.fourth .services .sign { padding: 60px 70px 50px 0px; color: #fff; font-family: 'arialregular'; font-size: 13px; text-align: right; }
.fourth .services .padding { padding: 150px 70px 100px 0px; }
/* footer part */
#footer-part { overflow: hidden; width: 100%; position: relative; z-index: 20; background: #fff; }
/* footer-bar */
.footer-bar { background-image: url(../images/backgroundimage4.png); background-repeat: no-repeat; background-size: cover; background-attachment: fixed; overflow: hidden; min-height: 800px; position: relative; z-index: 20; }
.footer-bar .footerbg { padding-top: 220px; background-image: url(../images/footerimg.png); background-repeat: no-repeat; background-position: 18% center; overflow: hidden; min-height: 500px;}
.footer-bar .footer { overflow: hidden; }
.footer-bar .footer .left { float: left; width: 800px; text-align: right;}
.footer-bar .footer .left a { display: inline-block; margin-top: 120px; margin-right: 20px; }
.footer-bar .footer .right { float: right; width: 222px; border-left: solid 1px #000; }
.footer-bar .footer .right h5 { padding-left: 20px; font-family: 'arialregular'; font-size: 13px; font-weight: 400; color: #00a4dd; line-height: 35px; }
.footer-bar .footer .right ul { padding-left: 20px; }
.footer-bar .footer .right ul li { font-family: 'arialregular'; font-size: 13px; color: #000; line-height: 28px; }
.footer-bar .footer .right ul li a { color: #000; text-decoration: none; }
.footer-bar .footer .sign { padding: 100px 70px 0px 0px; text-align: right; font-family: 'arialregular'; font-size: 13px; color: #009cdd;}
/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 1037px) {
.centering { width: 100%; margin: auto; }
.nav-bar { width: 800px; }
.first .connect .headline { padding: 190px 0 0 7%; }
.first .connect .headline h1 span { font-size: 55px; }
.first .connect .headline h1 img { padding: 10px 30px; }
.first .connect .content .left { width: 38%; }
.first .connect .content .right { width: 62%; }
.section-bar, .first .connect, .second .network, .third .hosting, .fourth .services { min-height: 750px; }
.second .network .content { padding-top: 180px; }
.second .network .left { width: 55%; }
.second .network .right { width: 45%; }
.second .network .right h2 { font-size: 55px; }
.third .hosting .content .left { width: 64%; }
.third .hosting .content .right { width: 35%; }
.third .hosting .headline h2 { padding: 100px 178px 0 0; font-size: 55px;}
.third .hosting .content .right h3 { padding: 10px 80px 10px 20px; }
.fourth .services .content { padding-top: 100px; }
.fourth .services .content .left { width: 30%; }
.fourth .services .content .right { width: 69%; }
.fourth .services .pannel .box { width: 25%; }
.fourth .services .pannel { padding-top: 80px; }
.footer-bar .footerbg { background-position: 10% center; background-size: 35% auto; }
.footer-bar .footer .left { width: 75%; }
.fourth .services .pannel .box h2 { font-size: 35px; }
.fourth .services .pannel .box p { padding: 0 30px 0 25px; }
.footer-bar .footer .left a { margin-right: -50px; }
.footer-bar .footer .left a img { width: 75%; }
.fourth .services .pannel .box .secondparah .border2 { min-height: 390px; }
.fourth .services .pannel .box .innerbox .border { min-height: 200px; }
}
/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (max-width: 959px) {
#header-part .logo { width: 25% }
.nav-bar { width: 75%; }
.nav-bar #menu li { padding: 0; }
.nav-bar #menu li a { padding: 45px 12px 12px; }
.first .connect .headline { padding: 190px 0 0 11%; }
.first .connect .headline h1 span { font-size: 41px; }
.first .connect .headline h1 img { padding: 0 30px; }
.second .network .right h2 { font-size: 50px; }
.second .network .left p { line-height: 25px; }
.third .hosting .headline h2 { font-size: 50px; padding:100px 135px 0 0;}
.third .hosting .content .right ul li a { padding: 5px; }
.third .hosting .content .right ul li a img { width: 80%; }
.third .hosting .content .left p { padding: 5px 30px 10px 70px; line-height: 25px; }
.third .hosting .content .right span { padding: 15% 0 0 20px; }
.fourth .services .content .right p { line-height: 25px; }
.fourth .services .content .left { width: 35%; }
.fourth .services .content .right { width: 64%; }
.fourth .services .pannel .box h2 { font-size: 30px; padding: 0 15px }
.fourth .services .pannel .box h4 { padding: 0 15px; }
.fourth .services .pannel .box p { padding: 0 15px; }
.footer-bar { min-height: 650px; }
.footer-bar .footer .left a img { width: 65%; }
.footer-bar .footer .left a { margin-right: -90px; }
.footer-bar .footer .left { width: 70%; text-align: right; }
.footer-bar .footer .right { width: 29%; }
.footer-bar .footerbg { padding-top: 140px; background-position: 8% 38%; }
.fourth .services .pannel .box .innerbox { min-height: 220px; }
.fourth .services .pannel .box .secondparah .inner { min-height: 330px; }
.fourth .services .pannel .box .secondparah .sectionlogo ul { padding: 0 15px; }
.fourth .services .pannel .box .secondparah .sectionlogo ul li a img {width: 100%; }
.fourth .services .pannel .box .innerbox .border { min-height: 215px; }
}
/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
#header-part {padding: 15px 0; }
#header-part .logo a { margin-top: 8px; }
.centering { width: 90%; margin: auto; }
#header-part .logo { width: 100%; }
#header-part .logo a { margin-left: 5px; }
.nav-bar { width: 100%; }
.nav-bar #menu { text-align: left; display: none; }
.nav-bar #menu li a { padding: 15px 0; background-position: 2% center; padding: 15px 50px; margin: 5px 0px; }
.nav-bar #menu li { display: block; width: 100%; }
.nav-bar .responsivemenu { display: block; margin-top: -33px; margin-right: 2px; }
.section-bar, .first .connect, .second .network, .third .hosting, .fourth .services { min-height: 600px; }
.first .connect .headline { padding: 120px 0 0; text-align: left; }
.first .connect .headline h1 { display: inline-block; }
.first .connect .headline h1 img { display: none; }
.first .connect .content .left { width: 100%; }
.first .connect .content .left h2 { text-align: left; padding: 10px 0 30px; }
.first .connect .content .right { padding: 20px 0px; width: 100%; border-top: 1px solid #000;}
.first .connect .content .right p { text-align: left; padding: 0px 0px; border-left: 0px; }
.first .connect .sign { text-align: left; padding: 50px 0; }
.second .network .content { padding-top: 75px; }
.second .network .left { width: 100%; }
.second .network .right { width: 100%; }
.second .network .right h2 { display: block; text-align: left; padding-top: 15px; padding-left: 0px; }
.second .network .right h3 { padding: 10px 0px; display: block; text-align: left; }
.second .network .left p { border-right: 0px; padding: 0px; text-align: left; border-bottom: 1px solid #fff; padding-bottom: 25px; }
.second .network .right p { display: block; text-align: left; padding-left: 0px; }
.second .network .right ul { padding-left: 12px; text-align: left; }
.second .network .right .sign { padding: 50px 0px; text-align: left; }
.third .hosting .headline h2 { padding: 50px 0px; display: block; text-align: left; }
.third .hosting .content .left { padding-bottom: 20px; width: 100%; border-left: 0px; border-bottom: 1px solid #000; border-right: none; }
.third .hosting .content .left p { padding: 10px 00px; display: block; text-align: left; }
.third .hosting .content .right { width: 100%; padding-top: 5px; }
.third .hosting .content .right h3 { padding: 20px 20px 20px 0px; }
.third .hosting .content .right span { padding: 20px 0px 0px 0px; }
.third .hosting .content .right ul { padding: 25px 0 0; }
.third .hosting .sign { text-align: left; }
.third .hosting .sign { padding: 50px 0px; }
.fourth .services .content { padding-top: 60px; }
.fourth .services .content .left { width: 100%; }
.fourth .services .content .left h3 { line-height: 30px; padding: 20px 0px; text-align: left; }
.fourth .services .content .right { width: 100%; border-left: none; border-bottom: 1px solid #fff;}
.fourth .services .content .right p { padding: 10px 0 25px; display: block; text-align: left; }
.fourth .services .pannel { padding-top: 60px; }
.fourth .services .pannel .box { width: 100%; text-align: right; padding-bottom: 20px; }
.fourth .services .pannel .box .innerbox { border-right: 0px; min-height: inherit; }
.fourth .services .pannel .box .secondparah { min-height: inherit; }
.fourth .services .pannel .box .secondparah .inner { min-height: 125px; text-align: left; }
.fourth .services .pannel .box .secondparah span { display: inline-block; padding: 20px 0px;}
.fourth .services .pannel .box .secondparah .sectionlogo ul { padding: 0px; }
.fourth .services .pannel .box h2 { padding: 0px 0px; text-align: left; }
.fourth .services .pannel .box h4 { padding: 0px 0px; text-align: left; }
.fourth .services .pannel .box p { padding: 0px 0px; text-align: left; display: block; }
.fourth .services .pannel .box span a { padding: 10px 0px; float: none; }
.fourth .services .pannel .box a { float: left; padding: 10px 0 0; }
.fourth .services .sign { padding: 50px 0; }
.footer-bar .footerbg { background-position: center; padding: 0px; }
.footer-bar .footer .left { width: 100%; text-align: left; }
.footer-bar .footer .right { width: 99%; margin-top: 20px; border-left: 0px; }
.footer-bar .footer .right h5, .footer-bar .footer .right ul { padding-left: 0px; }
.footer-bar .footer .sign { padding: 50px 0px; text-align: left; }
.fourth .services .pannel .box .innerbox .border { border: none; min-height: inherit;}
.fourth .services .pannel .box .secondparah .border2 { border: none; min-height: inherit; }
}