Sujet Précédent Sujet Suivant

Probleme de taille d'un site

Fermé
Titou098 Messages postés 16 Date d'inscription jeudi 7 juillet 2016 Statut Membre Dernière intervention 28 juillet 2016 - 28 juil. 2016 à 12:22
 byron - 30 juil. 2016 à 18:34
Bonjour,

J'ai crée un site web avec un thème wordpress mais j'ai un problème de résolution d’écran lorsque j’accède au site sur un autre pc, le menu se décale.

J'ai essayé de résoudre le problème dans le style mais rien y fait.

Merci de m'aider

voici une copie du style.css 
/*
Theme Name: ColorMag
Theme URI: http://themegrill.com/themes/colormag/
Author: ThemeGrill
Author URI: http://themegrill.com
Description: ColorMag is a perfect responsive magazine style WordPress theme. Suitable for news, newspaper, magazine, publishing, business and any kind of sites. Get free support at http://themegrill.com/support-forum/ and check the demo at http://demo.themegrill.com/colormag/
Version: 1.1.4
License: GNU General Public License, version 3 (GPLv3)
License URI: http://www.gnu.org/licenses/gpl-3.0.txt
Tags: one-column, two-columns, right-sidebar, left-sidebar, flexible-header, custom-header, custom-background, custom-menu, custom-colors, sticky-post, threaded-comments, translation-ready, featured-images, theme-options, post-formats, footer-widgets, blog, e-commerce, news
Text Domain: colormag

Resetting and rebuilding styles have been helped along thanks to the fine work of
Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html
along with Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
and Blueprint http://www.blueprintcss.org/
*/

/* =Reset
-------------------------------------------------------------- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}
html {
	overflow-y: scroll; /* Keeps page centred in all browsers regardless of content height */
	-webkit-text-size-adjust: 100%; /* Prevents iOS text size adjust after orientation change, without disabling user zoom */
	-ms-text-size-adjust: 100%; /* www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
nav,
section {
	display: block;
}
ol, ul {
	list-style: none;
}
table { /* tables still need 'cellspacing="0"' in the markup */
	border-collapse: collapse;
	border-spacing: 0;
	margin: 0 0 1.5em;
	width: 100%;
}
th {
   font-weight: bold;
}
th, td {
   border: 1px solid #EAEAEA;
   padding: 6px 10px;
}
caption, th, td {
	text-align: left;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
a:focus {
	outline: thin dotted;
}
a:hover,
a:active { /* Improves readability when focused and also mouse hovered in all browsers people.opera.com/patrickl/experiments/keyboard/test */
	outline: 0;
}
a img {
	border: 0;
}
embed, iframe, object {
	max-width: 100%;
}
/* =GLOBAL
----------------------------------------------- */
body,
button,
input,
select,
textarea {
	color: #444444;
	font: 16px 'Open Sans', serif;
	line-height: 1.6;
	word-wrap: break-word;
}
body {
	background-color: #eaeaea;
}
/* Headings */
h1, h2, h3, h4, h5, h6 {
	padding-bottom: 18px;
	color: #333333;
	font-weight: normal;
	font-family: 'Open Sans', sans-serif;
}
h1 { font-size: 42px; line-height: 1.2; }
h2 { font-size: 38px; line-height: 1.2; }
h3 { font-size: 34px; line-height: 1.2; }
h4 { font-size: 30px; line-height: 1.2; }
h5 { font-size: 26px; line-height: 1.2; }
h6 { font-size: 22px; line-height: 1.2; }
hr {
	border-color: #EAEAEA;
	border-style: solid none none;
	border-width: 1px 0 0;
	height: 0;
	margin: 30px 0;
}

/* =TEXT ELEMENTS
----------------------------------------------- */
p {
	line-height: 1.6;
	margin-bottom: 15px;
	font-family: 'Open Sans', serif;
	font-size: 15px;
}
strong {
	font-weight: bold;
}
cite, em, i {
	font-style: italic;
}
pre {
	background-color: #fff;
	margin-bottom: 20px;
	overflow: auto;
	padding: 20px;
	border: 1px solid #EAEAEA;
}
pre, code, kbd, var, samp, tt {
	font-family:"Courier 10 Pitch",Courier,monospace;
	font-size: 14px;
	line-height: 1.4;
	white-space: pre-wrap;
}
abbr, acronym, dfn {
	border-bottom: 1px dotted #777777;
	cursor: help;
}
address {
	display: block;
	font-style: italic;
	margin: 0 0 15px;
}
ins {
	background: #F8F8F8;
}
table {
	margin: 0 0 1.5em;
	width: 100%;
}

/* =SUPERCRIPT AND SUBSCRIPT
----------------------------------------------- */
sup, sub {
	font-size: 10px;
	height: 0;
	line-height: 1;
	position: relative;
	vertical-align: baseline;
}
sup {
	bottom: 1ex;
}
sub {
	top: .5ex;
}
dl {
	margin-bottom: 24px;
	font-size: 20px;
}
dt {
	font-weight: bold;
	margin-bottom: 5px;
}
dd {
	margin-bottom: 24px;
}
ul,
ol {
	list-style: none;
}
ol {
	list-style: decimal;
}
li > ul,
li > ol {
	margin: 0 0 0 10px;
}

/* =BLOCKQUOTE
----------------------------------------------- */
blockquote {
	padding: 30px 30px 20px 45px;
	margin-bottom: 20px;
	background-color: #289dcc;
	color: #FFFFFF;
	border-radius: 5px;
}
blockquote p {
	font-size: 20px;
	font-family: 'Open Sans', serif;
	line-height: 1.4;
	position: relative;
	padding-top: 13px;
	padding-left: 40px;
}
blockquote p:before {
	content: "\f10d";
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-decoration: inherit;
	color: #FFFFFF;
	font-size: 60px;
	position: absolute;
	top: -27px;
	left: -27px;
}
blockquote em, blockquote i, blockquote cite {
	font-style: normal;
}
blockquote cite {
	font: 12px "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 300;
	letter-spacing: 0.05em;
	float: right;
}

/* =FORMS
----------------------------------------------- */
input, textarea {
 	-webkit-border-radius: 0px;
}
input[type="text"],
input[type="email"],
input[type="search"],
input[type="password"],
textarea {
	-moz-appearance: none !important;
	-webkit-appearance: none !important;
	appearance: none !important;
}
input[type="text"],
input[type="email"],
input[type="password"],
textarea {
	padding: 1%;
	border: 1px solid #EAEAEA;
	line-height: 20px;
	width: 95%;
	margin: 0 0 30px;
	background-color: #F8F8F8;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
input[type="password"]:focus,
textarea:focus {
	border: 1px solid #EAEAEA;
}
input.s {
	width: 60%;
	padding: 4px 54px 4px 10px;
	height: 36px;
	color: #777777;
	background-color: #FFFFFF;
	margin: 0;
	border: 1px solid #EAEAEA;
}
input.s:focus {
	padding-left: 10px;
	border-color: #EAEAEA;
	text-indent: 0;
}
.colormag-button,
input[type="reset"],
input[type="button"],
input[type="submit"],
button {
   margin-bottom: 30px;
   padding: 10px 20px;
	background-color: #289dcc;
	border: 0px;
	transition: background-color 0.3s linear 0s;
   -webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius:3px;
   font-size: 18px;
   -moz-appearance: none !important;
	-webkit-appearance: none !important;
	appearance: none !important;
	cursor: pointer;
	display:inline-block;
   color: #FFFFFF;
}
#search-form input[type="submit"] {
	border-radius: 0;
	margin-left: -8px;
	margin-bottom: 0;
	padding: 6px 10px 5px;
	font-size: 18px;
}
.colormag-button:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
button:hover {
	background-color: #33363B;
}
.previous a,
.next a {
   padding: 5px 0;
	cursor: pointer;
   font-size: 18px;
}
.previous a:hover,
.next a:hover {
	color: #289dcc;
	text-decoration: underline;
}
input[type="reset"]:active,
input[type="button"]:active,
input[type="submit"]:active {
	-webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3);
	box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3);
}

/* =LINKS
----------------------------------------------- */
a {
	color: #289dcc;
	text-decoration: none;
}
a:focus, a:active, a:hover {
	text-decoration: none;
}

/* =IMAGES
----------------------------------------------- */
figure {
	margin: 0;
	text-align: center;
}
img {
	max-width:100%;
	height:auto;
	vertical-align:top;
	margin-bottom: 18px;
}
.entry-content img, .comment-content img, .widget img {
	max-width: 100%; /* Fluid images for posts, comments, and widgets */
}
img[class*="align"],
img[class*="wp-image-"],
img[class*="attachment-"] {

}
img.size-full, img.size-large {
	max-width: 100%;
	height: auto;
}
.entry-content img.wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}
img.alignleft, img.alignright, img.aligncenter {
	margin-bottom: 1.625em;
}
p img {

}
img#wpstats {
 	display: none;
}

/* =CLEARFIX
----------------------------------------------- */
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}
.clearfix {
	display: inline-block;
}
* html .clearfix {
	height:1%;
}
.clearfix {
	display: block;
}

/* =ALIGNMENT
----------------------------------------------- */
.alignleft {
	display: inline;
	float: left;
	margin-right: 30px;
}
.alignright {
	display: inline;
	float: right;
	margin-left: 30px;
}
.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/*****************************************************************/

/* =BODY
----------------------------------------------- */
body {
	padding-top: 10px;
	padding-bottom: 10px;
	background-size: cover;
}
#page {
	max-width: 1550px;
	margin: 0 auto;
}
.wide {
	padding-top: 0;
	padding-bottom: 0;
}
.wide #page {
	max-width: 100%;
}
.inner-wrap {
	margin: 0 auto;
	max-width: 1550px;
}

/* =HEADER
----------------------------------------------- */
#masthead {
}
#header-meta {
	background-color: #ffffff;
}
#header-text-nav-container {
	background-color: #FFFFFF;
}
#header-text-nav-wrap {
	padding: 20px 0 25px;
}
#header-left-section {
	float: left;
}
#header-logo-image {
	float: left;
   padding-right: 20px;
}
#header-logo-image img {
	margin-bottom: 0;
}
#header-text {
	float: left;
	padding-right: 20px;
}
#site-title {
	padding-bottom: 0;
	line-height: 1.2;
}
#site-title a {
	color: #289dcc;
	font-size: 46px;
}
#site-description {
	line-height: 24px;
	font-size: 16px;
	color: #666666;
	padding-bottom: 0px;
	font-family: 'Open Sans', serif;
}
#header-right-section {
	float: right;
}
#header-right-section .widget {
	text-align: right;
	color: #333333;
}
#header-right-section .widget .widget-title {
	padding-bottom: 0;
	font-size: 18px;
	line-height: 1.2;
   padding-bottom: 5px;
}
.header-image {
	margin-bottom: 0;
	border-bottom: 1px solid #EAEAEA;
	width: 100%;
}

/* =HEADER INFO TEXT
----------------------------------------------- */
.small-info-text {
	float: left;
	max-width: 100%;
	padding-right: 15px;
	padding-top: 2px;
}
.small-info-text p {
	font-size: 12px;
	color: #555555;
	margin-bottom: 0;
}

/* =SOCIAL LINKS
----------------------------------------------- */
.fa {
	font-size: 22px;
	color: #CCCCCC;
}
.social-links {
	text-align: center;
   float: right;
}
.social-links ul li {
	display: inline;
}
#masthead .social-links i.fa {
   font-size: 23px;
   padding: 0 10px;
}
.social-links i.fa {
	padding: 5px 10px;
	text-align: center;
	transition: background-color 0.2s ease-out 0s;
	font-size: 25px;
}
.social-links i.fa:hover {
	color: #289dcc;
}
.social-links i.fa-twitter {color: #1BB2E9;}
.social-links i.fa-facebook {color: #3B5A9B;}
.social-links i.fa-youtube {color: #ED3F41;}
.social-links i.fa-vimeo-square {color: #44BBFF;}
.social-links i.fa-skype {color: #009CEF;}
.social-links i.fa-linkedin {color: #007BB6;}
.social-links i.fa-google-plus {color: #DC4937;}
.social-links i.fa-github {color: #4183C4;}
.social-links i.fa-flickr {color: #0062DD;}
.social-links i.fa-dribbble {color: #E24D87;}
.social-links i.fa-instagram {color: #3F729B;}
.social-links i.fa-pinterest {color: #D5282E;}
.social-links i.fa-stumbleupon {color: #EC4823;}
.social-links i.fa-tumblr {color: #455469;}
.social-links i.fa-wordpress {color: #21759B;}
.social-links i.fa-codepen {color: #CCCCCC;}
.social-links i.fa-digg {color: #14589E;}
.social-links i.fa-reddit {color: #FF4500;}

/* =SEARCH WIDGET
----------------------------------------------- */
#masthead .search-wrap input.s {
   width: 200px;
}
.fa.search-top {
   color: #ffffff;
   cursor: pointer;
   font-size: 21px;
   padding: 11px 12px;
   position: absolute;
   right: 44px;
   top: 0;
}
.fa.search-top:hover {
   background-color: #289dcc;
}
.search-wrap {
   position: relative;
}
.search-wrap button {
   border-radius: 0;
   color: #fff;
   line-height: 45px;
   margin-bottom: 0;
   padding: 0 15px;
   position: absolute;
   top: 0;
   right: 0;
}
.search-icon:before {
   content: "\f002";
   font-family: FontAwesome;
   font-style: normal;
   font-weight: normal;
   text-decoration: inherit;
   color: #ffffff;
   font-size: 18px;
}
.search-form-top {
   border: 1px solid #eaeaea;
   display: none;
   padding: 10px;
   position: absolute;
   right: 0;
   top: 44px;
   z-index: 9999;
   background-color: #ffffff;
}
.not-found .search-wrap button {
   right: 175px;
}
#secondary .search-wrap button {
   right: 26px;
}

/* =RANDOM POST
----------------------------------------------- */
.random-post {
   position: absolute;
   right: 0;
   top: 0;
}
.random-post .fa-random {
   color: #fff;
   font-size: 20px;
   vertical-align: middle;
}
.main-navigation .random-post a {
   padding: 10px 12px;
   border-bottom: none;
}

/* =NAVIGATION
----------------------------------------------- */
nav li > ul,
nav li > ol {
	margin: 0;
	list-style: none;
}
#site-navigation {
   box-shadow: 0 0 2px rgba(0, 0, 0, 0.1) inset;
   position: relative;
   background-color: #232323;
   border-top: 4px solid #289dcc;
}
#site-navigation .inner-wrap {
   position: relative;
}
.home-icon {
   float: left;
}
.home-icon .fa {
   color: #ffffff;
   font-size: 27px;
}
.home-icon.front_page_on {
   background-color: #289dcc;
}
.main-navigation .home-icon a {
   padding: 7px 10px 6px;
}
.main-small-navigation .home-icon a {
   padding: 7px 10px;
}
.main-navigation {
	width: 100%;
	text-align: center;
}
.main-navigation li {
	float: left;
	position: relative;
	font-family: 'Open Sans', serif;
	font-weight: 300;
}
.main-navigation a {
   color: #ffffff;
	display: block;
	float: none;
	font-size: 14px;
   font-weight: 600;
	padding: 10px 12px;
   text-transform: uppercase;
}
.main-navigation li.default-menu,
li.default-menu {
	display: none;
}
.main-navigation a:hover,
.main-navigation ul li.current-menu-item a,
.main-navigation ul li.current_page_ancestor a,
.main-navigation ul li.current-menu-ancestor a,
.main-navigation ul li.current_page_item a,
.main-navigation ul li:hover > a {
}
.main-navigation a:hover,
.main-navigation ul li.current-menu-item a,
.main-navigation ul li.current-menu-item a:after,
.main-navigation ul li.current_page_ancestor a,
.main-navigation ul li.current-menu-ancestor a,
.main-navigation ul li.current_page_item a,
.main-navigation ul li:hover > a,
.main-navigation li.menu-item-has-children:hover > a:after {
	color: #ffffff;
}
.main-navigation a:hover,
.main-navigation ul li.current-menu-item > a,
.main-navigation ul li.current_page_ancestor > a,
.main-navigation ul li.current-menu-ancestor > a,
.main-navigation ul li.current_page_item > a,
.main-navigation ul li:hover > a {
   background-color: #289dcc;
}
.main-navigation li.menu-item-has-children > a:after,
.main-navigation li li.menu-item-has-children > a:after,
.main-navigation li.page_item_has_children > a:after,
.main-navigation li li.page_item_has_children > a:after {
   font-family: FontAwesome;
   font-style: normal;
   font-weight: normal;
   text-decoration: inherit;
   color: #ffffff;
   font-size: 14px;
   padding-left: 6px;
}
.main-navigation li.menu-item-has-children > a:after,
.main-navigation li.page_item_has_children > a:after {
   content: "\f107";
   color: #ffffff;
}
.main-navigation li li.menu-item-has-children > a:after,
.main-navigation li li.page_item_has_children > a:after {
   content: "\f105";
   position: absolute;
   right: 8px;
}

/* =DROP DOWN
----------------------------------------------- */
.main-navigation .sub-menu,
.main-navigation .children {
   background-color: #232323;
}
.main-navigation ul li ul,
.main-navigation ul li:hover ul ul,
.main-navigation ul ul li:hover ul ul,
.main-navigation ul ul ul li:hover ul ul,
.main-navigation ul ul ul ul li:hover ul ul {
	display:none;
	z-index: 100;
}
.main-navigation ul li:hover ul,
.main-navigation ul ul li:hover ul,
.main-navigation ul ul ul li:hover ul,
.main-navigation ul ul ul ul li:hover ul,
.main-navigation ul ul ul ul ul li:hover ul {
	display:block;
}
.main-navigation ul li ul {
	position: absolute;
	width: 200px;
	top: 42px;
}
.main-navigation ul li ul li {
	float: none;
}
.main-navigation ul li ul li a {
   border-top: none;
}
.main-navigation ul li ul li a,
.main-navigation ul li.current-menu-item ul li a,
.main-navigation ul li ul li.current-menu-item a,
.main-navigation ul li.current_page_ancestor ul li a,
.main-navigation ul li.current-menu-ancestor ul li a,
.main-navigation ul li.current_page_item ul li a {
	float: none;
	font-size: 14px;
	height: 100%;
	padding: 10px 15px;
	color: #ffffff;
	width: 170px;
   text-align: left;
   text-transform: none;
}
.main-navigation ul li ul li a:hover,
.main-navigation ul li ul li:hover > a,
.main-navigation ul li.current-menu-item ul li a:hover {
   color: #FFFFFF;
   background-color: #289dcc;
}
.main-navigation ul li ul li ul {
	left: 200px;
	top: 0;
}
.main-navigation select {
	display: none;
}

/* =RESPONSIVE MENU
----------------------------------------------- */
.menu-toggle, .top-menu-toggle {
	display: none;
	cursor: pointer;
}
.site-header .menu-toggle {
	color: #ffffff;
	margin: 0;
	text-align: center;
	font-family: 'Open Sans', serif;
   padding-bottom: 0;
}
.site-header .menu-toggle:hover {
   background-color: #289dcc;
}
.site-header .menu-toggle:before {
	content: "\f0c9";
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-decoration: inherit;
	font-size: 23px;
	color: #ffffff;
   padding: 8px 12px;
   display: block;
}
.main-small-navigation {
	float: none;
}
.main-small-navigation .menu-primary-container,
.main-small-navigation .nav-menu {
   padding-top: 43px;
}
.main-small-navigation ul {
  margin: 0;
  list-style: none;
}
.main-small-navigation a {
  display: block;
  font-size: 14px;
  color: #333333;
  padding: 10px 20px;
  text-decoration: none;
  text-transform: uppercase;
}
.main-small-navigation .random-post a {
   padding: 7px 12px;
   border-bottom: none;
}
.main-small-navigation li {
  background-color: #FFFFFF;
}
.main-small-navigation li a:hover {
  background-color: #289dcc;
  color: #FFFFFF;
}
.main-small-navigation ul ul a {
  padding-left: 45px;
  text-transform: none;
}
.main-small-navigation ul ul ul a {
  padding-left: 90px;
}
.main-small-navigation .current_page_item > a,
.main-small-navigation .current-menu-item > a {
  background: #289dcc;
  color: #FFFFFF;
}

/* =PAGE HEADER TITLE
----------------------------------------------- */
.page-header .page-title {
	border-bottom: 1px solid #f8f8f8;
	margin-bottom: 30px;
}

/* =CONTENT
----------------------------------------------- */
.sticky {
}
#main {
	padding-top: 30px;
	padding-bottom: 20px;
	background-color: #ffffff;
}

/* =POST FORMAT
----------------------------------------------- */
/* POST FORMAT LINK */
.format-link .entry-content p {
	text-align: center;
	padding-top: 30px;
}
.format-link .entry-content a {
	text-decoration: underline;
	text-transform: uppercase;
	padding: 15px 40px;
	border-radius: 3px;
	background-color: #289dcc;
   color: #FFFFFF;
   transition: background-color 0.3s linear 0s;
   display: inline-block;
}
.format-link .entry-content a:hover {
	background-color: #33363B;
}

/* POST FORMAT ASIDE */
.format-aside .entry-header { display: none; }

/* POST FORMAT STATUS */

/* POST FORMAT STANDARD */

/* =2,3,4 COLUMNS
----------------------------------------------- */
/* Two COLUMN */
.tg-one-half {
	float: left;
	width: 48%;
	padding: 0px 0px 30px;
}
.tg-one-half-last {
	float: right;
}

/* =NAVIGATION
----------------------------------------------- */
.default-wp-page {
	clear: both;
}
.default-wp-page .previous {
	float: left;
	padding: 30px 0;
}
.default-wp-page .next {
	float: right;
	padding: 30px 0;
}

/* =WP PAGENAVI PLUGIN
----------------------------------------------- */
.wp-pagenavi {
	text-align: center;
	margin-bottom: 30px;
}
#content .wp-pagenavi .page,
#content .wp-pagenavi a {
	padding: 4px 10px;
	color: #777777;
	border: 1px solid #F2F2F2;
}
#content .wp-pagenavi .current,
#content .wp-pagenavi a:hover {
	padding: 4px 10px;
	color: #FFFFFF;
	background-color: #289dcc;
	border: 1px solid #F2F2F2;
}
#content .wp-pagenavi a,
#content .wp-pagenavi span {
	margin-left: 5px;
	border-radius: 2px;
}
#content .wp-pagenavi span.pages {
	margin-left: 0;
	color: #777777;
	padding: 4px 10px;
	border: 1px solid #F2F2F2;
}

/* =PAGINATION
----------------------------------------------- */
.pagination {
	margin: 15px 0;
}
.pagination span {
	padding: 2px 5px;
	border: 1px solid #EAEAEA;
	background-color: #289dcc;
	color: #FFFFFF;
}
.pagination a span {
	background-color: #FFFFFF;
	color: #777777;
}
.pagination a span:hover {
	color: #289dcc;
	border-color: #289dcc;
	text-decoration: none;
}

/* =MEDIA
----------------------------------------------- */
.wp-caption {
	border: 1px solid #cccccc;
	margin-bottom: 1.5rem;
	max-width: 100%;
}
#colophon .wp-caption {
	border: 1px solid #444444;
}
.wp-caption img[class*="wp-image-"] {
	display: block;
	margin: 1.2% auto 0;
	max-width: 98%;
}
.wp-caption-text {
	text-align: center;
}
.wp-caption .wp-caption-text {
	margin: 0.8075rem 0;
}
.gallery-caption {
}

/* =WORDPRESS GALLERY SUPPORT
----------------------------------------------- */
.gallery {
   margin: 0 auto 15px;
}
.gallery-item {
   display: inline-block;
   padding: 15px 2%;
   text-align: center;
   vertical-align: top;
   width: 100%;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
}
.gallery-columns-3 .gallery-item,
.gallery-columns-4 .gallery-item,
.gallery-columns-5 .gallery-item {
   padding: 15px 1%;
}
.gallery-columns-6 .gallery-item,
.gallery-columns-7 .gallery-item,
.gallery-columns-8 .gallery-item,
.gallery-columns-9 .gallery-item {
   padding: 10px 0.5%;
}
.gallery-columns-2 .gallery-item { width:50%; }
.gallery-columns-3 .gallery-item { width:33.33%; }
.gallery-columns-4 .gallery-item { width:25%; }
.gallery-columns-5 .gallery-item { width:20%; }
.gallery-columns-6 .gallery-item { width:16.66%; }
.gallery-columns-7 .gallery-item { width:14.28%; }
.gallery-columns-8 .gallery-item { width:12.5%; }
.gallery-columns-9 .gallery-item { width:11.11%; }
.gallery-icon img {
   margin: 0 auto;
}
.gallery .gallery-caption {
   font-size: 12px;
   line-height: 1.2;
   padding-top: 5px;
}

/* =COMMENTS
----------------------------------------------- */
#comments {
	border-top: 1px solid #F8F8F8;
   padding-top: 15px;
}
#comments i {
	font-size: 16px;
	color: #AAAAAA;
	padding-right: 10px;
}
.comments-title {
	font-size: 24px;
}
.comment-content a {
	word-wrap: break-word;
}
.comment-navigation {
	margin-bottom: 15px;
}
.bypostauthor {
}
#comments .comments-title {
	margin-bottom: 10px;
}
.avatar {
	border-radius: 50%;
	float: left;
}
.comments-area article header {
	margin: 0 0 5px;
	overflow: hidden;
	position: relative;
}
.comments-area .comment-edit-link,
.comments-area .comment-permalink,
.comments-area .comment-date-time,
.comments-area .comment-author-link {
	display: block;
	margin-left: 100px;
	color: #999999;
}
#content .comments-area article header cite a:hover,
#content .comments-area a.comment-edit-link:hover,
#content .comments-area a.comment-permalink:hover {
	color: #289dcc;
}
.comments-area .comment-author-link a {
	color: #999999;
}
.comments-area .comment-author-link a:hover {
	color: #289dcc;
}
.comments-area .comment-author-link span {
	margin-left: 10px;
	padding: 0 5px;
	background-color: #289dcc;
	color: #FFFFFF;
	border-radius: 3px;
}
.comments-area article header .comment-edit-link:before{
	content: "\f044";
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-decoration: inherit;
	color: #AAAAAA;
	font-size: 16px;
	padding-right: 10px;
}
.comment-content {
	padding: 15px 15px 25px;
	background-color: #F8F8F8;
	border: 1px solid #EAEAEA;
	border-radius: 2px;
}
.comment {
	margin-bottom: 20px;
}
.comment ul, .comment ol {
   margin: 0 0 20px 20px;
}
.comment ul {
   list-style: square outside none;
}
.comment .comment-reply-link {
	float: right;
	color: #AAAAAA;
}
.comment .comment-reply-link:before {
	content: "\f112";
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-decoration: inherit;
	color: #AAAAAA;
	font-size: 16px;
	padding-right: 10px;
}
.comment .comment-reply-link:hover {
	color: #289dcc;
}
.comment-list {
	margin-bottom: 25px;
}
.comment-list .children {
   margin-left: 20px;
}
.comment-list, .comment-list .children {
	list-style-type: none;
	padding: 0;
}
.screen-reader-text { display: none; }
.nav-previous,
.nav-next {
   margin-bottom: 15px;
}
.nav-previous a,
.nav-next a {
   color: #289dcc;
	cursor: pointer;
   font-size: 16px;
}
.nav-previous a { float: left; }
.nav-next a { float: right; }
.nav-previous a:hover,
.nav-next a:hover {
	text-decoration: underline;
}

/* =COMMENT FORM
----------------------------------------------- */
#respond {
}
#respond h3#reply-title {
	font-size: 22px;
	line-height: 28px;
}
#respond h3#reply-title #cancel-comment-reply-link {
	margin-left: 10px;
	margin-left: 1rem;
	font-weight: normal;
	font-size: 16px;
	font-size: 1.6rem;
}
#respond form label {
	display: block;
	line-height: 1.5;
}
#respond form input[type="text"],
#respond form textarea {
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	font-size: 16px;
	line-height: 1.5;
	padding: 10px;
	width: 100%;
}
#respond form p.form-allowed-tags {
	font-size: 16px;
	line-height: 1;
	color: #5e5e5e;
	display: none;
}
.required {
	color: red;
}

/* =WIDGETS
----------------------------------------------- */
#secondary .widget ul li, #colophon .widget ul li {
	line-height: 1.5;
	padding: 5px 0;
}
#colophon .widget ul li {
	border-bottom: 1px solid #444444;
}
#secondary .widget ul li li, #colophon .widget ul li li {
	border-bottom: none;
}
#secondary .widget ul ul, #colophon .widget ul ul {
	padding-left: 10px;
}
.widget select {
	border: 1px solid #DDDDDD;
	color: #777777;
	padding: 2px;
	width: 60%;
}
#secondary .widget-title {
	border-bottom: 2px solid #289dcc;
   font-size: 18px;
   margin-bottom: 15px;
   padding-bottom: 0;
}
#secondary .widget-title span {
   background-color: #289dcc;
   color: #fff;
   padding: 6px 12px;
   display: inline-block;
}
#secondary .widget, .error-404 .widget {
	margin-bottom: 35px;
	font-size: 14px;
   background-color: #ffffff;
}
#secondary .widget p {
   font-size: 14px;
}
#secondary a:hover {
	text-decoration: underline;
}
.error-404 {
	padding-bottom: 20px;
	text-align: center;
}
.error-404 input.s {
	width: 50%;
}
#secondary .widget-title a.rsswidget {
   color: #fff;
}

/* =FOOTER WIDGET AREA
----------------------------------------------- */
.footer-widgets-wrapper {
	border-top: 1px solid #F2F2F2;
	background-color: #303440;
}
.footer-widgets-area {
	padding-top: 45px;
	padding-bottom: 10px;
	color: #cccccc;
}

.tg-footer-main-widget {
   width: 39.473684%;
   float: left;
   margin-right: 2.631579%
}
.tg-footer-other-widgets {
   float: right;
   width: 57.894737%;
}

.tg-first-footer-widget {
}
.tg-second-footer-widget,
.tg-third-footer-widget {
   width: 30.303030%;
   float: left;
   margin-right: 4.545454%
}
.tg-fourth-footer-widget {
   width: 30.303030%;
   float: right;
   margin-right: 0;
}



.footer-widgets-area .widget-title {
   border-bottom: 2px solid #289dcc;
   font-size: 18px;
   margin-bottom: 15px;
   padding-bottom: 0;
}
.footer-widgets-area .widget-title span {
   background-color: #289dcc;
   color: #fff;
   padding: 6px 12px;
   display: inline-block;
}
.footer-widgets-area p {
	text-align: left;
	color: #aaaaaa;
}
.footer-widgets-area a {
	color: #FFFFFF;
}
.footer-widgets-area a:hover {
	color: #289dcc;
}
#colophon .widget {
	margin-bottom: 40px;
}
#colophon, #colophon p {
	color: #b1b6b6;
	font-size: 14px;
	line-height: 1.4;
}

/* =FOOTER ADVERTISEMENT AREA
----------------------------------------------- */
.advertisement_above_footer {
   background-color: #ffffff;
}
.advertisement_above_footer .widget-title {
   border-bottom: 2px solid #289dcc;
   font-size: 18px;
   margin-bottom: 15px;
   padding-bottom: 0;
}
.advertisement_above_footer .widget-title span {
   background-color: #289dcc;
   color: #fff;
   padding: 6px 12px;
   display: inline-block;
}

/* =FOOTER SOCKET AREA
----------------------------------------------- */
.footer-socket-wrapper {
   padding: 20px 0px 50px;
   background-color: #303440;
}
.footer-socket-area {
   width: 100%;
}
.footer-socket-right-section {
   float: right;
}
.footer-socket-left-section {
   float: left;
}
.footer-socket-wrapper .copyright {
   color: #b1b6b6;
   float: left;
   font-size: 14px;
   max-width: 50%;
}
.footer-socket-wrapper .copyright a {
   color: #b1b6b6;
   border-bottom: 1px solid #5a5d62;
}
.footer-socket-wrapper .copyright a:hover {
   color: #ffffff;
}
.footer-socket-wrapper .small-menu {
   float: right;
}
.footer-socket-wrapper .small-menu a {
   padding-top: 0;
}
.footer-socket-wrapper .small-menu ul li ul {
   top: 21px;
}

/* =SCROLL UP
----------------------------------------------- */
a#scroll-up {
	bottom: 20px;
	position: fixed;
	right: 20px;
	display: none;
	opacity: 0.5;
	filter:alpha(opacity=50); /* For IE8 and earlier */
}
a#scroll-up i {
	font-size: 40px;
	color: #289dcc;
}
a#scroll-up:hover {
	opacity: 1;
	filter:alpha(opacity=100); /* For IE8 and earlier */
}

/* =PRIMARY AND SECONDARY CONTENT AREA
----------------------------------------------- */
#primary {
	float: left;
	width: 70.17543859%;
}
#secondary {
	float: right;
	width: 27.19298245%;
}

/* =LEFT SIDEBAR CONTENT LAYOUT
-------------------------------------------------------------- */
.left-sidebar #primary {
	float: right;
}
.left-sidebar #secondary {
	float: left;
}

/* =NO SIDEBAR CONTENT LAYOUT
-------------------------------------------------------------- */
.no-sidebar #primary {
	float: none;
	margin: 0 auto;
}
.no-sidebar-full-width #primary {
	width: 100%;
}
.no-sidebar #secondary,
.no-sidebar-full-width #secondary {
	display: none;
}

.widget_featured_posts .article-content .above-entry-meta .cat-links a {
   background-color: #289dcc;
   border-radius: 3px;
   color: #ffffff;
   font-size: 12px;
   padding: 3px 10px;
}
.widget_featured_posts .article-content .entry-title {
   padding: 10px 0 0;
   font-size: 22px;
}
.widget_featured_posts .article-content .entry-title a {
   color: #232323;
   text-shadow: none;
}
.widget_featured_posts .article-content .below-entry-meta .posted-on,
.widget_featured_posts .article-content .below-entry-meta .byline {
   padding-right: 10px;
}
.widget_featured_posts .article-content .below-entry-meta .posted-on .fa {
   color: #888888;
   font-size: 10px;
   padding-right: 3px;
}
.widget_featured_posts .article-content .below-entry-meta .byline .fa,
.widget_featured_posts .article-content .below-entry-meta .comments .fa {
   color: #888888;
   padding-right: 5px;
   font-size: 11px;
}
.widget_featured_posts .article-content .below-entry-meta .posted-on a,
.widget_featured_posts .article-content .below-entry-meta .byline a,
.widget_featured_posts .article-content .below-entry-meta .comments a {
   font-size: 12px;
}

/* =POST CONTENT
----------------------------------------------- */
.page-header .page-title {
   border-bottom: 2px solid #289dcc;
   font-size: 18px;
   margin-bottom: 15px;
   padding-bottom: 0;
}
.page-header .page-title span {
   background-color: #289dcc;
   color: #fff;
   padding: 6px 12px;
   display: inline-block;
}
.archive #content .post p {
   font-size: 14px;
}
.archive #content .post:nth-child(2n+1) {
   float: right;
   width: 48.7013%;
}
.archive #content .post:nth-child(2n) {
   float: left;
   width: 48.7013%;
   clear: both;
}
.archive #content .post:first-child {
   float: none;
   width: 100%;
}
.archive #content .post:not(:first-child) .article-content .entry-title {
   font-size: 22px;
}
#content .post {
}
.single #content .post,
#content .post {
   box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
}
#content .post {
   margin-bottom: 30px;
}
.single #content .post {
   margin-bottom: 0;
}
#content .post img {
   margin-bottom: 0;
}
#content .post .article-content {
   padding: 15px;
}
#content .post .article-content .above-entry-meta .cat-links a {
   background-color: #289dcc;
   border-radius: 3px;
   color: #ffffff;
   font-size: 12px;
   padding: 3px 10px;
}
#content .post .article-content .entry-title {
   padding: 5px 0 0;
   font-size: 32px;
}
#content .post .article-content .entry-title a {
   color: #232323;
}
#content .post .article-content .entry-title a:hover {
   color: #289dcc;
}
#content .post .article-content .below-entry-meta .posted-on,
#content .post .article-content .below-entry-meta .byline,
#content .post .article-content .below-entry-meta .comments,
#content .post .article-content .below-entry-meta .tag-links {
   padding-right: 10px;
}
#content .post .article-content .below-entry-meta .posted-on .fa {
   color: #888888;
   font-size: 10px;
   padding-right: 3px;
}
#content .post .article-content .below-entry-meta .byline .fa,
#content .post .article-content .below-entry-meta .comments .fa,
#content .post .article-content .below-entry-meta .tag-links .fa,
#content .post .article-content .below-entry-meta .edit-link .fa {
   color: #888888;
   padding-right: 5px;
   font-size: 11px;
}
#content .post .article-content .below-entry-meta .posted-on a,
#content .post .article-content .below-entry-meta .byline a,
#content .post .article-content .below-entry-meta .comments a,
#content .post .article-content .below-entry-meta .tag-links a,
#content .post .article-content .below-entry-meta .edit-link a {
  font-size: 12px;
}
#content .post .article-content .below-entry-meta {
   padding-bottom: 20px;
}
.below-entry-meta .updated {
  display: none;
}


.type-post .entry-title,
.type-page .entry-title {
	font-size: 34px;
	line-height: 1.2;
}
.post .entry-title a, .search .entry-title a {
	color: #333333;
	transition: all 0.3s ease 0s
}
.post .entry-title a:hover, .search .entry-title a:hover {
	color: #289dcc;
}
.post .entry-content {
	margin-bottom: 10px;
}
.entry-content ul {
	list-style: square;
}
.entry-content ul,
.entry-content ol {
	padding: 0 0 0 35px;
   margin-bottom: 30px;
}
.entry-content li > ul,
.entry-content li > ol {
	margin-bottom: 0;
}
.entry-content li {
	line-height: 1.3;
}
.post .entry-content a:hover {
	text-decoration: underline;
}
.entry-meta {
	color:#aaa;
	padding-bottom: 20px;
}
.entry-meta .byline i,
.entry-meta .cat-links i {
	padding-left: 5px;
	padding-right: 5px;
	font-size: 16px;
	color: #289dcc;
}
.entry-meta .byline a,
.entry-meta .cat-links a {
	font-size: 20px;
}
.entry-meta .byline,
.entry-meta .cat-links {
}
.entry-meta .byline {
	margin-right: 25px;
}
.entry-meta a {
	color:#289dcc
}
.entry-meta a:hover {
	text-decoration: underline;
}
.entry-meta .sep {
	display:block;
	border-top:1px solid #f2f2f2;
	position:relative;
	margin: 10px 0 10px 0;
}
.entry-meta .post-format {
	padding: 5px;
	position: absolute;
	right: -64px;
	top: -32px;
}
.entry-meta .post-format i {
	background-color: #289dcc;
	border-radius: 5px;
	color: #FFFFFF;
	display: block;
	height: 30px;
	line-height: 30px;
	text-align: center;
	width: 30px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	padding: 12px 8px 8px 8px;
}
.entry-meta .posted-on,
.entry-meta .comments-link,
.entry-meta .edit-link,
.entry-meta .tag-links {
	font-size:12px;
	line-height:20px;
	margin-right:25px;
}
.entry-meta .posted-on a,
.entry-meta .comments-link a,
.entry-meta .edit-link a,
.entry-meta .tag-links a {
	color:#aaa;
	font-size: 14px;
}
.entry-meta .posted-on a:hover,
.entry-meta .comments-link a:hover,
.entry-meta .edit-link a:hover,
.entry-meta .tag-links a:hover {
	color:#289dcc;
	text-decoration:none;
}
.entry-meta .posted-on i,
.entry-meta .comments-link i,
.entry-meta .edit-link i,
.entry-meta .tag-links i {
	font-size:14px;
	padding-right: 5px;
	padding-left: 5px;
	text-decoration:none
}
.entry-content a.read-more:hover {
	text-decoration: none;
}
.single #content .tags a {
	border: 1px solid #EAEAEA;
	padding: 3px 5px;
	border-radius: 3px;
	color: #777777;
}
.single #content .tags a:hover {
	color: #289dcc;
	text-decoration: none;
}

.more-link {
   display: inline-block;
   background-color: #289dcc;
   border-radius: 3px;
}
.more-link span {
   font-size: 12px;
   padding: 5px 10px;
   color: #FFFFFF;
   cursor: pointer;
   display: inline-block;
}
.more-link  span:hover {
   background-color: rgba(0, 0, 0, 0.1);
}

/* =FEATURED BLOG
----------------------------------------------- */
.no-post-thumbnail {
	background-color: #289dcc;
}
.tg-two-column-post-left {
	float: left;
	clear: both;
}
.tg-two-column-post-right {
	float: right;
}
.post-box {
	width: 48.5%;
	height: auto;
   margin-bottom: 30px;
   position: relative;
}
.yes-post-thumbnail.post-box {
	height: auto;
}
.post-box img {
	margin-bottom: 0;
}
.post-box .post-content-area {
	position: absolute;
	top: 50%;
	-ms-transform: translateY(-50%); /* IE 9 */
   -webkit-transform: translateY(-50%);
   transform: translateY(-50%);
   width: 100%;
   text-align: center;
}
.post-box .entry-title {
	padding-bottom: 0;
}
.post.post-box .entry-title a {
	color: #fff;
	text-shadow: 1px 1px 1px #000000;
	font-size: 28px;
	text-transform: uppercase;
	padding: 10px;
}
.post.post-box .entry-title a:hover {
	color: #289dcc;
}
.post-box .entry-title:after {
	background: none repeat scroll 0 0 #fff;
	content: "";
	display: block;
	height: 2px;
	margin: 15px auto;
	width: 100px;
}
.post-box .entry-meta {
	padding-bottom: 0;
}
.post-box .entry-meta span .fa {
	color: #fff;
}
.post-box .entry-meta .posted-on a,
.post-box .entry-meta .cat-links a  {
	color: #fff;
	text-shadow: 1px 1px 1px #000000;
	font-size: 16px;
}
.post-box .entry-meta .posted-on i,
.post-box .entry-meta .cat-links i {
	color: #ffffff;
}
.post-box .entry-meta .posted-on a:hover,
.post-box .entry-meta .cat-links a:hover {
	color: #289dcc;
	text-decoration: none;
}

/* =FRONT PAGE WIDGET AREAS
----------------------------------------------- */
.widget_slider_area {
   float: left;
   width: 55.26315789%;
}
.widget_beside_slider {
   float: right;
   width: 43.85964912%;
}


/* Slider widget meta CSS */
.widget_featured_slider .single-slide {
   position: relative;
}
.widget_featured_slider img {
   margin-bottom: 0;
}
.widget_featured_slider .slide-content {
   position: absolute;
   bottom: 0;
   background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3));
   background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3));
   background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3));
   background: linear-gradient(to bottom, rgba(0, 0, 0, 0) , rgba(0, 0, 0, 0.3));
   padding-bottom: 20px;
   padding-left: 5%;
   position: absolute;
   width: 95%;
}
.widget_featured_slider .slide-content .above-entry-meta .cat-links a {
   background-color: #289dcc;
   border-radius: 3px;
   color: #ffffff;
   font-size: 12px;
   padding: 3px 10px;
}
.widget_featured_slider .slide-content .entry-title {
   padding: 10px 0 0;
   font-size: 22px;
}
.widget_featured_slider .slide-content .entry-title a {
   color: #ffffff;
   text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
}
.widget_featured_slider .slide-content .entry-title a:hover {
   color: #289dcc;
}
.widget_featured_slider .slide-content .below-entry-meta .posted-on,
.widget_featured_slider .slide-content .below-entry-meta .byline {
   padding-right: 10px;
}
.widget_featured_slider .slide-content .below-entry-meta .posted-on .fa {
   color: #ffffff;
   font-size: 10px;
   padding-right: 3px;
}
.widget_featured_slider .slide-content .below-entry-meta .byline .fa,
.widget_featured_slider .slide-content .below-entry-meta .comments .fa {
   color: #ffffff;
   padding-right: 5px;
   font-size: 11px;
}
.widget_featured_slider .slide-content .below-entry-meta .posted-on a,
.widget_featured_slider .slide-content .below-entry-meta .byline a,
.widget_featured_slider .slide-content .below-entry-meta .comments a,
.widget_featured_slider .slide-content .below-entry-meta .comments span {
   color: #ffffff;
   font-size: 12px;
}
.widget_featured_slider .slide-content .below-entry-meta .posted-on a:hover,
.widget_featured_slider .slide-content .below-entry-meta .byline a:hover,
.widget_featured_slider .slide-content .below-entry-meta .comments a:hover {
   color: #289dcc;
}

/* Highlighted posts widget */
.widget_highlighted_posts .single-article {
   position: relative;
   float: left;
   margin-bottom: 10px;
   margin-right: 2%;
   max-width: 49%;
}
.widget_highlighted_posts .single-article:nth-child(even) {
   margin-right: 0;
}
.widget_highlighted_posts img {
   margin-bottom: 0;
}
.widget_highlighted_posts .article-content {
   position: absolute;
   bottom: 0;
   background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8));
   background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8));
   background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8));
   background: linear-gradient(to bottom, rgba(0, 0, 0, 0) , rgba(0, 0, 0, 0.8));
   padding-bottom: 10px;
   padding-left: 5%;
   position: absolute;
   width: 95%;
}
.widget_highlighted_posts .above-entry-meta {
   display: none;
}
.widget_highlighted_posts .article-content .above-entry-meta .cat-links a {
   background-color: #289dcc;
   border-radius: 3px;
   color: #ffffff;
   font-size: 12px;
   padding: 3px 10px;
}
.widget_highlighted_posts .article-content .entry-title {
   padding: 10px 0 0;
   font-size: 16px;
}
.widget_highlighted_posts .article-content .entry-title a {
   color: #ffffff;
   text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
}
.widget_highlighted_posts .article-content .entry-title a:hover {
   color: #289dcc;
}
.widget_highlighted_posts .article-content .below-entry-meta .posted-on,
.widget_highlighted_posts .article-content .below-entry-meta .byline {
   padding-right: 10px;
}
.widget_highlighted_posts .article-content .below-entry-meta .byline {
   display: none;
}
.widget_highlighted_posts .article-content .below-entry-meta .posted-on .fa {
   color: #ffffff;
   font-size: 10px;
   padding-right: 3px;
}
.widget_highlighted_posts .article-content .below-entry-meta .byline .fa,
.widget_highlighted_posts .article-content .below-entry-meta .comments .fa {
   color: #ffffff;
   padding-right: 5px;
   font-size: 11px;
}
.widget_highlighted_posts .article-content .below-entry-meta .posted-on a,
.widget_highlighted_posts .article-content .below-entry-meta .byline a,
.widget_highlighted_posts .article-content .below-entry-meta .comments a,
.widget_highlighted_posts .article-content .below-entry-meta .comments span {
   color: #ffffff;
   font-size: 11px;
}
.widget_highlighted_posts .article-content .below-entry-meta .posted-on a:hover,
.widget_highlighted_posts .article-content .below-entry-meta .byline a:hover,
.widget_highlighted_posts .article-content .below-entry-meta .comments a:hover {
   color: #289dcc;
}
.widget_highlighted_posts .widget-title {
   color: #555555;
   font-size: 24px;
}

/* TG:All Posts Widget Styling */
.blog .post:nth-child(2n) {
   float: left;
   width: 48.7013%;
   clear: both;
}
.blog .post:nth-child(2n+1) {
  float: right;
  width: 48.7013%;
}
.blog .post:first-child {
   float: none;
   width: 100%;
}
.blog .post .article-content .below-entry-meta .edit-link a,
.blog .post .article-content .below-entry-meta .tag-links a {
   font-size: 12px;
}
.blog .post .article-content .below-entry-meta .edit-link .fa,
.blog .post .article-content .below-entry-meta .tag-links .fa {
   color: #888888;
   padding-right: 5px;
   font-size: 11px;
}
.blog .post .article-content .below-entry-meta .tag-links {
   padding-right: 10px;
}
/* Search Page */
.search .post:nth-child(2n) {
   float: left;
   width: 48.7013%;
   clear: both;
}
.search .post:nth-child(2n+1) {
  float: right;
  width: 48.7013%;
}
.search .post:first-child {
   float: none;
   width: 100%;
}

/* =FRONT PAGE MAIN CONTENT SECTION
----------------------------------------------- */
.main-content-section {
   padding-top: 20px;
}
.main-content-section .tg-one-half {
   width: 48.75%;
   padding-bottom: 0;
}

.posted-on a,
.byline a,
.comments a,
.comments span,
.tag-links a,
.edit-link a {
   color: #888888;
}
.posted-on a:hover,
.byline a:hover,
.comments a:hover,
.tag-links a:hover,
.edit-link a:hover {
   color: #289dcc;
}

/* Featured posts widget */
.widget_featured_posts .article-content .above-entry-meta .cat-links a {
   background-color: #289dcc;
   border-radius: 3px;
   color: #ffffff;
   font-size: 12px;
   padding: 3px 10px;
}
.widget_featured_posts .article-content .entry-title {
   padding: 10px 0 0;
   font-size: 22px;
}
.widget_featured_posts .article-content .entry-title a {
   color: #232323;
   text-shadow: none;
}
.widget_featured_posts .article-content .entry-title a:hover {
   color: #289dcc;
}
.widget_featured_posts .article-content .below-entry-meta .posted-on,
.widget_featured_posts .article-content .below-entry-meta .byline {
   padding-right: 10px;
}
.widget_featured_posts .article-content .below-entry-meta .posted-on .fa {
   color: #888888;
   font-size: 10px;
   padding-right: 3px;
}
.widget_featured_posts .article-content .below-entry-meta .byline .fa,
.widget_featured_posts .article-content .below-entry-meta .comments .fa {
   color: #888888;
   padding-right: 5px;
   font-size: 11px;
}
.widget_featured_posts .article-content .below-entry-meta .posted-on a,
.widget_featured_posts .article-content .below-entry-meta .byline a,
.widget_featured_posts .article-content .below-entry-meta .comments a,
.widget_featured_posts .article-content .below-entry-meta .comments span {
   font-size: 12px;
}

.widget_featured_posts {
   margin-bottom: 30px;
}
.widget_featured_posts .widget-title {
   border-bottom: 2px solid #289dcc;
   font-size: 18px;
   margin-bottom: 15px;
   padding-bottom: 0;
}
.widget_featured_posts .widget-title span {
   background-color: #289dcc;
   color: #fff;
   padding: 6px 12px;
   display: inline-block;
}
.widget_featured_posts img {
   margin-bottom: 18px;
}
.widget_featured_posts .first-post {
   float: left;
   width: 48.70129870%;
   margin-bottom: 20px;
}
.widget_featured_posts .following-post {
   float: right;
   width: 48.70129870%;
}
.widget_featured_posts .following-post .byline {
   display: none;
}
.widget_featured_posts.widget_featured_posts_vertical .first-post,
.widget_featured_posts.widget_featured_posts_vertical .following-post {
   float: none;
   width: 100%;
}
.widget_featured_posts .single-article {
   background-color: #ffffff;
   box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
}
.widget_featured_posts .article-content {
   padding: 0 15px 5px;
}
.widget_featured_posts .article-content .below-entry-meta {
   margin-bottom: 12px;
}
.widget_featured_posts .article-content .entry-content p {
   font-size: 14px;
}
.widget_featured_posts .following-post .single-article {
   margin-bottom: 15px;
}
.widget_featured_posts .following-post figure {
   float: left;
   margin-right: 10px;
}
#secondary .widget_featured_posts .following-post .article-content .entry-title {
   font-size: 14px;
   line-height: 1.4;
}
.widget_featured_posts .following-post .article-content .entry-title {
   font-size: 18px;
}
.widget_featured_posts .following-post .article-content .below-entry-meta .posted-on a,
.widget_featured_posts .following-post .article-content .below-entry-meta .byline a {
   font-size: 11px;
}
.widget_featured_posts .following-post .article-content .below-entry-meta {
   margin-bottom: 0;
}
.widget_featured_posts .following-post img {
   margin-bottom: 0;
}
.widget_featured_posts .following-post .above-entry-meta {
   display: none;
}

.news-bar {
   background-color: #ffffff;
   padding: 8px 0 4px;
   box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.1);
   font-size: 14px;
}
.breaking-news {
   float: left;
}
.breaking-news div {
   display: none;
}
.breaking-news-latest {
   color: #555555;
   margin-right: 0;
   position: relative;
   margin-top: 0px;
   vertical-align: top;
}
/* The HTML list gets replaced with a single div,
   which contains the active ticker item, so you
   can easily style that as well */
.breaking-news div {
   display: inline-block;
   word-wrap: break-word;
}
.date-in-header {
   float: left;
   color: #555555;
   font-size: 14px;
   padding-right: 15px;
}
.newsticker {
   display: inline-block;
   padding-left: 0;
   overflow: hidden;
   height: 20px;
}
.author-box {
   width: 100%;
   display: inline-block;
   padding: 10px;
   box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
   margin-bottom: 25px;
}
.author-img img {
   margin-right: 15px;
}
.author-name {
   padding-bottom: 10px;
   font-size: 20px;
}
.author-description {
}

/* Related Posts */
.related-posts-main-title {
}
.related-posts-main-title .fa {
   color: #289dcc;
}
.related-posts-main-title span {
   font-size: 26px;
   padding-left: 10px;
}


.single-related-posts {
   width: 32.5%;
   box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
   margin-right: 1.25%;
   float: left;
   margin-bottom: 25px;
}
.single-related-posts img {
   margin-bottom: 0;
}
.related-posts .single-related-posts:nth-child(3n+3) {
   margin-right: 0;
}
.single-related-posts .article-content {
   padding: 0 10px 5px;
}
.single-related-posts .byline {
   display: none;
}
.single-related-posts .article-content .entry-title {
   padding: 10px 0 0;
   font-size: 18px;
}
.single-related-posts .article-content .entry-title a {
   color: #232323;
   text-shadow: none;
}
.single-related-posts .article-content .entry-title a:hover {
   color: #289dcc;
}
.single-related-posts .article-content .below-entry-meta .posted-on,
.single-related-posts .article-content .below-entry-meta .byline {
   padding-right: 10px;
}
.single-related-posts .article-content .below-entry-meta .posted-on .fa {
   color: #888888;
   font-size: 10px;
   padding-right: 3px;
}
.single-related-posts .article-content .below-entry-meta .byline .fa,
.single-related-posts .article-content .below-entry-meta .comments .fa {
   color: #888888;
   padding-right: 5px;
   font-size: 11px;
}
.single-related-posts .article-content .below-entry-meta .posted-on a,
.single-related-posts .article-content .below-entry-meta .byline a,
.single-related-posts .article-content .below-entry-meta .comments a {
   font-size: 12px;
}




/* Sharing Section */

.share-buttons {
   display: inline-block;
}
.box {
   border: 1px solid #eaeaea;
   border-radius: 3px;
   display: inline-block;
}
.count {
   background: none repeat scroll 0 0 #f2f2f2;
   color: #289dcc;
   float: right;
   font-size: 22px;
   padding: 0 16px;
}
.share {
   float: left;
}
#twitter, #facebook, #googleplus, #pinterest {
   float: left;
   padding-right: 20px;
}
.share .fa {
   display: block;
   font-size: 30px;
   line-height: 35px;
   padding: 0 15px;
}
.share .fa-twitter {
   color: #55acee;
}
.share .fa-facebook-square {
   color: #3b5998;
}
.share .fa-google-plus-square {
   color: #dd4b39;
}
.share .fa-pinterest {
   color: #cc2127;
}

.advertisement_125x125 {

}
.advertisement_125x125 img {
   margin-bottom: 8px;
   padding: 0 2px;
}
.advertisement-title {

}
.advertisement_300x250 {

}
.advertisement_300x250 img {
   margin: 0 auto;
   display: block;
}
#header-right-section .advertisement_728x90 {
   margin-bottom: 0;
   padding: 0;
}
.advertisement_728x90 {
   padding: 15px 0 45px;
   display: block;
}
#header-right-section .advertisement_728x90 img {
   padding: 0;
}
.advertisement_728x90 img {
   margin-bottom: 0;
   box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
   padding: 10px;
   display: block;
   margin: 0 auto;
}
.advertisement-content {
   text-align: center;
}

.advertisement_below_post_title {
   float: left;
   width: 300px;
   margin-right: 10px;
}

.image-popup {

}
.featured-image {

}
.post .featured-image {
   text-align: center;
}
#site-navigation {
   z-index: 999;
}

.fitvids-video {

}
.video-title {

}

/* Gallery Post Format */
.single-format-gallery {

}
.gallery-post-format {

}
.gallery-images {

}


/*--------------------------------------------------------------
Responsive Structure
--------------------------------------------------------------*/
@media screen and (max-width: 1190px) {
   #page {
      width: 100%;
   }
   .wide #page {
      width: 100%;
   }
   .inner-wrap {
      width: 100%;
   }
}
@media screen and (max-width:768px) {
   #header-text-nav-wrap {
      padding: 10px 0;
   }
   #header-left-section {
      float: none;
      margin-bottom: 10px;
   }
   #header-logo-image {
      float: none;
      text-align: center;
      padding-right: 0;
   }
   #header-text {
      float: none;
      text-align: center;
      padding-right: 0;
   }
   #header-right-section {
      float: none;
   }
   #header-right-section .widget {
      text-align:center;
   }
   .menu-toggle {
      display: block;
      float: left;
   }
   .main-navigation ul {
      display: none;
   }
   .main-navigation .home-icon a {
      padding: 7px 10px;
   }
   .widget_slider_area,
   .widget_beside_slider {
      float: none;
      width: 100%;
   }
   .widget_slider_area {
      padding-bottom: 10px;
   }
   #primary, #secondary {
      float: none;
      width: 100%;
   }
}
@media screen and (max-width:767px) {

}
@media screen and (max-width: 600px) {
   .news-bar {
      text-align: center;
   }
   .date-in-header,
   .breaking-news,
   #masthead .social-links {
      float: none;
      max-width: 100%;
   }
   .newsticker li {
      text-align: left;
   }
   .archive #content .post:first-child,
   .archive #content .post:nth-child(2n),
   .archive #content .post:nth-child(2n+1) {
      float: none;
      width: 100%;
   }
   .blog .post:first-child,
   .blog .post:nth-child(2n),
   .blog .post:nth-child(2n+1) {
      float: none;
      width: 100%;
   }
   .search .post:first-child,
   .search .post:nth-child(2n),
   .search .post:nth-child(2n+1) {
      float: none;
      width: 100%;
   }
   .tg-footer-main-widget {
      float: none;
      margin-right: 0;
      width: 100%;
   }
   .tg-footer-other-widgets {
      float: none;
      width: 100%;
   }
   .footer-socket-right-section,
   .footer-socket-left-section {
      float: none;
      text-align: center;
   }
   .footer-socket-wrapper .copyright {
      float: none;
      max-width: 100%;
      text-align: center;
   }
   .footer-socket-area .social-links {
      float: none;
   }
   .gallery-columns-4 .gallery-item,
   .gallery-columns-5 .gallery-item,
   .gallery-columns-6 .gallery-item,
   .gallery-columns-7 .gallery-item,
   .gallery-columns-8 .gallery-item,
   .gallery-columns-9 .gallery-item {
      width:25%;
   }
}
@media screen and (max-width: 420px) {
   .widget_featured_posts .first-post,
   .widget_featured_posts .following-post {
      float: none;
      width: 100%;
   }
   .main-content-section .tg-one-half {
      width: 100%;
   }
   .tg-second-footer-widget,
   .tg-third-footer-widget,
   .tg-fourth-footer-widget {
      float: none;
      margin-right: 0;
      width: 100%;
   }
   .single-related-posts {
      margin-right: 0;
      width: 100%;
   }
   .gallery-columns-4 .gallery-item,
   .gallery-columns-5 .gallery-item,
   .gallery-columns-6 .gallery-item,
   .gallery-columns-7 .gallery-item,
   .gallery-columns-8 .gallery-item,
   .gallery-columns-9 .gallery-item {
      width:33.33%;
   }
}
@media screen and (max-width: 380px) {
   .widget_highlighted_posts .single-article {
      float: none;
      margin-right: 0;
      max-width: 100%;
   }
}

/* search result tile hide */
.search h1.page-title {
   display: none;
}

.entry-title {
display: none !important;
}
.screenReader { left: -9999px; position: absolute; top: -9999px; }.thanks { background: #F2F3F6; border: 1px solid #7E8AA2; padding:10px; }/*****Forms*****/ol.forms { float: left; list-style: none; margin: 0; width: 100%; }ol.forms li { 	clear: both; 	float: left; 	margin-bottom: 18px; 	position: relative;	width: 100%;}ol.forms label {	cursor: pointer;	display: block;	float: left;	font-weight: bold;	padding-right: 20px;	width: 100px;}ol.forms input, ol.forms textarea {	border: 1px solid #7E8AA2;	border-radius: 3px;	font: inherit;	-moz-border-radius: 3px;	padding: 2px;	-webkit-border-radius: 3px;	width: 214px;}ol.forms textarea { height: 300px; width: 334px; }ol.forms input:focus, ol.forms textarea:focus { background-color: #f2f3f6; border-color: #ff9800; }.error { color: #f00; }ol.forms li .error { font-size: 12px; margin-left: 20px; }ol.forms li.textarea .error {	display: block;	position: absolute;	right: 0;	top: 0;	width: 100px;}ol.forms li.screenReader { margin-bottom: 0; }ol.forms li.buttons button {	background: #ff9800;	border: none;	color: #000;	cursor: pointer;	font: 16px/16px "Avenir LT Std", Helvetica, Arial, sans-serif;	overflow: hidden;	padding: 6px 3px 3px 3px;	text-transform: uppercase;	width: auto;}ol.forms li.buttons button:hover { color: #222; }ol.forms li.buttons button:active { left: -1px; position: relative; top: -1px; }ol.forms li.buttons, ol.forms li.inline { float: right; width: 460px; }ol.forms li.inline input { width: auto; }ol.forms li.inline label { display: inline; float: none; width: auto; }


A voir également:

1 réponse

Réponse 1 / 1
byron
30 juil. 2016 à 18:34
hello,

"j'ai un problème de résolution d’écran lorsque j’accède au site sur un autre pc, le menu se décale."
Plus simple de tester différentes résolutions sur son ordinateur pour vérifier cela.

"J'ai essayé de résoudre le problème dans le style mais rien y fait. "
Comment avez vous essayé?

Vous avez deux possibilités:
_choisir un thème wordpress qui est web responsive.
_rendre celui ci web responsive

L'explication du web responsive et sa nécessité:

http://www.alsacreations.com/article/lire/1615-cest-quoi-le-responsive-web-design.html

De l'aide pour faire ce genre de choses par CSS mais ce n'est pas le seul moyen à utiilser( indispensable toutefois):

https://www.google.fr/webhp?q=css%20responsive%20design%20tutorial
0

Discussions similaires

C'est quoi le site qui remplace coco chat
TP3 -
bazfile -

2 réponses
Colis en cours de transport vers votre site de livraison ?
Ninan_5568 -
JulieVdr -

7 réponses