﻿/* CSS Document 
Create By Rene Huanco Choque
*/
@import url(http://fonts.googleapis.com/css?family=Strait);header,nav,section,article,aside,footer,hgroup {display: block;}
body {background:url(images/texture.png) repeat;font-family: sans-serif;font-size: 13px;margin: 0;padding: 0;}
a{cursor:pointer;}
.r-content a:hover {color: #0C468C;text-decoration: underline;}
.r-content a {color: #0C65AE;text-decoration: none;}
.clear{clear:both;}
img{border:none;display:block;}
/*RIBBONS*/
.ribbon-full {background-color: #0F4A89;height: 50px;margin-top: 20px;}
.content-ribbon {background-color: #0F63BC;height: 55px;margin: 10px auto 0;position: relative;width: 1200px;z-index: 4;}
.shadow-header {background: url(images/shadow-sides.png) repeat scroll 0 0 transparent;bottom: 0;height: 20px;margin-bottom: -20px;margin-left: 20px;position: absolute;width: 1160px;}
.content-ribbon .ribbon-left {background: url(images/sides.png) repeat scroll 0 0 transparent;bottom: 0;height: 20px;left: 0;margin-bottom: -20px;position: absolute;width: 20px;}
.content-ribbon .ribbon-right {background: url(images/sides.png) repeat scroll right 0 transparent;bottom: 0;height: 20px;margin-bottom: -20px;position: absolute;right: 0;width: 20px;}
/*HEADER */
.language, .option {background: url(images/bg-search.png) repeat scroll 0 0 transparent;border: 1px solid #CBCBCB;border-radius: 5px 5px 5px 5px;display: block;height: 20px;margin-left: 13px;margin-right: 13px;margin-top: 13px;padding: 4px 9px 2px;}
.language {float: left;}
.language ul {margin: 0;padding: 0;}
.language li {color: #000;float: left;font-size: 11px;font-weight: bold;list-style: none outside none;margin-left: 5px;margin-right: 5px;margin-top: 3px;}
.language ul li i {border: 1px solid transparent;display: block;margin-top: -1px;padding: 2px;}
.language ul li#active i {background-color: #fff;border: 1px dotted #000000;}
.language ul li i:hover {background-color: #fff;border: 1px dotted #000000;}
.option {float: right;padding-left: 0;}
.option ul {margin: 0;padding: 0 0 0 16px;}
.option li {color: #000;float: left;font-size: 11px;font-weight: bold;list-style: none outside none;margin-left: 5px;margin-top: 3px;}
.option li a {color: #000000;text-decoration: none;}
.option .login, .option .support {margin-right: 15px;margin-top: -4px;}
.option .login {background: url(images/login-support.png) no-repeat scroll left top transparent;height: 20px;width: 20px;}
.option .login:hover {background: url(images/login-support.png) no-repeat scroll left bottom transparent;}
.option .support {background: url(images/login-support.png) no-repeat scroll right top transparent;height: 20px;width: 20px;}
.option .support:hover {background: url(images/login-support.png) no-repeat scroll right bottom transparent;}
/*RIBBON 2*/
.r-ribbon-fantasy {background-color: #0F63BC;height: 61px;margin: 0 auto;position: relative;width: 1200px;z-index: 4;}
.r-ribbon-fantasy .left-ribbon, .r-ribbon-fantasy .right-ribbon {bottom: 0;height: 61px;margin-bottom: -20px;position: absolute;width: 50px;}
.right-ribbon {background: url(images/sides-2.png) no-repeat scroll right center transparent;margin-right: -30px;right: 0;}
.left-ribbon {background: url(images/sides-2.png) no-repeat scroll left center transparent;margin-left: -30px;left: 0;}
.shadow-bottom {background: url(images/shadow-sides.png) repeat-x scroll center 0 transparent;bottom: 0;height: 20px;margin-bottom: -20px;position: absolute;width: 100%;}
.shadow-bottom.size {margin-left: 20px;width: 1160px;}
.r-ribbon-fantasy h1 {color: #FFFFFF;font-family: 'Strait',cursive;font-size: 27px;margin: 0;padding: 15px 0 0;text-align: center;text-shadow: 1px 0 0 #3C3C3C;}
/*LOGO*/
.logo {padding-top: 22px;}
.logo img {margin: 0 auto;}
.description {color: #5F5F5F;font-family: Strait;font-size: 27px;margin: 10px auto 20px auto;text-align: center;text-shadow: 1px 1px 0 #aaa;}
/*FORM INPUT SITE WEB*/
.form-input {background: url(images/shadow-form.png) no-repeat scroll center -44px transparent;padding-bottom: 34px;}
.form-input p {font-family: Strait;font-size: 36%;margin: 3px 0 0;text-align: center;}
.form-input .hidden {display: none;}
.form-input ul {background: url(images/bg-search.png) repeat scroll 0 0 transparent;border: 1px solid #CCCCCC;border-radius: 5px 5px 5px 5px;display: block;height: 72px;margin: 0 auto;padding: 25px 15px 0;width: 64%;}
.form-input ul li {color: #4E4E4E;display: block;float: left;font-size: 35px;list-style: none outside none;margin-left: 3px;margin-right: 3px;position: relative;}
.form-input .input-site {color: #5B5B5B;font-size: 35px;padding: 6px 7px;}
.form-input .input-site {background-color: #fff;border: 1px solid #CCCCCC;border-radius: 4px;box-shadow:0 1px 5px 1px #CCCCCC inset;height: 39px;margin-top: -6px;padding-bottom: 12px;padding-left: 7px;width: 327px;}
.form-input .input-site:hover {border: 1px solid #209CDE;box-shadow: 0 0 10px -5px #1793D6 inset;}
.form-input .input-site:focus {border: 1px solid #209CDE;box-shadow: 0 0 10px -5px #1793D6 inset;}
/*.form-input .submit-site {background-color: #0F63BC;border: medium none;border-radius: 4px 4px 4px 4px;color: #FFFFFF;cursor: pointer;display: block;font-size: 27px;height: 57px;margin-left: 15%;margin-top: -5px;padding-bottom: 6px;text-align: center;width: 91%;}
.form-input .submit-site:hover {background-color: #003F73;}*/
.form-input .submit-site {cursor: pointer;display: block;font-size: 25px;height: 55px;margin-left: 15%;margin-top: -5px;padding-bottom: 6px;text-align: center;width: 91%;}
p.text-active {color: #0B67D6;font-size: 14px;font-style: oblique;line-height: 20px;margin: 0 0 10px;text-align: center;}
.best, .delete, .free {display: block !important;float: left;}
.sites p, .delete p, .free p{font-family: 'Strait',cursive;font-size: 13px !important;text-shadow: 1px 0 0 #FFFFFF !important;}
.best {background: url(images/best.png) no-repeat scroll 0 0 transparent;display: inline-block;height: 32px;width: 32px;}
li.delete i.delete {background: url(images/delete.png) no-repeat scroll 0 0 transparent;display: inline-block;height: 32px;width: 32px;}
li.free i.free {background: url(images/free.png) no-repeat scroll 0 0 transparent;display: inline-block;height: 32px;width: 32px;}
/*services Options*/
aside.notes-important ul li{display: inline-block;float: left;list-style: none outside none;margin-left: 20px;margin-right: 20px;width: 298px;}
aside.notes-important ul {margin: 0 auto;padding: 0;width: 1025px;}
aside.notes-important ul li p {color: #070707;font-size: 12px;margin-top: 6px;padding-left: 12px;padding-right: 8px;padding-top: 3px;text-shadow: 1px 0 0 #EEEEEE;}
/*EXAMPLES*/
.more-option-sites ul {display: block;float: right;margin: 1% 3% 0 0;padding: 0;}
.more-option-sites ul li {color: #000000;float: left;font-size: 10px;list-style: none outside none;margin-left: 5px;margin-right: -2px;padding: 0;}
.more-option-sites ul li a {font-size: 114%;}
/*CONTENT SITE*/
.r-content {background: url(images/bg-content.png) repeat scroll 0 0 #F2F2F2;border-left: 1px solid #E3E3E3;border-right: 1px solid #E3E3E3; box-shadow:0px 0px 4px 1px #4D4B4B;margin: -20px auto 0;padding-bottom: 25px;padding-top: 20px;position: relative;width: 1158px;z-index: 2;}
/*FUNCTION*/
section.content-services {margin-top: 3%;padding-left: 3%;padding-right: 3%;}
.content-services aside {float: left;margin-left: 51px;margin-right: 51px;width: 260px;}
aside .board {background: url(images/shadow-t.png) no-repeat scroll center bottom transparent;padding-bottom: 15px;}
.board img {background-color: #fff;border: 1px solid #EAEAEA;padding: 5px;}
.list ul li {font-size: 15px;line-height: 18px;list-style: disc outside url(images/bullet.gif);margin-bottom: 9px;}
.separator {background: url(images/separator.png) no-repeat scroll center center transparent;height: 18px;margin-bottom: 15px;margin-top: 10px;}
.separator-2 {display: none;}
.separator-1 {display: none;}
/*TESTIMONIAL*/
.testimonial {position: relative;}
.testimonial blockquote {font-style: oblique;line-height: 40px;margin: 33px 88px 39px;font-size: 22px;}
.testimonial blockquote:before {content: "“";font-family: 'Times New Roman';font-size: 87px;left: 0;margin-left: 22px;margin-top: 10px;position: absolute;}
.testimonial blockquote:after {content: "”";font-family: 'Times New Roman';font-size: 87px;right: 0;margin-right: 80px;margin-top: 0px;position: absolute;}
.testimonial blockquote span {font-size:15px;font-style:normal;}

/*FANS*/
.fans {margin:15px auto 10px auto;text-align:center;}
/*Footer*/
footer {background-color: #0F63BC;box-shadow: 0 7px 7px -5px #000;color: #FCFCFC;height: 90px;margin: 0 auto 20px;position: relative;text-align: center;width: 1260px;z-index: 3;}
footer .left-footer {background: url(images/ribbon-footer.png) no-repeat scroll 0 0 transparent;height: 50px;left: 0;margin-top: -50px;position: absolute;top: 0;width: 50px;}
.footer-description {clear: both;padding-top: 23px;}
.footer-description p {margin: 0;font-size:22px;margin-bottom:6px;}
footer a {color: #fff;text-decoration: underline;}
footer a:hover {color: #fff;text-decoration: none;}
footer small {font-size: 12px;}
footer .right-footer {background: url(images/ribbon-footer.png) no-repeat scroll right 0 transparent;height: 50px;right: 0;margin-top: -50px;position: absolute;top: 0;width: 50px;}
footer .shadow-footer{background: url(images/ribbon-footer.png) repeat-x scroll center bottom transparent;height: 50px;margin-left: 50px;margin-top: -50px;position: absolute;width: 1160px;z-index: 20;}
/*Popup*/

#popup, #popup2 {background-color: #fff;border-radius: 5px;box-shadow: 0 0 25px 5px #999;color: #111;display: none;min-width: 450px;padding: 25px;}
#popup2 iframe {background: url(http://staticjw.com/images/load.gif) no-repeat scroll center center transparent;min-height: 540px;min-width: 651px;overflow-y: scroll;}
.content iframe {overflow-y: scroll !important;}
.button.small.pop2 {cursor: pointer;}
.button.small.pop2:hover {color: #CECFD0;text-decoration: underline;}
.button.b-close span:hover {background-color: #000000;color: #FFFFFF;cursor: pointer;}
.button.b-close span {background-color: #126ECF;border-radius: 3px 3px 3px 3px;clear: both;color: #FFFFFF;left: 610px;padding: 3px 10px 4px;position: relative;top: -9px;}

/*Carroucel*/

.list_carousel {margin-bottom: 0;margin-left: auto;margin-right: auto;padding-top: 25px;position: relative;width: 1000px;}
#pagination a:hover {background: url(images/list.png) no-repeat scroll left top transparent;text-decoration:none;}
.prev {background: url(images/left-prev.png) no-repeat scroll 0 0 transparent;height: 70px;left: 0;margin-left: -20px;margin-top: 100px;position: absolute;top: 0;width: 25px;}
.next {background: url(images/right-next.png) no-repeat scroll 0 0 transparent;height: 70px;margin-right: -20px;margin-top: 100px;position: absolute;right: 0;
top: 0;width: 25px;}
#r-slider div {margin-top: 5px;}
.list_carousel ul {margin: 0;padding: 0;list-style: none;display: block;}
#r-slider img {background-color: #FFFFFF;border: 1px solid #BBBBBB;box-shadow: 0 13px 4px -10px #474747;display: block;padding: 6px;}
.list_carousel li {float: left;margin: 0 16px;text-align: center;}
.caroufredsel_wrapper {height: 236px !important;}
.clearfix {float: none;clear: both;}


/*Signup settings */
.fieldset {width:400px;margin:50px auto;padding:20px;border:1px solid #aaa;background-color:#f9f9f9;box-shadow:2px 2px 4px #444;}
.fieldset .label {font-size:16px;margin-top:20px;}
.fieldset input {font-size:18px;margin-top:10px;margin-left:20px;height:32px;padding:5px;}
#bigsave {float:right;font-size:18px;padding:5px;margin-top:-40px;height:40px;}


/*Responsive*/
@media screen and (max-width: 1285px) {
.r-content {width: 1072px;}
.content-ribbon {width: 1114px;}
.form-input ul {width: 68%;}
.shadow-header {width: 1074px;}
.prev {margin-left: -61px !important;}
.next {margin-right: -63px !important;}
.r-ribbon-fantasy {width: 1114px;}
.fans {height: 490px;}
footer {width: 1174px;}
footer .shadow-footer {width: 1074px;}
.content-services aside {margin-left: 35px;margin-right: 35px;}
/*SLIDER*/
.list_carousel {width: 872px !important;}
.caroufredsel_wrapper {margin-left: -116px !important;width: 118% !important;}
#r-slider li {margin-left: 10px !important;margin-right: 10px !important;}
}
@media screen and (max-width: 1200px) {.r-content {width: 973px;}
.content-ribbon {width: 1015px;}
.shadow-header {width: 975px;}
.r-ribbon-fantasy {width: 1015px;}
.form-input ul {width: 75%;}
.list_carousel li {height: 160px !important;width: 160px !important;}
#r-slider img {height: 160px;width: 160px;}
.caroufredsel_wrapper {margin: 0 auto 0 99px !important;width: 778px !important;}
/*Functions*/
.content-services aside {margin-left: 22px;margin-right: 22px;}
/*FOOTER*/
footer {width: 1075px;}
footer .shadow-footer {width: 975px;}
/*CAROUCEL*/
.list_carousel {width: 789px !important;}
.caroufredsel_wrapper {margin: 0 auto 0 0 !important;width: 790px !important;}
}
@media screen and (max-width: 1104px) {
.form-input ul {width: 82.7%;}
.fans {display: none;}
}
@media screen  and (max-width: 1029px){
.form-input .input-site {width: 210px;}
}
@media screen and (max-width: 1010px) {.form-input .input-site {width: 215px;}
}
@media screen and (max-width: 1100px) {.r-content {width: 879px;}
aside.notes-important ul li {width: 251px;}
.content-ribbon {width: 921px;}
.shadow-header {width: 881px;}
.r-ribbon-fantasy {width: 921px;}
footer {width: 981px;}
footer .shadow-footer {width: 881px;}
/*Services*/
.content-services aside {margin-left: 7px;margin-right: 7px;}
/*CAROUCEL*/
.caroufredsel_wrapper {height: 150px !important;margin: 41px auto 0 -21px !important;width: 708px !important;}
.list_carousel ul {left: 0 !important;}
.list_carousel {width: 672px !important;}
aside.notes-important ul {display: inline-block;width: 100%;}
.list_carousel li {height: 120px !important;width: 120px !important;}
#r-slider img {height: 120px;width: 120px;}
}
@media screen and (max-width: 1020px) {.content-ribbon {width: 790px;}
.shadow-header {width: 751px;}
.r-content {width: 747px;}
.r-ribbon-fantasy {width: 789px;}
footer {width: 849px;}
footer .shadow-footer {width: 749px;}
/*Caroucel*/
.list_carousel {height: 200px;width: 606px !important;}
.caroufredsel_wrapper {height: 150px !important;margin: 33px auto 0 0 !important;width: 616px !important;}
.caroufredsel_wrapper ul {left: 0 !important;}
/*Transform services options*/
.separator {display: none;}
.clear {clear: none;}
.clear-2 {clear: both;}
.content-services aside {margin-left: 40px;margin-right: 40px;}
.separator-2 {height: auto !important;margin-bottom: 15px;margin-top: 15px;width: 100%;}
.separator-2 {display: block;}
}
@media screen and (max-width: 900px) {
.submit-site {font-size: 54% !important;width: 91% !important;}
}
@media screen and (max-width: 889px) {.content-ribbon {width: 668px;}
.shadow-header {width: 628px;}
/*FORM*/
.form-input ul {padding: 25px 2% 0;width: 91%;}
.form-input .input-site {width: 222px;}
aside.notes-important ul li {width: 94%;}
/*ROIBBON*/
.r-ribbon-fantasy {width: 668px;}
.separator-2 {display: none;}
.list_carousel {width: 486px !important;}
.caroufredsel_wrapper {width: 477px !important;}
.content-services aside {margin-left: 16px;margin-right: 16px;}
.r-content {width: 626px;}
/*FOOTER*/
footer .shadow-footer {width: 628px;}
footer {width: 728px;}
}
@media screen and (max-width:610px){.logo img {height: auto;width: 90%;}
.content-ribbon {width: 503px;}
.shadow-header {width: 463px;}
.r-ribbon-fantasy {width: 503px;}
.list_carousel {width: 488px !important;}
.caroufredsel_wrapper {margin-left: 63px !important;width: 346px !important;}
.list_carousel li {height: 90px !important;width: 90px !important;}
#r-slider img {height: 90px;width: 90px;}
.separator-1 {display: block;height: auto;width: 100%;}
.r-content {width: 461px;}
footer {width: 563px;}
footer .shadow-footer {width: 463px;}
.form-input {background: url(images/shadow-form.png) no-repeat scroll center 14px transparent;padding-bottom: 29px;}
.form-input ul {height: 52px;padding: 25px 2% 0;width: 90%;}
.form-input ul li {display: inline-block;height: 65px;}
.form-input .input-site {width: 242px;}
.submit-site {margin-top: -2px !important;width: 297% !important;}
.form-input {background: url(images/shadow-form.png) no-repeat scroll center 97px transparent;}
.content-services aside {float: none;margin-bottom: 25px;margin-left: auto !important;margin-right: auto !important;margin-top: 25px;}
}
@media screen and (max-width:768px){.r-content {width: 475px;}
.content-ribbon {width: 518px;}
.shadow-header {width: 478px;}
.logo img {height: auto;width: 90%;}
.r-ribbon-fantasy {width: 518px;}
/*FORM*/
.form-input ul {height: 172px;padding: 25px 2% 0;width: 90%;}
.visible {display: none;}
.form-input ul li.hidden {clear: both;display: block;float: none;height: 21%;}
.form-input li.hidden p.hidden {display: block;font-size: 74%;}
.form-input ul li {display: inline-block;font-size: 259%;height: 65px;}
.form-input .input-site {width: 242px;}
.submit-site {margin-left: 0 !important;margin-top: -2px !important;width: 334% !important;}
.form-input {background: url(images/shadow-form.png) no-repeat scroll center 97px transparent;}
.content-services aside {float: none;margin: 0 auto !important;}
.separator-1 {display: block;height: auto;margin-bottom: 12px;margin-top: 28px;width: 100%;}
section.testimonial blockquote:after {margin-top: -219px;}
section.testimonial blockquote:before {margin-top: 252px;}
/*Caroucel*/
#r-slider div {display: none;}
.list_carousel {height: 148px;width: 335px !important;}
.caroufredsel_wrapper {height: 100px !important;margin-left: 0 !important;width: 344px !important;}
.prev, .next {margin-top: 77px !important;}
.list_carousel li {height: 80px !important;width: 80px !important;}
#r-slider img {height: 80px;width: 80px;}
footer {width: 578px;}
footer .shadow-footer {width: 478px;}
}
@media screen and (max-width:596px){.content-ribbon, .r-content, .r-ribbon-fantasy, footer {border-left: 1px solid transparent;width: 99% !important;}
.list_carousel {width: 100% !important;}
.prev {margin-left: -2px !important;}
.next {margin-right: 0 !important;}
.shadow-header, .ribbon-left, .ribbon-right {display: none;}
.shadow-bottom, .left-ribbon, .right-ribbon, .left-footer, .right-footer, .shadow-footer {display: none;}
.form-input ul li {display: inline;float: none;font-size: 170%;text-align: center;}
.form-input {background: url(images/shadow-form.png) no-repeat scroll center 223px transparent;}
.caroufredsel_wrapper {height: 106px !important;margin-left: 14% !important;width: 65% !important;}
.r-ribbon-fantasy {height: auto;padding-bottom: 10px;}
.submit-site {margin-top: 13px !important;width: 100% !important;}
.form-input ul {height: auto;padding: 3% 0;width: 97%; display:inherit !important; text-align:center;}
.form-input .input-site {font-size: 20px;width: 50%;}
.language, .option {clear: both !important;display: table;float: none !important;margin: 0 auto 4px;padding-left: 0;padding-right: 0;width: 96%;}
.content-ribbon {height: auto !important;padding-bottom: 4px;padding-top: 6px;}
}
@media screen and (max-width:612px){.submit-site {width: 237% !important;}}
@media screen and (max-width:610px){.submit-site {width: 100% !important;}}
@media screen and (max-width:605px){.submit-site {width: 100% !important;font-size: 27px !important; margin:0 auto !important;}}
@media screen and (max-width:433px){.popup {background-color: #288ACF;height: 539px;width: 75.4%;}}

