@charset "UTF-8"; /* CSS Document */ #productSelect-tabs { margin: 0px; padding: 0px; border-bottom: solid 1px #CCC; text-align: center; } #productSelect-tabs ul:after { content: ""; display: table; clear: both; } #productSelect-tabs ul { margin: 0px; padding: 0px; } #productSelect-tabs li { margin: 0px; padding: 10px 14px 18px; display: block; white-space: nowrap; list-style: none; border-top: solid 1px #FFF; border-left: solid 1px #FFF; border-right: solid 1px #FFF; float: left; position: relative; } #productSelect-tabs li#tab1 { /*float:left;*/ } #productSelect-tabs li#tab2 { /*float:right;*/ } #productSelect-tabs li#tab1.on, #productSelect-tabs li#tab2.on, #productSelect-tabs li#tab3.on, #productSelect-tabs li#tab4.on { border-top: solid 1px #CCC; border-left: solid 1px #CCC; border-right: solid 1px #CCC; border-bottom: solid 1px #EEE; margin-bottom: -1px; padding-bottom: 19px; -webkit-border-top-left-radius: 2px; -webkit-border-top-right-radius: 2px; -moz-border-radius-topleft: 2px; -moz-border-radius-topright: 2px; border-top-left-radius: 2px; border-top-right-radius: 2px; background-color: #EEE; } #productSelect-tabs li.on::after { content: ''; position: absolute; left: 42%; bottom: 0; width: 0; height: 0; border-left: 20px solid transparent; border-right: 20px solid transparent; border-top: 20px solid #253447; clear: both; } #productSelect-tabs a:link, #productSelect-tabs a:visited, #productSelect-tabs a:hover {   float: left; margin: 0px; padding: 10px 30px; text-decoration: none; white-space: nowrap; display: inline-block; font-family: "Inter", Arial, Helvetica, sans-serif; font-size: 20px; font-weight: 400; line-height: 24px; color: #000; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px 2px 2px 2px; } #productSelect-tabs a:link, #productSelect-tabs a:visited { background: #E9ECF0; -webkit-transition: background 300ms ease-out; -moz-transition: background 300ms ease-out; -o-transition: background 300ms ease-out; transition: background 300ms ease-out; } #productSelect-tabs a:hover { background-color: #DFE1E3; -webkit-transition: background 70ms ease-in; -moz-transition: background 70ms ease-in; -o-transition: background 70ms ease-in; transition: background 70ms ease-in; } #productSelect-tabs li.on a:link, #productSelect-tabs li.on a:visited, #productSelect-tabs li.on a:hover { background: #253447; margin-bottom: -1px; color: white; } #cameraSelect-Easy, #cameraSelect-All, #MFGDiv, #div1, #div2 { clear: both; padding: 20px; } #cameraSelect-Easy .colLeft { width: 690px; float: left; min-height: 325px; padding: 10px 20px 0px 0px; /*border-right: 1px solid #CCC;*/ } #cameraSelect-Easy .colRight { float: right; width: 205px; } #cameraSelect-Easy .colRight p { font: 400 18px/24px "Inter", Arial, Helvetica, sans-serif; color: #DA101C; padding: 0px 0px 10px; } #cameraSelect-Easy .colRight p span { display: block; font: 400 12px/24px "Inter", Arial, Helvetica, sans-serif; color: #666; text-transform: uppercase; } #easy-1, #easy-2, #easy-3, #easy-4 { display: block; margin: 0px 0px 30px; font: 300 18px/24px "Inter", Arial, Helvetica, sans-serif; color: #666; } #easy-1 p, #easy-2 p, #easy-3 p, #easy-4 p { font: 400 24px/30px "Inter", Arial, Helvetica, sans-serif; color: #666; } ul.buttonList { margin: 0px; padding: 0px 0px 20px 30px; } ul.buttonList li { margin: 0px; padding: 0px; display: inline-block; text-align: left; } ul.buttonList.boxed li { width: 46%; } ul.buttonList a { padding: 5px 10px; margin: 0px 15px 10px 0px; display: inline-block; text-decoration: none; font-family: "Inter", sans-serif; font-weight: 600; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px 2px 2px 2px; border: 1px solid #CCC; color: #253447; -webkit-transition: background 300ms ease-out; -moz-transition: background 300ms ease-out; -o-transition: background 300ms ease-out; transition: background 300ms ease-out; } ul.buttonList a:before { content: ''; display: inline-block; width: 20px; height: 12px; background-image: url(../images/bullet-arrow_red.png); background-size: contain; background-repeat: no-repeat; background-position: right; margin-right: 10px; } ul.buttonList a:hover { color: #E30613; } /*ul.buttonList a:hover:before { 	filter: brightness(0) saturate(100%) invert(100%) sepia(1%) saturate(3140%) hue-rotate(253deg) brightness(115%) contrast(100%); }*/ ul.buttonList.boxed a { display: block; margin: 10px; /*width: 46%; float: left;*/ font-weight: 400; } ul.buttonList.boxed { padding: 0px; } ul.buttonList.boxed:after { content: ""; display: table; clear: both; } ul.buttonList a.on:link, ul.buttonList a.on:visited { border: 1px solid #DA101C; background: #DA101C url(../images/circleWhite.png) no-repeat 7px center; color: #FFF; } ul.buttonList a.on:hover { border: 1px solid #E9ECF0; background: #E9ECF0 url(../images/circleWhite.png) no-repeat 7px center; color: #FFF; padding: 5px 10px 5px 30px; } ul.formList-tight { float: left; margin: 0px; padding: 0px 20px 0px 20px; } ul.formList-tight li { list-style: none; padding: 0px 0px 14px 0px; } ul.formList-tight label { cursor: pointer; } ul.formList-tight li:hover { color: #000; } ul.formList-tight input { margin: 0px 5px 0px 0px; padding: 0px; } ul.formList { margin: 0px 0px 20px 10px; padding: 0px; float: left; width: 31%; } ul.formList li { margin: 0px; padding: 0px 0px 10px; list-style: none; } ul.formList label { display: block; padding: 5px 0px 5px; color: #666; } ul.formList select { width: 95%; color: #666; border: 1px solid #CCC; background: #EEE; padding: 2px 4px; margin: 0px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px 2px 2px 2px; outline: none; } ul.formList option { color: #666; padding: 2px 4px; margin: 0px; outline: none; } .logoLink { margin-top: 20px; font-style: italic; } .logoLink a { text-decoration: none; color: #666; } .logoLink a:hover, .logoLink a:hover img { opacity: 0.50; } /* cable config */ .notes { background: #EEE; padding: 10px; } .notes p { font-style: italic; padding: 0; margin: 0; text-transform: uppercase; font-weight: 400; color: #334359; } .notes ul { padding: 0 10px 0 12px; margin: 5px 10px 0px 12px; } .notes ul li { padding: 4px 0 4px 12px; margin: 0px 0 0px 12px; list-style-image: url(../images/arrowDrk.png); }