/* 
	BEAKERAPPS, LLC
*/

/* Fonts */
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900');
body, input, textarea, button, select, a, p { font-family: "Roboto", sans-serif; color: #000000; font-size: 14px; -webkit-font-smoothing: antialiased; }

/* Global */
html, body {margin: 0; padding: 0; width: 100%; height: 100%; background: #DC9419 url(../images/page-wood-bg.jpg) top center repeat; cursor: default; }
* { outline:none; -webkit-tap-highlight-color: rgba(0,0,0,0);}
*,:before,:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
a { text-decoration: none; }
a:hover { text-decoration: underline; }
a.gray { color: #444444; }
a.red { color: #D81F26; }
.gray { color: #444444; }
.red { color: #D81F26; }
.orange { color: #BC5C04; }
.black { color: #000000; }
a.underline { text-decoration: underline; }
a.underline:hover { text-decoration: none; }
p { line-height: 22px; }
ul { margin: 0; padding: 0; list-style: none; }
h1 { font-size: 28px; margin-bottom: 10px; }
hr { width: 100%; height: 2px; background-color: #EEEEEE; border: 0; }

.noselect { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }



@-webkit-keyframes borderBlink { from, to { border-color: transparent } 50% { border-color: black } }    
@keyframes borderBlink { from, to { border-color: #EEEEEE } 50% { border-color: #D81F26; } }    
.borderBlink{ -webkit-animation: borderBlink 1s step-end infinite; animation: borderBlink 1s step-end infinite; }

.alert-message { float: left; width: 100%; height: auto; padding: 20px; border: 4px solid #EEEEEE; margin: 0 0 20px 0; font-size: 16px; line-height: 20px; font-weight: 700; border-radius: 4px; background: #F7F7F7; transition: all 300ms ease-in-out; -webkit-transition: all 300ms ease-in-out; overflow: hidden; }
.alert-message .title { float: left; width: 100%; margin: 0 0 10px 0; color: #D81F26; font-weight: 900; transition: all 300ms ease-in-out; -webkit-transition: all 300ms ease-in-out; }
.alert-message .message { font-size: 12px; transition: all 300ms ease-in-out; -webkit-transition: all 300ms ease-in-out; }

.alert-sticky { opacity: 0; display: block; position: fixed; z-index: 9996; top: 85px; left: 0; width: 100%; height: 0; padding: 0 10px 0 10px; transition: all 300ms ease-in-out; -webkit-transition: all 300ms ease-in-out; }
.alert-sticky .centered { display: block; margin: 0 auto; height: 0; width: 100%; max-width: 820px; padding: 0 20px 0 270px; }
.alert-message-scroll { display: block; width: 100%; padding: 10px; border: 4px solid #EEEEEE; margin: 0; text-align: center; font-size: 16px; line-height: 20px; font-weight: 700; border-radius: 4px; background: #F7F7F7; }
.page.scrolled-desktop .alert-sticky { display: block; top: 100px; opacity: 1;  }
.page.scrolled-desktop .alert-message { display: none; }

.contact .page.scrolled-desktop .alert-sticky { display: none !important; }
.contact .page.scrolled-desktop .alert-message { display: block !important; }



/* Wrapper */
.wrapper { float: left; width: 100%; padding: 10px; }
.wrapper .centered { display: table; margin: auto; width: 100%; max-width: 820px; }

/* PAGE */
.page { float: left;  padding: 15px 20px 25px 20px; background: #FFFFFF; border-radius: 8px; box-shadow: 0 4px 10px 0 rgba(0,0,0,0.30); }


/* FOOTER */
.footer { float: left; width: 100%; padding: 20px; text-align: center; }
.footer a { color: #000000; font-weight: 700; text-decoration: underline; }
.footer a:hover { text-decoration: none; }


/* Page Top */
.page-top { position: relative; float: left; width: 100%; }
.page-top .logo { position: relative; float: left; width: 230px; height: 190px; margin: 0 0 20px 0; background: #DC9419 url(../images/wood-bg.jpg) top left no-repeat; background-size: cover; border-radius: 4px; box-shadow: 2px 3px 5px 0 rgba(0,0,0,.9); transition: all 50ms ease-in-out; -webkit-transition: all 50ms ease-in-out; }
.page-top .logo:active { box-shadow: 2px 6px 12px 0 rgba(0,0,0,1); }
.page-top .logo .rope-l { position: absolute; top: -35px; left: 20px; float: left; width: 10px; height: 60px;  background: url(../images/rope-single@2x.png) top center no-repeat; background-size: 10px 60px; }
.page-top .logo .rope-r { position: absolute; top: -35px; right: 20px; float: left; width: 10px; height: 60px;  background: url(../images/rope-single@2x.png) top center no-repeat; background-size: 10px 60px; }
.page-top .logo .home-box { position: relative; float: left; width: 100%; height: 190px; text-align: center; }
.page-top .logo .home-box .logo-btn { float: left; width: 100%; transition: all 100ms ease-in-out; }
.page-top .logo .home-box .logo-btn:hover { transform: scale(1.025); }
.page-top .logo .home-box .logo-btn .logo-img { display: block; margin: 20px auto 15px auto; width: 230px; height: 125px; }
.page-top .logo .home-box .phone-num { display: block; font-size: 22px; line-height: 22px; font-weight: 900; font-style: italic; text-decoration: none; }
.page-top .logo .home-box .phone-num:hover {text-shadow: 0 0 4px #FBEBD9, 0 0 4px #FBEBD9, 0 0 4px #FBEBD9; }


.page-top .banner { position: relative; z-index: 9998; float: right; width: calc(100% - 250px); max-width: 530px; height: 190px; margin: 0 0 20px 0; text-align: center; background: #DC9419 url(../images/wood-bg.jpg) top left no-repeat; background-size: cover; border-radius: 4px; box-shadow: 2px 3px 5px 0 rgba(0,0,0,.9); }
.page-top .banner .rope-l { position: absolute; top: -35px; left: 20px; float: left; width: 10px; height: 60px;  background: url(../images/rope-single@2x.png) top center no-repeat; background-size: 10px 60px; }
.page-top .banner .rope-r { position: absolute; top: -35px; right: 20px; float: left; width: 10px; height: 60px;  background: url(../images/rope-single@2x.png) top center no-repeat; background-size: 10px 60px; }
.page-top .banner .txt-part-1 { float: left; width: 100%; height: 25px; font-size: 18px; line-height: 25px; font-weight: 900; font-style: italic; }
.page-top .banner .family-photo { display: block; margin: 0 auto; width: auto; height: 140px; box-shadow: 0 2px 4px 0 rgba(0,0,0,.9); transition: all 100ms ease-in-out; }
.page-top .banner .family-photo:hover { box-shadow: 0 4px 8px 0 rgba(0,0,0,1); }
.page-top .banner .txt-part-2 { float: left; width: 100%; height: 25px; font-size: 18px; line-height: 25px; font-weight: 900; font-style: italic; }


.page-top .mobile-call-btn { position: fixed; bottom: -80px; left: 30px; z-index: 9999; float: left; width: calc(100% - 60px); height: auto; margin: 0 0 0 0; padding: 15px 20px 15px 20px; text-align: center; color: #000000; background: #DC9419 url(../images/wood-bg.jpg) center bottom no-repeat; background-size: cover; box-shadow: 0px 0px 6px 0 rgba(0,0,0,1); transition: all 300ms ease-in-out; -webkit-transition: all 300ms ease-in-out; text-decoration: none; border-radius: 4px 4px 0px 0px }
.page-top .mobile-call-btn.hide { display: none; }
.page-top .mobile-call-btn:active { box-shadow: 0px 0px 12px 0 rgba(0,0,0,1); }
.page-top .mobile-call-btn .num { display: block; font-size: 30px; line-height: 30px; font-weight: 900; }
.page-top .mobile-call-btn .num .phone-icon { position: relative; top: 2px; left: -4px; display: inline-block; width: 20px; height: 25px; background: url(../images/phone-icon.png) top left no-repeat; background-size: 20px 25px; }
.page-top .mobile-call-btn .text { display: block; font-style: 14px; line-height: 14px; font-weight: 700; }


#stick-here { display: none; float: left; width: 100%; height: 10px; }
.page-top .mobile-menu { display: none; position: relative; float: left; width: 100%; height: auto; margin: 0 0 20px 0; padding: 20px 10px 10px 10px; text-align: left; background: #DC9419 url(../images/wood-bg.jpg) center bottom no-repeat; background-size: cover; border-radius: 4px; box-shadow: 2px 3px 5px 0 rgba(0,0,0,.9); }
.page-top .mobile-menu .rope-l { position: absolute; top: -45px; left: 20px; float: left; width: 10px; height: 60px;  background: url(../images/rope-double@2x.png) top center no-repeat; background-size: 10px 60px; }
.page-top .mobile-menu .rope-r { position: absolute; top: -45px; right: 20px; float: left; width: 10px; height: 60px;  background: url(../images/rope-double@2x.png) top center no-repeat; background-size: 10px 60px; }
.page-top .mobile-menu .menu-btn { float: left; cursor: pointer; margin: 5px 0 0 5px; }
.page-top .mobile-menu .icon { float: left; width: 40px; height: 40px; margin: 0 5px 0 0; }
.page-top .mobile-menu .icon .bar1, .page-top .mobile-menu .icon .bar2, .page-top .mobile-menu .icon .bar3 { width: 35px; height: 5px; background-color: #000; margin: 6px 0; transition: 0.4s; }
.page-top .mobile-menu .icon.toggled .bar1 {-webkit-transform: rotate(-45deg) translate(-9px, 6px); transform: rotate(-45deg) translate(-9px, 7px);}
.page-top .mobile-menu .icon.toggled .bar2 { opacity: 0; }
.page-top .mobile-menu .icon.toggled .bar3 { -webkit-transform: rotate(45deg) translate(-8px, -8px); transform: rotate(45deg) translate(-8px, -8px); }
.page-top .mobile-menu .text { float: left; color: #000000; font-size: 26px; line-height: 40px; font-weight: 700; }
.page-top .mobile-menu .call-btn { float: right; width: 180px; height: auto; margin: 0 0 0 0; padding: 7px 5px 7px 5px; text-align: center; font-size: 18px; line-height: 20px; font-weight: 900; color: #FFFFFF; background: #D81F26; border-radius: 4px; transition: all 50ms ease-in-out; -webkit-transition: all 50ms ease-in-out; text-decoration: none; box-shadow: 1px 1px 3px 0 rgba(0,0,0,.9); }
.page-top .mobile-menu .call-btn:active { box-shadow: 2px 6px 12px 0 rgba(0,0,0,1); }
.page-top .mobile-menu .call-btn .text { display: block; width: 100%; font-size: 12px; line-height: 12px; color: #FFFFFF; text-align: center; }





/* Page Middle */
.page-middle { float: left; width: 100%; }
.page-middle .sidebar { position: relative; float: left; width: 230px; min-height: 600px; padding: 12px 0 0px 0; background: #DC9419 url(../images/sidebar-wood-bg.jpg) 0 -70px repeat; border-radius: 4px; box-shadow: 2px 3px 5px 0 rgba(0,0,0,.9); }
.page-middle .sidebar .rope-l { position: absolute; top: -45px; left: 20px; float: left; width: 10px; height: 60px;  background: url(../images/rope-double@2x.png) top center no-repeat; background-size: 10px 60px; }
.page-middle .sidebar .rope-r { position: absolute; top: -45px; right: 20px; float: left; width: 10px; height: 60px;  background: url(../images/rope-double@2x.png) top center no-repeat; background-size: 10px 60px; }

.page-middle .sidebar .navigation { float: left; width: 100%; margin: 0 0 20px 0; text-align: center; }
.page-middle .sidebar .navigation li { float: left; width: 100%; height: 40px; }
.page-middle .sidebar .navigation li a { float: left; width: 100%; height: 40px; font-size: 18px; line-height: 40px; font-weight: 900; text-transform: uppercase; text-decoration: none; }
.page-middle .sidebar .navigation li a .arrow { position: relative; top: 3px; display: none; width: 20px; height: 20px; background: url(../images/nav-arrow@2x.png) center center no-repeat; background-size: 20px 20px; }
.page-middle .sidebar .navigation li.selected a { text-shadow: 0 0 4px #FBEBD9, 0 0 4px #FBEBD9; }
.page-middle .sidebar .navigation li.selected a .arrow { display: inline-block; }
.page-middle .sidebar .navigation li:hover a { text-shadow: 0 0 4px #FBEBD9, 0 0 4px #FBEBD9, 0 0 4px #FBEBD9; }

.page-middle .sidebar .sidebar-more { display: none; margin: 0 0 10px 0; float: left; width: 100%; height: 40px; font-size: 18px; line-height: 40px; font-weight: 900; text-transform: uppercase; text-align: center; cursor: pointer; }
.page-middle .sidebar .sidebar-more .arrow { position: relative; top: -2px; display:inline-block; width: 0px; height: 0px; border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 8px solid #000000; }
.page-middle .sidebar.toggled .sidebar-more .arrow { top: -3px; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 8px solid #000000; border-top: inherit; }

.page-middle .sidebar .side-content { display: block; float: left; width: 100%; }

.page-middle .sidebar .side-link { float: left; width: 100%; margin: 0 0 20px 0; text-align: center; }
.page-middle .sidebar .side-link a { display: inline-block; transition: all 100ms ease-in-out; }
.page-middle .sidebar .side-link a:hover {transform: scale(1.025); }
.page-middle .sidebar .side-link a img { display: block; width: 100%; max-width: 200px; height: auto; }
.page-middle .sidebar .side-link span { display: block; width: 100%; margin:  2px 0 0 0; text-align: center; font-size: 11px; }

.page-middle .sidebar .extra-info { float: left; width: 100%; display: none; }
.page-middle .sidebar .side-info { float: left; width: 100%; margin: 0 0 20px 0; padding:0px 15px 0px 15px; text-align: left; }
.page-middle .sidebar .side-info.center-text { text-align: center; }
.page-middle .sidebar .side-info .title { display: block; margin: 0 0 15px 0; font-size: 16px; font-weight: 700; }
.page-middle .sidebar .side-info .title.center-text { text-align: center; }
.page-middle .sidebar .side-info .list { display: block; width: 100%;  margin: 0 0 15px 0; padding: 0 0 0 20px;  list-style: square outside url("../images/list-bullet.png"); }
.page-middle .sidebar .side-info .list li { display: list-item; margin: 0 0 7px 0; }
.page-middle .sidebar .side-info .list li:last-child { margin: 0 0 0 0; }


.page-middle .sidebar .side-info .link { position: relative; float: left; width: 100%; height: auto; padding: 8px 10px 8px 10px; margin: 0 0 15px 0; text-align: center; font-size: 12px; font-weight: 900; text-transform: uppercase; text-decoration: none; border: 1px solid #6C4409; background: #DC9419 url(../images/wood-bg.jpg) left center no-repeat; border-radius: 2px; box-shadow: 2px 3px 5px 0 rgba(0,0,0,.9); transition: all 50ms ease-in-out; -webkit-transition: all 50ms ease-in-out;}
.page-middle .sidebar .side-info .link.red { color: #BA0000; }
.page-middle .sidebar .side-info .link:hover { box-shadow: 2px 4px 8px 0 rgba(0,0,0,1); }
.page-middle .sidebar .side-info .link .nail-l { position: absolute; top: 5px; left: 5px; float: left; width: 10px; height: 10px;  background: url(../images/list-bullet.png) top center no-repeat; background-size: 10px 10px; }
.page-middle .sidebar .side-info .link .nail-r { position: absolute; top: 5px; right: 5px; float: left; width: 10px; height: 10px;  background: url(../images/list-bullet.png) top center no-repeat; background-size: 10px 10px; }

.page-middle .content { float: right; width: calc(100% - 250px); max-width: 530px; text-align: left; }
.page-middle .content p { margin: 0 0 20px 0; }
.page-middle .content .big-text { font-size: 22px; line-height: 24px; }



/* Index */
#stick-here-2 { float: left; width: 100%; height: 10px; margin-top: -10px; }
.desktop-top-wrapper { float: left; width: 100%; position: relative; z-index: 9999; }
.desktop-top-wrapper .centered { float: left; width: 100%; }
.desktop-top { display: block; position: relative; float: left; width: 100%; height: auto; margin: 0 0 30px 0; padding: 20px 10px 10px 10px; text-align: left; background: #DC9419 url(../images/wood-bg.jpg) center bottom no-repeat; background-size: cover; border-radius: 4px; box-shadow: 2px 3px 5px 0 rgba(0,0,0,.9); }
.desktop-top .rope-l { position: absolute; top: -45px; left: 20px; float: left; width: 10px; height: 60px;  background: url(../images/rope-double@2x.png) top center no-repeat; background-size: 10px 60px; }
.desktop-top .rope-r { position: absolute; top: -45px; right: 20px; float: left; width: 10px; height: 60px;  background: url(../images/rope-double@2x.png) top center no-repeat; background-size: 10px 60px; }
.desktop-top .text { float: left; padding: 0 0 0 10px; color: #000000; font-size: 28px; line-height: 28px; font-weight: 900; }
.desktop-top .text:hover { text-decoration: none; text-shadow: 0 0 4px #FBEBD9, 0 0 4px #FBEBD9, 0 0 4px #FBEBD9; }
.desktop-top .text .small-text { display: block; font-size: 14px; line-height: 16px; font-weight: 700; }
.desktop-top .call-btn { float: right; width: 240px; height: auto; margin: 0 0 0 0; padding: 7px 5px 7px 5px; text-align: center; font-size: 18px; line-height: 20px; font-weight: 900; color: #FFFFFF; background: #D81F26; border-radius: 4px; transition: all 50ms ease-in-out; -webkit-transition: all 50ms ease-in-out; text-decoration: none; box-shadow: 1px 1px 3px 0 rgba(0,0,0,.9); }
.desktop-top .call-btn:hover { box-shadow: 1px 3px 6px 0 rgba(0,0,0,1); }
.desktop-top .call-btn:active { box-shadow: 2px 6px 12px 0 rgba(0,0,0,1); }
.desktop-top .call-btn .small-text { display: block; width: 100%; font-size: 12px; line-height: 12px; color: #FFFFFF; text-align: center; }

.page.scrolled-desktop .desktop-top-wrapper { margin-top: 0; position: fixed; top: 0; left: 0; width: 100%; z-index: 9999; height: 0px; }
.page.scrolled-desktop .desktop-top-wrapper .centered { float: none; display: block; height: 0px; margin: 0 auto; width: 100%; max-width: 820px; padding: 0 20px 0 270px; }
.page.scrolled-desktop .desktop-top { position: relative; top: 10px; left: 0; float: left; margin: 0 0 0 0; }


.locations-top { font-size: 16px; line-height: 22px; margin: 0 0 30px 0; }
.locations-bottom { display:block; padding: 20px; width: 100%; font-style: oblique; color: #BC5C04; font-weight: 600; font-size: 14px; background-color: #FFFFFF; border: solid 2px #EEEEEE; }
.locations-bottom a { color: #BC5C04; text-decoration: none; }
.locations-bottom a:hover { text-decoration: underline; }


.starburst-wrapper { position: relative; float: right; display: block; width: 140px; height: 140px; margin: 20px 20px 20px 40px; filter: drop-shadow(3px 3px 1px rgba(0,0,0,0.6)); }
.starburst { float: right; width: 100%; height: 100%; position: relative; }
.starburst .square { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform-origin: 50% 50%; }

.starburst .square.s1 { background: #D81F26; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); }
.starburst .square.s2 { background: #D81F26; -webkit-transform: rotate(30deg); -moz-transform: rotate(30deg); -ms-transform: rotate(30deg); -o-transform: rotate(30deg); transform: rotate(30deg); }
.starburst .square.s3 { background: #D81F26; -webkit-transform: rotate(60deg); -moz-transform: rotate(60deg); -ms-transform: rotate(60deg); -o-transform: rotate(60deg); transform: rotate(60deg); }
.starburst-wrapper .text { position: absolute; display: table; top: 0; left: 0; width: 100%; height: 100%; vertical-align: middle; text-align: center; }
.starburst-wrapper .text:hover { text-decoration: none; }
.starburst-wrapper .text .cell { display: table-cell; vertical-align: middle; color: #FFFFFF; font-weight: 900; font-size: 16px; line-height: 16px; }


.accessories-info { display: block; width: 100%; padding: 20px; margin: 0 0 20px 0; text-align: left; border: 2px solid #EEEEEE; }


.shed-types { display: table; width: 100%; border-collapse: collapse; margin: 0 0 20px 0; }
.shed-types .row { display: table-row; }
.shed-types .row .cell { display: table-cell; border: 2px solid #EEEEEE; width: 50%; padding: 20px 10px 20px 10px; text-align: center; }
.shed-types .row .cell .slideshow { position: relative; display: inline-block; width: 200px; height: 150px; overflow: hidden; margin: 0 0 20px 0;  }
.shed-types .row .cell .slideshow .slide { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; }
.shed-types .row .cell .slideshow .slide img { display: block; width: 100%; height: auto; }

.shed-types .row .cell .title { display: block; margin: 0 0 20px 0; color: #222222; font-size: 16px; line-height: 18px; font-weight: 600; }
.shed-types .row .cell .bottom-info { display: block; margin: 20px 0 0 0; color: #BC5C04; font-size: 12px; line-height: 14px; font-weight: 600; }

.shed-types .row .cell .sizes-list { display: table; width: 100%; font-size: 12px; line-height: 16px; }
.shed-types .row .cell .sizes-list li { display: table-row; width: 100%; }
.shed-types .row .cell .sizes-list li:nth-child(odd) {background: #EEEEEE;}
.shed-types .row .cell .sizes-list li span { display: table-cell; }
.shed-types .row .cell .sizes-list li span.size, 
.shed-types .row .cell .sizes-list li span.price { color: #BC5C04; font-weight: 900; font-style: italic; }

.shed-types .row .cell .standard-info { display: block; width: 100%; margin: 20px 0 0 0; padding: 0; text-align: left; }
.shed-types .row .cell .standard-info.center-text { text-align: center; }
.shed-types .row .cell .standard-info .title { display: block; margin: 0 0 5px 0; padding: 0 ; font-size: 14px; font-weight: 700; color: #BC5C04; }
.shed-types .row .cell .standard-info .title.center-text { text-align: center; }
.shed-types .row .cell .standard-info .list { display: block; width: 100%;  margin: 0 0 15px 0; padding: 0 0 0 0; list-style: none; }
.shed-types .row .cell .standard-info .list li { display: list-item; margin: 0 0 0 0; padding: 2px 5px 2px 0px; font-size: 12px; border-bottom: 1px solid #EEEEEE; }
.shed-types .row .cell .standard-info .list li:last-child { margin: 0 0 0 0; border-bottom: none; }


.large-slideshow { position: relative; display: inline-block; width: 100%; padding-bottom: 75%; height: auto; overflow: hidden; margin: 0 0 0 0; background: #EEEEEE;  }
.large-slideshow .slide { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.large-slideshow .slide img { display: block; width: 100%; height: auto; }
.slideshow-title { display: block; width: 100%; text-align: left; font-size: 12px; line-height: 12px; font-style: italic; margin: 10px 0 0 0; }


.link-with-image { display: block; width: 100%; margin: 0 0 20px 0; padding: 2px; border: 2px solid #EEEEEE; transition: all 50ms ease-in-out; -webkit-transition: all 50ms ease-in-out; }
.link-with-image:hover { border-color: #CCCCCC; }
.link-with-image img { display: block; width: 100%; height: auto; }


/* Shed Options */
.options-list { display: block; width: 100%; padding: 0; font-size: 0; }
.options-list li { position: relative; display: inline-block; width: 33.333%; padding: 10px; margin: 0 0 20px 0; text-align: center; vertical-align: top; }
.options-list li a { display: block; width: 100%; }
.options-list li a:hover { text-decoration: none; }
.options-list li a .image { display: block; width: 100%; height: auto; padding: 0 0 100% 0; background: #EEEEEE center center no-repeat; background-size: contain; transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; box-shadow: 2px 2px 3px 0 rgba(0,0,0,.5); }
.options-list li:hover a .image { border-color: #CCCCCC; background-color: #FFFFFF; }

.options-list li a .ribbon-wrapper { position: absolute; top: 10px; left: 0px; transform: rotate(-25deg); transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; }
.options-list li:hover a .ribbon-wrapper { top: 5px; }
.options-list li a .ribbon { position: relative; width: 100%; max-width: 140px; height: 30px; margin: 0; padding: 0 5px 0 5px; background-color: #FFFFFF; color: #D81F26; display: block; font-size: 24px; line-height: 30px; font-weight: 900; text-align: center; text-decoration: none; -webkit-filter: drop-shadow(1px 2px 2px rgba(0, 0, 0, 0.6)); filter: drop-shadow(1px 2px 2px rgba(0, 0, 0, 0.6)); }
.options-list li a .ribbon::before { content: ''; position: absolute; top: 0; border: 15px solid #FFFFFF; z-index: -1; left: -10px; border-left: 10px solid transparent; border-top-left-radius: 2px; border-bottom-left-radius: 2px; }
.options-list li a .ribbon::after { content: ''; position: absolute; top: 0; border: 15px solid #FFFFFF; z-index: -1; right: -10px; border-right: 10px solid transparent; border-top-right-radius: 2px; border-bottom-right-radius: 2px; }
.options-list li a .ribbon .text { display: block; letter-spacing: -1px; }
.options-list li a .ribbon .text .small { font-size: 12px; line-height: 30px; font-weight: 900; }

.options-list li a .ribbon.call { font-size: 16px; line-height: 12px; font-weight: 900; padding: 3px 10px 0 10px; }
.options-list li a .ribbon.call .text { color: #D81F26; letter-spacing: 0px; }
.options-list li a .ribbon.call .text b { font-size: 16px; font-weight: 900; }

.options-list li a .description { display: block; margin: 10px 0 0 0; font-size: 12px; line-height: 14px; font-weight: 600; }



/* Cabins */
.cabins-list { display: block; width: 100%; font-size: 0; }
.cabins-list li { display: inline-block; width: 100%; margin: 0 0 30px 0; }
.cabins-list li .cabin-slideshow { position: relative; display: inline-block; width: 100%; padding-bottom: 55%; height: auto; overflow: hidden; margin: 0 0 2px 0; }
.cabins-list li .cabin-slideshow .slide { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: all 50ms ease-in-out; -webkit-transition: all 50ms ease-in-out; }
.cabins-list li .cabin-slideshow .slide:hover { border-color: #CCCCCC;  }
.cabins-list li .cabin-slideshow .slide img { display: block; width: 100%; height: auto; }
.cabins-list li .cabin-info { display: block; width: 100%; padding: 10px; margin: 10px 0 0 0; text-align: center; font-size: 16px; line-height: 22px; font-weight: 900; background: #DC9419 url(../images/wood-bg.jpg) bottom center no-repeat; background-size: cover; border-radius: 4px; box-shadow: 2px 3px 5px 0 rgba(0,0,0,.9); transition: all 50ms ease-in-out; -webkit-transition: all 50ms ease-in-out; }
.cabins-list li .cabin-info { position: relative; float: left; width: 100%; height: auto; padding: 8px 10px 8px 10px; margin: 0 0 15px 0; text-align: center; font-size: 16px; font-weight: 900; text-transform: uppercase; text-decoration: none; background: #DC9419 url(../images/wood-bg.jpg) left center no-repeat; border-radius: 2px; box-shadow: 2px 3px 5px 0 rgba(0,0,0,.9); transition: all 50ms ease-in-out; -webkit-transition: all 50ms ease-in-out; }
.cabins-list li .cabin-info .nail-l { position: absolute; top: 50%; left: 5px; margin-top: -5px; float: left; width: 10px; height: 10px;  background: url(../images/list-bullet.png) top center no-repeat; background-size: 10px 10px; }
.cabins-list li .cabin-info .nail-r { position: absolute; top: 50%; right: 5px; margin-top: -5px; float: left; width: 10px; height: 10px;  background: url(../images/list-bullet.png) top center no-repeat; background-size: 10px 10px; }



/* Gallery */
.gallery-list { display: block; width: 100%; overflow: hidden; }
.gallery-list li { float: left; width: 14.28%; padding: 2px; }
.gallery-list li a .number { display: block; opacity: .5; -webkit-opacity: .5; position: absolute; top: 2px; left: 2px; background: #FFFFFF; padding: 2px; font-size: 10px; line-height: 10px; font-weight: 700; transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; }
.gallery-list li a:hover .number { opacity: 1; -webkit-opacity: 1; padding: 4px; }
.gallery-list li a { position: relative; float: left; width: 100%; border: 2px solid #EEEEEE; padding: 2px; transition: all 50ms ease-in-out; -webkit-transition: all 50ms ease-in-out; }
.gallery-list li a:hover { border-color: #CCCCCC; padding: 2px; }
.gallery-list li a img { float: left; width: 100%; height: auto; }



/* Testimonials */
.testimonials-list { display: block; width: 100%; }
.testimonials-list li { display: block; width: 100%; padding: 20px; margin: 0 0 20px 0; border: 2px solid #EEEEEE; overflow: hidden; }
.testimonials-list li .testimonial { font-size: 14px; line-height: 16px; word-break: break-word; }
.testimonials-list li .customer { font-weight: 700; font-size: 14px; line-height: 16px; margin: 0; }
.testimonials-list li .images { float: right; margin: 0 0 20px 20px; }
.testimonials-list li .image { float: right; clear: both; margin: 0 0 5px 0; padding: 2px; border: 2px solid #EEEEEE; }
.testimonials-list li .image:hover { border-color: #CCCCCC; transition: all 50ms ease-in-out; -webkit-transition: all 50ms ease-in-out; }
.testimonials-list li .image img { float: right; width: 100%; max-width: 150px; height: auto; }

.testimonial-form { position: relative; display: block; width: 100%; padding: 20px; margin: 0 0 20px 0; border: 2px solid #EEEEEE; text-align: center; }
.testimonial-form .show-form { display: block; width: 100%; }
.testimonial-form .show-form .btn { display: inline-block; width: 100%; max-width: 300px; height: 50px; background: #D81F26; color: #FFFFFF; font-size: 16px; line-height: 50px; font-weight: 700; text-align: center; border: 0; cursor: pointer; border-radius: 4px; }
.testimonial-form .close_write_testimonials { text-decoration: underline; cursor: pointer; }
.testimonial-form .close_write_testimonials:hover { text-decoration: none; }

.testimonial-form .required { position: absolute; top: 10px; right: 10px; font-size: 12px; line-height: 12px; color: #AAAAAA; }

.testimonial-form .form-wrapper { display: none; width: 100%; text-align: left; }
.testimonial-form .row { display: block; width: 100%; margin: 0 0 10px 0; }
.testimonial-form .row .cell { display: block; width: 100%; }
.testimonial-form .row .cell.cell1 { font-size: 12px; line-height: 12px; font-weight: 700; margin: 0 0 5px 0; }
.testimonial-form .row .cell.cell2 .input { display: block; width: 100%; height: 40px; padding: 0px 12px 0px 12px; background: #FFFFFF; border: 1px solid #DDDDDD; border-radius: 2px; }
.testimonial-form .row .cell.cell2 .textarea { display: block; width: 100%; height: 100px; padding: 12px; background: #FFFFFF; border: 1px solid #DDDDDD; resize: none; border-radius: 2px; }
.testimonial-form .row .cell.cell2 .file { display: block; width: 100%; background: #f4f4f4; padding: 12px; border-radius: 2px; }
.testimonial-form .row .cell.cell2 .submit  { display: block; width: 100%; height: 50px; text-align: center; font-size: 17px; font-weight: 700; color: #FFFFFF; background: #D81F26 url(../images/arrow-white.png) right center no-repeat; background-size: 40px 40px; border: 0px; border-radius: 2px; cursor: pointer; -webkit-appearance: none; }

.testimonial-form .form-error { display: block; text-align: center; background: #FFDEDF; color: #D81F26; font-weight: 700; font-size: 12px; padding: 10px; border-radius: 2px; }
.testimonial-form .form-step-2 { display: block; text-align: center; background: #EEEEEE; color: #000000; font-weight: 700; font-size: 12px; padding: 10px; border-radius: 2px; }
.testimonial-form .form-step-3 { display: block; width: 100%; height: auto; padding: 20px; text-align:  center; }
.testimonial-form .form-step-3 .sent-txt { display: block; width: 100%; }
.testimonial-form .form-step-3 .sent-txt .sent-icon { display: inline-block; width: 50px; height: 50px; margin: 0 0 15px 0; background: url(../images/sent.png) center center no-repeat; background-size: 50px 50px; }
.testimonial-form .form-step-3 .sent-txt .large-txt { display: block; font-size: 22px; line-height: 26px; font-weight: 500; }


.paging { display: block; width: 100%; margin: 0 0 20px 0; font-size: 0; text-align: center; }
.paging li { display: inline-block; margin: 0 2px 0 2px; }
.paging li a { display: block; width: 40px; height: 40px; font-size: 16px; line-height: 36px; border: 2px solid #EEEEEE; transition: all 50ms ease-in-out; -webkit-transition: all 50ms ease-in-out; border-radius: 4px; }
.paging li a:hover { border-color: #CCCCCC; text-decoration: none; }
.paging li.selected a { background: #D81F26; color: #FFFFFF; border-color: #D81F26; }


/* About */
.company-picture { display: block; width: 100%; margin: 0 0 20px 0; padding: 2px; border: 2px solid #EEEEEE; transition: all 50ms ease-in-out; -webkit-transition: all 50ms ease-in-out; }
.company-picture:hover { border-color: #CCCCCC; }
.company-picture img { display: block; width: 100%; height: auto; }

/* Contact */
.content .step-2 { display: none; }
.content.step-2 .step-1 { display: none; }
.content.step-2 .step-2 { display: block; }


.form-sec { position: relative; display: block; overflow: hidden; width: 100%; margin: 0 0 0 0; padding: 30px; background: #FFFFFF; border: 2px solid #EEEEEE; }
.form-sec .sec-divider { float: left; width: 100%; margin: 0 0 20px 0; }
.form-sec .sec-divider .num { float: left; width: 24px; height: 24px; margin: 0 10px 0 0; font-size: 16px; line-height: 24px; font-weight: 700; color: #D81F26; text-align: center; background: #FFFFFF; box-shadow: 0 2px 6px 0 rgba(0,0,0,0.17); border-radius: 50%; }
.form-sec .sec-divider .txt { float: left; font-size: 18px; line-height: 24px; font-weight: 500; }

.form-sec ul li.error input, .form-sec ul li.error textarea, .form-sec ul li.error select { border-color: #D81F26 !important; background-color: #FCECED !important; }

.form-sec .required { position: absolute; top: 10px; right: 10px; font-size: 12px; line-height: 12px; color: #AAAAAA; }

.form-sec .contact-info { float: left; width: 100%; margin: 0 0 30px 0; }
.form-sec .contact-info li { float: left; width: 100%; margin: 0 0 10px 0; }
.form-sec .contact-info li .title { float: left; width: 90px; font-size: 12px; line-height: 40px; font-weight: 700; text-transform: uppercase; }
.form-sec .contact-info li .title .red { color: #D81F26; }
.form-sec .contact-info li .option { float: left; width: calc(100% - 90px); }
.form-sec .contact-info li .option .input { float: left; width: 100%; height: 40px; padding: 0 12px 0 12px; background: #FFFFFF; border: 1px solid #DDDDDD; border-radius: 2px; -webkit-appearance: none;}
.form-sec .contact-info li .option .input.half { width: 50%; }


.form-sec .building-details { float: left; width: 100%; margin: 0 0 30px 0; }
.form-sec .building-details li { float: left; width: 100%; margin: 0 0 10px 0; }
.form-sec .building-details li .title { float: left; width: 90px; font-size: 12px; line-height: 40px; font-weight: 700; text-transform: uppercase; }
.form-sec .building-details li .title.top-align { float: left; width: 90px; font-size: 12px; line-height: 12px; font-weight: 700; text-transform: uppercase; }
.form-sec .building-details li .title .red { color: #D81F26; }
.form-sec .building-details li .option { float: left; width: calc(100% - 90px); }
.form-sec .building-details li .option .title { width: 100%; line-height: 12px; margin: 14px 0 10px 0; }
.form-sec .building-details li .option .input { float: left; width: 100%; height: 40px; padding: 0 12px 0 12px; background: #FFFFFF; border: 1px solid #DDDDDD; border-radius: 2px; -webkit-appearance: none; }
.form-sec .building-details li .option .input.half { width: 50%; }
.form-sec .building-details li .option .textarea { float: left; width: 100%; height: 150px; padding: 12px; resize: none; background: #FFFFFF; border: 1px solid #DDDDDD; border-radius: 2px; -webkit-appearance: none;}
.form-sec .building-details li .option.col-2 .col { float: left; width: calc(50% - 5px); margin: 0 10px 0 0; }
.form-sec .building-details li .option.col-2 .col:last-child { margin: 0; }
.form-sec .building-details li .option .select { float: left; width: 100%; height: 40px; padding: 0 12px 0 12px; background: #FFFFFF url(../images/arrow.png) right center no-repeat; background-size: 40px 40px; border: 1px solid #DDDDDD; border-radius: 2px; -webkit-appearance: none;}


.form-sec .extra-details { float: left; width: 100%; margin: 0 0 10px 0; }
.form-sec .extra-details li { float: left; width: 100%; margin: 0 0 10px 0; }
.form-sec .extra-details li .title { float: left; width: 100%; margin: 0 0 8px 0; font-size: 12px; line-height: 12px; font-weight: 700; text-transform: uppercase; }
.form-sec .extra-details li .title.top-align { float: left; width: 90px; font-size: 12px; line-height: 12px; font-weight: 700; text-transform: uppercase; }
.form-sec .extra-details li .title .red { color: #D81F26; }
.form-sec .extra-details li .option { float: left; width: 100%; }
.form-sec .extra-details li .option .title { width: 100%; line-height: 12px; margin: 14px 0 10px 0; }
.form-sec .extra-details li .option .input { float: left; width: 100%; height: 40px; padding: 0 12px 0 12px; background: #FFFFFF; border: 1px solid #DDDDDD; border-radius: 2px; -webkit-appearance: none; }
.form-sec .extra-details li .option .input.half { width: 50%; }
.form-sec .extra-details li .option .textarea { float: left; width: 100%; height: 150px; padding: 12px; resize: none; background: #FFFFFF; border: 1px solid #DDDDDD; border-radius: 2px; -webkit-appearance: none;}
.form-sec .extra-details li .option.col-2 .col { float: left; width: calc(50% - 5px); margin: 0 10px 0 0; }
.form-sec .extra-details li .option.col-2 .col:last-child { margin: 0; }
.form-sec .extra-details li .option .select { float: left; width: 100%; height: 40px; padding: 0 12px 0 12px; background: #FFFFFF url(../images/arrow.png) right center no-repeat; background-size: 40px 40px; border: 1px solid #DDDDDD; border-radius: 2px; -webkit-appearance: none;}

.form-sec .submit-btn { float: left; width: 100%; height: 50px; text-align: center; font-size: 17px; font-weight: 700; color: #FFFFFF; background: #D81F26 url(../images/arrow-white.png) right center no-repeat; background-size: 40px 40px; border: 0px; border-radius: 2px; cursor: pointer; -webkit-appearance: none; }
.form-sec .sending-div { display: none; float: left; width: 100%; height: 50px; text-align: center; font-size: 17px; font-weight: 700; color: #FFFFFF; background: #D81F26 url(../images/spinner.gif) center center no-repeat; background-size: 50px 50px; border: 0px; border-radius: 2px; cursor: pointer; -webkit-appearance: none; }

.content.sending .form-sec .submit-btn { display: none; }
.content.sending .form-sec .sending-div { display: block; }

.error-text { display: none; float: left; width: 100%; margin: 10px 0 0 0; text-align: center; background: #FFDEDF; color: #D81F26; font-weight: 700; font-size: 12px; padding: 10px; border-radius: 2px; }
.content.error .error-text { display: block; }

.step-2 { text-align: center; }

.sent-txt { display: block; width: 100%; margin-bottom: 20px; }
.sent-txt .sent-icon { display: inline-block; width: 50px; height: 50px; margin: 0 0 15px 0; background: url(../images/sent.png) center center no-repeat; background-size: 50px 50px; }
.sent-txt .large-txt { display: block; font-size: 22px; line-height: 26px; font-weight: 500; }

.bottom-call-btn{ display: block; width: 100%; max-width: 320px; margin: 0 auto; padding: 10px; text-align: center; background: #FFFFFF; border: 1px solid #DDDDDD; box-shadow: 0 2px 4px 0 rgba(0,0,0,0.10); border-radius: 4px; transition: all 100ms ease-in-out; -webkit-transition: all 100ms ease-in-out; }
.bottom-call-btn .center { display: inline-block; padding: 0 25px 0 25px; text-align: center; background: url(../images/phone.png) right top no-repeat; background-size: 20px 30px; }
.bottom-call-btn .center .large-txt { display: block; font-size: 22px; line-height: 28px; font-weight: 500; }
.bottom-call-btn .center .small-txt { display: block; font-size: 14px; line-height: 14px; font-weight: 400; }



/* Materials */
.comes-standard-list { list-style: square; padding: 0px 0px 0px 20px; }
.materials-info-link { position: relative; display: block; width: 100%; height: auto; padding: 8px 10px 8px 10px; margin: 0 0 15px 0; text-align: center; font-size: 16px; font-weight: 900; text-transform: uppercase; text-decoration: none; background: #DC9419 url(../images/wood-bg.jpg) center bottom no-repeat; background-size: cover; border-radius: 2px; box-shadow: 2px 3px 5px 0 rgba(0,0,0,.9); transition: all 50ms ease-in-out; -webkit-transition: all 50ms ease-in-out; }
/*.materials-info-link:hover { box-shadow: 2px 4px 8px 0 rgba(0,0,0,1); text-decoration: none; }*/
.materials-info-link.metal { background-image: url(../images/metal-roof.png); }

.materials-info-link .nail-l { position: absolute; top: 50%; left: 5px; margin-top: -5px; float: left; width: 10px; height: 10px;  background: url(../images/list-bullet.png) top center no-repeat; background-size: 10px 10px; }
.materials-info-link .nail-r { position: absolute; top: 50%; right: 5px; margin-top: -5px; float: left; width: 10px; height: 10px;  background: url(../images/list-bullet.png) top center no-repeat; background-size: 10px 10px; }





/* -- Break Points -- */


@media all and (max-width: 860px) {

	/* Index */
	.desktop-top .call-btn {  width: 180px; }
	.page.scrolled-desktop .desktop-top-wrapper .centered {  padding: 0 30px 0 280px; }
	.shed-types { display: block; width: 100%; }
	.shed-types .row { display: block; width: 100%; }
	.shed-types .row .cell { display: block; width: 100%; margin: 0 0 20px 0; }
	.shed-types .row .cell .sizes-list li:nth-child(odd) {background: #EEEEEE;}
	.shed-types .row .cell .sizes-list li span.options {  }

	/* Contact */
	.form-sec { float: left; width: 100%; padding: 20px 20px 25px 20px; }
	.form-sec .contact-info li .title { width: 100%; margin: 0 0 8px 0; line-height: 12px; }
	.form-sec .contact-info li .option { width: 100%; }
	.form-sec .building-details li .title { width: 100%; margin: 0 0 8px 0; line-height: 12px; }
	.form-sec .building-details li .title.top-align { width: 100%; margin: 0 0 8px 0; line-height: 12px;  }
	.form-sec .building-details li .option {  width: 100%; }

	/* Gallery */
	.gallery-list li a .number { opacity: .6; -webkit-opacity: .6; padding: 2px; font-size: 10px; line-height: 10px; font-weight: 500;}
	.gallery-list li a:hover .number { opacity: .6; -webkit-opacity: .6; }

}


@media all and (max-width: 720px) {

	html, body {background-image: url(../images/page-wood-bg-mobile.jpg); }


	body, input, textarea, button, select, a, p { font-size: 16px; }
	h1, h2, h3, { margin-top: 0px; padding-top: 0px; }

	/* FOOTER */
	.footer {padding: 10px 20px 180px 20px; }
	.wrapper.contact .footer { padding: 10px 20px 20px 20px; }

	/* Page Top */
	.page-top .logo { width: 100%; height: 150px; margin-bottom: 10px; }
	.page-top .logo .home-box { height: 150px; }
	.page-top .logo .home-box .logo-btn .logo-img { width: auto; margin-top: 10px; height: 95px; }
	.page-top .logo .home-box .phone-num {  }
	.page-top .mobile-menu { display: block; }
	.page-top .banner { display: none; float: left; width: 100%; max-width: 100%; height: auto; }
	.page-top .banner.show { display: block; }
	.page-top .banner.hide-during-menu { display: none; }
	.page-top .banner .rope-l { display: none; top: -40px; background-image: url(../images/rope-double@2x.png); }
	.page-top .banner .rope-r { display: none; top: -40px; background-image: url(../images/rope-double@2x.png); }
	.page-middle .sidebar { display: none; width: 100%; min-height: auto; margin-bottom: 0; }
	.page-middle .sidebar.show { display: block; }
	.page-middle .sidebar .rope-l { display: none; }
	.page-middle .sidebar .rope-r { display: none; }
	.page-middle .sidebar .navigation li { text-align: left; padding: 0 20px 0 20px; }
	.page-middle .sidebar .navigation li a { font-size: 20px; }
	.page-middle .sidebar .navigation li:hover a { text-shadow: none; }
	.page-middle .sidebar .navigation li:active a { text-shadow: 0 0 4px #FBEBD9, 0 0 4px #FBEBD9, 0 0 4px #FBEBD9; }
	.page-middle .sidebar .sidebar-more { display: none; }
	.page-middle .sidebar .side-content { display: none; }
	.page-middle .sidebar.toggled .side-content { display: block; }
	.page-middle .content { float: left; width: 100%; max-width: 100%; height: auto; margin: 0 0 0 0; }
	#stick-here { display: block; }
	#stick-here.hide { display: none !important; }
	.mobile-menu.hide { display: none !important; }
	.page.scrolled .mobile-menu { margin-top: 0; position: fixed; top: 10px; left: 30px; width: calc(100% - 60px); z-index: 9999; }
	.page.scrolled .sidebar { position: fixed; top: 105px; left: 30px; width: calc(100% - 60px); z-index: 9999;  }
	.page.scrolled .page-top .mobile-call-btn { bottom: 0px; }
	.page.scrolled .page-top .banner.hide-during-menu { display: block; }

	/* Index */
	#stick-here-2 { display: none; }
	.desktop-top { display: none; }
	.shed-types .row .cell .sizes-list li span.size, 
	.shed-types .row .cell .sizes-list li span.price { font-size: 16px; }



	.alert-sticky { display: none; top: auto; bottom: 0px; opacity: 1; padding: 0 30px 0 30px;  }
	.alert-sticky .centered { position: relative; display: block; margin: 0 auto; height: 0; width: 100%; max-width: 820px; padding: 0 0px 0 0px; }
	.alert-sticky .centered .alert-message-scroll { position: absolute; bottom: 0; }
	.page.scrolled-desktop .alert-sticky { display: none; }
	.page.scrolled .alert-sticky { display: block; top: auto; bottom: 80px;  }

	.page.scrolled-desktop .alert-message { display: block; }




	/* Shed Options */
	.options-list li { width: 50%; }

	/* Gallery */
	.gallery-list li { width: 20%; }

}



@media all and (max-width: 480px) {

	.page-top .banner .family-photo { width: 90%; height: auto; }

	.testimonials-list li .image img { max-width: 100px;  }

}

@media all and (max-width: 380px) {

	.page-top .mobile-menu .text { font-size: 20px; line-height: 40px; }
	.page-top .mobile-menu .call-btn { float: right; width: 170px; }

	.testimonials-list li .image img { max-width: 80px;  }

}

@media all and (max-width: 350px) {

	.page-top .mobile-menu .text { display: none; }
	.page-top .mobile-menu .call-btn { float: right; width: 180px; }

	.paging li a { width: 30px; height: 30px; font-size: 16px; line-height: 26px; }

	.testimonials-list li .image img { max-width: 60px;  }


}


/* iPhone x */
@media only screen and (device-width : 375px)  and (device-height : 812px) and (-webkit-device-pixel-ratio : 3) { 

.page-top .mobile-call-btn { bottom: -100px; padding: 15px 20px 35px 20px; }


 }


/* -- Screens DPI -- */

/* -- @2x -- */
@media only screen and (-webkit-min-device-pixel-ratio: 2) {

	.desk-top-call-btn .right { background-image: url(../images/phone@2x.png); }
	.mobile-top-call-btn .centered { background-image: url(../images/phone@2x.png); }
	.form-sec .building-details li .option .select { background-image: url(../images/arrow@2x.png); }
	.form-sec .extra-details li .option .select { background-image: url(../images/arrow@2x.png);}
	.form-sec .submit-btn { background-image: url(../images/arrow-white@2x.png); }
	.sent-txt .sent-icon { background-image: url(../images/sent@2x.png); }
	.bottom-call-btn .centered { background-image: url(../images/phone@2x.png) ; }
	.testimonial-form .row .cell.cell2 .submit { background-image: url(../images/arrow-white@2x.png); }

}


/* -- @3x -- */
@media only screen and (-webkit-min-device-pixel-ratio: 3) {

	.desk-top-call-btn .right { background-image: url(../images/phone@3x.png); }
	.mobile-top-call-btn .centered { background-image: url(../images/phone@3x.png); }
	.form-sec .building-details li .option .select { background-image: url(../images/arrow@3x.png); }
	.form-sec .extra-details li .option .select { background-image: url(../images/arrow@3x.png);}
	.form-sec .submit-btn { background-image: url(../images/arrow-white@3x.png); }
	.sent-txt .sent-icon { background-image: url(../images/sent@3x.png); }
	.bottom-call-btn .centered { background-image: url(../images/phone@3x.png) ; }
	.testimonial-form .row .cell.cell2 .submit { background-image: url(../images/arrow-white@3x.png); }

}