* { margin: 0px; padding: 0px; }

header, footer, nav, section { display: block; }

.clear { clear: both; }

img { border: 0px; vertical-align: middle; }

a { text-decoration: none; color: #1da1f2; }

a:hover { color: #0f5992; }

hr { margin: 10px 0px; }

p { margin-bottom: 5px; }

.hidden { display: none !important; }

.large-text { font-size: 20px; line-height: 20px; }
.slarge-text { font-size: 26px; line-height: 26px; }
.sslarge-text { font-size: 56px; line-height: 56px; }

/* Styles for basic forms
-----------------------------------------------------------*/
textarea { min-height: 75px; }

/* Styles for validation helpers
-----------------------------------------------------------*/
.box-error ul, .box-war ul, .box-info ul { list-style-position:inside; }
.box-info {background-color:#fdfdbc; border:1px solid #d3d320; padding:10px; color:#303030;}
.box-error {background-color:#ffeeee; border:1px solid #fb5353; padding:10px; color:#ff0000;}
.box-war {background-color:#e7ffd3; border:1px solid #4ca900; padding:10px; color:#168002;}
.error { color: #ff0000; padding-left: 5px; }

.field-validation-error { color: #ff0000; }

.field-validation-valid { display: none; }

.input-validation-error { border: 1px solid #ff0000; background-color: #ffeeee; }

.validation-summary-errors { background-color:#ffeeee; border:1px solid #fb5353; padding:10px; color:#ff0000; margin-bottom: 5px; }
.validation-summary-errors ul,.notification ul { padding-left: 20px; }
.validation-summary-valid { display: none; }

.notification.success { background-color:#ddfdd8; border:1px solid #9adf8f; padding:10px; color:#333; margin-bottom: 5px; }

/* Styles for container
-----------------------------------------------------------*/
.mw { min-height: 100%; text-align: left; position: relative; z-index: 1; overflow: hidden; }
.wr { clear: left; width: 1038px; margin: 0px auto; }
.wr, .box, .box-mini, .last { display: block; min-height: 0; }
* html .wr, * html .box, * html .box-mini, * html .last { height: 1%; }

.oh { overflow: hidden !important; }
* html .oh { overflow: visible; }
.oa { overflow: auto !important; }
.oi { overflow: visible !important; }
.ib { display: inline-block; }

.fl { float: left; }
* html .fl { margin-right: -3px; }
.fr { float: right; }
* html .fr { margin-left: -3px; }

.align-left { text-align: left !important; }
.align-right { text-align: right !important; }
.align-center { text-align: center !important; }
.align-just { text-align: justify !important; }

.no-radius { -moz-border-radius: 0px !important; -webkit-border-radius: 0px !important; -khtml-border-radius: 0px !important; border-radius: 0px !important; }

/* Styles for master
-----------------------------------------------------------*/
html { height: 100%; line-height: 20px; }
body { height: 100%; font-size: 14px; font-family: 'Open Sans', arial, sans-serif; color: #333333; background: #ffffff; }

/* Styles for header
-----------------------------------------------------------*/
#top-menu-bar { width: 100%; }
#top-menu-bar span { display: block; }
.navi-bar ul li { list-style: none; float: left; padding: 0px 20px; }
.navi-bar ul li:first-child { padding-left: 0px; }
.navi-bar ul li a { color: #666; display: inline-block; text-decoration: none; }
.navi-bar ul li a .cloud { background: transparent url('../images/cloud36.png') no-repeat top center; width: 100%; height: 36px; }
.navi-bar ul li a .list { background: transparent url('../images/list36.png') no-repeat top center; width: 100%; height: 36px; }
.navi-bar ul li a .donate { background: transparent url('../images/donate36.png') no-repeat top center; width: 100%; height: 36px; }
.navi-bar ul li a:hover, .navi-bar ul li a.active { color: #0096d6; }
.navi-bar ul li a:hover .cloud,
.navi-bar ul li a.active .cloud,
.navi-bar ul li a:hover .list,
.navi-bar ul li a.active .list,
.navi-bar ul li a:hover .donate,
.navi-bar ul li a.active .donate { background-position: center -36px; }
.user-menu { position: absolute; top: 36px; right: 0px; z-index: 999; border: 1px solid #dc4e41; background-color: #fff; display: none; }
.user-menu ul { list-style: none; }
.user-menu ul li { padding: 0px; float: none; border-top: 1px solid #d3d3d3; }
.user-menu ul li:first-child { border-top: none; }
.user-menu ul li a { color: #666; padding: 10px 20px; display: block; min-width: 150px; }
.user-menu ul li a:hover { background-color: #f3f3f3; }

/* Styles for body
-----------------------------------------------------------*/
.box, .box-share { overflow: hidden; border: 1px solid #d6d6d6; background-color: #ffffff; -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; }
.box > .head { padding: 10px; background-color: #f3f3f3; }
.box.free-user { border-color: #686868; -moz-border-radius: 0px !important; -webkit-border-radius: 0px !important; -khtml-border-radius: 0px !important; border-radius: 0px !important; }
.box.free-user > .head { padding: 10px; background-color: #686868; color: #fff; text-align: center; font-weight: bold; }
.box.premium-user { border-color: #6faf4e; -moz-border-radius: 0px !important; -webkit-border-radius: 0px !important; -khtml-border-radius: 0px !important; border-radius: 0px !important; }
.box.premium-user > .head { padding: 10px; background-color: #6faf4e; color: #fff; text-align: center; font-weight: bold; }
.box > .body { padding: 10px; overflow: hidden; }

.box-mini { overflow: hidden; border: 1px solid #d6d6d6; background-color: #ffffff; -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; }
.box-mini > .body { padding: 2px 5px; overflow: hidden; }

.box-share { background: transparent url('../images/share100.png') no-repeat 10px 10px; padding: 10px 10px 10px 120px; min-height: 100px; }

#main > .content > .left { float: left; width: 728px; }
#main > .content > .right { float: right; width: 300px; }
#main > .content > .right .box { margin-bottom: 10px; }

#main > .content > .left-watch-video { float: left; width: 640px; }
#main > .content > .right-watch-video { float: right; width: 345px; margin-left: 10px; }

.file-contain { border: 1px solid #dddddd; padding: 2px 5px; }
.file-contain input.file { width:100%; padding:2px 0px; height:20px; }

input[type="text"], input[type="password"] { padding: 5px; border: 1px #dddddd solid; height: 18px; }
input[type="text"]:focus, input[type="password"]:focus { outline: 0px !important; border-color: #6fcbf3; -moz-box-shadow: 0px 0px 5px #6fcbf3; -webkit-box-shadow: 0px 0px 5px #6fcbf3; box-shadow: 0px 0px 5px #6fcbf3; }
input[type="text"][readonly] { background-color: #f3f3f3; cursor: default; }

input[type="checkbox"] { vertical-align: middle; }

.meta-info { font-size: 11px; padding-top: 3px; }
.meta-info ul { list-style: none; overflow: hidden; }
.meta-info ul li { float: left; padding-right: 5px; }

.label { height: 30px; line-height: 30px; }

ul.plan { list-style: none; }
ul.plan li { line-height: 36px; border-top: 1px dashed #d6d6d6; }
ul.plan li:first-child { border: 0px; }

table tr td, table tr th { padding: 7px 10px; }
table tr.odd { background-color: #f9f9f9; }

/* Styles for search box
-----------------------------------------------------------*/


/* Styles for footer
-----------------------------------------------------------*/
#footer { background-color: #f3f3f3; padding: 10px 0px; width: 100%; border-top: 1px solid #d6d6d6; position: absolute; bottom: 0px; }

/* Styles for icon
-----------------------------------------------------------*/
.cloud-load { background: transparent url('../images/cloud-load.gif') no-repeat center center; width: 75px; height: 30px; display: block; }
.circle-load { background: transparent url('../images/circle-load.gif') no-repeat center center; width: 76px; height: 76px; display: block; }
.user { color: #f3f3f3; background: transparent url('../images/user36.png') no-repeat center left; padding-left: 36px; height: 36px; line-height: 36px; display: inline-block; }
.user:hover { color: #f3f3f3; }
.file { background: transparent url('../images/file36.png') no-repeat center left; padding-left: 36px; height: 36px; line-height: 36px; display: inline-block; }
.download-guide { background: transparent url('../images/download-guide-icon.png'); width: 74px; height: 74px; display: inline-block; }
.download-guide.step-2 { background-position: -75px; }
.download-guide.step-3 { background-position: -150px; }
.tick,.cross { background: transparent url('../images/tick-cross20.png'); width: 20px; height: 20px; display: inline-block; }
.cross { background-position: -22px; }

/* Styles for width/height
-----------------------------------------------------------*/
.h30 { height: 30px !important; }
.h60 { height: 60px !important; }

.w75 { width: 75px !important; }

/* Styles for margin, padding
-----------------------------------------------------------*/
.pad0 { padding: 0px !important; }
.pad10 { padding: 10px !important; }

.padLR10 { padding: 0px 10px !important; }
.padT3 { padding-top: 3px !important; }
.padT5 { padding-top: 5px !important; }
.padR3 { padding-right: 3px !important; }
.padR10 { padding-right: 10px !important; }
.padR20 { padding-right: 20px !important; }
.padB5 { padding-bottom: 5px !important; }
.padL3 { padding-left: 3px !important; }
.padL5 { padding-left: 5px !important; }
.padL10 { padding-left: 10px !important; }

.marT15 { margin-top: 15px !important; }
.marT10 { margin-top: 10px !important; }
.marR3 { margin-right: 3px !important; }
.marL3 { margin-left: 3px !important; }
.marL5 { margin-left: 5px !important; }
.marL10 { margin-left: 10px !important; }
.marTB10 { margin: 10px 0px !important; }

/* Styles for border
-----------------------------------------------------------*/
.nb { border: none !important; }

/* Styles for text
-----------------------------------------------------------*/
.sub-text { color: #8a8a8a; font-size: 11px; }
.cl-gray { color: #8a8a8a; }
.bold { font-weight: bold; }
.fs19 { font-size: 19px; }

/* Buttons
-----------------------------------------------------------*/
.button {display:inline-block; border:1px solid; height: 28px; line-height:28px; padding:0px 10px !important; cursor:pointer; overflow:visible; font-weight:700;text-align:center;vertical-align:middle;}
.button-full {border:1px solid; line-height:34px; width:100%; cursor:pointer; overflow:visible; font-weight:700;-moz-border-radius: 5px;-webkit-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;text-align:center;vertical-align:middle;}
.button-blue {background-color:#1da1f2; color:#fff; border-color:#287ebf;}
.button-blue:hover {background-color:#287ebf; color:#fff;}
.button-green {background-color:#6faf4e; color:#fff; border-color:#5da737;}
.button-green:hover {background-color:#5da737; color:#fff;}
.button-gray {background-color:#ececec; color:#686868; border-color:#a8a8a8;-moz-box-shadow: 0px 0px 0px 1px #fcfcfc inset;-webkit-box-shadow: 0px 0px 0px 1px #fcfcfc inset;box-shadow: 0px 0px 0px 1px #fcfcfc inset;}
.button-gray:hover {color:#454545;}
.button-brown {background-color:#4c1312; color:#ffffff; border-color:#4c1312; line-height:24px !important; -moz-box-shadow: 0px 0px 0px 1px #fcfcfc inset;-webkit-box-shadow: 0px 0px 0px 1px #fcfcfc inset;box-shadow: 0px 0px 0px 1px #fcfcfc inset;}
.button-brown:hover {color:#ffffff; background-color:#6d1c1b;}

/* Boxes
-----------------------------------------------------------*/
.box.blue, .box-mini.blue { background-color: #639d02; color: #ffffff; border: 1px solid #119EE2; }
.box.green, .box-mini.green { background-color: #fff8dc; color: #5f5f5f; border: 1px solid #BDF333; }
.box.red, .box-mini.red { background-color: #a2362b; color: #ffffff; border: 1px solid #fb5353; }

/* Pagination
-----------------------------------------------------------*/
div.pagination
{
    text-align: right;
    padding: 15px 0 5px 0;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    float:right;
}

div.pagination ul.pager
{
    margin: 0px !important;
    padding: 0px !important;
    float: right;
    text-align: right;
}

div.pagination ul.pager li
{
    border: 1px solid #ddd;
    margin: 0 0 0 2px;
    height: 1%;
    float: left;
    list-style: none;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    background-color: #fff;
}

div.pagination ul.pager li.dl
{
    border: 0px;
    margin: 0 0 0 2px;
    height: 1%;
    float: left;
    list-style: none;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    padding: 0px !important;
}

div.pagination ul.pager li.current
{
    background: #42b4c4 url('images/bg-button-aqua.png') top left repeat-x !important;
    border-color: #36B9E2 !important;
    color: #fff !important;
    padding: 6px 6px !important;
}

div.pagination ul.pager li a
{
    margin: 0px;
    text-decoration: none;
    display: block;
    padding: 6px 6px !important;
}

div.pagination ul.pager li a:hover, div.pagination ul.pager li a:active
{
    color: #000;
}

.cbbPager{height:30px;padding:2px;margin:0px;background: #fff;border: 1px solid #d5d5d5;}