/* ----------- iPhone 5 and 5S ----------- */

/* Portrait and Landscape */
@media only screen and (min-width: 320px) and (max-width: 568px) {
h1, .h1 { font-size: 30px; }
.subpage { text-align: center; }
.subpage ul { text-align: left; }
.form-group { text-align: left; }
.navbar-brand { background: url('../img/logoCOSSD.png') no-repeat; width: 193px; height: 106px; -webkit-transition: all .3s; -moz-transition: all .3s; transition: all .3s; }
.affix { position: relative; top: 0; right: 0; left: 0; z-index: 1030; }
.navbar-top .navbar-brand.sub-brand { background: url('../img/logoCOSSD-mobile.png') no-repeat; width: 120px; height: 61px; position: absolute; margin: 5px; }
.navbar-top .navbar-brand { background: url('../img/logoCOSSD-sml.png') no-repeat; width: 162px; height: 83px; position: absolute; margin: 5px; }
header .intro-text .name { font-size: 1.1em; margin-bottom: 5px; }
.navbar-nav { margin: 40px 0 0 -15px; }
.dropdown-menu { box-shadow: none; }
.category-btn { width: 100%; }
.category-icon { float: right; }
.voucher { display: none; }
.heading { font-size: 4em; text-align: center; }
.home-logo { margin: 60px auto 10px auto; }
.result-logo { display: none; }
header .container { padding-top: 30px; padding-bottom: 12px; }
.product-icon { margin: 0; float: left; position: relative; bottom: 10px; background: url(../img/iconProductCatalog-mobile.png) no-repeat center center; width: 33px; height: 42px; }
.qualifications-icon { margin: 0; float: left; position: relative; bottom: 10px; background: url(../img/iconQualification-mobile.png) no-repeat center center; width: 33px; height: 42px; }
.hotel-icon { margin: 0; float: left; position: relative; bottom: 10px; background: url(../img/iconHotels-mobile.png) no-repeat center center; width: 33px; height: 42px; }
.utilsMenu ul li a { color: #fff; margin-left: 20px; }
.utilsMenu ul li { margin: 5px 15px 0 0; }
section.banner { min-height: 300px; }
.carousel .item { min-height: 300px; background-position: center; }
.index section img { top: 10px; max-width: 100px; }
.sub-heading { text-align: center; line-height: 28px; font-size: 1em; }
.red-heading { display: inline-block; line-height: 40px; }
.dropdown-menu { width: 100%; }
.collapsed { background: none; padding-left: 10px; }
section.compare-feature, section.connect-feature { min-height: 300px; position: relative; background-attachment: scroll; }
.result-listing { width: 100%; float: none; }
.result-logo img { width: 100%; }
#map-canvas { width: 100%; margin: 0; }
.listing-logo { width: 100%; min-height: 140px; float: none; margin-right: 0; border: none; height: auto; margin-bottom: 20px; }
.profile-map #map-canvas { width: 100%; }
.company-info { margin: 15px 0 20px 0; text-align: center; }
.major-category, .qualification { width: 100%; }
.index-link { padding: 12px 20px 5px 20px; }
header .intro-text .skills { font-size: 1.10em; font-weight: 300; }
.leaderboard-ad.home { margin-top: 0; }
.leaderboard-ad.sub { text-align: center; }
.company-btns { margin: 20px 0 0 0 }
.jwn-footer-row img { max-width: 100%; }
#cd-timeline { margin-bottom: 0; }
.trail-left, .trail-right { display: none; }
.cd-timeline-img-left, .cd-timeline-img-right { top: 20%; display: none; }
.cd-timeline-content-bottom { width: 100%; padding-left: 0; }
.cd-timeline-img-bottom { width: 35%; padding-left: 0; margin: 0 auto; }
#cd-timeline::before { display: none; }
.cd-timeline-content { margin-left: 0; }
.timeline-header { text-align: center; margin-left: 0; }
.cd-timeline-content p span { color: #f82d18; font-weight: 500 }
.contact-banner, .digital-banner, .company-banner, .garmin-banner { min-height: 250px; }
.subpage .border-right { border-right: none; padding-right: 15px; }
.pull-right { float: none !important; }
.banner-content { width: 100%; position: relative; right: 0; top: 0; padding-top: 10px; padding-bottom: 10px; }
.banner-content h1 { font-size: 20px; margin: 10px 0; }
.banner-content h5 { font-size: 14px; margin: 10px 0; }
.subpage img { max-width: 100% !important; margin-left: 3%; }
.banner-content-left { width: 100%; left: 0; top: 50%; padding: 0 20px; }
.banner-content-left h1 { font-size: 35px; line-height: 40px; }
.garmin-btn { text-align: center; }
.about-banner { -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; -o-background-size: cover; min-height: 150px; }
.subpage .container { padding-bottom: 0; }
.listing-logo img { position: relative; top: 0; left: 0; transform: none; -webkit-transform: none; -ms-transform: none; }
header { min-height: 100%; background-attachment: scroll; }
header .header-content .header-content-inner h1 { font-size: 22px; width: 100% }
header .header-content { position: absolute; top: 50%; padding: 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
header .header-content .header-content-inner p {/* margin-right: auto; *//* margin-left: auto; *//* margin-top: 15px; *//* margin-bottom: 25px; *//* max-width: 100%; *//* font-size: 13px; */ display: none; }
header .header-content hr { display: none; }
.popular-categories, .popular-categories-sub { display: none; }
.mobile-browse { display: block; text-align: center; margin: 10px auto; }
.mobile-browse a { display: block; text-align: center; margin: 10px auto; padding: 5px 10px; }
#search_container { position: relative; top: 8px; padding: 20px 0; }
#map-canvas { display: none; }
.navbar-default-sub .navbar-nav>li>a { line-height: 35px; }
.navbar-default .nav li:hover > .dropdown-menu { position: relative; }
.dropdown-menu > li { border-bottom: none; }
.navbar-default .nav .dropdown-menu > li > a { font-weight: 300; }
.browse-btn { margin: 20px 0; }
}
 @media (min-width: 568px) and (max-width: 667px) {
header { min-height: 100%; }
header .header-content { position: absolute; top: 55%; margin-top: 5%; padding: 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
header .header-content .header-content-inner h1, header .header-content hr, .popular-categories, header .header-content .header-content-inner p { display: none; }
#search_container { position: relative; top: 8px; padding: 20px 0; }
#map-canvas { display: none; }
.popular-categories, .popular-categories-sub { display: none; }
.mobile-browse { display: block; text-align: center; margin: 10px auto; }
.mobile-browse a { display: block; text-align: center; margin: 10px auto; padding: 5px 10px; }
}


/* ----------- iPhone 6 ----------- */

/* Portrait and Landscape */
@media only screen and (min-width: 360px) and (max-width: 668px) {
.result-logo { display: none; }
.result-listing { width: 100%; float: none; }
.affix { position: relative; top: 0; right: 0; left: 0; z-index: 1030; }
.navbar-brand { background: url('../img/logoCOSSD.png') no-repeat; width: 193px; height: 106px; -webkit-transition: all .3s; -moz-transition: all .3s; transition: all .3s; }
header .intro-text .name { font-size: 1.1em; }
.navbar-nav { margin: 40px 0 0 -15px; }
.dropdown-menu { box-shadow: none; }
.category-btn { width: 100%; }
.category-icon { float: right; }
.voucher { display: none; }
.heading { font-size: 4em; text-align: center; }
header .container { padding-top: 38px; padding-bottom: 10px; }
.product-icon, .qualifications-icon, .hotel-icon, .hiring-icon { margin: 0; float: left; position: relative; bottom: 10px; }
.utilsMenu ul li a { color: #fff; margin-left: 10px; }
.utilsMenu ul li { margin: 10px 5px 0 5px; }
section.banner { min-height: 300px; }
.carousel .item { min-height: 300px; background-position: center; }
.index section img { top: 0; }
.sub-heading { text-align: center; line-height: 28px; }
.red-heading { display: inline-block; line-height: 40px; }
.dropdown-menu { width: 100%; }
.listing-logo { width: 100%; min-height: 140px; float: none; margin-right: 0; border: none; height: auto; margin-bottom: 20px; }
.company-info { text-align: center }
.collapsed { background: none; padding-left: 10px; }
section.compare-feature, section.connect-feature { min-height: 300px; position: relative; background-attachment: scroll; }
.profile-map #map-canvas { width: 100%; }
.keep-open { margin-top: 10px; }
.utilsMenu ul { padding: 10px 0 0 0; display: block; margin-bottom: 0; }
section#search, section#compare, section#connect { padding: 25px 0; }
.company-btns { margin: 20px 0 0 0 }
.jwn-footer-row img { max-width: 100%; }
.subpage .border-right { border-right: none; padding-right: 15px; }
.contact-banner, .digital-banner, .company-banner, .garmin-banner { min-height: 250px; }
.pull-right { float: none !important; }
.banner-content { width: 100%; top: 50%; }
.subpage img { max-width: 100% !important; margin-left: 10%; }
.banner-content-left { width: 75%; left: 0; top: 50%; padding: 0 20px; }
.subpage img { max-width: 100% !important; margin-left: 0; }
.about-banner { -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; -o-background-size: cover; min-height: 150px; }
.subpage .container { padding-bottom: 0; }
.listing-logo img { position: relative; top: 0; left: 0; transform: none; -webkit-transform: none; -ms-transform: none; }
header .header-content .header-content-inner h1 { font-size: 40px; width: 100% }
header .header-content .header-content-inner p { margin-right: auto; margin-left: auto; margin-top: 15px; margin-bottom: 25px; max-width: 100%; font-size: 16px; }
#map-canvas { display: none; }
.navbar-default-sub .navbar-nav>li>a { line-height: 35px; }
.navbar-default .nav li:hover > .dropdown-menu { position: relative; }
.dropdown-menu > li { border-bottom: none; }
.navbar-default .nav .dropdown-menu > li > a { font-weight: 300; }
.browse-btn { margin: 20px 0; }
}
 @media (max-width: 668px) {
header { min-height: 100%; }
header .header-content { position: absolute; top: 50%; padding: 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
header .header-content .header-content-inner h1 { font-size: 36px; width: 100% }
header .header-content hr { display: none; }
.popular-categories, .popular-categories-sub { display: none; }
.mobile-browse { display: block; text-align: center; margin: 10px auto; }
.mobile-browse a { display: block; text-align: center; margin: 10px auto; padding: 5px 10px; }
#map-canvas { display: none; }
}

/* ----------- iPad 1 and 2 ----------- */
/* Portrait and Landscape */
@media only screen and (min-width: 668px) and (max-width: 1199px) {
.navbar-top .navbar-brand { background: url('../img/logoCOSSD-sml.png') no-repeat; width: 162px; height: 83px; margin: 10px; }
.affix { position: relative; top: 0; right: 0; left: 0; z-index: 1030; }
.voucher { display: none; }
.utilsMenu ul li { margin: 0 30px; }
.category-btn { width: 100%; }
.category-icon { margin-left: 0; float: right; }
.intro-text { /* margin-bottom: 20px; */ /* margin-top: 10px; */ }
#homepage-searchbox { margin-bottom: 0; }
.index section img { top: 30px; }
section.banner { min-height: 430px; }
.dropdown-menu { width: 100%; }
.carousel .item { min-height: 430px; }
section.compare-feature, section.connect-feature { min-height: 430px; position: relative; background-attachment: scroll; }
.profile-map #map-canvas { width: 100%; }
section#search, section#compare, section#connect { padding: 25px 0; }
header .container { padding-top: 60px; padding-bottom: 20px; }
.index section img { max-width: 100px; top: 30px; }
.red-heading { font-size: 0.32em; }
.heading { font-size: 3em; }
.sub-heading { font-size: 1em; }
.listing-logo { width: 180px; height: 180px; margin-bottom: 30px; }
.company-info h3 { margin: 0; font-size: 20px; }
.keep-open { margin-top: 29px; }
.jwn-footer-row img { max-width: 100%; }
#cd-timeline { margin-bottom: 0; }
.trail-left, .trail-right { display: none; }
.cd-timeline-img-left, .cd-timeline-img-right { top: 20%; display: none; }
.cd-timeline-content-bottom { width: 100%; padding-left: 0; }
.cd-timeline-img-bottom { width: 12%; padding-left: 0; }
#cd-timeline::before { display: none; }
.cd-timeline-content { margin-left: 0; }
.timeline-header { text-align: center; margin-left: 0; }
.subpage .border-right { border-right: none; padding-right: 15px; }
.pull-right { float: none !important; }
.subpage img { max-width: 100% !important; }
.garmin-btn { text-align: left; }
.pull-right { float: right !important; }
.subpage .border-right { border-right: none; padding-right: 15px; }
.banner-content { width: 65%; top: 20%; }
.banner-content-left { width: 60%; left: 0; top: 50%; padding: 0 20px; position: relative; }
.about-banner, .contact-banner, .digital-banner, .company-banner, .garmin-banner { min-height: 250px; }
.listing-logo img { top: 50%; left: 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
#search_container { position: relative; top: 0px; padding: 10px 0; }
#map-canvas { display: none; }
.popular-categories, .popular-categories-sub { display: none; }
.mobile-browse { display: block; text-align: center; margin: 10px auto; }
.mobile-browse a { display: block; text-align: center; margin: 10px auto; padding: 5px 10px; }
.browse-btn {/* margin: 20px 0; */ }
.major-category, .qualification { width: 50%; float: left; }
.browse-btn { margin: 40px 0; }
}
@media (min-width: 1024px) {
.popular-categories { display: block; }
.browse-btn { margin: 0; }
}
@media (max-width: 1024px) {
.pull-right { float: none !important; }
.ad { text-align: center; margin: 40px auto 0 auto; }
}
 @media(min-width:1023px) {
header .container { padding-top: 10px; padding-bottom: 20px; }
.pull-right { float: right !important; }
}
 @media only screen and (min-width: 1169px) and (max-width: 1200px) {
.cd-timeline-content { margin-right: 75px; margin-left: 105px; }
}
.banner-1 { background-image: url(/img/banner-img-1.jpg); }
.banner-2 { background-image: url(/img/banner-img-2.jpg); }
.banner-3 { background-image: url(/img/banner-img-3.jpg); }
.compare-feature { background-image: url(/img/compare-feature-img.jpg); }
.connect-feature { background-image: url(/img/connect-feature-img.jpg); }
 @media only screen and (min-width : 480px) {
.banner-1 { background-image: url(/img/banner-img-1-sm.jpg); }
.banner-2 { background-image: url(/img/banner-img-2-sm.jpg); }
.banner-3 { background-image: url(/img/banner-img-3-sm.jpg); }
.compare-feature { background-image: url(../img/compare-feature-img-sm.jpg); }
.connect-feature { background-image: url(/img/connect-feature-img-sm.jpg); }
}
 @media only screen and (min-width : 768px) {
.banner-1 { background-image: url(/img/banner-img-1-md.jpg); }
.banner-2 { background-image: url(/img/banner-img-2-md.jpg); }
.banner-3 { background-image: url(/img/banner-img-3-md.jpg); }
.compare-feature { background-image: url(../img/compare-feature-img-md.jpg); }
.connect-feature { background-image: url(/img/connect-feature-img-md.jpg); }
}
 @media only screen and (min-width : 1200px) {
.banner-1 { background-image: url(/img/banner-img-1-lg.jpg); }
.banner-2 { background-image: url(/img/banner-img-2-lg.jpg); }
.banner-3 { background-image: url(/img/banner-img-3-lg.jpg); }
.compare-feature { background-image: url(../img/compare-feature-img-lg.jpg); }
.connect-feature { background-image: url(/img/connect-feature-img-lg.jpg); }
}
 @media(min-width:768px) {
header .container { padding-top: 10px; padding-bottom: 20px; }
header .intro-text .name { font-size: 1.02em; letter-spacing: .2em; line-height: 35px; margin-bottom: 0; }
header .intro-text .skills { font-size: 1.80em; color: #fff126; letter-spacing: .2em; }
}
 @media(min-width:768px) {
header { min-height: 100%; }
header .header-content { position: absolute; top: 50%; padding: 0 50px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
header .header-content .header-content-inner { margin-right: auto; margin-left: auto; max-width: 1000px; }
header .header-content .header-content-inner p { margin-right: auto; margin-left: auto; }
}
 @media(min-width:768px) {
.navbar-top { /* padding: 8px 0; */ -webkit-transition: padding .3s; -moz-transition: padding .3s; transition: padding .3s; }
.navbar-brand { background: url('../img/logoCOSSD.png') no-repeat; width: 193px; height: 106px; -webkit-transition: all .3s; -moz-transition: all .3s; transition: all .3s; }
.navbar-top.navbar-shrink { padding: 10px 0; }
.navbar-top.navbar-shrink .navbar-brand img { background: url('../img/logoCOSSD.png') no-repeat; position: absolute; width: 140px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; }
.modal-dialog { width: 700px; margin: 30px auto; }
}
 @media(max-width:767px) {
section { padding: 75px 0; }
section.first { padding-top: 75px; }
}
 @media only screen and (min-width: 1170px) {
#cd-timeline { margin-top: 8em; margin-bottom: 0; }
#cd-timeline::before { left: 50%; margin-left: -2px; }
#cd-timeline h2 { margin: 10px 0 0 0; font-size: 18px; line-height: 20px; }
}
.cd-timeline-block { position: relative; margin: 2em 0; }
.cd-timeline-block:after { content: ""; display: table; clear: both; }
.cd-timeline-block:first-child { margin-top: 0; }
.cd-timeline-block:last-child { margin-bottom: 0; }
@media only screen and (min-width: 1170px) {
.cd-timeline-block { margin: 4.5em 0; }
.cd-timeline-block:first-child { margin-top: -130px; }
.cd-timeline-block:last-child { margin-bottom: 0; }
}
 @media only screen and (min-width: 1170px) {
.cd-timeline-img-right { left: 58%; margin-left: -10px; /* Force Hardware Acceleration in WebKit */ -webkit-transform: translateZ(0); -webkit-backface-visibility: hidden; }
.cd-timeline-img-left { left: 35%; margin-left: -10px; /* Force Hardware Acceleration in WebKit */ -webkit-transform: translateZ(0); -webkit-backface-visibility: hidden; }
.cssanimations .cd-timeline-img-left.is-hidden { visibility: hidden; }
.cssanimations .cd-timeline-img-right.is-hidden { visibility: hidden; }
.cssanimations .cd-timeline-img-left.bounce-in { visibility: visible; -webkit-animation: cd-bounce-1 0.6s; -moz-animation: cd-bounce-1 0.6s; animation: cd-bounce-1 0.6s; }
.cssanimations .cd-timeline-img-right.bounce-in { visibility: visible; -webkit-animation: cd-bounce-1 0.6s; -moz-animation: cd-bounce-1 0.6s; animation: cd-bounce-1 0.6s; }
}
 @media only screen and (min-width: 768px) {
.cd-timeline-content h2 { font-size: 20px; margin: 10px 0 0 0; }
.cd-timeline-content p { font-size: 14px; font-weight: 300; }
.cd-timeline-content p span { color: #f82d18; font-weight: 500 }
.cd-timeline-content .cd-read-more, .cd-timeline-content .cd-date { font-size: 14px; font-size: 0.875rem; }
}
@media only screen and (min-width: 1170px) {
.cd-timeline-content { margin-right: 92px; padding: 1.6em; width: 30%; }
.cd-timeline-content .cd-read-more { float: left; }
.cd-timeline-content .cd-date { position: absolute; width: 100%; left: 122%; top: 6px; font-size: 16px; font-size: 1rem; }
.cd-timeline-block:nth-child(even) .cd-timeline-content { float: right; }
.cd-timeline-block:nth-child(even) .cd-timeline-content .cd-read-more { float: right; }
.cd-timeline-block:nth-child(even) .cd-timeline-content .cd-date { left: auto; right: 122%; text-align: right; }
.cssanimations .cd-timeline-content.is-hidden { visibility: hidden; }
.cssanimations .cd-timeline-content.bounce-in { visibility: visible; -webkit-animation: cd-bounce-2 0.6s; -moz-animation: cd-bounce-2 0.6s; animation: cd-bounce-2 0.6s; }
}
 @media only screen and (min-width: 1170px) {
/* inverse bounce effect on even content blocks */
.cssanimations .cd-timeline-block:nth-child(even) .cd-timeline-content.bounce-in { -webkit-animation: cd-bounce-2-inverse 0.6s; -moz-animation: cd-bounce-2-inverse 0.6s; animation: cd-bounce-2-inverse 0.6s; }
}