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

body { margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; font-family: 'Open Sans', sans-serif; font-size:14px; color:#4D4D4D; }
img { border:0; }
#mainbg { width:100%; height:400px; background:url(../images/pattern.png) repeat; background-color:#00645a; }
#wrap { width:80%; margin:0 auto; padding-top:30px; color:#FFFFFF; }
.header-left { width:35%; margin-bottom:20px; float:left; }
.header-right { width:25%; float:right; padding:15px; text-align:right; padding-top:1.5em; }
.loginmenus { width:250px; background-color:#008579; float:right; -moz-box-shadow: 0 0 10px #000000; -webkit-box-shadow: 0 0 10px #000000; box-shadow: 0 0 10px #000000; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; text-align:center; padding:10px; }
.fr { float:right; }
.fl { float:left; }
.genpad { padding:3px 8px; }
.toggle { width:35px;padding: 2px; text-align:right; }
.loginsplit { background:url(../images/split.png) right no-repeat; }

/*---start-content----*/
.content { width:80%; margin:0 auto; }
.top-grids { margin: 1em 0; position:relative; width:100%; }
.top-grid1 { margin-top: 5em; padding-top: 2em; position:relative; }
.top-grid1 label { background: #ECECEC; height: 1px; display: block; position: absolute; top: -16px; width: 94%; }
.top-grid { width: 30.9%; float: left; margin-right: 2%; text-align: center; border-right: 1px solid #ECECEC; padding-bottom: 2em; }
.top-grid:nth-child(3), .top-grid:nth-child(6) { margin-right:0px; border-right:0; }
.top-grid a.icon { width: 53px; height: 53px; display: inline-block; padding: 0px; text-align: center; }
.top-grid a { font-size: 1.4em; color: #00645a; font-weight: 800; padding: 0.5em 0 0.6em 0; display: block; text-decoration:none; }
.top-grid a:hover { text-decoration:none; }
.top-grid p { color: #4D4D4D; line-height: 1.6em; font-size: 1em; width: 90%; margin: 0 auto; }
.upload { background: url(../images/bsprit.png) no-repeat 3px -54px; }
.share { background: url(../images/bsprit.png) no-repeat -49px -54px; }
.earn { background: url(../images/bsprit.png) no-repeat -98px -56px; }
.uploadcontainer { text-align:center; padding-top:100px; margin:0 auto;
                  /*color:#FFFFFF;*/
                  width:60%; font-weight:bold; }
.uploadcontainer h2{margin-top:60px;}
.footer { width:100%; padding:30px; background-color:#e8e8e8; text-align:center; }


.text12 { font-size:12px; }
.text13 { font-size:13px; }
.text14 { font-size:14px; }
.text15 { font-size:15px; }
.text16 { font-size:16px; }
.text17 { font-size:17px; }
.text18 { font-size:18px; }
.text19 { font-size:19px; }
.text20 { font-size:20px; }
.text21 { font-size:21px; }
.text22 { font-size:22px; }
.text23 { font-size:23px; }
.text24 { font-size:24px; }
.text25 { font-size:25px; }

.black { color:#191919; }
.medgrey { color:#999999; }
.lightgrey { color:#8D8D8D; }
.verylightgrey { color:#f0f0f0; }
.darkgrey { color:#444444; }
.blue { color:#2899c6; }
.green { color:#00645a; }
.orange { color:#f8951d; }
.white { color:#FFFFFF; }
.red { color:#df122a; }

/*start-nav*/
.menu2, .menu2 ul { margin: 0; padding: 0; list-style: none; }
.nav { }
.top-nav { width: 12.333%; float: left; padding: 3px 4px 0px; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; -o-transition: 0.5s all; cursor: pointer; }
.top-nav:hover { }

/*start-menu2*/
/*.menu2:before, .menu2:after { content: ""; display: table; }
.menu2:after { clear: both; }
.menu2 { zoom:1; }*/
.menu2 li { float: left; position: relative; }
.menu2a { float: left; padding: 12px 30px; color: #999; text-decoration: none; text-shadow: 0 1px 0 #000; }
.menu2 li:hover > a { color: #fafafa; }
*html .menu2 li a:hover { /* IE6 only */ color: #fafafa; }
.menu2 ul { margin: 20px 0 0 0; opacity: 1; visibility: hidden; position: absolute; top: 15px; right: -22px; z-index: 1; color: #004740; background: #FFFFFF; display: block; z-index: 9999; text-align:left; -moz-box-shadow: 0 0 10px #000000; -webkit-box-shadow: 0 0 10px #000000; box-shadow: 0 0 10px #000000; border-radius:3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -o-border-radius:3px;font-size:13px; }
/*.menu2 li:hover > ul { opacity: 1; visibility: visible; margin: 0; }*/
.menu2 ul ul { top: 0; left: 145px; margin: 0 0 0 20px; _margin: 0; /*IE6 only*/ webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.4); box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.4); }
.menu2 ul li { float: none; display: block; border: 0; _line-height: 0; /*IE6 only*/ }
.menu2 ul li:last-child { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; }
.menu2 ul a { _height: 10px; /*IE6 only*/ display: block; white-space: nowrap; float: none; color:#004740;  border-bottom: 1px solid #CECECE; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; padding:0.2em 0.6em; }
.menu2 ul a:hover { background: #004740; }
.menu2 ul li:first-child > a { }
.menu2 ul li:first-child > a:after { content: ''; position: absolute; left: 16px; top: -10px; border-left: 10px solid transparent; border-right: 10px solid transparent; }
.menu2 ul ul li:first-child a:after { left: -10px; top: 50%; margin-top: -6px; border-left: 0; border-bottom:10px solid transparent; border-top:10px solid transparent; border-right:10px solid #3F67C0; }
.menu2 ul li:last-child > a { -moz-border-radius: 0 0 3px 3px; -webkit-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px; }
/* Mobile */
.menu-trigger { display: none; }
/* iPad */
.no-transition { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; opacity: 1; visibility: visible; display: none; }
.nav-icon { height: 16px; width: 14px; background: url(../images/toggle_icon.png) no-repeat 0px 0px; display: block; }
.menu2 li:hover > .no-transition { display: block; }
/*end-menu2*/

.text14{font-size:14px;}







/*---start-responsive-deign----*/
@media only screen and (max-width: 1440px) and (min-width:1366px) {
.wrap { width:75%; }
.header-left { width: 35%; }
.header-left p { width: 92%; }
.header-right { width: 42%; }
}
@media only screen and (max-width: 1366px) and (min-width:1280px) {
.wrap { width:75%; }
.header-left { width: 35%; }
.header-left p { width:100%; }
.header-right { width: 46%; }
}
@media only screen and (max-width: 1280px) and (min-width:1024px) {
.wrap { width:80%; }
.header-left { width: 35%; }
.header-left p { width:100%; }
.header-right { width: 46%; }
}
@media only screen and (max-width: 1024px) and (min-width:768px) {
.wrap { width:80%; }
.header { min-height: 543px; }
.header-left { width: 35%; }
.header-left p { width:100%; }
.header-right { width:53%; background-size: 100%;  }
.loginmenus{width: 250px; margin: 0 auto;}
}
@media only screen and (max-width: 768px) and (min-width:640px) {
.wrap { width:80%; }
.logo { display:none; }
.header { background: url(../images/bg.jpg); min-height: 600px; }
.header-left { width: 100%; float:none; margin:0px; text-align:center; padding-top: 2em; }
.welcome-note p { font-size: 1em; }
.header-left label { width: 149px; min-height: 303px; display: inline-block; padding-top: 0; margin: 0px; background: url(../images/iphone.png) no-repeat; }
.header-left p { width:80%; margin:0 auto; }
.top-grid { width:100%; border-bottom:1px solid #ECECEC; margin-bottom:1.5em; border-right:none; border-left:none; }
.top-grid1 label { display:none; }
.top-grid1 { margin-top: 0em; padding-top: 0em; margin-bottom:1.5em; }
#slider-carousel h1, #slider-carousel h2 { font-size:2em; }
.loginmenus{width: 250px; float: left; margin-left: -120px;}
}
/*----*/
@media only screen and (max-width: 640px) and (min-width:480px) {
.wrap { width:80%; }
.logo { display:none; }
.header { background: url(../images/bg.jpg); min-height: 600px; }
.header-left { width: 100%; float:none; margin:0px; text-align:center; padding-top: 2em; }
.welcome-note p { font-size: 1em; }
.header-left label { width: 149px; min-height: 303px; display: inline-block; padding-top: 0; margin: 0px; background: url(../images/iphone.png) no-repeat; }
.header-left p { width:90%; margin:0 auto; }
.top-grid { width:100%; border-bottom:1px solid #ECECEC; margin-bottom:1.5em; border-right:none; border-left:none; }
.top-grid1 label { display:none; }
.top-grid1 { margin-top: 0em; padding-top: 0em; margin-bottom:1.5em; }
#slider-carousel h1, #slider-carousel h2 { font-size:2.5em; }
.loginmenus{width: 250px;}
}
/*----*/
@media only screen and (max-width: 480px) and (min-width:320px) {
.wrap { width: 85%; }
.logo { display:none; }
.header { background: url(../images/bg.jpg); min-height: 499px; }
.welcome-note h3 { font-size:1.5em; margin: 1em 0 0.3em 0; }
.header-left { width: 100%; float:none; margin:0px; text-align:center; padding-top: 2em; }
.welcome-note p { font-size: 0.875em; }
.top-grids { margin: 1.8em 0; }
.header-left label { width: 149px; min-height: 303px; display: inline-block; padding-top: 0; margin: 0px; background: url(../images/iphone.png) no-repeat; }
.header-left p { width: 100%; margin: 0 auto; font-size: 1.2em; }
.top-grid { width:100%; border-bottom:1px solid #ECECEC; margin-bottom:1em; border-right:none; border-left:none; padding-bottom: 1em; }
.top-grid a { font-size: 1.1em; }
.top-grid:nth-child(6) { border:none; }
.top-grid1 label { display:none; }
.top-grid1 { margin-top: 0em; padding-top: 0em; margin-bottom:1.5em; }
#slider-carousel h1, #slider-carousel h2 { font-size:2em; }
.loginmenus{width: 250px; margin-right: -20px;}
}
/*----*/
@media only screen and (max-width:320px) and (min-width:240px) {
.wrap { width: 85%; }
.logo { display:none; }
.header { background: url(../images/bg.jpg); min-height: 499px; }
.welcome-note h3 { font-size:1.5em; margin: 1em 0 0.3em 0; }
.header-left { width: 100%; float:none; margin:0px; text-align:center; padding-top: 1.5em; }
.welcome-note p { font-size: 0.875em; }
.top-grids { margin: 1.8em 0; }
.header-left label { width: 101px; min-height: 191px; display: inline-block; padding-top: 0; margin: 0px; background: url(../images/iphone.png) no-repeat; }
.header-left p { width: 100%; margin: 0 auto; font-size: 1em; }
.top-grid { width:100%; border-bottom:1px solid #ECECEC; margin-bottom:1em; border-right:none; border-left:none; padding-bottom: 1em; }
.top-grid a { font-size: 1.1em; }
.top-grid:nth-child(6) { border:none; }
.top-grid1 label { display:none; }
.top-grid1 { margin-top: 0em; padding-top: 0em; margin-bottom:1.5em; }
#slider-carousel h1, #slider-carousel h2 { font-size:2em; }
.loginmenus{width: 250px; margin-right: -25px;}
.uploadcontainer h2 {font-size:20px; padding-top:0; margin-top:0;}
}

@media only screen and (min-width:480px) {
.loginmenus{width: 250px; margin-right: 30px;}
.uploadcontainer h2 {}

}


@media only screen and (min-width:640px) {
.loginmenus{width: 250px; margin-left: -250px;}
}

@media only screen and (max-width:1024px) {
.loginmenus{width: 250px; margin-left: -200px;}
.uploadcontainer h2 {padding-top:0; margin-top:0;}
}

@media only screen and (min-width:360px) and (max-width:640px) {
.loginmenus{width: 250px; margin-left: -250px;}
.uploadcontainer h2 {font-size:20px; padding-top:0; margin-top:0;}
}

@media only screen and (min-width:768px) and (max-width:1024px) {
.loginmenus{width: 250px; margin-left: -130px;}
.uploadcontainer h2 {font-size:20px; padding-top:0; margin-top:0;}
}
/*---end-responsive-deign----*/
.footerbg {
    background-color: #ededed;
    border-top: 1px solid #b0b0b0;
}