/*
IE Fix Reference:
*/
body {
background: #FFF url('http://www.ilovetocreate.com/images/v6/subtle-fabric-bg.jpg');
font: 12px/18px Arial, Helvetica, sans-serif !important;
}
/* Header Styles */
header {
width:100%;
height:155px;
background:url(../images/headerBg.png) bottom repeat-x;
box-shadow: 0 1px 1px rgba(0,0,0,.4);
/* temp mobile fix */ min-width:1020px;
}
section#top {
position:relative;
max-width:1020px;
/* temp mobile fix */ min-width:1020px;
height:155px;
margin:0 auto;
}
nav {
max-width:1020px;
/* temp mobile fix */ min-width:1020px;
margin:0 auto;
position:absolute;
top:118px;
}
#logo {
position:absolute;
top:5px;
left:0;
}
#logo > a {
text-indent:-9999em;
background:url(../images/il2c-logo.jpg) no-repeat;
width:391px;
height:108px;
display:block;
}
#logo.alpha {
position:absolute;
top:35px;
left:0;
}
#logo.alpha > a {
text-indent:-9999em;
background:url(../images/logo-alpha.png) no-repeat;
width:300px;
height:70px;
display:block;
}
.extraNav{
height:35px;
position:absolute;
top:0;
right:20px;
padding:0 5px;
background:#2E2E2E;
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0 4px 5px rgba(0,0,0,.6), inset 0 1px 0 rgba(0,0,0,.6);
-moz-box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0 4px 5px rgba(0,0,0,.6), inset 0 1px 0 rgba(0,0,0,.6);
box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0 4px 5px rgba(0,0,0,.6), inset 0 1px 0 rgba(0,0,0,.6);
-webkit-border-radius: 0 0 10px 10px;
-moz-border-radius: 0 0 10px 10px;
border-radius: 0 0 10px 10px;
}
.lte8 .extraNav { border-right:solid 1px #555; border-bottom:solid 1px #555; border-left:solid 1px #555; }
.extraNav a {
float:left;
padding:8px 8px 4px;
color:rgb(255,255,255);
display:block;
-webkit-transition:color 150ms ease-in;
-moz-transition:color 150ms ease-in;
-o-transition:color 150ms ease-in;
-ms-transition:color 150ms ease-in;
transition:color 150ms ease-in;
}
.extraNav a:hover {
color:rgb(42,133,232);
}
#searchBox {
/*width:315px;*/
padding:4px 0 0 48px !important;
/*height:34px;*/
}
.ie9 #searchBox, .ie8 #searchBox, .ie7 #searchBox{width:306px;}
#searchBox #txtSearchTerms {
width:250px;
height:20px;
padding:4px;
background:#fff;
float:left;
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0 2px 3px rgba(0,0,0,.6), inset 0 1px 0 rgba(0,0,0,.6);
-moz-box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0 2px 3px rgba(0,0,0,.6), inset 0 1px 0 rgba(0,0,0,.6);
box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0 2px 3px rgba(0,0,0,.6), inset 0 1px 0 rgba(0,0,0,.6);
border:none;
}
#searchBox #defaultMainButton {
display:none;
visibility:hidden;
}
#searchBox #btnMainSearch {
float:left;
margin:1px 0 0;
border:none;
height:27px;
width:35px;
background: rgb(157,213,58) url('../images/searchBG.png') center no-repeat;
border: none !important;
-moz-transition: all 400ms ease;
-webkit-transition: all 300ms ease;
-o-transition: all 300ms ease;
-ms-transition: all 300ms ease;
transition: all 300ms ease;
-webkit-box-shadow: inset 0 0 1px rgba(0,0,0,.8), inset 0 2px 0 rgba(255,255,255,.5), inset 0 0 0 rgba(0,0,0,.6), inset 0 -2px 0 rgba(255,255,255,.3);
-moz-box-shadow: inset 0 0 1px rgba(0,0,0,.8), inset 0 2px 0 rgba(255,255,255,.5), inset 0 0 0 rgba(0,0,0,.6), inset 0 -2px 0 rgba(255,255,255,.3);
box-shadow: inset 0 0 1px rgba(0,0,0,.8), inset 0 2px 0 rgba(255,255,255,.5), inset 0 0 0 rgba(0,0,0,.6), inset 0 -2px 0 rgba(255,255,255,.3);
border-radius:0 4px 4px 0;
}
.lte8 #searchBox #btnMainSearch {
height:28px;
margin-top:0px;
}
#searchBox #btnMainSearch:hover {
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0 1px 3px rgba(0,0,0,.6), inset 0 0 0 rgba(0,0,0,0);
-moz-box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0 2px 3px rgba(0,0,0,.6), inset 0 0 0 rgba(0,0,0,0);
box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0 1px 3px rgba(0,0,0,.6), inset 0 0 0 rgba(0,0,0,0);
transition:box-shadow 300ms ease;
cursor:pointer;
}
#pageContent {
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0 2px 3px rgba(0,0,0,.6);
-moz-box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0 4px 5px rgba(0,0,0,.6);
box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0 2px 3px rgba(0,0,0,.6);
background:#fff !important;
padding:20px;
width:980px;
margin:0 auto;
}
footer {
background: #313131 url(../images/footerBg.png) repeat-x;
min-height:180px;
/*max-width:980px;*/
/* temp mobile fix */min-width:980px;
margin:0 auto 20px;
padding:0 20px;
box-shadow:0 2px 3px rgba(0,0,0,.4);
/*border-radius: 0 0 10px 10px;*/
position:relative;
}
.footerHeader {
height:35px;
padding-top:1px;
position:relative;
margin:0 auto !important;
}
ul#socialMedia {
position:absolute;
right:0;
bottom:0;
margin-bottom:0 !important;
height:30px;
}
ul#socialMediaHeader {
position:absolute;
right:20px;
bottom:37px;
margin-bottom:0 !important;
height:30px;
}
ul#socialMedia li, ul#socialMediaHeader li {
float:left;
margin:0 4px;
}
ul#socialMedia > li > a, ul#socialMediaHeader > li > a {
text-indent:-9999em;
display:block;
overflow:hidden;
height:20px;
width:35px;
background:url(../images/social-sprite.png) no-repeat;
box-shadow:0 -1px 2px rgba(0, 0, 0, 0.4) inset, 0 -1px 2px rgba(0, 0, 0, 0.4), 0 0 1px rgba(0, 0, 0, 0.8) inset,
0 2px 0 rgba(255, 255, 255, 0.5) inset, 0 0 0 rgba(0, 0, 0, 0.6) inset;
margin-top:10px;
-moz-transition: all 300ms ease;
-webkit-transition: all 300ms ease;
-o-transition: all 300ms ease;
-ms-transition: all 300ms ease;
transition: all 300ms ease;
border-radius:6px 6px 0 0;
}
ul#socialMedia > li > a:hover, ul#socialMediaHeader > li > a:hover {padding-top:10px; margin-top:0;}
ul#socialMedia li.facebook a, ul#socialMediaHeader li.facebook a {background-position:0 0;}
ul#socialMedia li.twitter a, ul#socialMediaHeader li.twitter a {background-position:-36px 0;}
ul#socialMedia li.youtube a, ul#socialMediaHeader li.youtube a { background-position:-72px 0;}
ul#socialMedia li.flickr a, ul#socialMediaHeader li.flickr a { background-position:-108px 0;}
ul#socialMedia li.blog a, ul#socialMediaHeader li.blog a { background-position:-144px 0;}
ul#socialMedia li.pinterest a, ul#socialMediaHeader li.pinterest a { background-position:-180px 0;}
ul#socialMedia li.googlePlus a, ul#socialMediaHeader li.googlePlus a { background-position:-216px 0;}
ul#brandFamily {
position:absolute;
right:20px;
bottom:55px;
margin-bottom:0 !important;
height:50px;
}
ul#brandFamily > li {
float:left;
margin:0 4px;
}
ul#brandFamily > li > a {
width:80px;
height:50px;
display:block;
background:url(../images/brand-sprites-clipped.png) no-repeat;
overflow:hidden;
padding:0 !important;
text-indent:-9999em;
}
ul#brandFamily > li > a.Aleenes {background-position: -172px 0; width: 55px;}
ul#brandFamily > li > a.CraftyChica {background-position: -242px 0;}
ul#brandFamily > li > a.Duncan {background-position: 0 0;}
ul#brandFamily > li > a.Scribbles {background-position: -325px 0;}
ul#brandFamily > li > a.Tulip {background-position: -81px 0;}
ul#brandFamily > li > a.Puffy {background-position: -405px 0;}
footer .row {margin:10px auto 10px;}
footer h6 {
color:rgb(200,200,200);
font-size:1em;
font-weight:bold;
border-bottom:1px solid rgb(90,90,90);
padding-bottom:4px;
}
footer .two ul, footer p {border-top:1px solid rgb(50,50,50);}
footer ul li {
margin:3px 0;
font-size:0.9em;
}
footer .two li {padding-left:10px;}
footer ul a {
color:rgb(225,225,225);
-moz-transition:all 300ms ease;
-webkit-transition:all 300ms ease;
-o-transition:all 300ms ease;
transition:all 300ms ease;
}
footer ul a:hover {color:rgb(42,133,232);}
footer p {
color:rgb(225,225,225);
padding-top:3px;
font-size:1.3rem !important;
}
footer #copyright {
position:absolute;
bottom:10px;
right:20px;
height:15px;
color:rgb(200,200,200);
color:#c8c8c8;
font:12px Arial, Helvetica, sans-serif;
}
/* =======================================
Button Mods
======================================= */
.button.inset {
-webkit-box-shadow: inset 0 0 1px rgba(0,0,0,.8), inset 0 2px 0 rgba(255,255,255,.5), inset 0 0 0 rgba(0,0,0,.6), inset 0 -2px 0 rgba(255,255,255,.3);
-moz-box-shadow: inset 0 0 1px rgba(0,0,0,.8), inset 0 2px 0 rgba(255,255,255,.5), inset 0 0 0 rgba(0,0,0,.6), inset 0 -2px 0 rgba(255,255,255,.3);
box-shadow: inset 0 0 1px rgba(0,0,0,.8), inset 0 2px 0 rgba(255,255,255,.5), inset 0 0 0 rgba(0,0,0,.6), inset 0 -2px 0 rgba(255,255,255,.3);
}
.button.inset:hover {
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0 1px 3px rgba(0,0,0,.6), inset 0 0 0 rgba(0,0,0,0);
-moz-box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0 2px 3px rgba(0,0,0,.6), inset 0 0 0 rgba(0,0,0,0);
box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0 1px 3px rgba(0,0,0,.6), inset 0 0 0 rgba(0,0,0,0);
transition:box-shadow 300ms ease;
}
li.green, a.green { color:rgb(157,213,58) !important; }
li.blue, a.blue { color:rgb(42,133,232);}
.green.button { background-color: rgb(157,213,58); }
.nice.green.button { border: 1px solid rgb(150,200,50); }
.green.button:hover { background-color: rgb(150,200,50); }
.container {
max-width:980px;
margin:0 auto;
}
/* =======================================
List Mods
======================================= */
div li { list-style-type:none; }
/*.row table { margin:auto; }*/
/* =======================================
Headers
======================================= */
.pageHeadline { width: 100%; background: #EAF6F9; padding: 10px 0; margin: 15px 0; overflow: hidden; -moz-border-radius: 18px; -webkit-border-radius: 18px; -o-border-radius: 18px; -ms-border-radius: 18px; -khtml-border-radius: 18px; border-radius: 18px; }
.pageHeadline h1 { font-size: 24px; font-weight: bold; color: #2B68C2; float: left; margin: 0 0 0 15px; }
/* =======================================
Live Person
======================================= */
.lpchat-container .lpchat-container { box-shadow: 0 1px 3px rgba(0,0,0,0.25); }