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

#wallpaper {
     width:680px;
     height:auto;
     position:relative;
     overflow:hidden;
     font-family:"Trebuchet MS", Helvetica, sans-serif;
     font-size:13px;
     margin:0 auto;
     background:url(../images/top-logo.png) no-repeat -8px top;
     padding-top:24px;
     color:#454545;
     line-height:1.5;
}
 #wallpaperthanks {
     width:740px;
     height:auto;
     position:relative;
     overflow:hidden;
     font-family:"Trebuchet MS", Helvetica, sans-serif;
     font-size:12px;
     margin:0 auto;
     padding-top:24px;
     color:#58595b;
}
 #ballsteps {
     width:660px;
     height:100px;
     float:left;
     background:url(../images/step-linebg.png) no-repeat 75px 18px;
}
 #ballsteps .stepActive {
     color:#f7931d !important;
}
 .stepbutton {
     color:#999999;
     width:20%;
     float:left;
     cursor:pointer;
     text-align:center;
     font-weight:bold;
}
 .stepbutton span{
     display:block;
     width:37px;
     height:37px;
     margin:0 auto;
     clear:both;
     text-align:center;
     line-height:35px;
     background:url(../images/step-inactivebg.png) no-repeat top left;
     margin-bottom:10px;
     color:#FFFFFF;
}
 #ballsteps .stepActive span{
     background:url(../images/step-activebg.png) no-repeat top left;
     color:#FFFFFF;
}
 .customPriceBody {
     margin-top:25px;
}
 .customArrow {
     background-image:url('../images/navarrow.jpg');
     background-repeat:no-repeat;
     height:21px;
     width:16px;
     margin: 8px 10px 0px 10px;
     float:left;
}
 #customSlider {
     width:4200px;
     height:auto;
     position:relative;
     float:left;
}
 #customColorSelect, #customLogoUpload, #customTextWrite, #formstepthird, #customContactInfo, #customThanks {
     width:680px;
     height:auto;
     float:left;
}
 #rws-colorlist {
     height:100%;
     background: #f1f1f2 none repeat scroll 0 0;
     border: 1px solid #e5e5e6;
     float: left;
     margin: 0 12px 0 0;
     padding: 10px 8px;
     width: 150px;
}
 #customColorCircle {
     float:left;
}
 #customdataprint {
     width:140px;
     height:auto;
     text-align:left 
}
 .customColorSelector {
     width:60px;
     height:16px;
     float:left;
     border:1px solid #c0c0c0;
     margin-bottom:10px;
}
 .gtcolorfortext {
     width:25px;
     height:16px;
     float:left;
     border:1px solid #c0c0c0;
     margin-bottom:10px;
}
 .gtcolorfortext.left {
    margin-right:10px !important;
}
 .gtcolorfortext.right {
    margin-left:0 !important;
}
 .right {
     margin-left:10px;
}
 #customPieceSelectorContainer {
     margin-top:10px;
     float:left;
}
 .customPieceSelector {
     width:110px;
     height:20px;
     float:left;
     border:1px solid #c0c0c0;
     margin-bottom:10px;
     cursor:pointer;
}
 #customPieceSelectorContainer .active {
     background-color:#e5ebf0;
}
 .customPieceColor {
     width:24px;
     height:100%;
     float:left;
     border-right:1px solid #c0c0c0;
}
 .customPieceText {
     float:left;
     width:84px;
     text-align:center;
}
 #stepfirstright {
     height:434px;
     width: 500px;
     float:left;
}
 #stepfirstrightinner {
     background-image:url('../images/2018-soccer-balls-frame.png');
     background-repeat:no-repeat;
     height:435px;
     width: 500px;
     overflow:hidden;
     float:left;
     margin-right:10px;
}
 .firstballstep1 {
     background:url(../images/logo-first-step.png) no-repeat 54% 63%;
     height:195px;
     width:195px;
     margin:8px 0 0 8px;
     float:left;
}
 .secondballstep1 {
    /*background:url(../images/logo-first-step.png) no-repeat 49% 48%;
     */
     height:198px;
     width:198px;
     margin:12px 4px 0 0px;
     float:right;
     position:relative;
}
 .secondballstep1 .logofirstplace {
     width:44px;
     height:44px;
     position:absolute;
     background:url(../images/logosmallicon.png) no-repeat 50% 50%;
     left:76px;
     top:27px;
     z-index:10;
	 -webkit-border-radius: 10px;    
	-moz-border-radius: 10px;    
	-o-border-radius: 10px;    
	-ms-border-radius: 10px;    
	border-radius: 10px;
     background-size: 100% auto !important;
}
 .secondballstep1 .customtextplace{
     width:94%;
     height:26px;
     position:absolute;
     top:87px;
     z-index:10;
     text-transform:uppercase;
     color:#000;
     font-weight:bolder;
     margin:0 3%;
     text-align:center;
     font-size:20px;
}
 .secondballstep1 .logosecondplace{
     width:44px;
     height:44px;
     position:absolute;
     background:url(../images/logosmallicon.png) no-repeat 50% 50%;
     left:75px;
     top:134px;
     z-index:10;
	 -webkit-border-radius: 10px;    
	-moz-border-radius: 10px;    
	-o-border-radius: 10px;    
	-ms-border-radius: 10px;    
	border-radius: 10px;
     background-size: 100% auto !important;
}
 .thirdballstep1 {
    /*background:url(../images/logo-first-step.png) no-repeat 42% 50%;
     */
     height:206px;
     width:206px;
     margin:10px 0 0 7px;
     float:left;
     position:relative;
}
 .thirdballstep1 .logofirstplace{
     width:44px;
     height:44px;
     position:absolute;
     background:url(../images/logosmallicon.png) no-repeat 50% 50%;
     left:80px;
     top:30px;
     z-index:10;
	 -webkit-border-radius: 10px;    
	-moz-border-radius: 10px;    
	-o-border-radius: 10px;    
	-ms-border-radius: 10px;    
	border-radius: 10px;
     background-size: 100% auto !important;
}
 .thirdballstep1 .customtextplace{
     width:94%;
     height:26px;
     position:absolute;
     top:92px;
     z-index:10;
     text-transform:uppercase;
     color:#000;
     font-weight:bolder;
     margin:0 3%;
     text-align:center;
     font-size:20px;
}
 .thirdballstep1 .logosecondplace{
     width:44px;
     height:44px;
     position:absolute;
     background:url(../images/logosmallicon.png) no-repeat 50% 50%;
     left:79px;
     top:140px;
     z-index:10;
	 -webkit-border-radius: 10px;    
	-moz-border-radius: 10px;    
	-o-border-radius: 10px;    
	-ms-border-radius: 10px;    
	border-radius: 10px;
     background-size: 100% auto !important;
}
 #custom_text{
    border:1px solid #ccc;
     height:22px;
     padding:5px;
     background:#fff;
     max-width:138px;
     color:#000;
     text-transform:uppercase;
}
 .fourthballstep1 {
     background:url(../images/logo-first-step.png) no-repeat 53% 47%;
     height:202px;
     width:202px;
     margin:14px 9.3px 0 0;
     float:right;
}
 .pieceStripesFront, .pieceStripesBack {
     float:left;
     position:relative;
     height:214px;
     width:214px;
     top:-428px;
}
 .pieceStripesFront {
     background-image:url(../images/front/pieceStripes/darkblue.png);
}
 .pieceStripesBack {
     background-image:url(../images/back/pieceStripes/darkblue.png);
}
 .pieceBordersFront, .pieceBordersBack {
     float:left;
     position:relative;
     height:214px;
     width:214px;
     top:-642px;
}
 .pieceBordersFront {
     background-image:url(../images/front/pieceBorders/black.png);
}
 .pieceBordersBack {
     background-image:url(../images/back/pieceBorders/black.png);
}
 #customImageBack {
     background-image:url('../images/back/base.png');
     background-repeat:no-repeat;
     width:214px;
     height:214px;
     overflow:hidden;
     float:left;
}
 .customNav {
     cursor:pointer;
     clear:both;
     height:30px;
     top:20px;
     margin:0 0 30px 0;
     position:relative;
     text-align:center;
     border:1px solid #ddd;
     background:#f3f3f3;
     padding:15px 15px;
}
 .customNext, .customPrev {
     display:inline-block;
}
 .customPrev {
     margin-right:20px;
}
 #customenquriydetails {
     background-color:#f1f2f2;
     border:1px solid #e7e8e9;
     width:618px;
     padding:5px 10px;
     margin-bottom:20px;
}
 #imageuploadbox {
     background:#f1f1f2;
     border:1px solid #e5e5e6;
     margin:25px 12px 0 0;
     text-align:center;
     width:150px;
     padding:10px 8px 10px 8px;
     float:left;
}
 .fileinputs {
     position: relative;
     margin:0 auto;
     width:101px;
     cursor:pointer;
}
 div.fakefile {
     position: absolute;
     top: 0px;
     left: 0px;
     z-index: 1;
}
 input.file {
     position: relative;
     text-align: right;
     -moz-opacity:0 ;
     filter:alpha(opacity: 0);
     opacity: 0;
     z-index: 2;
     width:101px;
}
 .customLogoBox {
     width:70px;
     height:50px;
     position:relative;
     background-image:url('../images/logohold.png');
     background-repeat:no-repeat;
     background-position:center center;
     margin-top:23px;
     margin-left:71px;
}
 .firstLogo {
     background-image:none;
}
 #customQuotePurchase {
     width:620px;
     margin-bottom:40px;
     padding:10px;
}
 .headingfirst {
     color:#58595b;
     font-weight:bolder;
     font-size:16px;
     width:620px;
     border-bottom:1px solid #d5d7d7;
     margin-bottom:6px;
     padding-bottom:2px;
}
 .headingsecond{
     margin-bottom:10px;
     padding-bottom:5px;
}
 .headingsecond a{
     color:#F7931D;
     text-decoration:none;
}
 .yelloheading{
     color:#F7931D;
     font-weight:bolder;
     font-size:12px;
     width:620px;
     border-bottom:1px solid #d5d7d7;
     margin-bottom:10px;
     padding-bottom:5px;
     text-align:center;
}
 .headingfirstprint{
     clear:both;
     color:#58595b;
     font-weight:bolder;
     font-size:16px;
     width:700px;
     border-bottom:1px solid #d5d7d7;
     margin-bottom:15px;
     padding-bottom:5px;
}
 #quoteError {
     color:#F00;
     float:right;
}
 #customContactInfo label {
     margin-right:5px;
     display:block;
     float:left;
     width:155px;
     font-weight:bold;
     margin-bottom:5px;
}
 #customContactInfo .chkemail{
     margin-right:5px;
     display:block;
     float:none;
     width:100%;
     font-weight:normal;
     margin-bottom:5px;
}
 #customContactInfo textarea {
     width:205px;
     width:205px;
     padding:3px;
     line-height:20px;
     margin-bottom:5px;
     background:url(../images/textarea-bg.png) no-repeat top left;
     border:none;
     height:67px;
}
 #customContactInfo input {
     width:205px;
     padding:0 3px;
     line-height:20px;
     margin-bottom:5px;
     background:url(../images/textbox-bg.png) no-repeat top left;
     border:none;
     height:20px;
}
 #customContactInfo input.chekbox {
     width:20px;
     padding:0 3px;
     line-height:20px;
     margin-bottom:5px;
     background:url(../images/textbox-bg.png) no-repeat top left;
     border:none;
     height:20px;
}
 .rws-cleardiv{
     width:100%;
     clear:both;
}
 #termscheck {
     float:left;
     margin-right:10px;
     width:auto !important;
}
 .dotted {
     width:373px;
     border-top:1px solid #d3d5d6;
     height:1px;
     margin:10px 0;
}
 .dottedprint {
     border-top:1px solid #d3d5d6;
     margin:4px 0 10px 0;
     clear:left;
}
 .smalltext {
     font-size:10px;
     color:#666;
}
 .errormsg {
     color:#f7941e;
     margin-left:5px;
     display:none;
     font-weight:bold;
}
 .dropdown {
     -webkit-border-radius: 3px;
    /* Saf3-4, iOS 1-3.2, Android <1.6 */
     -moz-border-radius: 3px;
    /* FF1-3.6 */
     border-radius: 3px;
    /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */
    /* useful if you don't want a bg color from leaking outside the border: */
     -moz-background-clip: padding;
     -webkit-background-clip: padding-box;
     background-clip: padding-box;
     border:1px solid #4d4d4d;
     margin-right:8px;
     background:#d9d9d9 url(../images/dropdown.png) repeat-x top left;
}
 .addButton {
     float:right;
     background:url(../images/add-button.png) no-repeat 0 top;
     width:33px;
     height:22px;
     text-align:center;
     color:#FFF;
     cursor:pointer;
     display:block;
     border:none;
     font-size:0;
     line-height:0;
     text-indent:-9999px;
}
 #purchaseTable, #priceTable {
     width:100%;
     margin-bottom:30px;
     font-weight:bold;
}
 th {
     color:#105286;
     font-weight:bolder;
     border-bottom:1px solid #d5d6d8;
}
 td {
     text-align:center;
}
 .total {
     color:#105286;
     font-weight:bolder;
}
 .tableFoot {
     border-top:1px solid #d5d6d8;
}
 .priceColumn {
     border-bottom:1px solid #d5d6d8;
}
 #submitButton {
     clear:left;
     font-size:18px;
     font-weight:bolder;
     width:119px;
     height:30px;
     float:none;
     margin:14px 0 0 98px;
     cursor:pointer;
     background:url(../images/submit-btn.png) no-repeat 0 top;
}
 .bluefont {
     font-size:10px;
     cursor:pointer;
     color:#F7931D;
     margin-left:5px;
}
 #step1{
}
/* Step 2 Starts Here */
 #rws-imageright{
     width:500px;
     float:right;
     height:440px;
}
 .rws-firstdiv{
     width:500px;
     height:436px;
     background:url(../images/soccer-ball-shading.png) no-repeat left top;
}
 .rws-seconddiv{
     width:500px;
     height:436px;
     background:url(../images/soccer-ball-hexagons.png) no-repeat left top;
}
 .rws-thirddiv{
     width:500px;
     height:436px;
     background:url(../images/2018-soccer-balls-primary-royal-blue.png) no-repeat left top;
}
 .rws-fourthdiv{
     width:500px;
     height:436px;
     background:url(../images/2018-soccer-balls-secondary-orange.png) no-repeat left top;
}
 .emailus a{
     color:#FF0000;
     font-weight:bold;
     text-decoration:none;
}
 .emailus a:hover{
     text-decoration:underline;
}
 .redcolor{
    color:#FF0000;
}
 #globalquoteError {
    color:#FF0000;
     font-weight:bold;
}
/* -- print page submission */
 #printpageselecton{
}
 #printpagedata {
     clear:both;
     margin-bottom:40px;
     padding:10px;
}
 .gttextcolor{
    width:100%;
     clear:both;
     overflow:hidden;
     padding-top:5px;
}
 .sbutton{
     background: url("../images/submit-btn.png") no-repeat scroll 0 top rgba(0, 0, 0, 0);
     clear: left;
     cursor: pointer;
     float: none;
     font-size: 0px;
     font-weight: bolder;
     height: 30px;
     margin: 0;
     width: 119px;
     border:none;
}