/* Theme Name: inspiredchiro Theme Author URI: http://www.studio313.com.au Description: 2014 theme for . Custom WordPress websites: www.studio313.com.au Author: Chris Myers and Pawel Author URI: http://www.studio313.com.au/ Version: 1.0 */ /** SITE STYLES **/ body { -webkit-text-size-adjust: none; background: #fff url(images/bg-blue-waves.png) center top no-repeat; font-size:13px;} h1, h2, h3, h4 { font-family: 'comfortaaregular'; margin:0; padding:0; text-decoration:none; outline:none; border:none;} h1 { font-size: 34px; color:#006a52; margin:0 0 10px 0;} h2 { font-size: 20px; color:#2dccd3; margin:0 0 7px 0;} h3 { font-size: px; color:; margin:0 0 7px 0;} h4 { font-size: px; color:; margin:0 0 7px 0;} p, a, li { font-family: ; margin:0; padding:0; text-decoration:none; outline:none; border:none;} p, li { font-size: px; color:; line-height:140%;} p { margin:0 0 7px 0;} a { text-decoration:none; color:; outline:none; border:none;} a:hover { color:;} ul, ol { margin-left:20px; margin-bottom:7px; color:;} ul { list-style:disc;} ol { list-style:decimal;} @media only screen and (min-width : 900px) {.no-lr-padding { padding-left:0 !important; padding-right:0 !important;} .no-l-padding { padding-left:0 !important;} .no-r-padding { padding-right:0 !important;}} @media only screen and (max-width : 1023px) {.no-m-padding { padding-left:0 !important; padding-right:0 !important;}} /* colours */ /* Logos */ /* WRAPPERS */ header { position:relative; margin:0; padding:0;} footer { position:relative; } /** HEADER **/ .head-panel-dgrey { background:#323232; color:#fff; font-family: 'comfortaaregular'; font-size:16px;} .header-hours p { margin:0; padding:0; margin-top:7px;} nav { position:relative; z-index:1000;} .nav-wrap { position:relative;} .header-appt { } .header-appt ul { position:relative; margin:0; padding:0; list-style:none;} .header-appt ul li { display:table; margin:0; padding:0; width:50%; float:left;} .header-appt ul li a { background:#2dccd3; text-decoration:none; text-align:center; height:35px; display:block; padding:7px 10px; color:#fff; -webkit-transition: background-color 0.5s ease; -moz-transition: background-color 0.5s ease; -ms-transition: background-color 0.5s ease; -o-transition: background-color 0.5s ease; transition: background-color 0.5s ease;} .header-appt ul li:first-child a { background:#006a52;} .header-appt ul li a:hover { background:#545454;} .header-appt ul li:nth-of-type(2) a {font-family: 'comfortaabold'; font-size:16px;} .header-appt ul li a:hover {} nav { position:relative; top:0px; height:140px;} .navbar-default { background:none; border:none;} ul.navbar-nav { position:relative; top:70px;} ul.navbar-nav a { font-size:20px; font-family: 'comfortaaregular'; color:#006a52 !important; -webkit-transition: color 0.25s ease; -moz-transition: color 0.25s ease; -ms-transition: color 0.25s ease; -o-transition: color 0.25s ease; transition: color 0.25s ease;} ul.navbar-nav a:hover { color:#545454 !important;} .header-feature-menu {} .header-feature-menu ul { position:relative; margin:0; padding:0; list-style:none;} .header-feature-menu ul li { margin:0; padding:0; display:inline; position:relative;} .header-feature-menu ul li a { border-radius:0 0 0 20px; margin-bottom:5px; padding:30px 20px; height:78px; background:#2dccd3; font-size:32px; color:#006a52; font-family: 'comfortaaregular' !important; display:block; width:100% !important; position:relative; -webkit-transition: color 0.25s ease; -moz-transition: color 0.25s ease; -ms-transition: color 0.25s ease; -o-transition: color 0.25s ease; transition: color 0.25s ease;} .header-feature-menu ul li:nth-child(2) a { background:#5DD6DB;} .header-feature-menu ul li:nth-child(3) a { background:#85E0E4;} .header-feature-menu ul li:nth-child(4) a { background:#ADEBEC;} .header-feature-menu ul li:nth-child(5) a { background:#D6F5F6;} .header-feature-menu ul li a:hover { text-decoration:none; color:#fff;} .header-feature-menu ul li.selected a { background:#006a52; color:#fff;} .header-feature-menu ul li.selected a .head-feat-arrow { display:none;} .head-feat-arrow { position:absolute; height:78px; width:78px; display:block; top:0; right:0; background:url(images/arrow-white-right.png) center center no-repeat; background-color:rgba(0,106,82,0.20); z-index:100;} @media only screen and (max-width : 500px) { .header-feature-menu ul li a { padding:15px 20px; height:50px; background:#2dccd3; font-size:18px; color:#006a52; display:block; width:48% !important; float:left;} .header-feature-menu ul li:nth-of-type(even) a { float:right;} .header-feature-menu ul li:nth-child(1) a { width:100% !important;} .head-feat-arrow { position:absolute; height:50px; width:50px; display:block; top:0; right:0; background:url(images/arrow-white-right-mobile.png) center center no-repeat; background-color:rgba(0,106,82,0.20); z-index:100;} } @media only screen and (max-width : 400px) { .header-feature-menu ul li a { font-size:14px; } .} @media only screen and (max-width : 1023px) { .head-panel-dgrey {font-size:13px; text-align:center;} .header-hours p { margin-bottom:7px;} .navbar-collapse { background-color:#fff; position:relative; z-index:1001;} ul.navbar-nav { position:relative; top:0;} } .header-tagline { position:absolute; top:30px; right:25px;} @media only screen and (min-width : 740px) and (max-width : 800px) { .header-tagline { position:absolute; top:30px; right:25px; width:50%; height:auto;} a.navbar-brand { width:80%; height:auto;} a.navbar-brand img { width:100%; height:auto;} } @media only screen and (max-width : 739px) { .header-tagline { position:absolute; top:95px; right:25px; width:50%; height:auto;} a.navbar-brand { width:45%; height:auto;} a.navbar-brand img { width:100%; height:auto;} .navbar-toggle { position:relative; top:25px; right:10px;} } @media only screen and (max-width : 739px) and (orientation : landscape) { .header-tagline { top:80px;} } @media only screen and (max-width : 500px) and (orientation : landscape) { .header-tagline { top:90px; width:100% !important; margin:0; padding:0; left:20px;} } @media only screen and (max-width : 480px) and (orientation : portrait) { .header-tagline { top:90px; width:95% !important; margin:0; padding:0; left:10px;} .header-tagline img { width:100%; height:auto;} } /** CONTENT **/ .video-top { display:none;} @media only screen and (max-width : 767px) {.video-top { display:block; margin-bottom:30px;}} .video-right { display:block;} @media only screen and (max-width : 767px) {.video-right { display:none; }} .video-right iframe, .video-top iframe { width:100%; height:auto;} .embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .grey-feature {border-bottom:1px solid #bab7af; border-top:1px solid #bab7af; background:#f1f1ef; padding:30px 0; margin:30px 0 0;} .grey-feature p { color:#2dccd3; font-family: 'comfortaaregular'; font-size:24px; max-width:900px; text-align:center; margin:0 auto;} .page-content {} .page-content.home-content { padding-top:30px;} .page-content p { color:#323232; font-family: 'fira_sansregular'; font-size:18px;} .content.internal { margin-top:30px;} .home-cont-sect { margin-bottom:40px;} .home-cont-sect h1 { color:#2dccd3; font-family: 'comfortaaregular'; font-size:24px;} .home-headshot { float:left; margin-right:20px; margin-bottom:30px; margin-top:5px; border-radius:0 0 0 20px; overflow:hidden;} .page-sidebar {} .page-sidebar ul { position:relative; margin:0; padding:0; list-style:none;} .page-sidebar ul li { background:#C8C5BF; position:relative; border-radius:0 0 20px 0; margin-bottom:6px;} .page-sidebar ul li:nth-child(1) { background:#5DD6DB;} .page-sidebar ul li:nth-child(2) { background:#378775;} .page-sidebar ul li .sidebar-icon { width:17%; min-height:60px; position:absolute; top:10px; left:1.5%;} .page-sidebar ul li .sidebar-icon.phone { background:url(images/icon-phone.png) center center no-repeat;} .page-sidebar ul li .sidebar-icon.appt { background:url(images/icon-appointment.png) center center no-repeat;} .page-sidebar ul li .sidebar-icon.hours { background:url(images/icon-hours.png) center center no-repeat;} .page-sidebar ul li .sidebar-icon.address { background:url(images/icon-address.png) center center no-repeat;} .page-sidebar ul li p { background:#bab7af; border-radius:0 0 20px 0; width:80%; display:inline-block; float:right; min-height:60px; margin:0; padding:14px 20px; color:#fff; font-family: 'comfortaabold'; font-size:17px;} .page-sidebar ul li p a {color:#fff; font-family: 'comfortaabold'; font-size:17px;} .page-sidebar ul li:nth-child(1) p { background:#39CCD2;} .page-sidebar ul li:nth-child(2) p { background:#0B6952;} .page-sidebar ul li p span { font-family: 'comfortaaregular'; font-size:17px;} .page-sidebar.quote { padding-top:50px;} .page-sidebar.quote p { color:#bab7af; font-size:20px; font-family: 'fira_sansitalic';} .page-sidebar.quote p span {font-family: 'comfortaabold'; font-size:15px;} .gen-header { margin-bottom:30px;} @media only screen and (max-width : 850px) { .page-sidebar.quote { padding-top:0px; margin-bottom:30px;} .page-sidebar ul li p br { display:none;} .page-sidebar ul li .sidebar-icon { width:17%; min-height:60px; position:absolute; top:0px; left:1.5%;} } /** FOOTER **/ footer { margin-top:50px;} .footer-grey { border-bottom:1px solid #bab7af; border-top:1px solid #bab7af; background:#f1f1ef; padding:30px 0;} .footer-grey ul.footer-nav { list-style:none; padding:0; margin:0; position:relative; margin-top:10px;} .footer-grey ul.footer-nav li { display:inline-block; padding:0; margin:0; width:100%; margin-bottom:3px;} .footer-grey ul.footer-nav li a { color:#bab7af; font-family: 'fira_sansregular'; font-size:14px;} .footer-rhs { text-align:right;} .footer-rhs img { margin-top:10px;} .footer-rhs p { color:#bab7af; font-family: 'fira_sansregular'; font-size:13px; margin-top:35px;} .footer-rhs p span { margin:0 15px;} .footer-white { padding:20px 0; background:#fff;} .footer-white p { text-align:center; color:#bab7af; font-family: 'fira_sansregular'; font-size:13px;} /* misc */ .cf:before, .cf:after { content: ""; display: table; } .cf:after { clear: both; } .cf { zoom: 1; } .fl { float:left;} .fr { float:right;} .hide { display:none;} .show { display:block;} /* image align */ img.alignright {float:right; margin:10px 0 10px 15px;} .alignright {float:right; } img.alignleft {float:left; margin:10px 15px 10px 0;} .alignleft {float:left; } img.aligncenter {display: block; margin-left: auto; margin-right: auto; margin-bottom:10px; margin-top:10px;} .aligncenter {display: block; margin-left: auto; margin-right: auto;} /* fonts */ /** Comfortaa **/ @font-face { font-family: 'comfortaabold'; src: url('fonts/Comfortaa-ff/comfortaa_bold.eot'); src: url('fonts/Comfortaa-ff/comfortaa_bold.eot?#iefix') format('embedded-opentype'), url('fonts/Comfortaa-ff/comfortaa_bold.woff2') format('woff2'), url('fonts/Comfortaa-ff/comfortaa_bold.woff') format('woff'), url('fonts/Comfortaa-ff/comfortaa_bold.ttf') format('truetype'), url('fonts/Comfortaa-ff/comfortaa_bold.svg#comfortaabold') format('svg'); font-weight: normal; font-style: normal;} @font-face { font-family: 'comfortaaregular'; src: url('fonts/Comfortaa-ff/comfortaa_regular.eot'); src: url('fonts/Comfortaa-ff/comfortaa_regular.eot?#iefix') format('embedded-opentype'), url('fonts/Comfortaa-ff/comfortaa_regular.woff2') format('woff2'), url('fonts/Comfortaa-ff/comfortaa_regular.woff') format('woff'), url('fonts/Comfortaa-ff/comfortaa_regular.ttf') format('truetype'), url('fonts/Comfortaa-ff/comfortaa_regular.svg#comfortaaregular') format('svg'); font-weight: normal; font-style: normal;} @font-face { font-family: 'comfortaathin'; src: url('fonts/Comfortaa-ff/comfortaa_thin.eot'); src: url('fonts/Comfortaa-ff/comfortaa_thin.eot?#iefix') format('embedded-opentype'), url('fonts/Comfortaa-ff/comfortaa_thin.woff2') format('woff2') url('fonts/Comfortaa-ff/comfortaa_thin.woff') format('woff'), url('fonts/Comfortaa-ff/comfortaa_thin.ttf') format('truetype'), url('fonts/Comfortaa-ff/comfortaa_thin.svg#comfortaathin') format('svg'); font-weight: normal; font-style: normal;} /** Fira Sans **/ @font-face { font-family: 'fira_sansbold'; src: url('fonts/Firasans-ff/firasans-bold.eot'); src: url('fonts/Firasans-ff/firasans-bold.eot?#iefix') format('embedded-opentype'), url('fonts/Firasans-ff/firasans-bold.woff2') format('woff2'), url('fonts/Firasans-ff/firasans-bold.woff') format('woff'), url('fonts/Firasans-ff/firasans-bold.ttf') format('truetype'), url('fonts/Firasans-ff/firasans-bold.svg#fira_sansbold') format('svg'); font-weight: normal; font-style: normal;} @font-face { font-family: 'fira_sansextrabold'; src: url('fonts/Firasans-ff/firasans-extrabold.eot'); src: url('fonts/Firasans-ff/firasans-extrabold.eot?#iefix') format('embedded-opentype'), url('fonts/Firasans-ff/firasans-extrabold.woff2') format('woff2'), url('fonts/Firasans-ff/firasans-extrabold.woff') format('woff'), url('fonts/Firasans-ff/firasans-extrabold.ttf') format('truetype'), url('fonts/Firasans-ff/firasans-extrabold.svg#fira_sansextrabold') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'fira_sansitalic'; src: url('fonts/Firasans-ff/firasans-italic.eot'); src: url('fonts/Firasans-ff/firasans-italic.eot?#iefix') format('embedded-opentype'), url('fonts/Firasans-ff/firasans-italic.woff2') format('woff2'), url('fonts/Firasans-ff/firasans-italic.woff') format('woff'), url('fonts/Firasans-ff/firasans-italic.ttf') format('truetype'), url('fonts/Firasans-ff/firasans-italic.svg#fira_sansitalic') format('svg'); font-weight: normal; font-style: normal;} @font-face { font-family: 'fira_sansmedium'; src: url('fonts/Firasans-ff/firasans-medium.eot'); src: url('fonts/Firasans-ff/firasans-medium.eot?#iefix') format('embedded-opentype'), url('fonts/Firasans-ff/firasans-medium.woff2') format('woff2'), url('fonts/Firasans-ff/firasans-medium.woff') format('woff'), url('fonts/Firasans-ff/firasans-medium.ttf') format('truetype'), url('fonts/Firasans-ff/firasans-medium.svg#fira_sansmedium') format('svg'); font-weight: normal; font-style: normal;} @font-face { font-family: 'fira_sanssemibold'; src: url('fonts/Firasans-ff/firasans-semibold.eot'); src: url('fonts/Firasans-ff/firasans-semibold.eot?#iefix') format('embedded-opentype'), url('fonts/Firasans-ff/firasans-semibold.woff2') format('woff2'), url('fonts/Firasans-ff/firasans-semibold.woff') format('woff'), url('fonts/Firasans-ff/firasans-semibold.ttf') format('truetype'), url('fonts/Firasans-ff/firasans-semibold.svg#fira_sanssemibold') format('svg'); font-weight: normal; font-style: normal;} @font-face { font-family: 'fira_sansregular'; src: url('fonts/Firasans-ff/firasans-regular.eot'); src: url('fonts/Firasans-ff/firasans-regular.eot?#iefix') format('embedded-opentype'), url('fonts/Firasans-ff/firasans-regular.woff2') format('woff2'), url('fonts/Firasans-ff/firasans-regular.woff') format('woff'), url('fonts/Firasans-ff/firasans-regular.ttf') format('truetype'), url('fonts/Firasans-ff/firasans-regular.svg#fira_sansregular') format('svg'); font-weight: normal; font-style: normal; }