zapatista.kompot.si/themes/Travelify-tr00/styles/style.css

2561 lines
46 KiB
CSS
Raw Normal View History

2021-05-08 17:51:48 +02:00
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-family: inherit;
font-size: 100%;
font-style: inherit;
font-weight: inherit;
margin: 0;
outline: 0;
padding: 0;
vertical-align: baseline;
}
html {
-webkit-text-size-adjust: none;
}
:focus {
outline: 0;
}
ol, ul {
list-style: none;
margin: 0;
}
table {
border-collapse: separate;
border-spacing: 0;
}
caption, th, td {
font-weight: normal;
text-align: left;
}
blockquote:before, blockquote:after, q:before, q:after {
content: "";
}
blockquote, q {
quotes: "" "";
}
a img {
border: 0;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}
embed, iframe, object {
max-width: 100%;
}
/* =Global
-----------------------------------------------*/
body, input, textarea, article {
color: #1d1d1d;
font: 14px Helvetica, Arial, sans-serif;
font-weight: 400;
line-height: 24px;
word-wrap: break-word;
-ms-word-wrap: break-word;
}
body {
border-top: 6px solid #57ad68;
}
hr {
border: 0 none #eaeaea;
border-top: 1px solid;
height: 0;
margin: 0 0 40px;
}
.wrapper {
max-width: 1018px;
margin: 0 auto;
background-color: #f8f8f8;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
border-radius: 4px;
}
.container {
margin: 0 auto;
max-width: 978px;
}
::selection {
background: #57ad68;
color: #fff;
}
/* Headings
-----------------------------------------------*/
h1, h2, h3, h4, h5, h6 {
font-weight: normal;
font-family: 'Open Sans', sans-serif;
color: #555;
}
h1 {
font-size: 30px;
line-height: 36px;
}
h2 {
font-size: 28px;
line-height: 55px;
}
h3 {
font-size: 26px;
line-height: 32px;
}
h4 {
font-size: 24px;
line-height: 30px;
}
h5 {
font-size: 22px;
line-height: 28px;
}
h6 {
font-size: 19px;
line-height: 25px;
text-transform: uppercase;
}
/* No Border/Margin/Padding */
.no-margin-top {
margin-top: 0px !important;
}
.no-margin-bottom {
margin-bottom: 0px !important;
}
.no-margin-left {
margin-left: 0px !important;
}
.no-margin-right {
margin-right: 0px !important;
}
.no-padding-top {
padding-top: 0px !important;
}
.no-padding-bottom {
padding-bottom: 0px !important;
}
.no-padding-left {
padding-left: 0px !important;
}
.no-padding-right {
padding-right: 0px !important;
}
.no-border-top {
border-top: 0 none !important;
}
.no-border-bottom {
border-bottom: 0 none !important;
}
.no-border-left {
border-left: 0 none !important;
}
.no-border-right {
border-right: 0 none !important;
}
/* Text elements */
p {
margin-bottom: 15px;
}
strong {
font-weight: bold;
}
cite, em, i {
font-style: italic;
}
pre {
background-color: #fff;
margin-bottom: 20px;
overflow: auto;
padding: 20px;
}
pre, code, kbd {
font-family: "Courier 10 Pitch", Courier, monospace;
font-size: 14px;
line-height: 19px;
background-color: #F9F9F9;
}
abbr, acronym, dfn {
border-bottom: 1px dotted #666;
cursor: help;
}
address {
display: block;
margin: 0 0 1.625em;
}
ins {
background: #fff9c0;
}
/* Superscript and Subscript */
sup, sub {
font-size: 10px;
height: 0;
line-height: 1;
position: relative;
vertical-align: baseline;
}
sup {
bottom: 1ex;
}
sub {
top: .5ex;
}
/* Blockquote */
blockquote {
font-style: italic;
font-weight: normal;
padding: 20px;
background: #fff;
border-left: 4px solid #439f55;
margin-bottom: 20px;
background-color: #F9F9F9;
}
blockquote p {
margin: 0;
}
blockquote em, blockquote i, blockquote cite {
font-style: normal;
}
blockquote cite {
color: #666;
font: 12px "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 300;
letter-spacing: 0.05em;
text-transform: uppercase;
}
/* Breadcrumb */
.breadcrumb {
float: right;
text-align: right;
margin-top: 5px;
margin-bottom: 5px;
font-size: 12px;
}
.breadcrumb ul li {
display: inline-block;
margin-right: 6px;
margin-left: 0px;
color: #999;
}
.breadcrumb ul li a {
color: #999;
}
.breadcrumb ul li a:hover, .breadcrumb ul li.current_item {
color: #57ad68;
}
.breadcrumb ul li a:after {
content: "/";
margin-left: 12px;
}
/* Forms */
input, textarea {
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=password], input[type="email"], textarea {
border: 1px solid #eaeaea;
width: 50%;
margin: 0 0 10px;
background-color: #f9f9f9;
border-radius: 3px;
padding: 4px 0;
}
textarea {
width: 100%;
}
input[type="text"]:focus, input[type="email"]:focus, input[type="search"]:focus, input[type="password"]:focus, textarea:focus {
border: 1px solid #ccc;
}
input.s {
width: 0;
padding: 3px 30px 3px 0;
height: 22px;
color: #bbb;
font-style: italic;
margin: 0;
border-color: transparent;
cursor: pointer;
text-indent: 25px;
font-weight: 300;
}
input.s:focus {
width: 100px;
padding-left: 10px;
border-color: #eaeaea;
text-indent: 0;
}
input[type="reset"], input[type="button"], input[type="submit"] {
display: inline-block;
border-radius: 2px;
font-size: 14px;
white-space: nowrap;
text-align: center;
margin: 0;
line-height: 24px;
display: inline-block;
text-decoration: none;
padding: 4px 12px;
text-transform: lowercase;
border: 1px solid #439f55;
cursor: pointer;
background: #57ad68;
color: #fff;
position: relative;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
-webkit-box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2);
box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2);
}
input[type="reset"]:hover, input[type="button"]:hover, input[type="submit"]:hover {
background: #439f55;
}
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);
box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3);
}
/* Links */
a {
color: #57ad68;
text-decoration: none;
}
.entry-content a {
text-decoration: underline;
}
a:focus, a:active, a:hover {
color: #439f55;
text-decoration: none;
}
/* Images */
figure {
margin: 0;
text-align: center;
}
img {
max-width: 100%;
height: auto;
vertical-align: top;
}
.entry-content img, .comment-content img, .widget img {
max-width: 100%; /* Fluid images for posts, comments, and widgets */
}
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;
}
img#wpstats {
display: none;
}
/* Assistive text */
.assistive-text {
position: absolute !important;
clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
}
#main-nav a.assistive-text:active, #main-nav a.assistive-text:focus {
background: #eee;
border-bottom: 1px solid #ddd;
color: #1982d1;
clip: auto !important;
font-size: 12px;
position: absolute;
text-decoration: underline;
top: 0;
left: 7.6%;
}
/* clearfix hack */
.clearfix:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}
.clearfix {
display: inline-block;
}
/* commented backslash */
* html .clearfix {
height: 1%;
}
.clearfix {
display: block;
}
/* Readmore */
a.readmore {
float: right;
font-size: 14px;
white-space: nowrap;
text-align: center;
margin: 0;
line-height: 20px;
display: inline-block;
text-decoration: none;
padding: 4px 12px;
text-transform: lowercase;
border: 1px solid #439f55;
cursor: pointer;
background: #57ad68;
color: #fff;
position: relative;
border-radius: 2px;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2);
box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2);
}
a.readmore:hover {
background: #439f55;
color: #fff;
}
a.readmore:active {
-webkit-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.3);
box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.3);
}
a.more-link:hover {
text-decoration: underline;
}
/* 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;
}
/* Back to Top */
.back-to-top {
position: fixed;
bottom: 10px;
right: 18px;
}
.back-to-top a:before {
content: '\f432';
}
.back-to-top a {
padding: 8px 6px 8px 11px;
display: block;
background: #fff;
color: #eaeaea;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
border-radius: 4px;
}
.back-to-top a:hover {
color: #bdbdbd;
}
/* =Header
-----------------------------------------------*/
#branding {
margin-top: 15px;
}
.hgroup-wrap {
padding-top: 15px;
padding-bottom: 35px;
}
.hgroup-wrap a {
display: block;
}
#site-logo {
float: left;
margin-top: 32px;
}
#site-title {
font: 36px 'Open Sans', sans-serif;
line-height: 42px;
}
#site-title a {
color: #57ad68;
letter-spacing: -2px;
}
#site-title a img {
vertical-align: inherit;
max-width: 978px;
}
#site-title a span, #site-title a:hover, #site-title a:focus, #site-title a:active {
color: #439f55;
}
#site-description {
font: 14px helvetica, Arial, sans-serif;
line-height: 20px;
color: #999;
font-weight: 200;
}
.hgroup-right {
float: right;
margin-top: 38px;
}
/* Social Profiles */
.social-icons {
float: left;
}
.social-icons ul {
margin: -10px 0 0;
float: right;
}
.social-icons ul li {
margin-top: 10px;
float: left;
padding-right: 1px;
}
.social-icons ul li a {
display: block;
font-family: 'Genericons';
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
padding: 2px 3px;
color: #d0d0d0;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
border-radius: 2px;
font-size: 21px;
*overflow: auto;
*zoom: 1;
*display: inline;
}
.social-icons ul li a:hover {
color: #fff !important;
}
.social-icons ul li.facebook a:before {
content: '\f204';
}
.social-icons ul li.facebook a:hover {
background: #3B5998;
}
.social-icons ul li.twitter a:before {
content: '\f202';
}
.social-icons ul li.twitter a:hover {
background: #00aced;
}
.social-icons ul li.google-plus a:before {
content: '\f218';
}
.social-icons ul li.google-plus a:hover {
background: #cd4132;
}
.social-icons ul li.pinterest a:before {
content: '\f209';
}
.social-icons ul li.pinterest a:hover {
background: #cb2027;
}
.social-icons ul li.linkedin a:before {
content: '\f207';
}
.social-icons ul li.linkedin a:hover {
background: #005a87;
}
.social-icons ul li.tumblr a:before {
content: '\f214';
}
.social-icons ul li.tumblr a:hover {
background: #2b4761;
}
.social-icons ul li.vimeo a:before {
content: '\f212';
}
.social-icons ul li.vimeo a:hover {
background: #1bb7ea;
}
.social-icons ul li.instagram a:before {
content: '\f215';
}
.social-icons ul li.instagram a:hover {
background: #517fa4;
}
.social-icons ul li.flickr a:before {
content: '\f211';
}
.social-icons ul li.flickr a:hover {
background: #0063db;
}
.social-icons ul li.youtube a:before {
content: '\f213';
}
.social-icons ul li.youtube a:hover {
background: #cd4132;
}
.social-icons ul li.rss a:before {
content: '\f413';
}
.social-icons ul li.rss a:hover {
background: #fc7216;
}
/* Header Image */
.header-image {
width: 100%;
height: auto;
}
/* =Menu
--------------------------------------------------------------*/
#main-nav {
border: 1px solid #439f55;
cursor: pointer;
background: #57ad68;
color: #fff;
position: relative;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
-webkit-box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2);
box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2);
}
#main-nav li {
float: left;
position: relative;
padding: 0;
}
#main-nav>ul {
padding-left: 20px;
}
#main-nav a {
color: #fff;
display: block;
float: left;
font-size: 14px;
padding: 8px 12px 0 10px;
height: 32px;
}
#main-nav a:hover, #main-nav ul li.current-menu-item a, #main-nav ul li.current_page_ancestor a, #main-nav ul li.current-menu-ancestor a, #main-nav ul li.current_page_item a, #main-nav ul li:hover > a {
background: #439f55;
-webkit-box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.2);
box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.2);
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
opacity: 1;
color: #fff;
}
#main-nav ul ul {
text-shadow: none;
}
#main-nav li:hover > a, #main-nav ul ul :hover > a, #main-nav a:focus {
color: #439f55;
}
/* Dropdown */
#main-nav ul li ul,
#main-nav ul li:hover ul ul,
#main-nav ul ul li:hover ul ul,
#main-nav ul ul ul li:hover ul ul,
#main-nav ul ul ul ul li:hover ul ul {
display: none;
z-index: 9999;
}
#main-nav ul li:hover ul,
#main-nav ul ul li:hover ul,
#main-nav ul ul ul li:hover ul,
#main-nav ul ul ul ul li:hover ul,
#main-nav ul ul ul ul ul li:hover ul {
display: block;
}
#main-nav ul li ul {
position: absolute;
background-color: #fff;
border-bottom: 4px solid #439f55;
top: 40px;
left: 0px;
width: 190px;
}
#main-nav ul li ul li {
float: none;
border-bottom: 1px solid #EAEAEA;
border-left: 1px solid #EAEAEA;
border-right: 1px solid #EAEAEA;
padding: 0;
}
#main-nav ul li ul li a,
#main-nav ul li.current-menu-item ul li a,
#main-nav ul li ul li.current-menu-item a,
#main-nav ul li.current_page_ancestor ul li a,
#main-nav ul li.current-menu-ancestor ul li a,
#main-nav ul li.current_page_item ul li a {
float: none;
line-height: 21px;
font-size: 13px;
font-weight: normal;
height: 100%;
padding: 6px 10px;
color: #777;
text-transform: capitalize;
background: #fff;
border: none;
-webkit-box-shadow: none;
box-shadow: none;
}
#main-nav ul li.current_page_item ul li a {
background: #fff;
-webkit-box-shadow: none;
box-shadow: none;
}
#main-nav ul li.current_page_item a {
border: none;
}
#main-nav ul li ul li a:hover, #main-nav ul li ul li:hover > a, #main-nav ul li.current-menu-item ul li a:hover {
background-color: #F9F9F9;
-webkit-box-shadow: none;
box-shadow: none;
color: #439f55;
}
#main-nav ul li ul li ul {
left: 188px;
top: 0px;
}
#main-nav select {
display: none;
}
.default-menu {
display: none;
}
/* =Featured Slider
--------------------------------------------------------------*/
.featured-slider, .featured-slider .slider-cycle {
position: relative;
height: 246px;
}
.featured-slider .displayblock {
display: block;
}
.featured-slider .displaynone {
display: none;
}
.featured-text {
display: none;
position: absolute;
bottom: 55px;
right: 30px;
text-align: right;
color: #fff;
-webkit-box-shadow: none;
box-shadow: none;
padding: 20px;
background: #555;
background: rgba(0, 0, 0, 0.5);
margin-top: 4px;
float: right;
clear: right;
width: 35%;
text-shadow: 0 2px 2px rgba(0, 0, 0, 0.4);
border-radius: 4px;
border: 1px;
}
.featured-text .featured-title {
font: 28px Helvetica, Arial, sans-serif;
font-weight: 200;
padding-bottom: 10px;
text-shadow: 0 2px 2px rgba(0, 0, 0, 0.6);
}
.featured-text .featured-title a {
color: #fff;
}
/* Controllers */
#controllers {
text-align: center;
line-height: 0;
position: absolute;
width: 100%;
bottom: 15px;
z-index: 9999;
}
#controllers a {
width: 10px;
height: 10px;
margin: 0 4px;
overflow: hidden;
display: inline-block;
background-color: #fff;
border-radius: 2px;
color: #fff;
}
#controllers a:hover, #controllers a.active {
background-color: #439f55;
color: #439f55;
}
/* =Content
-----------------------------------------------*/
#main {
padding: 30px 0 10px;
}
#main form input, #main form textarea {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
#content h1, #content h2, #content h3, #content h4, #content h5, #content h6 {
padding-bottom: 10px;
}
#content ul {
list-style-type: disc;
}
#content ul, #content ol {
margin: 0 0 20px 30px;
}
#content ul a, #content ol a {
color: #777;
}
#content ul a:hover, #content ol a:hover {
text-decoration: none;
color: #439f55;
}
#content ol {
list-style-type: decimal;
}
#content ol ol {
list-style: upper-alpha;
}
#content ol ol ol {
list-style: lower-roman;
}
#content ol ol ol ol {
list-style: lower-alpha;
}
#content ul ul, #content ol ol, #content ul ol, #content ol ul {
margin-bottom: 0;
}
.service-item {
padding-bottom: 15px;
}
.service-item .service-icon {
width: 40px;
height: 40px;
border-radius: 25px;
background-color: rgba(0, 0, 0, 0.6);
float: left;
display: block;
margin-right: 20px;
text-align: center;
}
.service-item .service-icon img {
height: 40px;
width: 40px;
border-radius: 25px;
}
#content .service-item .service-title {
font-size: 20px;
line-height: 25px;
color: #555;
display: block;
overflow: hidden;
padding-top: 7px;
padding-bottom: 0;
}
.sticky article {
border-bottom: 3px solid #57ad68;
}
#primary {
float: left;
margin-left: 3.06%;
width: 65.64%;
}
#content .post {
padding-top: 20px;
padding-bottom: 20px;
border-top: 2px dashed #eaeaea;
}
#content .post:first-child {
padding-top: 0;
border-top: none;
}
.page-title-wrap {
background-color: #f5f5f5;
border-bottom: 1px solid #eaeaea;
padding: 20px 0;
}
.page-title {
font-size: 24px;
line-height: 30px;
color: #555;
font-weight: normal;
float: left;
padding-top: 2px;
}
.page-title a {
color: #555;
}
.entry-title {
font: 24px 'Open Sans', sans-serif;
line-height: 1.4em;
}
.entry-title, .entry-title a {
color: #1b1e1f;
letter-spacing: -1px;
font-size: 32px;
text-shadow: 0 1px 0 #fff;
padding-top: 10px;
display: block;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-ms-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
}
.post .entry-title,
.page h2.entry-title {
padding-left: 2.5%;
padding-right: 2.5%;
}
.single-attachment .entry-title {
margin: 0 2.5%;
}
.medium-wrap .entry-title {
margin: 0;
padding: 5px 0;
}
.entry-title a:hover, .entry-title a:focus, .entry-title a:active {
color: #439f55;
}
.entry-meta-bar {
border-top: 1px solid #eaeaea;
border-top: rgba(0, 0, 0, .035) 1px solid;
border-bottom: 1px solid #eaeaea;
border-bottom: rgba(0, 0, 0, .035) 1px solid;
padding: 7px 5px;
clear: both;
background: #f9f9f9;
}
.entry-meta {
float: left;
padding-top: 2px;
font-size: 12px;
margin: 0 1.3%;
}
.entry-meta a {
color: #555;
}
.entry-meta a:hover {
color: #439f55;
}
.entry-meta span {
padding-right: 8px
}
.entry-meta .author:before,
.entry-meta .date:before,
.entry-meta .category:before,
.entry-meta .comments:before,
.tags:before,
.back-to-top a:before {
font-family: 'Genericons';
font-size: 18px;
vertical-align: bottom;
padding-right: 3px;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
*overflow: auto;
*zoom: 1;
*display: inline;
}
.entry-meta .author:before {
content: '\f304';
}
.entry-meta .date:before {
content: '\f303';
}
.entry-meta .category:before {
content: '\f301';
}
.entry-meta .comments:before {
content: '\f300';
}
.tags:before {
content: '\f302';
font-size: 18px;
}
.tags {
margin-bottom: 20px;
}
.tags a {
color: #888;
}
.tags a:hover {
color: #439f55;
}
.post-featured-image {
margin-bottom: 0px;
max-width: 700px;
}
.post-featured-image a {
display: block;
}
.entry-content dt, .comment-content dt {
font-weight: bold;
}
.entry-content dd, .comment-content dd {
margin-bottom: 20px;
}
.entry-content {
padding: 1.5% 2.5%;
display: block;
overflow: hidden;
}
table {
background: #f9f9f9;
border-left: 1px solid #eaeaea;
border-radius: 4px;
margin: 0 0 25px 0;
width: 100%;
}
table caption {
color: #999;
font-size: .85em;
text-transform: uppercase;
}
th {
border-top: 1px solid #eaeaea;
border-bottom: 1px solid #eaeaea;
border-right: 1px solid #eaeaea;
padding: 4px 2%;
font-weight: bold;
text-align: left;
}
td, tbody th {
background: #f9f9f9;
border-top: 1px solid #eaeaea;
border-bottom: 1px solid #eaeaea;
border-right: 1px solid #eaeaea;
color: #666;
font-size: 14px;
padding: 4px 2%;
}
tr:hover td, tr:hover th {
background: #fff;
}
thead th, tfoot th, thead tr:hover th, tfoot tr:hover th {
background: #d8d8d8;
}
/* Column */
.column {
margin-left: -3.06%;
}
.column a {
margin-bottom: 10px;
display: block;
}
.one-half, .one-third, .one-fourth {
float: left;
margin: 0 0 0 2.97%;
padding-bottom: 20px;
}
.one-half {
width: 47.03%;
}
.one-third {
width: 30.36%;
}
.one-fourth {
width: 22.02%;
}
/* Sidebar */
#secondary {
float: left;
margin-left: 3.06%;
width: 31.28%;
}
/* Left Sidebar Template */
.left-sidebar-template #primary,
.left-sidebar-template #content-woocommerce {
float: right;
}
.left-sidebar-template #secondary {
float: left;
margin-left: 0;
}
/* One Column Template */
.one-column-template .wrapper {
max-width: 708px;
}
.one-column-template .container {
width: 668px;
}
.no-sidebar-template #content {
width: 668px;
margin: 0 auto;
}
/* Custom Gallery Page */
.custom-gallery #main {
padding-bottom: 20px;
}
#content .custom-gallery-title, .custom-gallery-title a {
font-size: 20px;
text-align: center;
line-height: 25px;
color: #555;
padding-bottom: 0;
}
.custom-gallery-title a:hover {
color: #439f55;
}
/* Blog Medium Page */
.medium-wrap .post-featured-image {
width: 38.57%;
float: left;
margin-right: 2.67%;
margin-bottom: 2.5%;
}
.medium-wrap .entry-content {
padding-bottom: 0;
}
/* Contact Page */
.map-location {
background-color: #FFFFFF;
border: 1px solid #CCCCCC;
margin-bottom: 26px;
padding: 5px;
}
.contact #primary .form label {
display: block;
padding-bottom: 5px;
}
.wpcf7 p {
margin-bottom: 0;
}
/* Single Page */
.single .entry-meta {
float: none;
}
.single .entry-meta-bar {
padding-bottom: 10px;
}
/* =Attachments
-----------------------------------------------*/
.image-attachment div.attachment {
background: #f9f9f9;
border: 1px solid #ddd;
border-width: 1px 0;
margin: 0 -8.9% 1.625em;
overflow: hidden;
padding: 1.625em 1.625em 0;
text-align: center;
}
.image-attachment div.attachment img {
display: block;
height: auto;
margin: 0 auto 1.625em;
max-width: 100%;
}
.image-attachment div.attachment a img {
border-color: #f9f9f9;
}
.image-attachment div.attachment a:focus img, .image-attachment div.attachment a:hover img, .image-attachment div.attachment a:active img {
border-color: #ddd;
background: #fff;
}
.image-attachment .entry-caption p {
font-size: 10px;
letter-spacing: 0.1em;
line-height: 2.6em;
margin: 0 0 2.6em;
text-transform: uppercase;
}
/* =Comments
--------------------------------------------------------------*/
.comments-title {
font-size: 30px;
font-weight: normal;
line-height: 38px;
padding-bottom: 15px;
}
#content .comments-area ul, #content .comments-area ol {
margin: 0 0 30px 30px;
}
#content .comments-area ul ul, #content .comments-area ol ol {
margin-bottom: 0;
}
.comments-area article {
margin: 24px 0;
margin: 1.7rem 0;
border-bottom: 2px dashed #eaeaea;
}
.comments-area article header {
margin: 0 0 2.4rem;
overflow: hidden;
position: relative;
}
.comments-area article header img {
float: left;
padding: 0;
line-height: 0;
}
.comments-area article header cite, .comments-area article header time {
display: block;
margin-left: 35px;
margin-left: 4rem;
}
.comments-area article header cite {
font-style: normal;
font-size: 15px;
font-size: 1.1rem;
line-height: 1.4;
}
.comments-area article header time {
line-height: 1.7;
text-decoration: none;
font-size: 12px;
font-size: 0.86rem;
color: #5e5e5e;
}
.comments-area article header a {
text-decoration: none;
color: #5e5e5e;
}
.comments-area article header a:hover {
color: #21759b;
}
.comments-area article header cite a {
color: #444;
}
.comments-area article header cite a:hover {
text-decoration: underline;
}
.comments-area article header h4 {
position: absolute;
top: 0;
right: 0;
padding: 6px 12px;
padding: 0.4rem 0.8rem;
font-size: 12px;
font-size: 0.8rem;
font-weight: normal;
color: #fff;
background-repeat: repeat-x;
background: #0088d0;
border-radius: 3px;
border: 1px solid #007cbd;
}
.comments-area li.bypostauthor cite span {
position: absolute;
margin-left: 5px;
margin-left: 0.35rem;
padding: 2px 5px;
padding: 0.14rem 0.35rem;
font-size: 10px;
font-size: 0.714285714rem;
}
a.comment-reply-link:before {
font-family: 'Genericons';
content: '\f412';
margin-right: 3px;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
*overflow: auto;
*zoom: 1;
*display: inline;
}
a.comment-reply-link {
font-size: 13px;
font-size: 0.9rem;
line-height: 1.8;
color: #686868;
}
a.comment-reply-link:hover {
color: #21759b;
}
.commentlist .pingback {
line-height: 1.7;
margin-bottom: 24px;
margin-bottom: 1.71rem;
}
.commentlist .children {
margin-left: 48px;
margin-left: 3.42rem;
}
/* Comment form */
#respond {
margin-top: 1rem;
}
#respond h3#reply-title {
font-size: 30px;
font-weight: normal;
}
#respond h3#reply-title #cancel-comment-reply-link {
margin-left: 10px;
margin-left: 0.71rem;
font-weight: normal;
font-size: 12px;
font-size: 0.85rem;
}
#respond form {
margin: 24px 0;
margin: 1.7rem 0;
}
#respond form p {
margin: 0.78rem 0;
}
#respond form p.logged-in-as {
margin-bottom: 24px;
margin-bottom: 1.7rem;
}
#respond form label {
display: block;
line-height: 1.7;
}
#respond form input[type="text"], #respond form textarea {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
font-size: 0.85rem;
line-height: 1;
padding: 10px;
padding: 0.714rem;
width: 100%;
}
#respond form p.form-allowed-tags {
margin: 0;
font-size: 12px;
font-size: 0.85rem;
line-height: 2;
color: #5e5e5e;
}
.required {
color: red;
}
label ~ span.required {
display: block;
float: left;
margin: -18px 0 0 -16px;
margin: -1.28rem 0 0 -1.14rem;
}
#disqus_thread {
padding: 5px 15px;
}
/* Image borders */
img[class*="align"], img[class*="wp-image-"] {
/* Add fancy borders to all WordPress-added images but not things like badges and icons and the like */
}
a:focus img[class*="align"], a:hover img[class*="align"], a:active img[class*="align"], a:focus img[class*="wp-image-"], a:hover img[class*="wp-image-"], a:active img[class*="wp-image-"] {
/* Add some useful style to those fancy borders for linked images ... */
}
.img-border {
background-color: #fff;
padding: 5px;
border: 1px solid #ccc;
}
/* =Pagination
--------------------------------------------------------------*/
#wp_page_numbers {
margin-bottom: 40px;
border-top: 1px solid #EAEAEA;
border-bottom: 1px solid #EAEAEA;
padding: 7px 0;
}
#wp_page_numbers ul {
list-style-type: none;
list-style-image: none;
margin: 0;
float: right;
}
#wp_page_numbers ul li {
float: left;
margin-left: 7px;
}
#wp_page_numbers ul li.page_info {
padding: 3px 8px 0;
color: #999;
}
#wp_page_numbers ul li a {
color: #777;
display: block;
float: left;
background-color: #f9f9f9;
border: 1px solid #eaeaea;
border-radius: 3px;
padding: 1px 8px 2px;
}
#wp_page_numbers ul li a:hover, #wp_page_numbers ul li.active_page a {
border: 1px solid #57ad68;
color: #fff;
background: #439f55;
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3);
}
#wp_page_numbers ul li a:active {
-webkit-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.3);
box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.3);
}
/* wp-pagenavi */
.wp-pagenavi {
margin-bottom: 40px;
border-top: 1px solid #EAEAEA;
border-bottom: 1px solid #EAEAEA;
padding: 7px 0;
text-align: center;
}
.wp-pagenavi .pages {
padding: 3px 7px 0;
color: #999;
border: none;
}
.wp-pagenavi .current, .wp-pagenavi a {
display: inline-block;
color: #777;
background-color: #f9f9f9;
border: 1px solid #eaeaea;
border-radius: 3px;
padding: 1px 8px 2px !important;
margin-left: 4px;
}
.wp-pagenavi .current, .wp-pagenavi a:hover {
border: 1px solid #439f55 !important;
color: #fff;
background: #57ad68;
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3);
}
.wp-pagenavi a:active {
-webkit-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.3);
box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.3);
}
/* Default wp-page */
#content ul.default-wp-page {
list-style: none;
margin: 0 2.5%;
padding: 7px 0 0;
}
.home #content ul.default-wp-page {
margin: 0;
}
ul.default-wp-page li {
padding-bottom: 7px;
}
ul.default-wp-page li.previous {
float: left;
}
ul.default-wp-page li.next {
float: right;
}
ul.default-wp-page li a {
display: inline-block;
color: #777;
background-color: #f9f9f9;
border: 1px solid #eaeaea;
border-radius: 2px;
padding: 8px 8px 8px;
}
ul.default-wp-page li a:hover {
border: 1px solid #57ad68;
color: #fff !important;
border: 1px solid #439f55;
cursor: pointer;
background: #439f55;
color: #fff;
position: relative;
border-radius: 2px;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
-webkit-box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2);
box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2);
}
ul.default-wp-page li a:active {
-webkit-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.3);
box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.3);
}
/* Single pagination */
.pagination {
margin: 30px 0 30px 0px;
border-top: rgba(0, 0, 0, .035) 1px solid;
border-bottom: rgba(0, 0, 0, .035) 1px solid;
background: #f9f9f9;
padding: 7px 0;
text-align: center;
color: #999;
}
.pagination span {
display: inline-block;
color: #fff;
background-color: #57ad68;
border: 1px solid #57ad68;
border-radius: 2px;
padding: 1px 8px 2px;
margin-left: 3px;
}
.pagination a span {
background-color: inherit;
border: 1px solid #e5e5e5;
color: #777;
}
.pagination a:hover span {
background-color: #57ad68;
border: 1px solid #57ad68;
color: #fff;
}
/* =Widgets
-----------------------------------------------*/
.widget {
background: #fff;
padding: 15px;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
border-radius: 2px;
margin-bottom: 30px;
}
.widget ul li {
background-image: url('../images/arrow-right.png');
background-position: 0 8px;
background-repeat: no-repeat;
padding: 0 0 0 15px;
font-size: 13px;
}
.widget ul li a {
margin: 0 0 8px 0;
}
#secondary .recentcomments ul li {
background-position: 30px 6px;
}
.widget ul li a:hover {
color: #439f55;
text-decoration: underline;
}
.widget-title {
font-size: 18px;
line-height: 30px;
padding-bottom: 10px;
}
.widget-title, .widget-title a {
color: #555;
}
.widget-title a:hover {
color: #439f55;
}
/* Search Widget */
.widget_search input.s {
width: 100%;
height: 40px;
padding: 0 35px 0 15px;
color: #777;
background-color: #f9f9f9;
background-image: none;
background-position: right 10px;
border-color: #eaeaea;
cursor: text;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
opacity: 1;
text-indent: 0;
}
.widget_search input.s:focus {
border-color: #ccc;
}
/* Calendar Widget */
.widget_calendar #wp-calendar {
width: 95%;
text-align: center;
margin: auto;
border-radius: none;
}
.widget_calendar #wp-calendar caption, .widget_calendar #wp-calendar td, .widget_calendar #wp-calendar th {
text-align: center;
}
.widget_calendar #wp-calendar caption {
font-size: 11px;
font-weight: 500;
padding: 5px 0 3px 0;
text-transform: uppercase;
}
.widget_calendar #wp-calendar th {
background: #f4f4f4;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
font-weight: bold;
}
.widget_calendar #wp-calendar tfoot td {
background: #f4f4f4;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}
/* Text Widget */
.widget_article {
margin-bottom: 20px;
}
.widget_article .article-title a:hover {
text-decoration: underline;
}
.widget_article .post {
padding-bottom: 20px;
}
.widget_article .article-content p {
margin-bottom: 0px;
}
/* Tag Cloud */
.widget_tag_cloud a {
margin-right: 5px;
color: #777;
padding: 10px 0;
}
.widget_tag_cloud a:hover {
color: #439f55;
}
/* WP Caption */
.wp-caption {
margin-bottom: 30px;
max-width: 100%;
}
.wp-caption .wp-caption-text, .gallery-caption {
font-style: italic;
}
.wp-caption .wp-caption-text {
margin-bottom: 0;
padding: 15px 0;
border-bottom: 1px solid #EAEAEA;
}
.widget select {
max-width: 100%;
}
/* =Footer
-----------------------------------------------*/
#footerarea {
margin-bottom: 10px;
}
#footerarea form input, #footerarea form textarea {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
#footerarea .widget-wrap {
border-top: 1px solid #eaeaea;
padding: 0 2.5%;
}
#footerarea .widget-area {
padding: 40px 0;
}
#footerarea .widget {
padding-left: 15px;
padding-right: 15px;
}
.col-3 {
width: 31.6%;
float: left;
margin-left: 2.5%;
}
.col-3:first-child {
margin-left: 0;
}
#footerarea .widget_archive, #footerarea .widget_pages, #footerarea .widget_nav_menu, #footerarea .widget_recent_entries, #footerarea .widget_categories, #footerarea .widget_recent_comments, #footerarea .widget_meta, #footerarea .widget_rss {
margin-bottom: 22px;
}
#footerarea .widget_archive ul li, #footerarea .widget_pages ul li, #footerarea .widget_nav_menu ul li, #footerarea .widget_recent_entries ul li, #footerarea .widget_categories ul li, #footerarea .widget_recent_comments ul li, #footerarea .widget_meta ul li, #footerarea .widget_rss ul li {
padding-bottom: 8px;
}
#footerarea .widget-title {
font-size: 19px;
text-transform: uppercase;
line-height: 25px;
}
#footerarea .widget_article {
margin-bottom: 10px;
}
#footerarea .widget_info, #footerarea .widget_text {
margin-bottom: 15px;
}
/* Site Generator */
#site-generator {
padding: 20px 0px;
border-top: 2px dashed #eaeaea;
color: #999;
}
#site-generator .copyright {
float: left;
padding-top: 5px;
font-size: 12px;
}
.footer-right {
padding-top: 5px;
float: right;
font-size: 12px;
}
#site-generator .copyright a {
color: #777;
}
#site-generator .copyright a:hover {
color: #439f55;
}
/* Custom implementations */
.attachment-featured.wp-post-image {
-webkit-transition: all .5s ease;
-moz-transition: all .5s ease;
-ms-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease;
}
.attachment-featured.wp-post-image:hover {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
filter: alpha(opacity=80);
opacity: 0.8;
}
article {
background: #fff;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
box-sizing: border-box;
padding: 2.5%;
}
.medium-wrap article {
padding: 0;
}
.medium-wrap {
padding: 0 2.5%;
}
#comments {
padding: 5px 2.5%;
}
.comment {
-webkit-box-shadow: none;
box-shadow: none;
}
#main {
padding: 20px 2.5%;
}
/* =WooCommerce
-------------------------------------------------------------- */
#breadcrumb {
padding: 40px 0 0 0;
}
#breadcrumb a {
color: #0066cc;
font-size: 12px;
font-weight: 400;
}
#breadcrumb a:hover {
color: #444444;
text-decoration: none;
}
#content-woocommerce {
margin-bottom: 20px;
float: left;
width: 62.6%;
padding: 10px 1.5%;
background: #fff;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}
#content-woocommerce .page-title {
display: block;
float: none;
font-size: 32px;
line-height: 42px;
padding-bottom: 10px;
}
.cart-collaterals .shipping_calculator {
width: 100%;
}
.woocommerce ul.product_list_widget li {
background-image: none;
}
/* =Responsive Structure
-----------------------------------------------*/
/* All Tablet Portrait size smaller than standard 1079 (devices and browsers) */
@media only screen and (max-width: 1078px) {
.wrapper {
width: 95%;
}
#site-title a img {
max-width: 668px;
}
.no-sidebar-template #content {
margin: 0;
width: 100%;
}
#site-logo {
margin-left: 20px;
}
.page-title {
padding-left: 30px;
}
/* Column */
.column {
margin-left: -2.99%;
}
.one-half, .one-third, .one-fourth {
margin: 0 0 0 2.90%;
}
.one-third, .one-fourth {
width: 30.43%;
}
.widget_service .one-third, .widget_service .one-fourth {
width: 47.02%;
}
#footerarea .widget_info, #footerarea .widget_text {
margin-bottom: 30px;
}
}
/* All Mobile Portrait size smaller than 768 (devices and browsers) */
@media only screen and (max-width: 767px) {
hr {
margin-bottom: 30px;
}
input[type="text"], input[type="password"], textarea, input[type="reset"], input[type="button"], input[type="submit"] {
margin-bottom: 20px;
}
input.s {
margin: 0;
}
input.s:focus {
width: 235px;
}
#primary,
#secondary,
#content-woocommerce,
.col-3 {
float: none;
margin-left: 0;
width: auto;
}
.featured-title, .featured-content, .featured-text {
display: none;
}
.one-column-template .container, .container {
width: auto;
}
.comments-title, #respond h3#reply-title {
font-size: 26px;
line-height: 32px;
}
#content h1, #content h2, #content h3, #content h4, #content h5, #content h6 {
padding-bottom: 10px;
}
#branding {
margin-top: 15px;
}
.hgroup-wrap {
padding-bottom: 25px;
padding-top: 0;
}
.hgroup-right {
margin-top: 32px;
}
.hgroup-right .social-icons {
display: none;
}
#site-logo {
margin-top: 25px;
}
#site-title a img {
max-width: 280px;
}
#main-nav {
height: 36px;
padding: 13px 0 0;
}
#main-nav ul {
display: none;
}
#main-nav select {
display: block;
width: 100%;
border: 0 none;
font: 14px 'Open Sans', sans-serif;
color: #555;
height: 24px;
}
.page-title-wrap {
padding: 10px 0;
}
.breadcrumb {
margin-top: 0px;
float: none;
text-align: left;
}
#main {
padding-top: 40px;
}
.post-featured-image {
margin-bottom: 5px;
}
.entry-content {
padding-bottom: 0px;
}
/* Column */
.column {
margin-left: 0;
}
.one-half, .one-third, .one-fourth, .widget_service .one-half, .widget_service .one-third, .widget_service .one-fourth {
margin: 0;
padding-bottom: 10px;
width: 100%;
}
#content .post {
padding-bottom: 30px;
}
.widget_search input.s, .widget_search input.s:focus {
width: 100%;
}
#wp_page_numbers, .wp-pagenavi, #content ul.default-wp-page, .pagination {
margin-bottom: 30px;
}
#wp_page_numbers ul li.page_info, .wp-pagenavi .pages {
display: none;
}
.wp-caption {
margin-bottom: 15px;
}
.widget {
margin-bottom: 30px;
}
.widget_custom-tagcloud {
margin-bottom: 22px;
}
.widget_article {
margin-bottom: 10px;
}
.widget_service {
margin-bottom: 0;
}
.widget_recent_work {
margin-bottom: 10px;
}
.widget_testimonial .testimonial-icon {
float: none;
margin-bottom: 15px;
}
#site-generator .social-icons, #site-generator .copyright {
float: none;
width: 100%;
}
#site-generator .social-icons ul {
text-align: center;
float: none;
}
#site-generator .social-icons ul li {
display: inline-block;
float: none;
}
#site-generator .copyright {
padding-top: 10px;
text-align: center;
}
.footer-right {
text-align: center;
float: none;
}
}
/* All Mobile landscape size and All Mini Tablet Portrait size smaller than standard 768 and larger than 480 (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
input.s:focus {
width: 375px;
}
.hgroup-wrap {
padding-bottom: 30px;
}
.hgroup-right {
margin-top: 37px;
}
#site-title a img {
max-width: 420px;
}
/* Column */
.column {
margin-left: -3.57%;
}
.one-half, .one-third, .one-fourth {
margin: 0 0 0 3.44%;
width: 46.56%;
}
.widget_service .column {
margin-left: 0;
}
#footerarea {
margin-bottom: 10px;
}
}
/* All Mobile size smaller than standard 320 (devices and browsers) */
@media only screen and (max-width: 319px) {
.one-column-template .wrapper, .wrapper, .one-column-template .container, .container {
width: 95%;
}
}
/* Customize colors */
body {
background-color: #001719;
}
a {
color: #004c99;
}
#site-title a {
color: darkred;
}
.hgroup-right img {
height: 131px;
}
#site-title a:hover {
color: #063572;
}
.wrapper {
background: #F8F8F8;
}
.social-icons ul li a {
color: #186ebf;
}
#main-nav a,
#main-nav a:hover,
#main-nav ul li.current-menu-item a,
#main-nav ul li.current_page_ancestor a,
#main-nav ul li.current-menu-ancestor a,
#main-nav ul li.current_page_item a,
#main-nav ul li:hover > a {
color: #fff;
}
.widget,
article {
background: #fff;
}
.entry-title,
.entry-title a,
h1,
h2,
h3,
h4,
h5,
h6,
.widget-title {
color: #1b1e1f;
}
a:focus,
a:active,
a:hover,
.tags a:hover,
.custom-gallery-title a,
.widget-title a,
#content ul a:hover,
#content ol a:hover,
.widget ul li a:hover,
.entry-title a:hover,
.entry-meta a:hover,
#site-generator .copyright a:hover {
color: #6e92b7;
}
#main-nav {
background: #001f4f;
border-color: #001f4f;
}
#main-nav ul li ul,
body {
border-color: #001f4f;
}
#main-nav a:hover,
#main-nav ul li.current-menu-item a,
#main-nav ul li.current_page_ancestor a,
#main-nav ul li.current-menu-ancestor a,
#main-nav ul li.current_page_item a,
#main-nav ul li:hover > a,
#main-nav li:hover > a,
#main-nav ul ul:hover > a,
#main-nav a:focus {
background: #007fbf;
}
#main-nav ul li ul li a:hover,
#main-nav ul li ul li:hover > a,
#main-nav ul li.current-menu-item ul li a:hover {
color: #007fbf;
}
.entry-content {
color: #1D1D1D;
}
::selection {
background: #3a73c9;
}
blockquote {
border-color: #3a73c9;
}
#controllers a:hover,
#controllers a.active {
color: #3a73c9;
}
/* Prilagoditve */
#site-description {
color: #444;
margin-top: 5px;
}
#main-nav a {
font-size: 1rem;
}
#main-nav {
background-image: url(../images/temno.png);
border: none;
}
header, #main {
background-image: url(../images/svetlo.png);
}
header .hgroup-right {
margin-top: 0;
position: absolute;
right: 0;
top: 0;
bottom: 0;
}
header .hgroup-right img {
height: 100%;
}
header .hgroup-wrap {
padding-right: 200px;
}
header .container {
position: relative;
}
@media screen and (max-width: 485px) {
header .hgroup-wrap {
padding-right: 20px;
}
header .hgroup-right {
position: relative;
}
header .hgroup-right img {
width: 100%;
height: auto;
}
}