diff options
Diffstat (limited to 'openo-portal/portal-common/src/main/webapp/common/css/style-ict.css')
-rw-r--r-- | openo-portal/portal-common/src/main/webapp/common/css/style-ict.css | 1640 |
1 files changed, 820 insertions, 820 deletions
diff --git a/openo-portal/portal-common/src/main/webapp/common/css/style-ict.css b/openo-portal/portal-common/src/main/webapp/common/css/style-ict.css index d1c70489..15a3b77d 100644 --- a/openo-portal/portal-common/src/main/webapp/common/css/style-ict.css +++ b/openo-portal/portal-common/src/main/webapp/common/css/style-ict.css @@ -1,820 +1,820 @@ -/** - * Copyright 2016, CMCC Technologies Co., Ltd. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -@font-face { - font-family: 'Lato'; - font-style: normal; - font-weight: 400; - src: local('Lato Regular'), local('Lato-Regular'), url(9k-RPmcnxYEPm8CNFsH2gg.woff) format('woff'); -} -html, body, div, span, applet, object, blockquote, pre, -a, abbr, acronym, address, big, cite, code, -del, dfn, em, img, ins, kbd, q, s, samp, -small, strike, strong, sub, sup, tt, var, -b, u, i, center, -dl, dt, dd, ol, ul, li, -fieldset, form, label, legend, -table, caption, tbody, tfoot, thead, tr, th, td, -article, aside, canvas, details, embed, -figure, figcaption, footer, header, hgroup, -menu, nav, output, ruby, section, summary, -time, mark, audio, video { - margin: 0; - padding: 0; - border: 0; - font-size: 1em; - vertical-align: baseline; -} -/* HTML5 display-role reset for older browsers */ -article, aside, details, figcaption, figure, -footer, header, hgroup, menu, nav, section { - display: block; -} -body { - background: rgba(231, 231, 231, 0.43); - line-height: 1.125em; - color: white; - max-width: 1920px; - margin: 0 auto; - position: relative; - font-family: 'Lato', Helvetica, Arial, Tahoma; - text-shadow: 1px 1px 0 rgba(0,0,0,0.3); -} -ol, ul { - padding: 0 10px; - margin: 0 10px; - line-height: 1.5em; -} -h1, h2, h3, h4, h5, h6 { - text-shadow: 1px 1px 0 rgba(0,0,0,0.5); - font-family: 'Lato', Georgia, Helvetica, Tahoma; - margin: 10px 0; - font-weight: normal; -} -h1 { - font-size: 1.875em; -} -h2 { - font-size: 1.6em; - line-height: 1em; -} -h3 { - font-size: 1.25em; -} -h4 { - font-size: 1.125em; -} -h5 { - font-size: 1em; -} -h6 { - font-size: 0.875em; -} -a { - text-decoration: none; - color: white; -} -a:hover { - color: white; - opacity: 0.9; -} -a:visited { - color: white; -} -h2 { - cursor: pointer; -} -code, pre { - font-family: Monaco, Menlo, Consolas; - font-size: 1em; - color: #FFFFDE; - padding: 0 3px 2px; -} - -table { - border-collapse: collapse; - border-spacing: 0; -} - -.header { - /*padding: 14px 0; - background-color: rgb(19, 17, 17); - background-color: #006a3f; - background-image: - radial-gradient(rgba(0,0,0,0.1) 15%, transparent 16%), - radial-gradient(rgba(0,0,0,0.1) 15%, transparent 16%), - radial-gradient(rgba(255, 255, 255, 0.1) 15%, transparent 20%), - radial-gradient(rgba(255, 255, 255, 0.1) 15%, transparent 20%); - background-image: - -webkit-radial-gradient(rgba(0,0,0,0.1) 15%, transparent 16%), - -webkit-radial-gradient(rgba(0,0,0,0.1) 15%, transparent 16%), - -webkit-radial-gradient(rgba(255, 255, 255, 0.1) 15%, transparent 20%), - -webkit-radial-gradient(rgba(255, 255, 255, 0.1) 15%, transparent 20%); - background-position: 0 0px, 4px 4px, 0 1px, 4px 5px; - background-size: 8px 8px; - border-bottom: 1px solid rgb(41, 41, 41);*/ - margin-top: 3%; - /* margin-left: 10%; */ - margin-left: 75px; -} -@media (min-width: 1600px){ - .header { - margin-top: 3%; - margin-left: 95px; - } -} - -.header div.float-left { - /*padding-left: 2%;*/ -} - -@media (min-width: 769px) and (max-width: 1024px) { - .header div.float-left { - /*padding-left: 5%;*/ - } -} - -.header a { - font-size: 35px; - color: white; - display: block; - opacity: 0.8; -} -.header a:first-letter { - font-size: 60px; - line-height: 40px; - font-weight: bold; -} -.header .target { - margin-left: 5px; - margin-bottom: 20px; -} - -.header .reponsive-block { - list-style: none; - margin: 0px; - padding: 50px 2% 0 0; -} - -.header .reponsive-block li { - display: inline-block; - float:left; -} - -.header .reponsive-block a { - display: inline-block; - margin: 0 5px; - cursor: pointer; - background: url(../i/reponsive.png) no-repeat; -} - -.header .reponsive-block a.desktop { - background-position: 3px 0; - width: 34px; height: 26px; -} - -.header .reponsive-block a.tablet-landscape { - background-position: -49px 0; - width: 22px; - height: 22px; -} - -.header .reponsive-block a.tablet-portrait { - background-position: -90px 0; - width: 18px; - height: 24px; -} - -.header .reponsive-block a.iphone-landscape { - background-position: -129px 0; - width: 20px; - height: 20px; -} - -.header .reponsive-block a.iphone-portrait { - background-position: -166px 0; - width: 16px; - height: 26px; -} - -.header .reponsive-block a.desktop:hover, -.header .reponsive-block a.desktop.active { - background-position: 3px -34px; -} - -.header .reponsive-block a.tablet-landscape:hover, -.header .reponsive-block a.tablet-landscape.active { - background-position: -49px -34px; -} - -.header .reponsive-block a.tablet-portrait:hover, -.header .reponsive-block a.tablet-portrait.active { - background-position: -91px -33px; -} - -.header .reponsive-block a.iphone-landscape:hover, -.header .reponsive-block a.iphone-landscape.active { - background-position: -128px -33px; -} - -.header .reponsive-block a.iphone-portrait:hover, -.header .reponsive-block a.iphone-portrait.active { - background-position: -166px -33px; -} -.free-wall { - margin: auto; -} - -.free-wall-logo { - margin: auto; - height: 420px; -} -.size2-2 { - width: 80px; - height: 80px; -} - -.size11 { - height: 160px; - width: 160px; -} - -.size12 { - width: 160px; - height: 320px; -} - -.size21 { - width: 320px; - height: 160px; -} - -.size22 { - height: 320px; - width: 320px; -} - -.size13 { - width: 160px; - height: 480px; -} - -.size31 { - width: 480px; - height: 160px; -} - -.size23 { - width: 320px; - height: 480px; -} - -.size24 { - width: 320px; - height: 640px; -} - -.size32 { - width: 480px; - height: 320px; -} - -.size33 { - width: 480px; - height: 480px; -} - -.size34 { - width: 480px; - height: 640px; -} - -.size43 { - width: 640px; - height: 480px; -} - -.size35 { - width: 480px; - height: 800px; -} - -.size53 { - width: 800px; - height: 480px; -} - -.size36 { - width: 480px; - height: 960px; -} - -.size41 { - width: 270px; - height: 160px; -} -.size42 { - width: 270px; - height: 320px; -} -.size41-1024 { - width: 213px; - height: 133px; -} -.size42-1024 { - width: 213px; - height: 275px; -} -.size41-1366 { - width: 278px; - height: 156px; -} -.size42-1366 { - width: 278px; - height: 332px; -} -.size41-1440 { - width: 310px; - height: 168px; -} -.size42-1440 { - width: 310px; - height: 340px; -} -.size41-1600 { - width: 330px; - height: 173px; -} -.size42-1600 { - width: 330px; - height: 354px; -} - -.donate form { - height: 100%; - width: 100%; - background: rgb(44, 62, 80); -} - -.donate form .paypal { - display: block; - margin: auto; - padding: 20px 0px 0px 0px; - outline: 0; -} - -.img-demo { - vertical-align: bottom; - list-style: none; - margin:0; - padding: 0; -} - -.img-demo li { - float: left; - width: 25%; - text-align: center; -} - -.img-demo li img { - border: 2px solid white; - width: 98px; - height: 98px; -} - -.float-left { - float: left; -} - -.float-right { - float: right; -} - -.clearfix:before, -.clearfix:after { - content: ""; - display: table; -} - -.clearfix:after { - clear: both; -} - -.clearfix { - zoom: 1; /* For IE 6/7 (trigger hasLayout) */ -} - -.rest-left { - margin-left: 244px; -} - -.desc h1, -.desc h2, -.desc h3, -.desc h4, -.desc h5, -.desc h6 { - font-weight: bold; -} - -.desc h2 { - border-bottom: 1px solid rgba(0,0,0,0.1); - margin-top: 0px; - margin-bottom: 0px; - padding-bottom: 50px; -} - -.desc h2 span { - float: left; - display: block; - line-height: 50px; -} - -.brick { - background-color: white; - float: left; - cursor: default; - overflow: hidden; - background-repeat: no-repeat; - background-size: cover; - background-position: center; -} - -.brick .cover { - overflow: hidden; - margin: 20px; -/* margin-left: 60%; */ - margin-top: 25%; -/* width: 120px; */ - height: 30px; - font-size: 30px; - padding: 7px; - float: right; - text-align: right; -} - -.brick .read-more { - position: absolute; - display: none; - bottom: 0px; - left: 0px; - right: 0px; - padding: 12px; - background: rgb(0, 0, 0); - background: rgba(0, 0, 0, 0.45); -} - -.brick:hover .read-more { - display: block; - cursor: pointer; -} - -.brick .desc { - display: none; -} - -.full-width .float-left { - display: none; -} - -.full-width .desc { - display: block; -} - -.full-width.brick { - box-shadow: none; - overflow: visible; - border: none !important; - background: none !important; -} - -.full-width.brick .cover { - margin: 0px 20px; - color: #333; -} - -.full-width.brick .cover * { - text-shadow: none; -} - -.full-width.brick .cover code { - color: #666; -} - -.open .float-left { - display: none; -} - -.open .desc { - display: block; -} - -.example { - width: 0px; - height: 0px; - overflow: visible !important; /* for ie7 */ -} - -.example-draggable { - cursor: move; -} - -.example-draggable * { - cursor: move; -} - -.example-draggable a { - cursor: pointer; -} - -.cell { - background-position: center center; - background-repeat: no-repeat; - background-size: cover; - position: absolute; - background-color: #222; -} - -[class*="-share"] { - cursor: pointer; - margin: 20px 0; - line-height: 30px; - padding-left: 30px; -} - -.facebook-share { - background: url(../i/fb.png) no-repeat left center; -} - -.twitter-share { - background: url(../i/tw.png) no-repeat left center; -} - -.google-share { - background: url(../i/gp.png) no-repeat left center; -} - -.download-icon { - background: url(../i/download.png) no-repeat left center; - display: block; - margin: 0 0 10px 0; - line-height: 30px; - padding-left: 30px; -} - -.js-icon { - background: url(../i/js.png) no-repeat left center; - display: block; - line-height: 30px; - padding-left: 30px; -} - -.fork { - float: right; - width: 100%; - height: 100%; - display: block; - background: url(../i/forkme.png) no-repeat top right; -} - -.back-button { - position: fixed; - z-index: 9999; - padding: 1%; - bottom: 2%; - right: 2%; - display: none; - background: black; -} - -.back-button .back-icon { - background: url(../i/back.png) no-repeat top center; - width: 45px; - height: 27px; - display: block; -} - -.back-button .back-icon:hover { - background: url(../i/back.png) no-repeat bottom center; -} - -@media (min-width: 1600px) { - .main-content-wrapper{ - width:100%; - margin-left:95px; - margin-right: 1%; - } -} - -@media (min-width: 1441px) and (max-width: 1599px) { - .main-content-wrapper{ - width:100%; - /*margin-left: 0%; */ - margin-left:75px; - margin-right: 1%; - } -} - -@media (min-width: 1367px) and (max-width: 1440px) { - .main-content-wrapper{ - width:100%; - margin-left: 75px; - margin-right: 1%; - } -} - -@media (min-width: 1281px) and (max-width: 1366px) { - .main-content-wrapper{ - width:100%; - /*margin-left: 2%; */ - margin-left:75px; - margin-right: 2%; - } -} - -@media (min-width: 1025px) and (max-width: 1280px) { - .main-content-wrapper{ - width:100%; - /*margin-left: 4%;*/ - margin-left:75px; - margin-right: 1%; - } -} - -@media (min-width: 769px) and (max-width: 1024px) { - .main-content-wrapper{ - width:100%; - /*margin-left: 6%;*/ - margin-left:75px; - margin-right: 1%; - } -} - -@media (min-width: 641px) and (max-width: 768px) { - .main-content-wrapper{ - width:100%; - margin-left: 10%; - margin-right: 1%; - } -} - -@media (min-width: 481px) and (max-width: 640px) { - .main-content-wrapper{ - width:100%; - margin-left: 0%; - margin-right: 1%; - } -} - -@media (max-width: 480px) { - .main-content-wrapper{ - width:100%; - margin-left: 9%; - margin-right: 1%; - } -} - -body{ - font-family: microsoft yahei; - background: #484747; -} - -.skyBlue-mainpage{ - background: -moz-linear-gradient(left top, #1cadd9, #20c0f0); - background: -webkit-gradient(linear, left top, right bottom, color-stop(0, #1cadd9), color-stop(1, #20c0f0)); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1cadd9', endColorstr='#20c0f0', GradientType='0'); - background: linear-gradient(to bottom right,#1cadd9, #20c0f0); -} -.golden-mainpage{ - background-image: -moz-linear-gradient(left top, #bca374, #d9cf7a); - background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #bca374), color-stop(1, #d9cf7a)); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#bca374, endColorstr=#d9cf7a, GradientType=0); - background: linear-gradient(to bottom right,#bca374, #d9cf7a); -} -.manLieONCloud-image{ - background-image: url('../image/mainpage/pic/1.png'); -} -.orange-mainpage{ - background-image: -moz-linear-gradient(left top, #f09c0a, #f4be35); - background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #f09c0a), color-stop(1, #f4be35)); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#f09c0a, endColorstr=#f4be35, GradientType=0); - background: linear-gradient(to bottom right,#f09c0a, #f4be35); -} -.pinkishRed-mainpage{ - background-image: -moz-linear-gradient(left top, #e03655, #ef3a5b); - background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #e03655), color-stop(1, #ef3a5b)); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#e03655, endColorstr=#ef3a5b, GradientType=0); - background: linear-gradient(to bottom right,#e03655, #ef3a5b); -} -.magicCube-image{ - background-image: url('../image/mainpage/pic/4.png'); -} -.grassGreen-mainpage{ - background-image: -moz-linear-gradient(left top, #008b04, #03a501); - background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #008b04), color-stop(1, #03a501)); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#008b04, endColorstr=#03a501, GradientType=0); - background: linear-gradient(to bottom right,#008b04, #03a501); -} -.meeting-image{ - background-image: url('../image/mainpage/pic/3.png'); -} -.earth-image{ - background-image: url('../image/mainpage/pic/2.png'); -} -.toolsImageBrokenLine{ - background-image: url('../image/mainpage/icon/1.png'); - height: 150px; - width: 120px; - top: 30px; - position: absolute; -} -.toolsImageHierachy{ - background-image: url('../image/mainpage/icon/2.png'); - height: 150px; - width: 120px; - top: 30px; - position: absolute; -} -.toolsImageGear{ - background-image: url('../image/mainpage/icon/3.png'); - height: 150px; - width: 120px; - top: 30px; - position: absolute; -} -.toolsImagePresent{ - background-image: url('../image/mainpage/icon/4.png'); - height: 150px; - width: 120px; - top: 30px; - position: absolute; -} -.toolsImageFile{ - background-image: url('../image/mainpage/icon/5.png'); - height: 150px; - width: 120px; - top: 30px; - position: absolute; -} -.toolsImageBriefcase{ - background-image: url('../image/mainpage/icon/6.png'); - height: 150px; - width: 120px; - top: 30px; - position: absolute; -} -.contentTip{ - opacity:0; - display:block; - padding: 20px; - text-align: left; - line-height: inherit; - text-indent: 2em; - position: absolute; -} -.contentTipShow{ - display:block; - padding: 20px; - text-align: left; - line-height: inherit; - text-indent: 2em; - position: absolute; -} -.coverHidden{ - display:none; -} -.coverShrink{ - width:0px !important; - height:0px !important; -} -/* -.brick .contentToggle{ - -webkit-transition: opacity 1s ease-in-out; - -moz-transition: opacity 1s ease-in-out; - -o-transition: opacity 1s ease-in-out; - transition: opacity 1s ease-in-out; -} -.brick .cover :hover{ - opacity:0; -} -*/ -.hideSideMenuForMainPage { - display: none! important; -} -.fullFillDiv { - width:100%; - height:100%; -} - +/**
+ * Copyright 2016, CMCC Technologies Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+@font-face {
+ font-family: 'Lato';
+ font-style: normal;
+ font-weight: 400;
+ src: local('Lato Regular'), local('Lato-Regular'), url(9k-RPmcnxYEPm8CNFsH2gg.woff) format('woff');
+}
+html, body, div, span, applet, object, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed,
+figure, figcaption, footer, header, hgroup,
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video {
+ margin: 0;
+ padding: 0;
+ border: 0;
+ font-size: 1em;
+ vertical-align: baseline;
+}
+/* HTML5 display-role reset for older browsers */
+article, aside, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section {
+ display: block;
+}
+body {
+ background: rgba(231, 231, 231, 0.43);
+ line-height: 1.125em;
+ color: white;
+ max-width: 1920px;
+ margin: 0 auto;
+ position: relative;
+ font-family: 'Lato', Helvetica, Arial, Tahoma;
+ text-shadow: 1px 1px 0 rgba(0,0,0,0.3);
+}
+ol, ul {
+ padding: 0 10px;
+ margin: 0 10px;
+ line-height: 1.5em;
+}
+h1, h2, h3, h4, h5, h6 {
+ text-shadow: 1px 1px 0 rgba(0,0,0,0.5);
+ font-family: 'Lato', Georgia, Helvetica, Tahoma;
+ margin: 10px 0;
+ font-weight: normal;
+}
+h1 {
+ font-size: 1.875em;
+}
+h2 {
+ font-size: 1.6em;
+ line-height: 1em;
+}
+h3 {
+ font-size: 1.25em;
+}
+h4 {
+ font-size: 1.125em;
+}
+h5 {
+ font-size: 1em;
+}
+h6 {
+ font-size: 0.875em;
+}
+a {
+ text-decoration: none;
+ color: white;
+}
+a:hover {
+ color: white;
+ opacity: 0.9;
+}
+a:visited {
+ color: white;
+}
+h2 {
+ cursor: pointer;
+}
+code, pre {
+ font-family: Monaco, Menlo, Consolas;
+ font-size: 1em;
+ color: #FFFFDE;
+ padding: 0 3px 2px;
+}
+
+table {
+ border-collapse: collapse;
+ border-spacing: 0;
+}
+
+.header {
+ /*padding: 14px 0;
+ background-color: rgb(19, 17, 17);
+ background-color: #006a3f;
+ background-image:
+ radial-gradient(rgba(0,0,0,0.1) 15%, transparent 16%),
+ radial-gradient(rgba(0,0,0,0.1) 15%, transparent 16%),
+ radial-gradient(rgba(255, 255, 255, 0.1) 15%, transparent 20%),
+ radial-gradient(rgba(255, 255, 255, 0.1) 15%, transparent 20%);
+ background-image:
+ -webkit-radial-gradient(rgba(0,0,0,0.1) 15%, transparent 16%),
+ -webkit-radial-gradient(rgba(0,0,0,0.1) 15%, transparent 16%),
+ -webkit-radial-gradient(rgba(255, 255, 255, 0.1) 15%, transparent 20%),
+ -webkit-radial-gradient(rgba(255, 255, 255, 0.1) 15%, transparent 20%);
+ background-position: 0 0px, 4px 4px, 0 1px, 4px 5px;
+ background-size: 8px 8px;
+ border-bottom: 1px solid rgb(41, 41, 41);*/
+ margin-top: 3%;
+ /* margin-left: 10%; */
+ margin-left: 75px;
+}
+@media (min-width: 1600px){
+ .header {
+ margin-top: 3%;
+ margin-left: 95px;
+ }
+}
+
+.header div.float-left {
+ /*padding-left: 2%;*/
+}
+
+@media (min-width: 769px) and (max-width: 1024px) {
+ .header div.float-left {
+ /*padding-left: 5%;*/
+ }
+}
+
+.header a {
+ font-size: 35px;
+ color: white;
+ display: block;
+ opacity: 0.8;
+}
+.header a:first-letter {
+ font-size: 60px;
+ line-height: 40px;
+ font-weight: bold;
+}
+.header .target {
+ margin-left: 5px;
+ margin-bottom: 20px;
+}
+
+.header .reponsive-block {
+ list-style: none;
+ margin: 0px;
+ padding: 50px 2% 0 0;
+}
+
+.header .reponsive-block li {
+ display: inline-block;
+ float:left;
+}
+
+.header .reponsive-block a {
+ display: inline-block;
+ margin: 0 5px;
+ cursor: pointer;
+ background: url(../i/reponsive.png) no-repeat;
+}
+
+.header .reponsive-block a.desktop {
+ background-position: 3px 0;
+ width: 34px; height: 26px;
+}
+
+.header .reponsive-block a.tablet-landscape {
+ background-position: -49px 0;
+ width: 22px;
+ height: 22px;
+}
+
+.header .reponsive-block a.tablet-portrait {
+ background-position: -90px 0;
+ width: 18px;
+ height: 24px;
+}
+
+.header .reponsive-block a.iphone-landscape {
+ background-position: -129px 0;
+ width: 20px;
+ height: 20px;
+}
+
+.header .reponsive-block a.iphone-portrait {
+ background-position: -166px 0;
+ width: 16px;
+ height: 26px;
+}
+
+.header .reponsive-block a.desktop:hover,
+.header .reponsive-block a.desktop.active {
+ background-position: 3px -34px;
+}
+
+.header .reponsive-block a.tablet-landscape:hover,
+.header .reponsive-block a.tablet-landscape.active {
+ background-position: -49px -34px;
+}
+
+.header .reponsive-block a.tablet-portrait:hover,
+.header .reponsive-block a.tablet-portrait.active {
+ background-position: -91px -33px;
+}
+
+.header .reponsive-block a.iphone-landscape:hover,
+.header .reponsive-block a.iphone-landscape.active {
+ background-position: -128px -33px;
+}
+
+.header .reponsive-block a.iphone-portrait:hover,
+.header .reponsive-block a.iphone-portrait.active {
+ background-position: -166px -33px;
+}
+.free-wall {
+ margin: auto;
+}
+
+.free-wall-logo {
+ margin: auto;
+ height: 420px;
+}
+.size2-2 {
+ width: 80px;
+ height: 80px;
+}
+
+.size11 {
+ height: 160px;
+ width: 160px;
+}
+
+.size12 {
+ width: 160px;
+ height: 320px;
+}
+
+.size21 {
+ width: 320px;
+ height: 160px;
+}
+
+.size22 {
+ height: 320px;
+ width: 320px;
+}
+
+.size13 {
+ width: 160px;
+ height: 480px;
+}
+
+.size31 {
+ width: 480px;
+ height: 160px;
+}
+
+.size23 {
+ width: 320px;
+ height: 480px;
+}
+
+.size24 {
+ width: 320px;
+ height: 640px;
+}
+
+.size32 {
+ width: 480px;
+ height: 320px;
+}
+
+.size33 {
+ width: 480px;
+ height: 480px;
+}
+
+.size34 {
+ width: 480px;
+ height: 640px;
+}
+
+.size43 {
+ width: 640px;
+ height: 480px;
+}
+
+.size35 {
+ width: 480px;
+ height: 800px;
+}
+
+.size53 {
+ width: 800px;
+ height: 480px;
+}
+
+.size36 {
+ width: 480px;
+ height: 960px;
+}
+
+.size41 {
+ width: 270px;
+ height: 160px;
+}
+.size42 {
+ width: 270px;
+ height: 320px;
+}
+.size41-1024 {
+ width: 213px;
+ height: 133px;
+}
+.size42-1024 {
+ width: 213px;
+ height: 275px;
+}
+.size41-1366 {
+ width: 278px;
+ height: 156px;
+}
+.size42-1366 {
+ width: 278px;
+ height: 332px;
+}
+.size41-1440 {
+ width: 310px;
+ height: 168px;
+}
+.size42-1440 {
+ width: 310px;
+ height: 340px;
+}
+.size41-1600 {
+ width: 330px;
+ height: 173px;
+}
+.size42-1600 {
+ width: 330px;
+ height: 354px;
+}
+
+.donate form {
+ height: 100%;
+ width: 100%;
+ background: rgb(44, 62, 80);
+}
+
+.donate form .paypal {
+ display: block;
+ margin: auto;
+ padding: 20px 0px 0px 0px;
+ outline: 0;
+}
+
+.img-demo {
+ vertical-align: bottom;
+ list-style: none;
+ margin:0;
+ padding: 0;
+}
+
+.img-demo li {
+ float: left;
+ width: 25%;
+ text-align: center;
+}
+
+.img-demo li img {
+ border: 2px solid white;
+ width: 98px;
+ height: 98px;
+}
+
+.float-left {
+ float: left;
+}
+
+.float-right {
+ float: right;
+}
+
+.clearfix:before,
+.clearfix:after {
+ content: "";
+ display: table;
+}
+
+.clearfix:after {
+ clear: both;
+}
+
+.clearfix {
+ zoom: 1; /* For IE 6/7 (trigger hasLayout) */
+}
+
+.rest-left {
+ margin-left: 244px;
+}
+
+.desc h1,
+.desc h2,
+.desc h3,
+.desc h4,
+.desc h5,
+.desc h6 {
+ font-weight: bold;
+}
+
+.desc h2 {
+ border-bottom: 1px solid rgba(0,0,0,0.1);
+ margin-top: 0px;
+ margin-bottom: 0px;
+ padding-bottom: 50px;
+}
+
+.desc h2 span {
+ float: left;
+ display: block;
+ line-height: 50px;
+}
+
+.brick {
+ background-color: white;
+ float: left;
+ cursor: default;
+ overflow: hidden;
+ background-repeat: no-repeat;
+ background-size: cover;
+ background-position: center;
+}
+
+.brick .cover {
+ overflow: hidden;
+ margin: 20px;
+/* margin-left: 60%; */
+ margin-top: 25%;
+/* width: 120px; */
+ height: 30px;
+ font-size: 30px;
+ padding: 7px;
+ float: right;
+ text-align: right;
+}
+
+.brick .read-more {
+ position: absolute;
+ display: none;
+ bottom: 0px;
+ left: 0px;
+ right: 0px;
+ padding: 12px;
+ background: rgb(0, 0, 0);
+ background: rgba(0, 0, 0, 0.45);
+}
+
+.brick:hover .read-more {
+ display: block;
+ cursor: pointer;
+}
+
+.brick .desc {
+ display: none;
+}
+
+.full-width .float-left {
+ display: none;
+}
+
+.full-width .desc {
+ display: block;
+}
+
+.full-width.brick {
+ box-shadow: none;
+ overflow: visible;
+ border: none !important;
+ background: none !important;
+}
+
+.full-width.brick .cover {
+ margin: 0px 20px;
+ color: #333;
+}
+
+.full-width.brick .cover * {
+ text-shadow: none;
+}
+
+.full-width.brick .cover code {
+ color: #666;
+}
+
+.open .float-left {
+ display: none;
+}
+
+.open .desc {
+ display: block;
+}
+
+.example {
+ width: 0px;
+ height: 0px;
+ overflow: visible !important; /* for ie7 */
+}
+
+.example-draggable {
+ cursor: move;
+}
+
+.example-draggable * {
+ cursor: move;
+}
+
+.example-draggable a {
+ cursor: pointer;
+}
+
+.cell {
+ background-position: center center;
+ background-repeat: no-repeat;
+ background-size: cover;
+ position: absolute;
+ background-color: #222;
+}
+
+[class*="-share"] {
+ cursor: pointer;
+ margin: 20px 0;
+ line-height: 30px;
+ padding-left: 30px;
+}
+
+.facebook-share {
+ background: url(../i/fb.png) no-repeat left center;
+}
+
+.twitter-share {
+ background: url(../i/tw.png) no-repeat left center;
+}
+
+.google-share {
+ background: url(../i/gp.png) no-repeat left center;
+}
+
+.download-icon {
+ background: url(../i/download.png) no-repeat left center;
+ display: block;
+ margin: 0 0 10px 0;
+ line-height: 30px;
+ padding-left: 30px;
+}
+
+.js-icon {
+ background: url(../i/js.png) no-repeat left center;
+ display: block;
+ line-height: 30px;
+ padding-left: 30px;
+}
+
+.fork {
+ float: right;
+ width: 100%;
+ height: 100%;
+ display: block;
+ background: url(../i/forkme.png) no-repeat top right;
+}
+
+.back-button {
+ position: fixed;
+ z-index: 9999;
+ padding: 1%;
+ bottom: 2%;
+ right: 2%;
+ display: none;
+ background: black;
+}
+
+.back-button .back-icon {
+ background: url(../i/back.png) no-repeat top center;
+ width: 45px;
+ height: 27px;
+ display: block;
+}
+
+.back-button .back-icon:hover {
+ background: url(../i/back.png) no-repeat bottom center;
+}
+
+@media (min-width: 1600px) {
+ .main-content-wrapper{
+ width:100%;
+ margin-left:95px;
+ margin-right: 1%;
+ }
+}
+
+@media (min-width: 1441px) and (max-width: 1599px) {
+ .main-content-wrapper{
+ width:100%;
+ /*margin-left: 0%; */
+ margin-left:75px;
+ margin-right: 1%;
+ }
+}
+
+@media (min-width: 1367px) and (max-width: 1440px) {
+ .main-content-wrapper{
+ width:100%;
+ margin-left: 75px;
+ margin-right: 1%;
+ }
+}
+
+@media (min-width: 1281px) and (max-width: 1366px) {
+ .main-content-wrapper{
+ width:100%;
+ /*margin-left: 2%; */
+ margin-left:75px;
+ margin-right: 2%;
+ }
+}
+
+@media (min-width: 1025px) and (max-width: 1280px) {
+ .main-content-wrapper{
+ width:100%;
+ /*margin-left: 4%;*/
+ margin-left:75px;
+ margin-right: 1%;
+ }
+}
+
+@media (min-width: 769px) and (max-width: 1024px) {
+ .main-content-wrapper{
+ width:100%;
+ /*margin-left: 6%;*/
+ margin-left:75px;
+ margin-right: 1%;
+ }
+}
+
+@media (min-width: 641px) and (max-width: 768px) {
+ .main-content-wrapper{
+ width:100%;
+ margin-left: 10%;
+ margin-right: 1%;
+ }
+}
+
+@media (min-width: 481px) and (max-width: 640px) {
+ .main-content-wrapper{
+ width:100%;
+ margin-left: 0%;
+ margin-right: 1%;
+ }
+}
+
+@media (max-width: 480px) {
+ .main-content-wrapper{
+ width:100%;
+ margin-left: 9%;
+ margin-right: 1%;
+ }
+}
+
+body{
+ font-family: microsoft yahei;
+ background: #484747;
+}
+
+.skyBlue-mainpage{
+ background: -moz-linear-gradient(left top, #1cadd9, #20c0f0);
+ background: -webkit-gradient(linear, left top, right bottom, color-stop(0, #1cadd9), color-stop(1, #20c0f0));
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1cadd9', endColorstr='#20c0f0', GradientType='0');
+ background: linear-gradient(to bottom right,#1cadd9, #20c0f0);
+}
+.golden-mainpage{
+ background-image: -moz-linear-gradient(left top, #bca374, #d9cf7a);
+ background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #bca374), color-stop(1, #d9cf7a));
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#bca374, endColorstr=#d9cf7a, GradientType=0);
+ background: linear-gradient(to bottom right,#bca374, #d9cf7a);
+}
+.manLieONCloud-image{
+ background-image: url('../image/mainpage/pic/1.png');
+}
+.orange-mainpage{
+ background-image: -moz-linear-gradient(left top, #f09c0a, #f4be35);
+ background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #f09c0a), color-stop(1, #f4be35));
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#f09c0a, endColorstr=#f4be35, GradientType=0);
+ background: linear-gradient(to bottom right,#f09c0a, #f4be35);
+}
+.pinkishRed-mainpage{
+ background-image: -moz-linear-gradient(left top, #e03655, #ef3a5b);
+ background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #e03655), color-stop(1, #ef3a5b));
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#e03655, endColorstr=#ef3a5b, GradientType=0);
+ background: linear-gradient(to bottom right,#e03655, #ef3a5b);
+}
+.magicCube-image{
+ background-image: url('../image/mainpage/pic/4.png');
+}
+.grassGreen-mainpage{
+ background-image: -moz-linear-gradient(left top, #008b04, #03a501);
+ background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #008b04), color-stop(1, #03a501));
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#008b04, endColorstr=#03a501, GradientType=0);
+ background: linear-gradient(to bottom right,#008b04, #03a501);
+}
+.meeting-image{
+ background-image: url('../image/mainpage/pic/3.png');
+}
+.earth-image{
+ background-image: url('../image/mainpage/pic/2.png');
+}
+.toolsImageBrokenLine{
+ background-image: url('../image/mainpage/icon/1.png');
+ height: 150px;
+ width: 120px;
+ top: 30px;
+ position: absolute;
+}
+.toolsImageHierachy{
+ background-image: url('../image/mainpage/icon/2.png');
+ height: 150px;
+ width: 120px;
+ top: 30px;
+ position: absolute;
+}
+.toolsImageGear{
+ background-image: url('../image/mainpage/icon/3.png');
+ height: 150px;
+ width: 120px;
+ top: 30px;
+ position: absolute;
+}
+.toolsImagePresent{
+ background-image: url('../image/mainpage/icon/4.png');
+ height: 150px;
+ width: 120px;
+ top: 30px;
+ position: absolute;
+}
+.toolsImageFile{
+ background-image: url('../image/mainpage/icon/5.png');
+ height: 150px;
+ width: 120px;
+ top: 30px;
+ position: absolute;
+}
+.toolsImageBriefcase{
+ background-image: url('../image/mainpage/icon/6.png');
+ height: 150px;
+ width: 120px;
+ top: 30px;
+ position: absolute;
+}
+.contentTip{
+ opacity:0;
+ display:block;
+ padding: 20px;
+ text-align: left;
+ line-height: inherit;
+ text-indent: 2em;
+ position: absolute;
+}
+.contentTipShow{
+ display:block;
+ padding: 20px;
+ text-align: left;
+ line-height: inherit;
+ text-indent: 2em;
+ position: absolute;
+}
+.coverHidden{
+ display:none;
+}
+.coverShrink{
+ width:0px !important;
+ height:0px !important;
+}
+/*
+.brick .contentToggle{
+ -webkit-transition: opacity 1s ease-in-out;
+ -moz-transition: opacity 1s ease-in-out;
+ -o-transition: opacity 1s ease-in-out;
+ transition: opacity 1s ease-in-out;
+}
+.brick .cover :hover{
+ opacity:0;
+}
+*/
+.hideSideMenuForMainPage {
+ display: none! important;
+}
+.fullFillDiv {
+ width:100%;
+ height:100%;
+}
+
|