Betclever
Well-known member
Hello all,
May I ask someone to help me to responsive a code please cause I have tried everything to customize this one but problems appears on the webpage on mobile version and on larger screen like the mine (27") but no problem on normal screen like 15" or 17"...
This is the CSS code:
Thanks a lot for your help.
May I ask someone to help me to responsive a code please cause I have tried everything to customize this one but problems appears on the webpage on mobile version and on larger screen like the mine (27") but no problem on normal screen like 15" or 17"...
This is the CSS code:
Code:
inner-page {
background-color: #ffffff;
}
.inner-page .review-area {
background-color: #fff;
padding: 5px 0 7px;
}
.inner-page .page-heading {
background-color: #555;
border-bottom: 15px solid white;
height: 45px;
}
.inner-page .page-heading h2 {
color: #fff;
font-size: 15px;
line-height: 45px;
padding: 0 0 0 15px;
text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.4);
}
.help-box {
background-color: #fff;
}
.help-box .help-content {
padding: 15px;
width: 680px;
}
.help-box .help-content p {
color: #555;
font-size: 13px;
line-height: 1.2;
margin: 0 0 10px;
text-align: justify;
}
.bookmaker-heading {
background-image url('http://www.bet-clever.com/styles/images/favbetbanniere.png');
border-radius: 3px;
height: 70px;
margin: 0 15px 15px;
width: auto;
}
.bookmaker-heading.betfair {
background-position: 0 -280px;
}
.bookmaker-heading a {
display: block;
height: 60px;
margin: 5px;
outline: medium none;
text-indent: -9999px;
width: 275px;
}
#overview-box {
background: #313131 url("") no-repeat scroll left bottom;
height: 340px;;
margin: 0 0 20px;
padding: 8px;
width: 100%;
}
#overview-box .overview-content {
background-color: transparent;
background-image: none;
float: left;
height: 305px;
margin: 0 0 0 17px;
width: 575px;
}
.overview-content h3 {
color: white !important;
font-family: Verdana,Verdana,sans-serif;
font-size: 13px;
font-weight: bold;
margin: 0 0 6px;
text-shadow: 0 0 10px #c0c8d2;
}
.overview-content h3.overall {
color: #e45203;
font-family: Verdana,Verdana,sans-serif;
font-size: 14px;
font-weight: bold;
margin: 0 0 6px;
text-shadow: 0 0 10px #febf9c;
}
.overview-content p {
color: #4b4b4b;
font-family: Tahoma,Verdana,Arial,sans-serif;
font-size: 13px;
font-weight: normal;
margin: 0 0 7px;
text-align: justify;
}
#overview-box .overview-content .divider {
background-color: #565656;
box-shadow: 0 0 10px #c0c8d2;
height: 1px;
width: 100%;
}
#overview-box .overview-content .divider-overall {
background-color: #e45203;
box-shadow: 0 0 10px #febf9c;
height: 1px;
width: 100%;
}
#overview-box .overview-image {
background-color: transparent;
background-image: none;
float: right;
height: 305px;
margin: 4px 18px 0 0;
width: 320px;
}
#overview-box .overview-image .overview-bookmaker-screenshot {
background-color: transparent;
height: 240px;
margin: 0 0 7px;
width: 320px;
}
#overview-box .overview-image .overview-bookmaker-screenshot:hover {
}
#overview-box .overview-image .overview-bookmaker-screenshot a {
display: block;
height: 325px;
margin: -78px 0 0 30px;
outline: medium none;
position: absolute;
text-indent: -9999px;
width: 290px;
z-index: 500;
}
#overview-box .overview-image .overview-bookmaker-screenshot a:hover {
}
.overview-image .overview-bookmaker-screenshot.iasbet a {
background-image: url("http://www.odds.com.au/images/screenshots/iasbet-screen.png");
}
.overview-image .overview-bookmaker-screenshot.luxbet a {
background-image: url("http://www.odds.com.au/images/screenshots/luxbet-screen.png");
}
.overview-image .overview-bookmaker-screenshot.centrebet a {
background-image: url("http://www.odds.com.au/images/screenshots/centrebet-screen.png");
}
.overview-image .overview-bookmaker-screenshot.sportingbet a {
background-image: url("http://www.odds.com.au/images/screenshots/sportingbet-screen.png");
}
.overview-image .overview-bookmaker-screenshot.sportsbet a {
background-image: url("http://www.odds.com.au/images/screenshots/sportsbet-screen.png");
}
.overview-image .overview-bookmaker-screenshot.betfair a {
background-image: url("http://www.odds.com.au/images/screenshots/betfair-screen.png");
}
.overview-image .overview-bookmaker-screenshot.unitab a {
background-image: url("http://www.odds.com.au/images/screenshots/unitab-screen.png");
}
#overview-box .betnow-container, #full-review-box .betnow-container {
border: 1px solid #555;
border-radius: 4px;
box-shadow: 2px 2px 6px #ccc;
height: 55px;
margin: 0 auto;
width: 320px;
}
#overview-box a.betnow-large, #full-review-box a.betnow-large {
background: #f88e12 url("http://www.odds.com.au/images/striped-bg-sprite.gif") repeat-x scroll 0 -1200px;
border-color: orange;
border-radius: 3px;
border-style: solid;
border-width: 1px;
color: white;
display: block;
font-size: 27px;
height: 53px;
line-height: 53px;
margin: 0 auto;
text-align: center;
text-decoration: none;
text-shadow: 0 0 6px rgba(0, 0, 0, 0.4);
width: 318px;
}
#overview-box a.betnow-large:hover, #full-review-box a.betnow-large:hover {
background: #ff0000 url("http://www.odds.com.au/images/striped-bg-sprite.gif") repeat-x scroll 0 -1200px;
border-color: #ffc938 #b8690d #b8690d #ffc938;
}
#full-review-box-header {
background-image: url("http://www.odds.com.au/images/bookmaker-fullreview-header.jpg");
background-repeat: no-repeat;
height: 90px;
margin: 0;
text-indent: -9999px;
width: 807px;
}
#full-review-box {
background-repeat: no-repeat;
color: #555;
background-color: white;
font-size: 14px;
padding: 0 16px;
width: auto;
height: 975px;
margin-top: -20px;
}
#full-review-box hr {
clear: both;
color: #b3ccdc;
}
#full-review-box .left {
width: auto;
}
#full-review-box .right {
}
#full-review-box h3 {
}
#full-review-box h3.overall {
font-size: 18px;
margin: 0 0 10px;
}
#full-review-box h4 {
color: #406090;
margin: 0;
}
.review-summary-box {
background-color: #313131;
color: white;
border: 1px solid #ccc;
border-radius: 5px;
margin: 30px 0 10px;
padding: 15px;
}
.review-summary-box h3 {
float: left;
font-size: 22px;
font-weight: normal;
}
.review-summary-box h3 span {
color: white;
}
.review-summary-box h3::after {
content: " - ";
}
.review-summary-box .obrating-stars {
margin-left: auto;
width: auto;
}
.ob-review-data {
display: none;
}
.overview-content .opinion-box {
border-bottom: 1px solid #ddd;
height: 140px;
width: 575px;
}
#overview-box .opinion-heading {
color: white;
font-size: 15px;
letter-spacing: -1px;
text-shadow: none;
}
#overview-box .opinion-heading a {
color: white;
font-size: 15px;
letter-spacing: -1px;
text-decoration: none;
text-shadow: none;
}
#overview-box .opinion-heading a:hover {
text-decoration: underline;
}
#overview-box .opinion-box p {
color: white;
font-size: 14px;
line-height: 1.23;
}
.overview-content .sub-ratings-box {
height: 98px;
margin: 9px 0 0;
width: 575px;
}
.sub-ratings-box .sub-ratings-list {
list-style: outside none none;
margin: 0;
padding: 0;
}
.sub-ratings-list .sub-ratings-item {
color: white;
cursor: help;
float: left;
font-family: Tahoma,"Droid Sans",Verdana,sans-serif;
font-size: 11px;
font-weight: bold;
height: 80px;
margin: 0;
text-align: center;
width: 114px;
}
.sub-ratings-list .sub-ratings-item .name {
height: 30px;
width: auto;
}
.sub-ratings-list .sub-ratings-item:hover .name {
color: red;
}
.sub-ratings-list .sub-ratings-item .sub-ratings-link {
background-color: white;
background-image: url("http://www.odds.com.au/images/sub-rating-stars.jpg");
border: 1px solid #e5e5e5;
border-radius: 5px;
box-shadow: 0 0 10px #e5e5e5;
color: #aaa;
cursor: help;
display: block;
font-family: Verdana,Verdana,sans-serif;
font-size: 10px;
margin: 0 auto;
height: 15px;
outline: medium none;
padding: 33px 0 0;
text-decoration: none;
text-indent: -9999px;
width: 48px;
}
.sub-ratings-list .sub-ratings-item:hover .sub-ratings-link, .sub-ratings-list .sub-ratings-item .sub-ratings-link:hover {
border: 1px solid #d4d4d4;
box-shadow: 0 0 10px #d0d0d0;
}
.sub-ratings-item .sub-ratings-description {
background-color: #fff;
border: 1px solid #dedede;
border-radius: 4px;
display: none;
height: 43px;
padding: 8px 10px;
position: absolute;
width: 485px;
z-index: 650;
}
.one .sub-ratings-description {
margin: 18px 0 0 32px;
}
.two .sub-ratings-description {
margin: 18px 0 0 -82px;
}
.three .sub-ratings-description {
margin: 18px 0 0 -196px;
}
.four .sub-ratings-description {
margin: 18px 0 0 -310px;
}
.five .sub-ratings-description {
margin: 18px 0 0 -424px;
}
#sub-ratings-box .sub-ratings-item .sub-ratings-description p {
font-size: 12px;
line-height: 1.2;
}
.overview-content .obrating-box {
background-color: #f9fbfd;
border: 1px solid #dedede;
border-radius: 4px;
height: 59px;
margin: 0 0 0 32px;
position: relative;
width: 505px;
z-index: 600;
}
.obrating-box .obrating-title {
float: left;
height: 30px;
margin: 18px 0 0 55px;
position: relative;
width: 155px;
}
#obrating-box .obrating-title h3 {
background-image: url("http://www.odds.com.au/images/overall-rating-heading.jpg");
height: 30px;
text-indent: -9999px;
width: 155px;
}
.obrating-box .obrating-stars {
float: left;
margin: 16px 0 0 5px;
}
.obrating-stars {
height: 28px;
width: 150px;
}
.obrating-box .obrating-decimal {
color: black;
float: left;
font-family: Arial Narrow,Arial,Helvetica,sans-serif;
font-size: 15px;
font-weight: normal;
height: 28px;
letter-spacing: 0.01em;
margin: 20px 0 0 5px;
width: 38px;
}
.obrating-decimal span {
font-size: 15px;
color: black;
}
.fullreview-heading {
height: 40px;
}
.fullreview-heading .fullreview-title {
color: #235f84;
float: left;
font-size: 22px;
font-weight: normal;
height: 30px;
margin: 11px 15px 0 0;
}
.fullreview-heading .backtotop {
float: right;
height: 24px;
margin: 13px 10px 0 0;
width: 80px;
}
.fullreview-heading .backtotop a {
background-color: #f4f4f4;
border-color: #fff;
border-radius: 3px;
border-style: solid;
border-width: 1px;
color: #555;
display: block;
font-size: 10px;
height: 12px;
line-height: 12px;
padding: 5px;
text-align: center;
text-decoration: none;
text-transform: uppercase;
width: 68px;
}
.fullreview-heading .backtotop a:hover {
background-color: orange;
border-color: #fff;
color: #fff;
text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.25);
}
.ad-box-728-90 {
height: 106px;
margin: 30px auto 40px;
padding: 15px 0 0 23px;
width: 753px;
}
#boxTopReview .bookmakerBanner h2 {
margin: 0;
padding: 0;
position: absolute;
text-indent: -9999px;
}
#boxTopReview .bookmakerBanner .betnowSmall {
height: 55px;
margin: 14px 0 0 476px;
position: absolute;
width: 320px;
z-index: 20;
}
#boxTopReview .bookmakerBanner .betnowSmall a {
border: 0 none;
border-radius: 5px;
color: #cce5ff;
display: block;
font-family: Arial Narrow,Arial,Helvetica,sans-serif;
font-size: 28px;
font-style: italic;
font-weight: bold;
height: 55px;
line-height: 55px;
overflow: hidden;
text-align: center;
text-decoration: none;
text-shadow: 1px 1px 0 #1f57a7;
width: 320px;
}
#boxTopReview .bookmakerBanner .betnowSmall a span {
color: white;
}
#boxTopReview .bookmakerBanner .betnowSmall a:hover {
color: white;
text-shadow: 1px 1px 0 #b55009;
}
#full-review-box p {
line-height: 1.35;
margin: 6px 0 12px;
}
.fullreview-heading .fullreview-title-rating {
background-image: url("http://icons.iconarchive.com/icons/saki/nuoveXT/24/Actions-bookmark-icon.png");
background-position:0 0;
float: left;
margin: 8px 0 0;
height: 24px;
width: 24px;
}
.obrating-stars .star {
background-image: url("http://icons.iconarchive.com/icons/saki/nuoveXT/24/Actions-bookmark-icon.png");
background-position: 0 0;
float: left;
height: 24px;
width: 24px;
}
.bloc-reviews {
background-color: white;
background-image: url("");
border: 1px solid #e9e9e9;
clear: both;
padding: 10px;
height: 200px;
margin-bottom: 1px;
}
.bloc-reviews img {
float: left;
margin: 10px 20px 10px 0;
}
.bloc-reviews .bloc-description-note {
float: right;
width: 300px;
}
.bloc-reviews .bloc-description-note-txt {
color: black;
float: right;
font: 22px/37px arial;
margin-right: 5px;
}
.bloc-reviews .bloc-description-note .star-on {
background-image: url("http://icons.iconarchive.com/icons/saki/nuoveXT/24/Actions-bookmark-icon.png");
display: inline-block;
float: right;
height: 24px;
margin-left: 2px;
margin-top: 5px;
width: 24px;
}
.bloc-reviews em {
color: #be0007;
display: block;
font-family: Arial,Helvetica,sans-serif;
font-size: 17px;
font-weight: bold;
line-height: 30px;
margin-bottom: 10px;
}
.content-section .post-text .bloc-reviews h3 {
color: #003b68;
font-family: "FrutigerLT57CnBold",Arial,Helvetica,sans-serif;
font-size: 25px;
line-height: 32px;
margin-bottom: 10px;
}
.content-section .post-text p {
margin: 8px 0;
}
.bloc-reviews p {
margin: 0 0 5px;
color: black;
}
.blog-post {
font-size: 15px;
background-color: #313131;
color: white;
margin-left: 15px;
}
.bloc-reviews .bloc-button {
text-align: right;
}
.bloc-reviews a.reviewnow
{
background: #c3c3c3;
background: -moz-linear-gradient(top, #c3c3c3 20%, #7d7d7d 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(20%,#c3c3c3), color-stop(100%,#7d7d7d));
background: -webkit-linear-gradient(top, #c3c3c3 20%,#7d7d7d 100%);
background: -o-linear-gradient(top, #c3c3c3 20%,#7d7d7d 100%);
background: -ms-linear-gradient(top, #c3c3c3 20%,#7d7d7d 100%);
background: linear-gradient(to bottom, #c3c3c3 20%,#7d7d7d 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c3c3c3', endColorstr='#7d7d7d',GradientType=0 );
border: 1px solid #949494;
border-radius: 5px;
box-shadow: 0 1px 0 hsla(0, 100%, 100%, 0.3) inset, 0 0 2px hsla(0, 100%, 100%, 0.3) inset, 0 1px 2px hsla(0, 0%, 0%, 0.29);
color: #fff !important;
cursor: pointer;
display: inline-block;
font: bold 15px/27px sans-serif;
margin: 0;
padding: 5px 15px 3px;
text-align: center;
text-decoration: none !important;
text-shadow: 0 -1px 0 hsla(0, 0%, 0%, 0.3);
text-transform: uppercase;
}
.bloc-reviews a.betnow
{
background: #9e0107;
background: -moz-linear-gradient(top, #9e0107 20%, #be0007 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(20%,#9e0107), color-stop(100%,#be0007));
background: -webkit-linear-gradient(top, #9e0107 20%,#be0007 100%);
background: -o-linear-gradient(top, #9e0107 20%,#be0007 100%);
background: -ms-linear-gradient(top, #9e0107 20%,#be0007 100%);
background: linear-gradient(to bottom, #9e0107 20%,#be0007 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9e0107', endColorstr='#be0007',GradientType=0 );
border: 1px solid #9e0107;
border-radius: 5px;
box-shadow: 0 1px 0 hsla(0, 100%, 100%, 0.3) inset, 0 0 2px hsla(0, 100%, 100%, 0.3) inset, 0 1px 2px hsla(0, 0%, 0%, 0.29);
color: #fff !important;
cursor: pointer;
display: inline-block;
font: bold 15px/27px sans-serif;
margin: 0 0 0 15px;
padding: 5px 15px 3px;
text-align: center;
text-decoration: none !important;
text-shadow: 0 -1px 0 hsla(0, 0%, 0%, 0.3);
text-transform: uppercase;
}Thanks a lot for your help.
