@charset "UTF-8";
/* CSS Document */

html, body { font-family: 'Open Sans', sans-serif; }

::-webkit-input-placeholder { font-weight:300; color:#999; }
:-moz-placeholder { font-weight:300; color:#999; }
::-moz-placeholder { font-weight:300; color:#999; }
:-ms-input-placeholder { font-weight:300; color:#999; }

.hidden { display: none; }
button.bg-green, button.bg-gray, button.bg-red, button.bg-blue, button.bg-white, button.bg-transparent { display:inline-block; vertical-align:top; border:0px; height:38px; min-width:38px; text-align:center; line-height:38px; border-radius:5px; font-size:14px; padding:0px 10px; cursor:pointer; transition:all .5s ease; overflow:hidden; text-overflow:ellipsis; }
/*button.bg-green:active, button.bg-gray:active, button.bg-red:active, button.bg-blue:active, button.bg-white:active, button.bg-transparent:active { opacity:.25; }*/
button.bg-green:focus, button.bg-gray:focus, button.bg-red:focus, button.bg-blue:focus, button.bg-white:focus, button.bg-transparent:focus { outline:0px; }
button.bg-gray:last-child, button.bg-red:last-child, button.bg-blue:last-child, button.bg-white:last-child, button.bg-transparent:last-child { margin-right:0px; }
button.bg-green { background:#5cb85c; color:#fff; }
button.bg-gray { background:#666; color:#fff; }
button.bg-red { background:#c00; color:#fff; }
button.bg-blue { background:#3271c1; color:#fff; }
button.bg-white { background:#fff; color:#666; font-weight:700; border:1px solid #ccc; line-height:36px; }
	button.bg-white i { font-weight:800; }
button.bg-transparent { background:transparent; color:#999; font-size:20px; padding:0px 5px; margin-right:0px; }


button[action="checkbox"] { border-radius:5px !important; margin-right:5px !important; height:40px; width:40px; font-size:16px; background:#fff; }
button[action="checkbox"][data-status="active"]::before { font-family: 'FontAwesome'; top:0px; left:10px; content:"\f00c"; }
    button.bg-white[action="checkbox"][data-status="active"] { background:#f9f9f9 !important; color:#3271c1 !important; box-shadow:0px 0px 3px #ccc inset; }

button.btn-round { box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12),0 3px 1px -2px rgba(0,0,0,0.2); border-radius:50% !important; height:45px; width:45px; font-size:25px !important; margin-top:-3px !important; position:relative;}
.box-shadow { box-shadow:0px 0px 5px #ccc; }
	
button.bg-gray.activeBtn { background:#999 !important; }
button.bg-red.activeBtn { background:#f00 !important; }
button.bg-blue.activeBtn { background:#5ea0f4 !important; }
button.bg-white.activeBtn { background:#f9f9f9 !important; color:#3271c1 !important; box-shadow:0px 0px 3px #ccc inset; }
button.bg-transparent.activeBtn { color:#5ea0f4 !important; }

button i.leftIcon { float:left; font-size:30px; font-size:20px; line-height:34px; padding-right:5px; }
button i.rightIcon { float:right; font-size:30px; font-size:20px; line-height:34px; padding-left:5px; }

div.bg-green { background:#5cb85c; color:#fff; }
div.bg-blue { background:#3271c1; color:#fff; }
div.bg-red { background:#c00; color:#fff; }
div.bg-gray { background:#666; color:#fff; }

.dyn-group { display:inline-block; vertical-align:top; padding-right:5px; }
	.dyn-group div[data="text"], .dyn-group div[data="icon"] { display:inline-block; vertical-align:top; height:36px; line-height:36px; font-size:16px; padding:0px 10px; }
	.dyn-group span { display:inline-block; line-height:36px; font-size:12px; padding: 0 10px; font-weight:700; }	
	.dyn-group:last-child { margin-right:0px; }
	.dyn-group input { display:inline-block; vertical-align:top; height:36px; line-height:36px; font-size:14px; padding:0px 10px; margin:0px; border:1px solid #ccc; transition:all .5s ease; position:relative; color:#3271c1; font-weight:300; box-shadow: inset 0px 0px 0px 0px #fff; -webkit-appearance: none; }
    .dyn-group input[disabled] { display:inline-block; vertical-align:top; height:36px; line-height:36px; font-size:14px; padding:0px 10px; margin:0px; border:1px solid #ccc; transition:all .5s ease; position:relative; color:#777; font-weight:300; box-shadow: inset 0px 0px 0px 0px #fff; -webkit-appearance: none; background: #ddd; }
	.dyn-group input + input { margin-left:-6px; }
	.dyn-group input:focus { border-color:#3271c1; box-shadow:0px 0px 2px 1px #3271c1 inset; outline:0px; }
	.dyn-group input[data="spinner"] { text-align:center; width:50px; }
	.dyn-group input:first-child { border-radius:5px 0px 0px 5px; }
	.dyn-group input:last-child { border-radius:0px 5px 5px 0px; }
	.dyn-group input:only-child { border-radius:5px; }
    .dyn-group input::-webkit-calendar-picker-indicator { display: none; }
	
	.dyn-group div[data="icon"]{ border-top:1px solid #ccc; border-bottom:1px solid #ccc; margin:0 -5px; background:#f1f1f1; color:#666; min-width:18px; text-align:center; font-weight:700; text-shadow:0px 0px 3px #fff; }
	.dyn-group div[data="icon"] + button { margin:0px; }
	.dyn-group button + div[data="icon"]{ margin-left:0px; border-left:1px solid #ccc; }
    .dyn-group div[data="icon"]:first-child { border-radius:5px 0px 0px 5px; border-left:1px solid #ccc; margin-left:0px; margin-right: -3px;}
	.dyn-group div[data="icon"]:first-child + input { margin-left:-1px; }
	.dyn-group div[data="icon"]:last-child { border-radius:0px 5px 5px 0px; border-right:1px solid #ccc; margin-right:0px; }

    .dyn-group [data="icon"][data-popup="Date"] { background:#fff; margin-left:-3px !important; z-index:100; border:1px solid #ccc; border-left:0px !important; border-radius:0px 5px 5px 0px !important; position:relative; cursor:pointer; }
	.dyn-popup [data="icon"][data-popup="Date"] { color:#3271c1 !important; }

	.dyn-group button { margin:0px; }
	.dyn-group button + button { border-radius:0px; /* margin-right:-5px;*/ }
	.dyn-group input + button { margin-left:-4px; }
	.dyn-group button:first-child { border-radius:5px 0px 0px 5px; margin-right:-5px !important; }
	.dyn-group button:last-child { border-radius:0px 5px 5px 0px; }
	.dyn-group input + button:last-child { border-left:0px; }
	.dyn-group button:only-child { border-radius:5px; }
	.dyn-group a:first-child button { border-radius:5px 0px 0px 5px; margin-right:-6px; }
	.dyn-group a:last-child button { border-radius:0px 5px 5px 0px; }
	.dyn-group a:only-child button { border-radius:5px; }
	
	.dyn-group select { border:1px solid #ccc; background:#fff url('/Images/site-templates/svg/dropdown-arrows.svg') no-repeat right 10px center; border-radius:0px; height:38px; line-height:38px; font-size:14px; padding:0px 25px 0px 10px; text-overflow:ellipsis; outline: medium none; -webkit-appearance:none; -moz-appearance: none; margin-right:-6px; transition:all .5s ease; color:#3271c1; font-weight:400; cursor:pointer; vertical-align:top; }
    .dyn-group select:focus { border-color:#3271c1; box-shadow:0px 0px 3px #6bacff inset; outline:0px; color:#3271c1 !important; }
    .dyn-group select:-moz-focusring { text-shadow:0px 0px 0px #000; color:transparent; }
	.dyn-group select:first-child { border-radius:5px 0px 0px 5px; margin-left:0px; }
	.dyn-group select:last-child { border-radius:0px 5px 5px 0px; margin-right:0px; }
	.dyn-group select:only-child { border-radius:5px; }
	.dyn-group select:disabled { background:#ddd; color:#999; cursor:default; }


	.dyn-group textarea { width: calc(100% - 22px); min-width: calc(100% - 22px); max-width:calc(100% - 22px); border:1px solid #ccc; border-radius:5px; min-height:100px; padding:10px; transition:box-shadow .5s ease;  font-size:14px; font-family:inherit; font-weight:300; }
	.dyn-group textarea:focus { border-color:#3271c1; box-shadow:0px 0px 3px #6bacff inset; outline:0px; }
	.dyn-group input[name="cvv"] { width: 30px; letter-spacing: 2px; margin-left: 0px; }
	.dyn-group input[name="ccNumber"] { letter-spacing: 0.75px; margin-left: 0px; }

	.dyn-mini { line-height:22px; }
    .dyn-mini select { height:22px; line-height:22px; font-size:12px; vertical-align:top; padding:0px 15px 0px 5px; background:#fff url('/Images/site-templates/svg/dropdown-arrows.svg') no-repeat right 5px center; cursor:pointer; min-width:50px; color:#3271c1; }
    .dyn-mini input { height:20px; line-height:20px; font-size:12px; padding:0px 5px; min-width:50px; }
    .dyn-mini div[data="icon"] { height:20px; line-height:20px; font-size:12px; padding:0 2px; }
    .dyn-mini button { height:22px; line-height:16px; font-size:12px; padding:0; min-width:25px; padding:0px 5px; }
    .dyn-mini textarea { font-size:12px; line-height:20px; }

div.dyn-box { display:none; }
.inactiveHidden { display:none !important; }
div.activeShow { display: block; }
div.activeInlineShow { display:inline-block; }
div.dyn-tab.activeBtn { border-color:#ccc #ccc #fff; margin-bottom:-1px; background:#fff !important; color:#3271c1; }

.sidebarTabs div.dyn-tab { border-color:#f9f9f9; border-bottom:1px solid #ccc; font-size:10px; }
.sidebarTabs div.dyn-tab.activeBtn { border-color:#ccc #ccc #fff; margin-bottom:-1px; background:#fff !important; color:#3271c1; }

div.dyn-tab-group { border-bottom:1px solid #ccc; height:50px; white-space:nowrap; }
div.dyn-tab { border:1px solid #fff; border-bottom:1px solid #ccc; height:49px; max-width:105px; padding:0px 10px; white-space:normal; display:inline-block; vertical-align:top; border-radius:5px 5px 0px 0px; transition:all .5s ease; cursor:pointer; color:#999; text-align:center; font-size:12px; line-height:14px; font-weight:700;  }


.invalidInput { border: 1px solid #c00; border-color:#c00 !important; color:#c00 !important; }
.invalidInput:focus { box-shadow:0px 0px 3px #fd8484 inset !important; }
.loadingInput { background:#fff url(/Images/AjaxLoader.gif) no-repeat right 10px center !important; background-size:20px !important; transition:none !important; }

.dyn-holder { display:inline-block; }
	div.dyn-holder input, div.dyn-holder textarea, div.dyn-holder select { width:100%; font-size:inherit; font-family:inherit; border-radius:5px !important; border:1px solid #ccc; position:relative; }
	div.dyn-text, div.dyn-textarea, div.dyn-select { font-family:inherit; display:inline-block; vertical-align:top; cursor:pointer; color:#3271c1; padding:0px; }

	div.dyn-icon { display:inline-block; vertical-align:top; width:8px; height:8px; padding:0px; font-size:8px; line-height:16px; color:#3271c1; margin-left:2px; cursor:pointer; }

.dyn-add { display:block; width:100% !important; }
	.dyn-add input { display:inline-block; vertical-align:top; height:36px; line-height:36px; font-size:16px; padding:0px 10px; margin:0px; border:1px solid #ccc; transition:all .5s ease; border-radius:5px 0px 0px 5px; background:#fff; }
    .dyn-add button { border-radius:0px; }
    .dyn-add input:focus { border-color:#3271c1; box-shadow:0px 0px 3px #6bacff inset; }


.dyn-popup { display:inline-block; vertical-align:top; position:relative; }
    [data-popup="Wishlist"],[data-popup="Order"],[data-popup="Estimate"],[data-popup="List"],[data-popup="Cart"],[data-popup="Compare"] { display:inline-block; float:none !important; cursor:pointer; }
    .popupArrowContainer { position:absolute; text-align:center; z-index:10001; }
    .popupArrowBox { display:inline-block; vertical-align:top; width:30px; height:15px; }
		.popupArrowBox .popupArrowBorder { position:relative; width:0px; height:0px; border-left:15px solid transparent; border-right:15px solid transparent; border-bottom:15px solid #ccc; margin:-2px auto 0; }
        .popupArrowBox .popupArrowBg { position:relative; width:0px; height:0px; border-left:12px solid transparent; border-right:12px solid transparent; border-bottom:13px solid #f9f9f9; margin:-13px 0px 0px 3px; }
    .dyn-popup .popupList { position:absolute; width:275px; margin:11px 0 0 -90px; border:2px solid #ccc; border-top:1px solid #ccc; border-radius:5px; overflow:hidden; background:#fff; text-align:left; z-index:10000; }

        .dyn-popup.popupListDetails .popupList { width:400px; margin-left:-186px; }
            .dyn-popup.popupListDetails .rowContainer { width:100%; height:295px; }
            .dyn-popup.popupListDetails #popupRightDetails { height:250px; overflow:auto; white-space:normal; margin-right:-10px; padding-right:10px; }

            .dyn-popup[data-direction="down"] .popupArrowBorder { border-bottom:15px solid #ccc; }
            .dyn-popup[data-direction="down"] .popupArrowBg { border-bottom:13px solid #e9edf0; }
            .dyn-popup[data-direction="up"] .popupArrowBorder { border-bottom:0px; border-top:15px solid #ccc; }
            .dyn-popup[data-direction="up"] .popupArrowBg { border-bottom:0px; border-top:13px solid #fff; margin:-15px 0 0 3px; }

                #popupLeftImage { float:left; width:125px; text-align:center; }
                    #popupLeftImage img { max-width:125px; border-radius:3px; }
                #popupRightDetails { float:right; width: calc(100% - 145px); }
                    #popupRightTitle { font-size:14px; font-weight:700; color:#3271c1; line-height:16px; }

                        #popupRightTitle span { font-size:12px; font-weight:300; color:#666; }
                    #popupRightPrice { color:green; font-size:14px; font-weight:700; padding-top:5px; display:none; }
                    #popupRightDescription { padding:10px 0px; font-size:12px; border-top:1px solid #f1f1f1; margin-top:10px; border-bottom:1px solid #f1f1f1; }
                    #popupRightRows { margin-top:10px; }
                        .popupRightRow { font-size:12px; font-weight:400; clear:both; }
                            .popupLeftCol { float:left; width:100px; color:#999; }
                            .popupRightCol { float:right; width: calc(100% - 100px); color:#666; }
                    #popupRightButtons { border-top:1px solid #f1f1f1; margin-top:10px; padding-top:10px; padding-right:5px; }
                        #popupRightButtons button { margin-top:5px; width:100%; }
        .listContainer { display:none; vertical-align:top; width:0px; }
            .listContentTitle { padding:10px 20px; height:30px; background:#f9f9f9; font-weight:700; font-size:14px; color:#666; min-width:220px; border-top:1px solid #ccc; border-bottom:1px solid #ccc; }
                .listContentTitle .listArrow { color:#999; line-height:50px; font-size:20px; height:50px; border-right:1px solid #ccc; width:50px; margin:-10px 0 -10px -20px; transition:all .5s ease; cursor:pointer; }
                .listContentTitle .listView { color:#999; line-height:50px; font-size:20px; height:50px; border-left:1px solid #ccc; width:50px; margin:-10px -20px -10px 0px; transition:all .5s ease; cursor:pointer; }

                #popupListTitle { background:#f9f9f9; }
            .rowContainer { overflow:auto; max-height:325px; width:275px; }
                .listRow { text-align:left; padding:10px 20px; border-top:1px solid #ccc; font-size:14px; line-height:14px; min-width:220px; font-weight:300; height:30px; transition:all .5s ease; }

                    .listRow:active { opacity:.20; }
                    .listDetails { margin-right:10px; text-align:left; }
                        .listTitle { color:#3271c1; font-size:14px; font-weight:400; padding-bottom:3px; }
                        .listInfo { color:#666; font-size:10px; font-weight:400; }
                            .listInfo strong { font-weight:700; }
                    .listArrow { font-size:20px; height:30px; line-height:30px; color:#3271c1; }
                    .listRemove { width:20px; height:20px; line-height:20px; color:#666; font-size:14px; cursor:pointer; opacity:.50; transition:all .5s ease; }

                    .listView { font-size:20px; height:30px; line-height:30px; color:#3271c1; cursor:pointer; float:right; }

                .itemRow { padding:20px; border-top:1px solid #ccc; min-width:220px; transition:all .5s ease; }

                    .itemImg { width:40px !important; height:40px; border-radius:5px; padding:5px; background:#fff; overflow:hidden; text-align:center; margin-right:10px; border:1px solid #ccc; }
                        .itemImg img { max-width:40px; max-height:40px; }
                        .itemImg .itemCount { margin:-20px 0 0 24px; position:relative; background:#fff !important; color:#666 !important; }
                    .itemDetails { font-size:12px; margin-right:5px; text-align:left; }
                        .itemName { width:190px; font-weight:700; color:#3271c1; overflow:hidden; text-overflow:ellipsis; margin-bottom:5px; font-size:12px; line-height:14px; }
                        .itemPrice { display:inline-block; vertical-align:top; font-size:12px; font-weight:700; color:#666; margin-top:10px; }
                        .itemQty { display:inline-block; vertical-align:top; font-size:12px; color:#666; text-align:left; }
                    .itemRemove { width:20px; height:20px; line-height:20px; color:#666; font-size:14px; cursor:pointer; opacity:.50; transition:all .5s ease; }


                .popupBtnHolder { height:0px; width:100%; z-index:100;}
                    .popupBtn { display:inline-block; position:relative; width:35px; height:35px; margin-top:1px; font-size:20px; line-height:35px; color:#999; text-align:center; transition:all .5s ease; cursor:pointer; margin-left:5px; z-index:100; border-radius:0px 0px 0px 5px; }


.sidebarMainTitle { background:#e9edf0; color:#596269; text-align:center; padding:5px; border-top:1px solid #ccc; border-bottom:1px solid #ccc; font-weight:700; font-size:13px; }

[data-justify="group"] { display:-webkit-flex; display:flex; text-align:center;}
	[data-justify="group"] > button[action="select"], [data-justify="group"] > button[action="toggle"], [data-justify="group"] > select, [data-justify="group"] > div.dyn-group, [data-justify="group"] > div.dyn-tab, [data-justify="group"] > input { -webkit-flex:1; -ms-flex:1; flex:1; }
	[data-justify="group"] div[data="icon"] { margin:0px; }
	[data-justify="group"] input, [data-justify="group"] select { min-width:60px; }
[data-justify="enable"] { -webkit-flex:1; -ms-flex:1; flex:1; }
[data-justify="disable"] { -webkit-flex:0 0 auto !important; -ms-flex:0 0 auto !important; flex:0 0 auto !important; min-width:auto; width:auto;  }

[data-empty=""] { display:none !important; }

.floatLeft { float:left; }
.floatRight { float:right; }
.noSelect { cursor:default !important; background:transparent !important; color:#666 !important; }
.not-available { color:#ddd !important; background:#f9f9f9 !important; }
	.not-available img { opacity:.25; }
	.not-available .itemTextMath { color:#c00; text-align:left; }
.noWrap { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
	.noWrap .sectionCol { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.v-position { position:relative; top:50%; transform:translateY(-50%); }
.v-spacing { margin-top:5px; margin-bottom:5px; }
.align-left { text-align:left; }
.align-center { text-align:center; }
.align-right { text-align:right; }
.mobile-overflow { max-height:575px; overflow:auto; }
.hiddenBox { display:none !important; }
.helptext { font-size: 14px; font-weight: 100; text-align: left; padding-top: 5px; padding-bottom: 5px; color: #999;}
.roundRight { border-radius:0px 3px 3px 0px !important; }
.roundLeft { border-radius:3px 0px 0px 3px !important; }
.roundNone { border-radius:0px !important; }
.roundAll { border-radius:5px !important; }

.paddingRight0 { padding-right:0px !important; }

.superMiniText { font-size:10px; height:0px; line-height:16px; position:relative; text-align:center; }

.preventPopupBtnResize .dyn-popup { display:block; }

.infoSpacer { padding:0px 5px; }
.addItemContainer { border-top:0px; padding:10px 20px; background:#f9f9f9 !important; }

#closePopupBtn { display:none; float:right; width:20px; height:20px; line-height:20px; text-align:center; color:#999; font-size:12px; transition:all .5s ease; cursor:pointer; }


.listContainer .dyn-text, .listContainer .dyn-text div.dyn-icon { color:#666 !important; }


.cartGroup button { border-radius:5px !important; margin-right:5px !important; }
.cartGroup select { border-radius:5px !important; }


.grow { animation: grow 300ms 1 forwards; }

.dyn-tab-overflow { width:100%; overflow:hidden; }
    .tabGroupBtnHolder { width:auto; height:0px; text-align:center; }
        .tabGroupBtn { width:0px; height:0px; }
            .tabGroupBtn[data-direction="left"] { float:left; margin-left:-20px; display:none; }
            .tabGroupBtn[data-direction="right"] { float:right; margin-right:-5px; }
                .tabGroupBtn .rndGroupBtnIcon { position:absolute; margin-top:11px; width:15px; height:30px; border-radius:3px; background:#ccc; color:#fff; line-height:29px; z-index:100; font-size:20px; cursor:pointer; transition:all .5s ease; }


/* Reusable Classes */
.mobileBtn { width:44px; height:44px; line-height:44px; text-align:center; font-size:18px; transition:all .25s ease; }

.dyn-group-dark input { background:#7a868f; border-color:#7a868f; color:#fff; }
.dyn-group-dark select { background:#7a868f url('/Images/site-templates/svg/dropdown-arrows.svg') no-repeat right 10px center; border-color:#7a868f; color:#fff; }
.dyn-group-dark select:focus { color:#fff !important; }
.dyn-group-dark div[data="icon"] { background:#7a868f; border-color:#7a868f; color:#fff; text-shadow:none; }
.dyn-group-dark button { background:#7a868f; color:#fff; }


.dyn-group-dark input::-webkit-input-placeholder { font-weight:300; color:#232a31; font-style:italic; }
.dyn-group-dark input:-moz-placeholder { font-weight:400; color:#232a31; font-style:italic; }
.dyn-group-dark input::-moz-placeholder { font-weight:400; color:#232a31; font-style:italic; }
.dyn-group-dark input:-ms-input-placeholder { font-weight:400; color:#232a31; font-style:italic; }


/* Optionized Functionality */
.optionized { width:100%; text-align:left; }
.optionized input { width:100%; margin:0px; border:1px solid #ccc; }
    .optionized .optionized-holder { height:0px; width:100%; display:none; position:relative; z-index:100;  }
    .optionized .optionized-results { border:1px solid #ccc; border-top:0px; position:absolute; background:#fff; max-height:200px; overflow:auto; width: calc(100% - 2px); box-shadow:0px 4px 4px #ccc;  }
	.optionized .optionized-results div { cursor:pointer; }

    .optionizedActive { background:#f1f1f1; }
	.dyn-group .optionized input { width: calc(100% - 22px); }
	.dyn-mini .optionized input { width: calc(100% - 12px); }


input[data-popup="Date"], [data-popup="Date"] input { pointer-events:none; cursor:pointer; }
#calendarTitle { font-weight:700; width: calc(100% - 88px); margin-right:0px; }
    #calendarTitle span { padding:0px; font-size:18px; line-height:41px; }
#calendarDayNames { padding:0px 10px; width:252px; margin:0 auto; }
    .dayName { display:inline-block; vertical-align:top; margin:2px; width:32px; height:20px; line-height:20px; font-size:10px; font-weight:700; text-align:center; color:#000; }
#calendarDays { padding:0px 10px 10px; width:252px; margin:0 auto; }
    .calendarEmptyDay { display:inline-block; vertical-align:top; margin:2px; width:30px; height:30px; line-height:30px; background:#fff; border:1px solid #fff; color:#fff; }
    .calendarDay { display:inline-block; vertical-align:top; margin:2px; width:30px; height:30px; line-height:30px; background:#fff; border:1px solid #f1f1f1; color:#3271c1; border-radius:5px; text-align:center; font-size:12px; transition:all .5s ease; cursor:pointer; font-weight:700; }

    .activeCalendarDay { background:#3271c1 !important; border-color:#3271c1 !important; color:#fff !important; }
    .currentCalendarDay { background:#e6ebf2; color:#3271c1; border-color:#e6ebf2; }

.pulse-btn { -webkit-animation: pulse 1.5s 1s infinite cubic-bezier(0.66, 0, 0, 1); -moz-animation: pulse 1.5s 3 cubic-bezier(0.66, 0, 0, 1); -ms-animation: pulse 1.5s 3 cubic-bezier(0.66, 0, 0, 1); animation: pulse 5s infinite cubic-bezier(0.66, 0, 0, 1); }


.trashIconFormat { position:relative; width:11px; height:15px; line-height:14px; background:#fff; border-radius:3px; font-size:18px; }
    .trashIconFormat i { transform: translate(-3px,-2px); }
.trashIcon1 { transform: translate(15px,12px); }
.trashIcon2 { transform: translate(21px,3px); }
i.addAccountIcon { text-shadow:-1px -1px 0 #596269, 1px -1px 0 #596269, -1px 1px 0 #596269, 1px 1px 0 #596269; font-size:13px; transform:translateX(-4px) translateY(1px); }



#warningPopup .transPopupContainer, #warningPopup .transPopupBtnHeader, #warningPopup .transPopupBtnContainer { background:#c00; border-color:#c00; color:#c00; }
#confirmPopup .transPopupContainer, #confirmPopup .transPopupBtnHeader, #confirmPopup .transPopupBtnContainer { background:#fff; border-color:#fff; color:#fff; }

#warningPopup { z-index: 1000001 !important; }
#confirmPopup { z-index: 1000001 !important; }

#confirmButtons { margin-top:25px; }
    #confirmButtons button { width:100%; }

.addItemMsgShow { display:none; margin-top:15px; }
#xo_rightsidebar .addItemMsgShow { display:block; }

.bubble { display:none; vertical-align:top; text-align:center; padding:0px 5px; min-width:10px; height:20px; line-height:20px; font-size:10px; color:#fff; font-weight:700; background:#c00; border-radius:12px; border:1px solid #f00; margin:2px; }
.activeBubble { display:inline-block; }

.rotateDown { transform: rotate(0deg); animation: upsideDown .5s linear 0s 1 forwards; }
.rotateUp { transform: rotate(180deg); animation: upsideUp .5s linear 0s 1 forwards; }
.jiggleMe { transform: rotate(0deg); animation: jiggles 1s linear 0s 1 forwards; }

@keyframes upsideDown
{
	0%		{ transform: rotate(0deg); }
	100%	{ transform: rotate(180deg); }
}
@keyframes upsideUp
{
	0%		{ transform: rotate(180deg); }
	100%	{ transform: rotate(0deg); }
}
@keyframes jiggles
{
	0%		{ transform: rotate(0deg); }
	20%		{ transform: rotate(10deg); }
	40%		{ transform: rotate(-10deg); }
	60%		{ transform: rotate(10deg); }
	80%		{ transform: rotate(-10deg); }
	100%	{ transform: rotate(0deg); }
}



@media (max-width: 900px)
{
    #warningPopup .transPopupBtnHeader { box-shadow:none !important; }
    #warningPopup .transPopupBtnContainer { margin-top:0px; }
    
    #confirmPopup .transPopupBtnHeader { box-shadow:none !important; }
    #confirmPopup .transPopupBtnContainer { margin-top:0px; }
}


@-webkit-keyframes pulse
{
    0% { box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12),0 3px 1px -2px rgba(0,0,0,0.2); }
    20% { box-shadow: 0 0 0 45px rgba(232, 76, 61, 0); }
    100% { box-shadow: 0 0 0 45px rgba(232, 76, 61, 0); }
}
@-moz-keyframes pulse
{
    0% { box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12),0 3px 1px -2px rgba(0,0,0,0.2); }
    20% { box-shadow: 0 0 0 45px rgba(232, 76, 61, 0); }
    100% { box-shadow: 0 0 0 45px rgba(232, 76, 61, 0); }
}
@-ms-keyframes pulse
{
    0% { box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12),0 3px 1px -2px rgba(0,0,0,0.2); }
    20% { box-shadow: 0 0 0 45px rgba(232, 76, 61, 0); }
    100% { box-shadow: 0 0 0 45px rgba(232, 76, 61, 0); }
}
@keyframes pulse
{
    0% { box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12),0 3px 1px -2px rgba(0,0,0,0.2); }
    20% { box-shadow: 0 0 0 45px rgba(232, 76, 61, 0); }
    100% { box-shadow: 0 0 0 45px rgba(232, 76, 61, 0); }
}


@media (max-width: 600px)
{
	.dyn-popup.mobilePopup { position:fixed; height:100vh; width:100vw; top:0px; left:0px; z-index:10000; background: url(/Images/site-templates/transparent/blacktrans_50.png); }
    .dyn-popup.mobilePopup .popupArrowContainer { display:none; }
    .dyn-popup.mobilePopup .popupList { position:fixed !important; width:85vw !important; min-height:30vh !important; top:5vh; left:5vw; margin:0px !important; }
    .dyn-popup.mobilePopup .rowContainer { width:85vw; max-height:60vh; }
    .dyn-popup.mobilePopup.popupListDetails [data-popup="Item"] { display:none; }
    .dyn-popup.mobilePopup.popupListDetails #popupRightDetails { height:auto; }
    .dyn-popup.mobilePopup.popupListDetails .rowContainer { height:auto; max-height:85vh; }
}


@media (max-width: 450px)
{
	#popupLeftImage { width:100%; float:none; height:125px; margin-bottom:20px; }
        #popupLeftImage img { max-width:80%; max-height:125px; }
    .dyn-popup.popupListDetails #popupRightDetails { width:100%; float:none; }
    
    .sidebarBody .dynamicSidebarContainer { padding-bottom:140px; }
	
	.resizeSelect { max-width:50px; }
}

@keyframes grow
{
    from { transform: translate(0px,-5px); scale(.5,.5); opacity:0; }
    to { transform: translate(0px,0px); scale(1,1); opacity:1; }
}








/* Targets 3rd & 4th, Air & Air 2, Mini 2 Generation Ipads */
@media only screen and (min-device-width : 1536px) and (max-device-width : 2048px) and (min-resolution: 192dpi)
{
	html, body { height:100%; overflow: scroll; -webkit-overflow-scrolling:touch; }
}

/* Targets 1st & 2nd Generation Ipads */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px)
{
	html, body { height:100%; overflow:scroll; -webkit-overflow-scrolling:touch; }
}

/* Targets Iphone 6 Portrait */
@media only screen and (min-device-width : 375px) and (max-device-width : 667px)
{
	html, body { height:100%; overflow:scroll; -webkit-overflow-scrolling:touch; }
}

/* Targets Iphone 6 Plus Portrait */
@media only screen and (min-device-width : 414px) and (max-device-width : 736px)
{
	html, body { height:100%; overflow:scroll; -webkit-overflow-scrolling:touch; }
}

/* Targets Iphone 5 & 5s Portrait */
@media only screen and (min-device-width : 320px) and (max-device-width : 568px)
{
	html, body { height:100%; overflow:scroll; -webkit-overflow-scrolling:touch; }
}

/* Targets Targets All Other Iphones Portrait */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px)
{
	html, body { height:100%; overflow:scroll; -webkit-overflow-scrolling:touch; }
}



/* Remove Hover Effects for Mobile Devices */
@media (min-width: 800px)
{
	button.bg-green:hover { background:#6fd36f; }
	button.bg-gray:hover { background:#999; }
	button.bg-red:hover { background:#f00; }
	button.bg-blue:hover { background:#5ea0f4; }
	button.bg-white:hover { color:#3271c1; }
	button.bg-transparent:hover { color:#3271c1; }
	
	div.bg-green:hover { background:#6fd36f; }
	div.bg-blue:hover { background:#5ea0f4; }
	div.bg-red:hover { background:#f00; }
	div.dyn-tab:hover { background:#f9f9f9; }
	div.dyn-text:hover, div.dyn-textarea:hover, div.dyn-select:hover, div.dyn-holder:hover .dyn-icon { color:#5ea0f4; }
	
	#popupRightTitle strong:hover { color:#59b958; cursor:pointer; }
	.listContentTitle .listArrow:hover, .listContentTitle .listView:hover { background:#fff; color:#3271c1; }
	.listRow:hover { background:#f3f8ff; cursor:pointer; }
	.listRemove:hover { color:#c00; opacity:1; }
	.listView:hover { color:#3271c1; opacity:1; }
	.itemRow:hover { background:#f3f8ff; }
	.itemRemove:hover { color:#c00; opacity:1; }
	.popupBtn:hover { color:#3271c1; }
	#closePopupBtn:hover { color:#c00; }
	.listContainer .dyn-text:hover, .listContainer .dyn-text:hover div.dyn-icon { color:#3271c1 !important; }
	.tabGroupBtn .rndGroupBtnIcon:hover { background:#999; }
	.dyn-group-dark button:hover { background:#7a868f; color:#fff; }
	.optionized .optionized-results div:hover { background:#f1f1f1; }
	.calendarDay:hover { background:#f9f9f9; color:#3271c1; }
	
	.pulse-btn:hover { -webkit-animation: none; -moz-animation: none; -ms-animation: none; animation: none; }
	.sideHeadInfo:hover .trashIconFormat { color:#c00; }
}
