Link to home
Start Free TrialLog in
Avatar of Nicholas_BlueStar
Nicholas_BlueStar

asked on

Need to "center" my form

I would like to center my form on this page (http://test.bluestarbussales.com/features_leftsidebar%20-%20Copy.html)

I am assuming it is a "simple" line of code I need to add (where and what I do not know)


Here is the code:

<div class="content_full_size">
                  <div class="h2_background">
                    <h2><span>Part Order Form</span></h2>
                    <div class="clr"></div>
                  </div>
                  <div class="clr"></div>
                  <div class="pic"> <div class="pic img_hover_box 1_ico"><a href="http://cdn.pimg.co/p/800x600/205927/fff/img.png" class="prettyPhoto" rel="prettyPhoto[id]"> <img src="images/part_order.png"/>
          	        
          	        </a>
          
      </div> 
                  </div>
                  <div class="separator_clear small"></div>
                  <form action="parts.php" method="post" id="contactform_main">
                                      <ol>
                                        <li>
                                          <input name="name" required class="text" id="name" placeholder="Name (required)"/>
                                        </li>
                                        <li>
                                          <input name="email" required class="text" id="email" placeholder="Email (required)"/>
                                        </li>
                                        <li>
                                          <input name="school" required class="text" id="school" placeholder="School / Business (required)"/>
                                        </li>
                                        <li>
                                          <input id="phone" name="phone" class="text" placeholder="Phone # (required)" required/>
                                        </li>
                                        <li>
                                          <input id="vin" name="vin" class="text" placeholder="Last 8 VIN / Body # (required)" required/>
                                        </li>
                                        <li>
                                          <input id="part" name="part" class="text" placeholder="Part # (optional)" />
                                        </li>
                                        <li>
                                          <input id="description" name="description" class="text" placeholder="Description of Part (required)" required/>
                                        </li>
                                        <li class="buttons">
                                          <input type="submit" name="imageField" value="submit" class="send" />
                                          <!--<input type="image" name="imageField" id="imageField" src="images/sub.png" class="send" />-->
                                          <div class="clr"></div>
                                        </li>
                                      </ol>
                                    </form>
                </div>

Open in new window

Avatar of COBOLdinosaur
COBOLdinosaur
Flag of Canada image

in your stylesheet give the form a specific width and margin:auto

That will center it in the parent tag.  If you want is centered in the page, then give the parent a width of 100%.



Cd&
Avatar of Nicholas_BlueStar
Nicholas_BlueStar

ASKER

you are talking about my style.css right?

How/where do I put in the width and margin:auto?

Here is my style.css

 

* { border:0; margin:0 auto; padding:0; outline:none; }
body { width:100%; margin:0; padding:0; font:normal 12px/150% "Liberation sans", Arial, Helvetica, sans-serif; background:#f6f6f6;}
.body_pattern { background:#f6f6f6; }

/* TEXT EDITOR */
p { line-height:150%; padding:5px 0; color:#a0a0a0; }
p.white { color:#fff;}
a { text-decoration:none; }

h1 {  color:#ffffff;}
h1 small { color:#c3c1c1; font-size:18px; text-transform:none;}

h2 { color:#000000; font-size:14px; padding:10px 0;   }
a.colbox { display: block;}
a h2 span { text-decoration:none; color:#fff; font-size:14px;text-transform: uppercase;}
a:hover h2 span { color:#fff; }

h2.op { color:#000000;  padding:0; margin-top:50px; width:940px; margin-bottom:10px;}
h2.op a{background:#fec223; padding:2px 6px; color:#000!important; text-decoration:none; float:right; font-size:12px!important;}
h2.op span {  color:#fec223;  padding:10px 10px 10px 0; margin:0;  }

h3 { font-size:12px; color:#ffffff;}
a h3 span { text-decoration:none; color:#000000; }
a:hover h3 span { color:#1d5682; }
h3 a {
    -webkit-transition:   0.3s ease;
-moz-transition:   0.3s ease;
-ms-transition:   0.3s ease;
-o-transition:   0.3s ease;
transition:   0.3s ease;
}
h3 a:hover{color:#317BB5!important;}

input, select, textarea { border: none;color:#404040; font-size:12px;  font-family:Arial, Verdana, Helvetica, sans-serif; }
input.required { width: 60%; float: left; border: none; height: 30px; background: #fff; }
input.button { background: #1d5682; color: #fff;  width: 37%; float: left; height: 30px; cursor: pointer; }
/* responsive image */
img {  }
@media \0screen {
	img { width: auto; /* for ie 8 */ }
}

/* IMG  */
a.pic {  position: relative; padding:0; margin:0;
-webkit-transition:   0.5s ease;
-moz-transition:   0.5s ease;
-ms-transition:   0.5s ease;
-o-transition:   0.5s ease;
transition:   0.5s ease;}
img.margin_right { margin:0 20px 0 0; }
a.pic img.h { position :absolute; padding:0; top:-1px; bottom:0; left:1px; visibility:hidden; }
a.pic:hover { filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70); 
-moz-opacity: 0.7; 
-khtml-opacity: 0.7; 
opacity: 0.7; }



a.pic h3 { margin:15px 0 5px 0;}

/* CONTENT */
.body_res { background:none; margin:0; padding:0; max-width:100%;  }
.bg_white{background:#fff;}
.brd{border-bottom:4px solid #87b165;}
.main_resise { margin:0 auto;  
              -webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box;    
	box-sizing: border-box;   
        
}


/* header */
.preheader { padding:0; margin:0 auto; color:#333333; position:relative; z-index:9999;  margin:0 auto;  
             width: 100%; background: url(../images/dot.png);}
        
.preheader.prefooterg {border-top: none;}
.header { padding:0; margin:0; color:#333333; position:relative; z-index:9999; }
.header_resise {background: #00477b; border-top: 3px solid #2a699a;border-bottom: 3px solid #2a699a; margin: 0 auto;}      
.nav_panel {  }

/* logo */
.logo {
	width: 375px;
	font-size: 30px;
	line-height: 100%;
	text-transform: none;
	font-weight: bold;
	float: left;
	margin-bottom: 5px;
	margin-left: 10px;
	margin-right: 0;
	margin-top: 5px;
}
.logo span {color: #b9c562!important; font-weight: bold!important;}
.logo a { color:#595959; text-decoration:none; font-weight: bold; }
/* RSS_blog */
.RSS_blog {  padding:0; float: left; margin-top: 15px;}
.RSS_blog a { text-align:right; display:inline;}
.RSS_blog img { margin:0 0px 0 3px; }
/* Widget text */
.header_right_text { line-height:13px; font-size:11px; display:block;}
.header_right_text span { display:block;}
/* img */
img.rss1 { background:url(../images/f1.png) no-repeat; width:32px; height:32px; 
-webkit-transition:   0.5s ease;
-moz-transition:   0.5s ease;
-ms-transition:   0.5s ease;
-o-transition:   0.5s ease;
transition:   0.5s ease;}
img.rss1:hover { background:url(../images/f1_a.png) no-repeat; width:32px; height:32px;}
img.rss2 { background:url(../images/f2.png) no-repeat; width:32px; height:32px;
-webkit-transition:   0.5s ease;
-moz-transition:   0.5s ease;
-ms-transition:   0.5s ease;
-o-transition:   0.5s ease;
transition:   0.5s ease;}
img.rss2:hover { background:url(../images/f2_a.png) no-repeat; width:32px; height:32px;}
img.rss3 { background:url(../images/f3.png) no-repeat; width:32px; height:32px;
-webkit-transition:   0.5s ease;
-moz-transition:   0.5s ease;
-ms-transition:   0.5s ease;
-o-transition:   0.5s ease;
transition:   0.5s ease;}
img.rss3:hover { background:url(../images/f3_a.png) no-repeat; width:32px; height:32px;}
img.rss4 { background:url(../images/f4.png) no-repeat; width:32px; height:32px;
-webkit-transition:   0.5s ease;
-moz-transition:   0.5s ease;
-ms-transition:   0.5s ease;
-o-transition:   0.5s ease;
transition:   0.5s ease;}
img.rss4:hover { background:url(../images/f4_a.png) no-repeat; width:32px; height:32px;}
img.rss5 { background:url(../images/f5.png) no-repeat; width:32px; height:32px;
-webkit-transition:   0.5s ease;
-moz-transition:   0.5s ease;
-ms-transition:   0.5s ease;
-o-transition:   0.5s ease;
transition:   0.5s ease;}
img.rss5:hover { background:url(../images/f5_a.png) no-repeat; width:32px; height:32px;}
img.rss6 { background:url(../images/f6.png) no-repeat; width:32px; height:32px;
-webkit-transition:   0.5s ease;
-moz-transition:   0.5s ease;
-ms-transition:   0.5s ease;
-o-transition:   0.5s ease;
transition:   0.5s ease;}
img.rss6:hover { background:url(../images/f6_a.png) no-repeat; width:32px; height:32px;}
img.rss7 { background:url(../images/f7.png) no-repeat; width:32px; height:32px;
-webkit-transition:   0.5s ease;
-moz-transition:   0.5s ease;
-ms-transition:   0.5s ease;
-o-transition:   0.5s ease;
transition:   0.5s ease;}
img.rss7:hover { background:url(../images/f7_a.png) no-repeat; width:32px; height:32px;}


/* content */
.content { margin:0 auto; width:100%; position:relative; margin-top:0px; z-index:999; background:#ffffff;}
.content1 { margin:0 auto; width:100%; position:relative; margin-top:0px; z-index:999;}
.sep{height:3px; background:url(../images/sep.png) center center no-repeat; margin:40px 0 -20px 0; opacity:0.5;}
/* content_text */
.content_text { font-size:18px;line-height:1.6em; padding:20px 0; margin:0 0px;  border-bottom: 3px solid #3ca0db;}
.content_text h1 { display:block; padding:0 10px; margin:0 2%; text-align:center; color: #3ca0db!important;}
.content_text span { display:block; padding:0 10px; margin:0 2%;}
.content_text small { font-size:14px; color:#a6a6a6; display:block; }
.content_text small span { display:inline; font-size:14px; color:#a6a6a6; margin:0; padding:0; }
.content_text img { float:right; margin:0; padding:0; height:50px; }
.content_text img.button_1 { background:url(../images/button_text_hover.png) no-repeat; }
.content_text img.button_1:hover { background:url(../images/button_text.png) no-repeat; }
/*social*/
/*img_hover_box_r_plus*/
.img_hover_box.pic { display: block; position: relative; }
.img_hover_box.pic .img_hover_overlay { position: absolute; top: 0; left: 0; visibility:hidden;  border:none; width:100%; height:100%; padding:0;
-webkit-transition:   0.5s ease;
-moz-transition:   0.5s ease;
-ms-transition:   0.5s ease;
-o-transition:   0.5s ease;
transition:   0.5s ease;}
.img_hover_box.pic:hover .img_hover_overlay { visibility:visible; }
.img_hover_box.pic .img_hover_overlay2 {background: #b9c562; position: absolute; top: 0; left: 0; visibility:hidden;  border:none; width:100%; height:100%; padding:0;
-webkit-transition:   0.5s ease;
-moz-transition:   0.5s ease;
-ms-transition:   0.5s ease;
-o-transition:   0.5s ease;
transition:   0.5s ease;}
.img_hover_box.pic:hover .img_hover_overlay2 { visibility:visible; background: #b9c562;}

.img_hover_box.pic .r_plus { position: absolute; bottom: 60px; left: 50%; visibility:hidden;  border:none;  margin:0;}
.img_hover_box.pic .r_plus:hover {opacity:1;}
.img_hover_box.pic:hover .r_plus { visibility:visible; }

.img_hover_box.pic .img_hover_overlay { background:url(../images/img_overlay.png) repeat;}
.img_hover_box.pic .img_hover_overlay2 { background:#b9c562 url(../images/img_overlay.png) repeat;}
.img_hover_box.pic .r_plus { background:url(../images/img_hover.png) no-repeat;}
.img_hover_box.pic .r_plus.pos_right { background:url(../images/img_hover_href.png) no-repeat;}

.img_hover_box.pic .r_plus {height:40px; width:40px; margin:-12px 0 0 -12px; }
.img_hover_box.pic .r_plus.pos_left {margin-left:-8px; }
.img_hover_box.pic .r_plus.pos_right {margin-left:2px; }

/*Slider*/
.sliderwrapper {height: 291px; width: 100%; margin: 0 auto;}
.now_slider {position:absolute; z-index:99; padding-top: 0px; margin-top: -105px; width: 100%;}
.home_text { max-width:100%;  margin-top:20px; text-align: center; text-transform: none!important;}
.home_text h1 { padding-bottom:10px;}
.home_text p {font-size: 12px;}
hr {margin-top: 20px; color: #e6e6e6; background: #e6e6e6; border-top: 1px solid #e6e6e6;}

.after_slder { background: url(../images/middlebg.png);}

/* BLOG PAGES */
.main_content {position: relative; width:940px; margin:0 auto; padding:0; max-width: 99%;}

/*now_page*/
.now_page{width:100%; background:url(../images/dot.png); -webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box;    
	box-sizing: border-box;      border-top: 10px solid #eaeaea;  border-bottom: 4px solid #eaeaea;}
.now_page_res {   margin:0 auto; text-align:center; color:#fff; font-size:12px; position:relative; z-index:100;  }
.now_page_res h1{padding: 20px 0 0px 0; text-transform: uppercase; font-weight: lighter; }
.now_page_res h1 span {color:#00477b!important;}
.now_page_res p {padding-bottom: 30px; color: #c2c2c2;}
.now_page_res .social{ background:#87b165; min-height:50px;  text-align:right; padding-top:25px;}
.now_page_res .tit{color:#fffffe; font-size:18px; font-weight:bold; font-style:normal; margin-bottom:10px;}
h2.title{background:url(../images/bar.png) center repeat-x;;  padding-left:0px; margin: 20px 55px 20px 0; }
h2.title span { display: inline-block; padding: 6px 20px 6px 0; color: #535353; background: #fff; font-weight: lighter;}
h2.title2{background:url(../images/bar.png) center repeat-x;;  padding-left:0px; margin: 20px 0px 20px 0; }
h2.title2 span { display: inline-block; padding: 6px 20px 6px 0; color: #535353; background: #fff;font-weight: lighter;}
/* left_side */
.side_full { width:97%; float:right; margin:2% 1.5%; }
.side_big { width:64%; float:right; margin:2% 0 2%  }
.side_small { width:30%; float:left; margin:2% 0 2%  }

.side_small .content { padding:0;}

/* ul li */
.side_small ul { list-style:none; margin:10px 0; padding:0; }
.side_small ul li { padding:5px 10px 5px 0px; margin:3px 0; font-size:11px; border-bottom:1px solid #f1f1f1; color:#333; }
.side_small ul li a { color:#15acf2; display:block; }
.side_small ul li a:hover { color:#414141; }


/* .right_side_big.l { float:left; } */
/* .right_side { padding:10px 18px; } */

/* coment */
.coment1 { overflow:hidden; margin:3% 0 0 1%; border-top:1px solid #c8c8c8; padding-top:20px; }
.coment2 { overflow:hidden; margin:3% 0 0 20%; border-top:1px solid #c8c8c8; padding-top:20px; }

/* center_colums  */
.columns { margin:0px auto 0 auto; padding:0; }
.columns.margin_board { margin:0 2%; width:96%;}
.colums_box { text-align:left; width:240px; margin:0 10px 0 0; padding:0; float:left; background:#ffffff;}
.colums_box a h2{ padding:0 0 0px 0px; padding-top: 15px; color: #fff;}
.colums_box.last { text-align:left; width:240px; margin:0 0 0 0; padding:0;}
.colums_box.project { text-align:left; width:219px; margin:20px 28px 0 0; padding:0; float:left; }
.colums_box.project:hover{border-bottom:1px solid #fec223;}
.colums_box.project.last { text-align:left; width:219px; margin:20px 0 0 0; padding:0; float:right; }


.colums_box.text_left { text-align:left; }
.colums_box.text_left h2, .colums_box.text_left p { }
.colums_box p.more_bg { padding:15px 0; border:1px solid #f0f0f0; border-top:0; background:#fcfcfc;}
.colums_box:hover p.more_bg  { background:#f0f0f0; }
.col4{width:25%; float:left;}
.col4:hover{}
.col4.last{ margin-right:0; float:right;}
.col4 .tit { padding:10.5% 2% 1% 2%;}
.col4 a h2.ico1{background:url(../images/ico1.png) center left no-repeat; padding-left:35px;}
.col4 a h2.ico2{background:url(../images/ico2.png) center left no-repeat; padding-left:35px;}
.col4 a h2.ico3{background:url(../images/ico3.png) center left no-repeat; padding-left:35px;}
.col4 a h2.ico4{background:url(../images/ico4.png) center left no-repeat; padding-left:35px;}
.col4 a h2:hover{color:#87b165!important;}
.col4 .col_text{padding:5px 20px 25px 10px; font-size:12px; line-height:22px;}
.col4 .col_text p{ color:#a9a9a9;}
.col2{float:left; width:49%; margin:0% 2% 2% 0; background:#fff; }
.col2.last{ margin:0% 0% 2% 0;}
.col2 .tit{border-bottom:1px solid #e6e6e6; padding:15px 20px 10px 20px;}
.col2 .col_text{padding:2.5% 2% 2% 2%;}
.col2 a h1{background:url(../images/tit_bg_big.png) center left no-repeat; padding-left:20px; text-transform:none;}
/*latest work*/
.l_w_item{float:left; width:45%; margin-right:10px;}
.l_w_item p {margin-bottom:20px; font-size:11px;}
.l_w_item h3 {font-weight:normal; margin-top:20px; margin-bottom:10px;}
.butt{background:#a8be0f; border-radius:2px; color:#fff!important; padding:4px 10px;}
h2 img { position:relative; top:0px; padding-right:0px;}
/*item_features*/
.feat_item{padding-left:70px;}
.feat_item p {line-height:22px;}
.item1{background:url(../images/service.png) center left no-repeat;}
.item2{background:url(../images/service2.png) center left no-repeat;}
.item3{background:url(../images/service3.png) center left no-repeat;}

/* colums_box */
.bluecap {background: #00477b; width: 100%; height: 50px; color: #fff;}
.colums_box.no_bg { border:none; text-align:center; width:23%; margin:0% 2.6% 0% 0;  float:left; }
.colums_box.no_bg.last {   margin:0% 0% 0% 0;  float:left;}
.colums_box.no_bg p { color:#747474; font-size:12px; margin-top: 90px;  padding-bottom: 15px;}
.colums_box.no_bg:hover p{color: #fff;}
.colums_box.no_bg:hover .bluecap {background: #2a699a;}
.colums_box.no_bg:hover a h2 span {color: #fff!important;}
.colums_box.no_bg img {
    margin-bottom: 20px;
    -webkit-transition:   0.5s ease;
-moz-transition:   0.5s ease;
-ms-transition:   0.5s ease;
-o-transition:   0.5s ease;
transition:   0.5s ease;}
.colums_box_1  { background: #fff url(../images/h1.png) 78px 65px no-repeat;}
.colums_box_1:hover  { background: #317bb5 url(../images/h1a.png) 78px 65px no-repeat;}
.colums_box_2 { background:  #fff url(../images/h2.png) 78px 65px no-repeat;}
.colums_box_2:hover { background: #317bb5 url(../images/h2a.png) 78px 65px no-repeat;}
.colums_box_3 { background: #fff url(../images/h3.png) 78px 65px no-repeat;}
.colums_box_3:hover { background: #317bb5 url(../images/h3a.png) 78px 65px no-repeat;}
.colums_box_4 { background: #fff url(../images/h4.png) 78px 65px no-repeat; }
.colums_box_4:hover { background:#317bb5 url(../images/h4a.png) 78px 65px no-repeat;}

/* content_blog */
.content_blog { padding:0; }
.content_blog ul { list-style:none; }
.content_blog li { background:url(../images/ul_li_body.png) left no-repeat; padding:2px 0 2px 15px; }
.content_blog li a { font-weight:bold; font-style:italic; color:#8f8f8f; font-size:11px; }
.content_blog li a:hover {color:#db7641;}

/* prefooter */
.prefooter {  padding:0; margin:0; max-width:100%;  margin-top:0px; background: #1d5682; border-top: 1px solid #d9d9d9;}
.prefooter_resise { margin:0 auto; padding: 40px 0;  
 -webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box;    
	box-sizing: border-box;  }
.prefooter h3 {padding:0px 0px 20px; margin-bottom:10px;  color: #fff!important; font-size: 18px!important; text-transform: uppercase; font-weight: lighter;}
.prefooter h3.log{font-size:30px!important;}
.prefooter h3.log span{color:#fec223;}
.prefooter p { color:#a9a9a9; font-size:12px; line-height:1.5em; padding:0px 0 5px; }
.prefooter p span{color:#afafaf; font-size:12px;}
.prefooter a { color:#25a9ff;  }
/* Flickr */
.widget_flickrRSS { }
.widget_flickrRSS img { border: 0; background:#484848; text-align: center; margin:0px 7px 7px 0; width:60px; height:60px; }
.widget_flickrRSS img.last { margin:7px 0; }
.widget_flickrRSS img:hover {  }
/* footer */
footer { color:#aecae0; font-size:11px;  text-align:left;; padding:20px 0; margin:0; background:#00477b; width: 100%; margin: 0 auto;}
footer a { color:#aecae0!important; text-decoration:none; }
/*-------------------------------------*/
/* search */
.selectnav {display: none;}
.search { margin:7px 0px 0px 0;  padding:0px 0 0 0; width:auto; height:30px;  margin-right: 0px;  width: 160px; margin-top: 7px; padding:5px 0px 5px 0;  float:right;}
.search form { padding:0; width:auto; }
.search label { padding:2px 10px 0 0;}
.search span { display:block;  padding:0;  background:url(../../images/search_bg.png) no-repeat left top; }
.search input.editbox_search {  -webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;padding:0px 0px 0px;  width:100%; height:30px; font-size:12px; line-height:16px; color:#b4b4b4; background: #fafafa url(../images/searchicon.png) right center no-repeat;  padding-left: 5px; box-sizing: border-box;  -moz-box-sizing: border-box;  -o-box-sizing: border-box; -webkit-box-sizing: border-box;}
.search input.button_search {  padding:0; border:none; float:left; }

a.fl { margin:10px 10px 10px 0; float:left; padding:0; }
/* img */
img.fgh { background:#3d3d3d; padding:4px; margin:0 3px 0 0; float:left; }
img.fgh:hover { background:#e05d1f; }

/*== Sitemap Page Template ==*/
.sitemap-page { line-height: 160%; }
.sitemap-page h4 { margin-bottom: 5px; font-weight: normal; }
.sitemap-page h3 { padding-bottom: 10px; margin-bottom: 15px; }
.sitemap-page ul { margin-bottom: 20px; }
.sitemap-page ul li { margin: 1px 2%; }
.sitemap-page ul li ul { margin: 1px 2%; }
.sitemap-page ul li a { color: #656464; }
/*== Timeline Page Template ==*/
#archives { padding: 10px 0 0; line-height: 160%; }
#archives a { font-style: normal; color: #656464; }
#archives .archives_list { border-left: 1px solid #e1e1e1; list-style: none; margin: 0 0 15px 15px; }
#archives .archives_list li { margin: 2px 0; clear: left; padding-left: 24px; font-size: 0.9em; font-style: normal; list-style: none; }
#archives .archives_list .date { color: #727272; width: 20%; font-style: normal; display: inline-block; vertical-align: top; }
#archives .archives_list .linked { width: 50%; display: inline-block; vertical-align: top; }
#archives .archives_list .comments { width: 20%; display: inline-block; vertical-align: top; }
#archives .archives_list .comments a { color: #7e7e7e; font-size: 0.9em; font-style: italic; text-decoration: underline; padding-left: 13px; }
#archives .archives_list .comments a:hover { text-decoration: none; }
h3.archive_year { font-weight: normal; font-size: 1.4em; color: #585858; margin-top: 0; padding: 0px; }
/*== Breadcrumb ==*/
.breadcrumbs { padding: 10px 0; width: 100%; overflow:hidden; font-size: 12px; }
.breadcrumbs a { font-size:12px; color:#ffffff;}

/*- Message -*/
.message div { margin:0 0 18px; }
.message input { padding:9px 15px; width:90%; border: 1px solid #ddd; color:#000; }
.message textarea { height:114px; overflow:auto; padding:9px 15px; width:90%; border: 1px solid #ddd; }
.message .submit { float:left; }
.message .submit input { background:#fff; width:128px; height:32px; font-weight:bold; color:#000; }
.message .btn { padding:0; width:auto; }
.message .notice { color:#a4a4a4; float:right; font-style:italic; padding:10px 0 0; }

/* contact-us */
.contact_us div { padding:3px 5px;}
.contact_us div input[type=text] { width:70%;}
.contact_us div textarea { width:95%; height:70px;}

/*- Post Comments -*/
.post-comments h2 { padding-top:10px; }
.post-comments .fl { width:80px; padding:0 10px 0 0; }
.post-comments .fr { width:100%; margin-right: 0; }
/* post-commets */
.post-commets { padding:2px 0 0 0; margin:5px 0 0 0; float:right; width:42px; height:28px; text-align:center; }
.post-commets a { color:#fff; font-size: 18px; text-decoration:none; }

/*- Box2 -*/
.box2 { background:#f9f9f9; border:1px solid #ddd; width: 480px; height:1%; margin:0 0 20px; padding:10px; min-height:100px; }
.box2.alt { background:#FFFFFF; }
.box2.alt { background:#FFFFFF; }
.comm-name, .comm-date { line-height:20px; font-size: 80%; }
/*=== Sub Columns ===*/
.cols { float:left; width:45%; }
.cols:first-child { padding:0 15px 0 0; }
.col ul li { border-bottom:1px solid #EAEAEA; clear:both; padding:8px 0 8px; }
.col.popular-posts li { border-bottom:none; padding:0px 0 0px; }
.col.popular-posts li { min-height:65px; }
.col ul li img { float:left; margin:0 10px 0 0; max-height:58px; max-width:58px; border:1px solid #EAEAEA; padding:4px; background:#fff; }
.col.widget_recent_entries { float:right; }
.col span { float:left; width:65%; }
.cols ul { list-style: none; }
.col ul li a:hover { text-decoration:underline; }

/* Global */
.clr { clear:both; height:0; margin:0 auto; padding:0;  overflow: hidden;}
.bg { clear: both; border-bottom:1px solid #f1f1f1; margin:20px 0; padding:0; height:1px; }
.left, .fl { float:left; }
.right { float:right;}
img.fl { float:left; margin:5px 15px 0 0; }

a.post{background:url(../images/arr_post.png) center left no-repeat; padding-left:10px; color:#a9a9a9!important;}
a.post span{padding-left:10px; color:#fec223;}

a.getstarted {font-size: 20px; color: #fff!important; padding: 10px 40px; background: #85af64; -webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px; margin: 20px 0; display: inline-block;}


.feelfree { float: left; color: #7d7d7d; font-size: 12px; margin-top: 22px; margin-bottom: 20px; text-transform: uppercase;}
.feelfree span {color: #b9c562;}



.content_full_size { width:100%;  padding-bottom: 40px;}

/*sub_page_blog*/
.post h3 { padding-top:15px; padding-bottom:0; margin-bottom:0; font-size:16px; font-weight:normal; color:#414141; }
.post h3 a,
.post h3 a:hover {  }

.post h2 {margin-bottom:0; }
.post h2 a{ font-weight:bold;}

.post .pic { margin:0 0 20px; }
.post_detail { color:#a4a4a4; font-style:normal; padding:0; font-size:11px; font-weight:normal; margin:5px 0 5px 0; }
.post_detail a { font-size:11px; color:#a4a4a4; font-weight:bold; font-style:normal; text-decoration:none; }
.post_detail a:hover { font-size:11px; color:#a4a4a4; text-decoration:none; }
.post_date {  color:#fff; font-style:normal; font-weight:normal; font-size:18px; float:left; text-align:center; padding:8px 15px; background:#e25e54; border-top:3px solid #353535; margin:0 20px 20px 0; display:none;}
.post_date span { color:#fff; font-style:normal; font-weight:normal; font-size:12px; display:block; margin-top:5px; padding:5px 3px 0; text-align:center; border-top:1px solid #fff; }


.post_detail a.read_more:hover { color:#e25e54; font-style:normal; font-weight:normal; }

/*coments*/
#coment { overflow:hidden; margin:10px 0; padding-bottom:10px; }
#coment img { float:left; margin-right:20px; }
#coment h3 { margin:0; padding:0; }
#coment .podpis {  margin:5px 0;  }
#coment .podpis a { margin-left:10px; }
#coment2 { overflow:hidden; margin:10px 0 00px 50px;  padding-bottom:10px; }
#coment2 img { float:left; margin-right:20px; }
#coment2 h3 { margin:0; padding:0; }
#coment2 .podpis {  margin:5px 0 0 0;  }
#coment2 .podpis a { margin-left:10px; }
#coment3 { overflow:hidden; margin:10px 0 00px 100px;  padding-bottom:10px; }
#coment3 img { float:left; margin-right:20px; }
#coment3 h3 { margin:0; padding:0; }
#coment3 .podpis {  margin:5px 0 0 0;  }
#coment3 .podpis a { margin-left:10px; }
#coment3 .lin { border-top:1px solid #c8c8c8; margin-top:20px; }

/*form Contact_us*/
#contactform_main { margin:0; padding:5px 0; }
#contactform_main * { color:#8b8b8e; }
#contactform_main ol { margin:0; padding:0; list-style:none; }
#contactform_main li { margin:0; padding:0; background:none; border:none; display:block; clear:both; }
#contactform_main li.buttons { margin:5px 0 5px 0; clear:both; }
#contactform_main label { margin:0; width:60px; padding:6px 0; text-transform:none; float:left; font-weight:normal; color:#8b8b8b; }
#contactform_main label .ness { color:#656566; }
#contactform_main label span { color:#8b8b8b; }
#contactform_main input.text { width:55%; border:1px solid #d3d3d3; margin:5px 0; padding:5px 2px; height:16px; background:#ffffff; float:left; font-size:12px; color:#8b8b8e; }
#contactform_main textarea { width:83%; border:1px solid #d3d3d3; margin:4px 0; padding:5px 2px; background:#ffffff; float:left; font-size:12px; color:#8b8b8e; }
#contactform_main li.buttons input {cursor: pointer; padding:2px 10px 4px 10px; margin:10px 0 0 60px; border:0; color:#FFF; float:left; background:#2A699A; font-size:14px; font-weight:bold; }


/*h3.h3_act_href*/
h3.h3_act_href { clear:both; width:100%; text-align:left; display:block; background:none; padding-left:0; height:15px; margin-bottom: 10px;}
h3.h3_act_href a span,
h3.h3_act_href a{ color:#313131; text-decoration:none; font-weight:bold; 
 -webkit-transition:   0.3s ease;
-moz-transition:   0.3s ease;
-ms-transition:   0.3s ease;
-o-transition:   0.3s ease;
transition:   0.3s ease;}
h3.h3_act_href a:hover span,
h3.h3_act_href a:hover em,
h3.h3_act_href a:hover{color:#317BB5; text-decoration:none;  }
h3.h3_act_href a.h3_href em {font-style:normal;}

h3.h3_act_href a.h3_href {padding:8px 0 12px 40px;}

h3.h3_act_href a.ico_1{background:url(../images/ico.png) no-repeat left top;
 -webkit-transition:   0.3s ease;
-moz-transition:   0.3s ease;
-ms-transition:   0.3s ease;
-o-transition:   0.3s ease;
transition:   0.3s ease;}
h3.h3_act_href a.ico_2{background:url(../images/ico-02.png) no-repeat left top;
 -webkit-transition:   0.3s ease;
-moz-transition:   0.3s ease;
-ms-transition:   0.3s ease;
-o-transition:   0.3s ease;
transition:   0.3s ease;}
h3.h3_act_href a.ico_3{background:url(../images/ico-03.png) no-repeat left top;
 -webkit-transition:   0.3s ease;
-moz-transition:   0.3s ease;
-ms-transition:   0.3s ease;
-o-transition:   0.3s ease;
transition:   0.3s ease;}
h3.h3_act_href a.ico_4{background:url(../images/ico-04.png) no-repeat left top;
 -webkit-transition:   0.3s ease;
-moz-transition:   0.3s ease;
-ms-transition:   0.3s ease;
-o-transition:   0.3s ease;
transition:   0.3s ease;}
h3.h3_act_href a.ico_1:hover{background:url(../images/ico_a.png) no-repeat left top; color:#19aae3;}
h3.h3_act_href a.ico_2:hover{background:url(../images/ico_a-02.png) no-repeat left top; color:#19aae3;}
h3.h3_act_href a.ico_3:hover{background:url(../images/ico_a-03.png) no-repeat left top;color:#19aae3;}
h3.h3_act_href a.ico_4:hover{background:url(../images/ico_a-04.png) no-repeat left top;color:#19aae3;}

.cols2 {margin-top: 20px;}


h3.blogpost a {font-size: 16px!important; }

h3.blogpost span {margin-top: 5px; display: block; color: #009ceb;}

.bar {width: 100%; background: url(../images/bar.png) repeat-x; height: 10px;}

.fleft50 {
    float: left;
    width: 49%;
}
.fright50 {
    float: right;
    width: 49%;
}

p.date {
    font-size: 10px!important; 
    color: #a9a9a9;
    border-bottom: 1px solid #e9e9e9;
    padding: 0 0 5px 0!important;
}


a.readmore {
    color: #78b312!important;
    text-decoration: none;
    font-size: 12px;
    padding-bottom: 10px;
}

a.readmore:hover {
    color: #78b312!important;
    text-decoration: underline;
    font-size: 12px;
    margin-bottom: 10px!important;
}

p.test {
    display: block;
    background: url(../images/test.png) no-repeat;
    font-size: 12px;
    color: #d1d1d1;
    padding: 30px 20px 30px 60px;
    font-style: italic;
     -webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box;    
	box-sizing: border-box;  
        width: 460px;
        height: 130px;
}

.picfloat {float: left;}
.namefloat {margin-left: 10px; float: left;}
.name {font-weight: bold; color: #484848!important;}

/* footer box */
.prefooter_box:after { clear: both; content: ""; display: block; }
.prefooter_box { width: 100%; margin:0 0 0 0; }
.prefooter_box > div { float: left; vertical-align: top; }
.prefooter_box > div:first-child, .prefooter_box > article:first-child { margin-left: 0; }
.prefooter_box > div:last-child, .prefooter_box > article:last-child { margin-right: 0; }
.pref_box { width:32%; float:left; margin:0 1.3333% 3% 0; padding:0; }
.pref_box.about{margin-right:90px;}
.pref_box.contact{width:150px;}
.pref_box p{color:#aecae0; font-size:12px; }
.pref_box a{color:#5d5d5c!important; text-decoration:underline;}
.pref_box p.bold{font-weight:bold;}
.pref_box .tit {margin-bottom:20px; color:#fff; font-size:18px; margin-top: 30px;}
.pref_box.last {  float:left; margin:0 0 3% 0; padding:0; }
.Flickr { width:20%;  margin:3% 5.3333% 3% 0;}

.menudiv {
    width: 100%;
    border: 1px solid #eaeaea;
    border-left: none;
    border-right: none;
}


/*4cols_gallery*/
.cols44{overflow:visible!important;}
.col44 { width:245px; float:left; padding:0; margin-right:0px; position:relative;  top:0; }
.col44 h3 { position:relative; bottom:0px; margin-bottom:0px;}
.col44 a img { margin-top:0px;}
.col44.last { float:right; margin:0; margin-right:0px;}
.col44.invisible-box { display: none; opacity: 0;  z-index: 1;}
.mask {
    left:0px;
	top:0px;
	background: #b9c562;
		-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear;
	-o-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear;
	transition: all 0.2s linear;
	-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
	width:100%;
	height:100%;
	-moz-transform:scale(1);
	-webkit-transform:scale(1);
	-o-transform:scale(1);
	-ms-transform:scale(1);
	transform:scale(1);
	z-index:999;
	position:absolute;
		
	padding:0px;
}
.mask span{
    display: block;
	color:#ffffff;
	font-size:14px;
	font-weight:bold;
	text-transform:uppercase;
	position: relative;
         text-align: left;
         left: 5%;
         bottom: -140px;
        
}
.mask p{
     display: inline-block;
	color:#fff!important;
	font-size:12px;
	padding-top:0px;
	line-height:20px;
        
        
        position: relative;
         text-align: left;
         left: 5%;
         bottom: -125px;
}
a.info {
	display: block;
	text-decoration: none;
	background: url(../images/ico_link.png) no-repeat;
	position:absolute;
        
	bottom:70px;
	left:5%!important;
	width:30px!important;
	height:30px!important;
	opacity:0.8;
	overflow:hidden;
}
a.info:hover{
	opacity:1;
}
a.link {
	display: block;
	text-decoration: none;
	background: url(../../images/ico_full.png) no-repeat;
	position:absolute;
	bottom:41px;
	left:41%!important;
	width:19px!important;
	height:16px!important;
	opacity:0.8;
}
a.link:hover{
	opacity:1;
}
.pic.img_hover_box:hover{
	cursor:pointer;
}
.pic.img_hover_box:hover .mask {
	-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}

img.bb {border-bottom: 3px solid #b9c562;}

.somebg {
    width: 100%;
    background: url(../images/dot.png);
    padding: 5px 0 40px;
}

.hrenover {
    background: #fff;
    padding: 10px 0;
    margin-top: -5px;
}

.hrenover:hover {
    background: #00477b;
}

.hrenover:hover h3 a {
    color: #fff!important;
}

.hrenover:hover p {
    color: #fff!important;
}


/* prefooter */
.prefooter { padding:0px 0; margin:0 auto; }
.prefooter h2 { font-size:14px; color:#fff; padding:15px 0; margin:0; }
.prefooter p { color:#fff; font-size:12px; line-height:1.5em; padding:5px 0; }
.prefooter a { color:#c1c1c1; font-style:italic; }
.pref_blog { width:23%; float:left; margin:0px 15px 5px 0; padding:0; }
.pref_blog.last { margin:0px 0 5px 0; }
a.fl { margin:10px 10px 40px 0; float:left; padding:0; }


#mailform-subscribe {
	color: #fff;
	padding: 20px 15px;
	text-shadow: 1px 1px #111;
}
#mailform-subscribe input {
	font-size: 13px;
	margin-bottom: 10px;

	border-radius: 6px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border:1px solid #cccccc;
}
#mailform-subscribe input.email {
	background: #fff url(../images/mailform-subscribe.png) no-repeat 10px center;
	padding-left: 32px
}
#mailform-subscribe input[type="submit"] {
	width: 73px;
	margin:0px 0 0 0px;
	background-color: #1D5682;
	border-bottom: 1px solid rgba(0,0,0,0.25);
	border-radius: 0px;
	box-shadow: 0 1px 1px rgba(0,0,0,0.2);
	color: #ffffff!important;
	cursor: pointer;
	display: inline-block;
	moz-border-radius: 0px;
	moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
	padding: 5px 4px 5px 4px !important;
	position: relative;
	text-decoration: none;
	text-shadow: 1px 1px rgba(0, 0, 0, 0.1);
	webkit-border-radius: 0px;
	webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
	font-size: 11px;
	border-radius: 5px;
	font-weight: normal;
	line-height: 1;
        height: 30px;
}
#mailform-subscribe input[type="submit"]:hover {
	
	color: #fff;
}
#mailform-subscribe input[type="submit"]:active {
	top: 1px
}

.content_page {
    background: #fff;
}

.content_full_size { width:100%; }
/*centercol*/
.centercol { width:65%; float:left; padding:0; }
.centercol.last {float:right;}
/*sidebar*/
.sidebar {width:30%; float:left;  }
.sidebar.last { float:right; }


.p404 h2{ font-size:50px!important; color:#e25e54!important;  text-align:center; margin:0px auto 0; line-height:1.2em;  background:none;padding-top: 40px; }
.p404 h2 span{ font-size:22px;  color:#7D7D7D; text-align:center; margin:10px auto 0; line-height:1.2em; }
.p404 p,.p404 a{ font-size:24px; color:#B4B4B4; text-align:center; padding:40px 0 60px; line-height:1.2em; }
.p404 p span { font-size:24px; display:block; text-align:center; margin:20px auto; line-height:1.2em; }
.p404 h2,
.p404 .btn { margin-bottom:0; }
.p404 .content_box { margin-bottom:40px; }

.pic.fl { margin:5px 20px 10px 0; }
.pic.fr { margin:5px 0 20px 10px; }
.fl { float:left; }
.fr { float:right; }

.h2_background {position:relative; padding-top: 30px;}
.h2_background h2 { color: #515151!important; width:100%; margin:0px 0 20px 0; padding:0;}
.h2_background h2 span{ padding:10px 20px 10px 0; }

.img_hover_box.pic a img.h2 { position: absolute; top: 0; left: 0; visibility:hidden; background:rgba(0,0,0,0.5) url(../images/img_z.png) center center no-repeat; border:none; display:none; width:100%; height: 100%; }
.img_hover_box.pic a:hover img.h2 { visibility:visible; display:block; }

/*3cols*/
.cols3 { margin:0px auto 0; width:100%; padding:0; text-align:left; }
.col3 { width:30%; margin:0 35px 0 0; float:left; padding:0;  }
.col3 p { margin:0; padding:0; }
.col3.last { float:right; margin-right:0; }

.tangodiv {float: left;margin-left: 28px;}

/*4cols*/
.cols4p { margin:0 auto; width:100%; padding:0; text-align:left; }
.col4p { width:24%; margin:0 12px 0 0; float:left; padding:0;  }
.col4p.last { float:left; margin-right:0; }
.cols4p.bg {background:url(../images/cols4_bg.png) repeat-y top left; padding:10px 0;}
.center_side { margin-top:20px; padding-top:20px; background:url(../images/border.png) repeat-x left bottom; padding-bottom:40px;}
.center_side h2 { display:block; float:left; }

.margin {padding-top: 20px;}

.pluginConnectTextDark {color: #fff!important;}
.nav_panel .tinynav { display:none; }
.slidertop { margin-top: -113px; }
.slidertop1 { margin-top: -119px; }
.sliderwraperheight { height: 500px; }
#slider-wrapper object { width: 100%; }
.pic img { max-width: 100%; height: auto; }
 /* special */
.right { float: right; }
.container #coment img { width: auto; }
.container #coment2 img { width: auto; }
.container #coment3 img { width: auto; }
.two { display: none; }
.content_resize.adder .col2.last { float: right; }
.change img {
	width: 227;
	height: auto;
}
.change h1 { color: #fff!important; text-align: left; }
.change.some h1 span { display: inline; color: #fff;}
.change.some h3 { color: #fff!important; }
.change.some h2 { margin-top: 3px!important; text-align: center!important; font-size: 20px!important; line-height: 30px!important; font-weight: bold!important; color: #fff!important; }
.change.some h1 {
	margin-top: 3px!important;
	text-align: center!important;
	font-size: 30px!important;
	line-height: 30px!important;
	font-weight: bold!important;
	color: #fff!important;
}
.change.some .col2 { width: auto; float: none; }
.change.some .col3 { width: auto; float: none; }
.change.some .col4 { width: auto; float: none; }
.change.some .header_row_2 h2 { color: #474747!important; }
.change.some  h1.left { text-align: left!important; }
.product img { width: 100%; height: auto; }
.code { padding: 0 12px; width: auto; }
.code h1 { padding: 20px 0 10px 20px; text-align: left; font-size: 24px; color: #fff!important; font-weight: bold; }
.code h3 { font-weight: bold!important; }
.code img { width: 100%; height: auto; }
#ticker1 .tweet_list.tweet_even, #ticker1 .tweet_list, #ticker1 .tweet_list .tweet_even { background: none; color: #fff; }
.column_2 .col2 { background: none; }
.dc_pricingtable05 ul.borderright, .dc_pricingtable05 ul.borderleft, .dc_pricingtable05 ul.borderleft, .dc_pricingtable05 ul.borderleft, .dc_pricingtable06 ul.borderright, .dc_pricingtable06 ul.borderleft { list-style: none; }

Open in new window

ASKER CERTIFIED SOLUTION
Avatar of Chris Stanyon
Chris Stanyon
Flag of United Kingdom of Great Britain and Northern Ireland image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
@Nicholas_BlueStar - there's really no need to paste your entire CSS file - we can see it on your site :)
haha shoot, sorry!

Im a novice at this stuff for sure.

After your help I have decided to just change 55% to 90% to make it look better within the page.

Thanks for all the help!