/********** Fonts **********/
@font-face { font-family: 'montserratLight'; src: url(../../common/fonts/montserrat.light.eot) }
@font-face { font-family: 'montserratLight'; src: url(../../common/fonts/montserrat.light.ttf) }

@font-face { font-family: 'montserratRegular'; src: url(../../common/fonts/montserrat.regular.eot) }
@font-face { font-family: 'montserratRegular'; src: url(../../common/fonts/montserrat.regular.ttf) }

@font-face { font-family: 'montserratSemiBold'; src: url(../../common/fonts/montserrat.semiBold.eot) }
@font-face { font-family: 'montserratSemiBold'; src: url(../../common/fonts/montserrat.semiBold.ttf) }

@font-face { font-family: 'merriweatherLight'; src: url(../../common/fonts/merriweather.light.eot) }
@font-face { font-family: 'merriweatherLight'; src: url(../../common/fonts/merriweather.light.ttf) }

@font-face { font-family: 'merriweatherRegular'; src: url(../../common/fonts/merriweather.regular.eot) }
@font-face { font-family: 'merriweatherRegular'; src: url(../../common/fonts/merriweather.regular.ttf) }

@font-face { font-family: 'merriweatherRegularItalic'; src: url(../../common/fonts/merriweather.regularItalic.eot) }
@font-face { font-family: 'merriweatherRegularItalic'; src: url(../../common/fonts/merriweather.regularItalic.ttf) }

@font-face { font-family: 'merriweatherBold'; src: url(../../common/fonts/merriweather.bold.eot) }
@font-face { font-family: 'merriweatherBold'; src: url(../../common/fonts/merriweather.bold.ttf) }

@font-face { font-family: 'alexbrushRegular'; src: url(../../common/fonts/alexbrush.regular.eot) }
@font-face { font-family: 'alexbrushRegular'; src: url(../../common/fonts/alexbrush.regular.ttf) }

@font-face { font-family: 'openSansLight'; src: url(../../common/fonts/openSans.light.eot) }
@font-face { font-family: 'openSansLight'; src: url(../../common/fonts/openSans.light.ttf) }

@font-face { font-family: 'openSansRegular'; src: url(../../common/fonts/openSans.regular.eot) }
@font-face { font-family: 'openSansRegular'; src: url(../../common/fonts/openSans.regular.ttf) }

@font-face { font-family: 'openSansSemiBold'; src: url(../../common/fonts/openSans.semiBold.eot) }
@font-face { font-family: 'openSansSemiBold'; src: url(../../common/fonts/openSans.semiBold.ttf) }

@font-face { font-family: 'robotoLight'; src: url(../../common/fonts/roboto.light.eot) }
@font-face { font-family: 'robotoLight'; src: url(../../common/fonts/roboto.light.ttf) }

@font-face { font-family: 'robotoRegular'; src: url(../../common/fonts/roboto.regular.eot) }
@font-face { font-family: 'robotoRegular'; src: url(../../common/fonts/roboto.regular.ttf) }

@font-face { font-family: 'robotoMedium'; src: url(../../common/fonts/roboto.medium.eot) }
@font-face { font-family: 'robotoMedium'; src: url(../../common/fonts/roboto.medium.ttf) }

@font-face { font-family: 'robotoBold'; src: url(../../common/fonts/roboto.bold.eot) }
@font-face { font-family: 'robotoBold'; src: url(../../common/fonts/roboto.bold.ttf) }

@font-face { font-family: 'robotoSlabBold'; src: url(../../common/fonts/robotoSlab.bold.eot) }
@font-face { font-family: 'robotoSlabBold'; src: url(../../common/fonts/robotoSlab.bold.ttf) }

/********** Site **********/
body { overflow: auto; margin: 0px; background: #909B9C }
img { display: block }
#headerExternalWrapper { position: relative; float: left; width: 100%; background: url(../images/whiteBackground.gif) repeat-y center top }
#headerWrapper { position: relative; overflow-x: hidden; width: 980px; margin: 0px auto; padding-bottom: 85px; background: url(../images/whiteBackground.gif) no-repeat center top }
#designsExternalWrapper { position: relative; float: left; width: 100%; background: url(../images/designsBackground.jpg) repeat-y center top }
#designsWrapper { position: relative; overflow-x: hidden; width: 980px; margin: 0px auto; background: url(../images/designsBackground.jpg) repeat-y center top }
#princingExternalWrapper { position: relative; float: left; width: 100%; background: url(../images/whiteBackground.gif) repeat-y center top }
#princingWrapper { position: relative; overflow-x: hidden; width: 980px; margin: 0px auto; background: url(../images/whiteBackground.gif) repeat-y center top }
#contactExternalWrapper { position: relative; float: left; width: 100%; background: url(../images/contactBackground.jpg) repeat-y center top }
#contactWrapper { position: relative; overflow-x: hidden; width: 980px; margin: 0px auto; background: url(../images/contactBackground.jpg) repeat-y center top }
#footerExternalWrapper { position: relative; float: left; width: 100%; background: url(../images/footerBackground.gif) repeat-y center top }
#footerWrapper { position: relative; overflow-x: hidden; width: 980px; height: 149px; margin: 0px auto; background: url(../images/footerBackground.gif) repeat-y center top }
#subfooterExternalWrapper { position: relative; float: left; width: 100%; background: url(../images/subfooterBackground.gif) repeat-y center top }
#subfooterWrapper { position: relative; overflow-x: hidden; width: 980px; height: 55px; margin: 0px auto; background: url(../images/subfooterBackground.gif) repeat-y center top }

#contentExternalWrapper { position: relative; float: left; width: 100%; background: url(../images/whiteBackground.gif) repeat-y center top }
#contentWrapper { position: relative; overflow-x: hidden; width: 980px; margin: 0px auto; background: url(../images/whiteBackground.gif) repeat-y center top }

#pagerExternalWrapper { position: relative; float: left; text-align: center; font-size: 0px }
#pagerWrapper { position: relative; display: inline-block }
.pagerPreviousNext:link, .pagerPreviousNext:active, .pagerPreviousNext:visited { position: relative; float: left; margin-left: 20px; margin-right: 20px; font: normal 17px robotoRegular; color: #212121; text-decoration: none }
.pagerPreviousNext:hover { position: relative; float: left; margin-left: 20px; margin-right: 20px; font: normal 17px robotoRegular; color: #212121; text-decoration: underline }
.pagerNumberNormal:link, .pagerNumberNormal:active, .pagerNumberNormal:visited { position: relative; float: left; margin-left: 8px; margin-right: 8px; font: normal 17px robotoRegular; color: #212121; text-decoration: none }
.pagerNumberNormal:hover { position: relative; float: left; margin-left: 8px; margin-right: 8px; font: normal 17px robotoRegular; color: #212121; text-decoration: underline }
.pagerNumberSelected { position: relative; float: left; margin-left: 8px; margin-right: 8px; font: normal 17px robotoBold; color: #E75D73 }

.returnLink { position: relative; float: left; clear: left; margin-left: 10px; margin-top: 50px; font: normal 17px robotoMedium; color: #E75D73 }

/********** Header **********/
#headerLogo { position: relative; float: left; width: 409px; margin-left: calc(50% - 204px); margin-top: 110px }
#headerText { position: relative; float: left; width: 960px; margin-left: 10px; margin-top: 26px; font: normal 22px robotoLight; color: #424256; line-height: 140%; text-align: center }
#headerText b { font-weight: normal; font-family: robotoBold }

/********** Features **********/
#featuresTitle { position: relative; float: left; width: 960px; margin-left: 10px; margin-top: 71px; margin-bottom: 0px; font: normal 36px merriweatherRegular; color: #393A45; text-align: center }
.featureWrapper { position: relative; float: left; width: 280px; margin-top: 56px; padding-top: 130px; background-repeat: no-repeat; background-position: center top }
.featureTitle { position: relative; float: left; width: 280px; margin-top: 0px; font: normal 24px merriweatherRegularItalic; color: #393A45; text-align: center }
.featureText { position: relative; float: left; width: 280px; margin-top: 5px; font: normal 17px robotoLight; color: #4D5064; line-height: 26px; text-align: center }

/********** Designs **********/
#designsTitle { position: relative; float: left; width: 960px; margin-left: 10px; margin-top: 110px; font: normal 36px merriweatherRegular; color: #393A45; text-align: center }
#designsSubtitle { position: relative; float: left; width: 960px; margin-left: 10px; margin-top: 8px; margin-bottom: 41px; font: normal 18px robotoLight; color: #4D5064; text-align: center }
#designsSubtitle span { font: normal 18px robotoMedium; color: #F56E80; text-decoration: underline; cursor: pointer }
#designsSubtitle span:hover { font: normal 18px robotoMedium; color: #F56E80; text-decoration: underline; cursor: pointer }
.designLinkWrapper { position: relative; float: left; width: 292px; margin: 41px 17px 0px 17px; background: url(../images/designShadow.png) no-repeat center top }
.designLink:link, .designLink:active, .designLink:visited { position: relative; float: left; width: 280px; height: 280px; margin-left: 4px; margin-top: 4px; -webkit-transform: translate(0px, 0px); transform: translate(0px, 0px); -webkit-transition: all 0.2s 0.0s ease; transition: all 0.2s 0.0s ease }
.designLink:hover { position: relative; float: left; width: 280px; height: 280px; margin-left: 4px; margin-top: 4px; -webkit-transform: translate(-2px, -4px); transform: translate(-2px, -4px); -webkit-transition: all 0.2s 0.0s ease; transition: all 0.2s 0.0s ease }
.designName { position: relative; float: left; width: 292px; margin-top: 20px; font: normal 20px merriweatherRegularItalic; color: #4D5064; text-align: center }
.designItemWrapper { position: relative; float: left; width: 276px; height: 276px; margin-left: 23px; margin-top: 47px; background: url(../images/designFeature.png) }
.desingItemText { position: relative; float: left; width: 200px; margin-left: 38px; margin-top: 78px; font: italic 20px openSansLight; color: #4D5064; line-height: 30px; text-align: center }

/********** Pricing **********/
#pricingTitle { position: relative; float: left; width: 960px; margin-left: 10px; margin-top: 110px; font: normal 36px merriweatherRegular; color: #393A45; text-align: center }
#pricingSubtitle { position: relative; float: left; width: 960px; margin-left: 10px; margin-top: 7px; margin-bottom: 38px; font: normal 20px robotoLight; color: #4D5064; text-align: center }
#pricingSubtitle span { font: normal 20px robotoMedium; color: #4D5064; text-decoration: underline; cursor: pointer }
#pricingSubtitle span:hover { font: normal 20px robotoMedium; color: #4D5064; text-decoration: underline; cursor: pointer }
.pricingSection { position: relative; float: left; width: 214px; margin-left: 20px; margin-top: 48px; padding-left: 3px; padding-right: 3px; padding-top: 68px; font: normal 17px robotoLight; color: #4D5064; line-height: 24px; text-align: center; background-repeat: no-repeat; background-position: center top }
.pricingSection b { font: normal 17px robotoBold; color: #F45D72 }
.pricingSection a:link, .pricingSection a:active, .pricingSection a:visited { font: normal 17px robotoBold; color: #F45D72; text-decoration: underline }
.pricingSection a:hover { font: normal 17px robotoBold; color: #E75D73; text-decoration: underline }
#pricingBottomText { position: relative; float: left; width: 820px; margin-left: 120px; margin-top: 92px; font: normal 20px robotoLight; color: #4D5064; line-height: 30px; text-align: center }
#pricingBottomText b { font: normal 20px robotoBold; color: #4D5064 }

/********** Contact **********/
#contactTitle { position: relative; float: left; width: 960px; margin-left: 10px; margin-top: 95px; font: normal 38px merriweatherRegular; color: #FCE3D6; text-align: center }
.contactText { position: relative; float: left; width: 960px; margin-left: 10px; font: normal 20px robotoLight; color: #FFFFFF }
.contactText b { font: normal 20px robotoMedium; color: #FCE3D6 }
.ccityInput { display: none }
.contactInput { position: relative; float: left; padding: 17px 16px 17px 16px; font: normal 18px robotoRegular; color: #34495E; border: solid 0px #FFFFFF; background: #FFFFFF; border-radius: 5px }
.contactSendButton { position: relative; float: left; padding: 17px 16px 18px 16px; font: normal 18px montserratSemiBold; color: #FFFFFF; background: #E75D73; border-width: 0px; border-radius: 5px; cursor: pointer; box-shadow: 1px 3px 3px #2F2F3D; -webkit-transition: all 0.3s 0.0s ease; transition: all 0.3s 0.0s ease }
.contactSendButton:hover { position: relative; float: left; padding: 17px 16px 18px 16px; font: normal 18px montserratSemiBold; color: #FFFFFF; background: #C24E61; border-width: 0px; border-radius: 5px; cursor: pointer; box-shadow: 1px 3px 3px #2F2F3D; -webkit-transition: all 0.3s 0.0s ease; transition: all 0.3s 0.0s ease }
.contactSendButton:disabled { position: relative; float: left; padding: 17px 16px 18px 16px; font: normal 18px montserratSemiBold; color: #8282A8; background: #565670; border-width: 0px; border-radius: 5px; cursor: pointer; box-shadow: 1px 3px 3px #2F2F3D; -webkit-transition: all 0.3s 0.0s ease; transition: all 0.3s 0.0s ease }
.contactResultOk { position: relative; float: left; font: normal 18px robotoRegular; color: #FFFFFF }
.contactResultKo { position: relative; float: left; font: normal 18px robotoRegular; color: #E75D73 }
.contactCheckboxWrapper { position: relative; float: left; width: 500px; margin-left: 10px; margin-top: 20px }
.contactCheckboxMarkNormal { position: relative; float: left; width: 22px; height: 22px; background: url(../images/checkbox.normal.png) no-repeat left top; cursor: pointer; -webkit-transition: all 0.3s 0.0s ease; transition: all 0.3s 0.0s ease }
.contactCheckboxMarkChecked { position: relative; float: left; width: 22px; height: 22px; background: url(../images/checkbox.checked.png) no-repeat left top; cursor: pointer; -webkit-transition: all 0.3s 0.0s ease; transition: all 0.3s 0.0s ease }
.contactCheckboxLabel { position: relative; float: left; margin-left: 7px; font: normal 16px robotoLight; color: #BDBDBD }
.contactCheckboxLabel a:link, .contactCheckboxLabel a:active, .contactCheckboxLabel a:visited, .contactCheckboxLabel a:hover { font: normal 16px robotoLight; color: #BDBDBD; text-decoration: underline }

/********** Content **********/
.contentTitle { position: relative; float: left; width: 960px; margin-left: 10px; margin-top: 52px; margin-bottom: 0px; font: normal 36px robotoBold; color: #4D5064 }
.contentSubtitle { position: relative; float: left; width: 960px; margin-left: 10px; margin-top: 38px; margin-bottom: 0px; font: normal 24px robotoBold; color: #4D5064 }
.contentText { position: relative; float: left; width: 960px; margin-left: 10px; margin-top: 15px; margin-bottom: 0px; font: normal 17px robotoLight; color: #4D5064; line-height: 26px; text-align: justify }
.contentText b { font: normal 17px robotoMedium; color: #4D5064 }
.contentText li { margin-bottom: 10px }
.contentText a:link, .contentText a:active, .contentText a:visited, .contentText a:hover { font: normal 17px robotoRegular; color: #4D5064; text-decoration: underline }

/********** Wedding list **********/
#weddingListBannerExternalWrapper { position: relative; float: left; width: 100%; margin-top: 72px; background: url(../images/weddingListBannerBackground.jpg) no-repeat center top }
#weddingListBannerWrapper { position: relative; overflow-x: hidden; width: 980px; height: 498px; margin: 0px auto; background: url(../images/weddingListBannerBackground.jpg) no-repeat center top }
#weddingListBannerTitle { position: relative; float: left; clear: left; width: 580px; margin-left: 10px; margin-top: 107px; font: normal 48px merriweatherRegular; color: #393A45; line-height: 28px }
#weddingListBannerTitle span { font: normal 76px alexbrushRegular; color: #393A45 }
#weddingListBannerText { position: relative; float: left; clear: left; width: 580px; margin-left: 10px; margin-top: 0px; font: normal 18px robotoLight; color: #4D5064; line-height: 30px }
#weddingListBannerText b { font: normal 18px robotoMedium; color: #4D5064 }
#weddingListBannerButton { position: relative; float: left; clear: left; width: 310px; height: 36px; margin-left: 10px; margin-top: 33px; padding-top: 14px; font: normal 18px montserratSemiBold; color: #FFFFFF; text-align: center; background: #4D5064; border-radius: 5px; cursor: pointer; -webkit-transition: all 0.2s 0.0s ease; transition: all 0.2s 0.0s ease }
#weddingListBannerButton:hover { position: relative; float: left; clear: left; width: 310px; height: 36px; margin-left: 10px; margin-top: 33px; padding-top: 14px; font: normal 18px montserratSemiBold; color: #FFFFFF; text-align: center; background: #393B4A; border-radius: 5px; cursor: pointer; -webkit-transition: all 0.2s 0.0s ease; transition: all 0.2s 0.0s ease }

#weddingListFeaturesExternalWrapper { position: relative; float: left; width: 100%; background: url(../images/whiteBackground.gif) repeat-y center top }
#weddingListFeaturesWrapper { position: relative; overflow-x: hidden; width: 980px; margin: 0px auto; background: url(../images/whiteBackground.gif) repeat-y center top }
.weddingListFeatureWrapper { position: relative; float: left; width: 940px; margin-left: 20px }
.weddingListFeatureTitle { position: relative; float: left; width: 720px; font: normal 30px merriweatherRegularItalic; color: #393A45 }
.weddingListFeatureText { position: relative; float: left; width: 720px; min-height: 120px; margin-top: 12px; font: normal 18px robotoLight; color: #4D5064; line-height: 30px }
.weddingListFeatureText b { font: normal 18px robotoMedium; color: #4D5064 }

#weddingListExamplesExternalWrapper { position: relative; float: left; width: 100%; background: url(../images/lightGrayBackground.gif) repeat-y center top }
#weddingListExamplesWrapper { position: relative; overflow-x: hidden; width: 980px; margin: 0px auto; background: url(../images/lightGrayBackground.gif) repeat-y center top }
#weddingListExamplesTitle { position: relative; float: left; width: 960px; margin-left: 10px; margin-top: 108px; font: normal 36px merriweatherRegular; color: #393A45; text-align: center }
#weddingListExamplesText { position: relative; float: left; width: 960px; margin-left: 10px; margin-top: 10px; font: normal 18px robotoLight; color: #4D5064; text-align: center; line-height: 30px }
.weddingListExampleWrapper { position: relative; float: left; width: 292px; margin-top: 55px }
.weddingListExampleImageWrapper { position: relative; float: left; width: 292px; height: 246px; background: url(../images/listDesignShadow.png) no-repeat center top }
.weddingListExampleImageLink:link, .weddingListExampleImageLink:active, .weddingListExampleImageLink:visited { position: relative; float: left; width: 280px; height: 234px; margin-left: 4px; margin-top: 4px; -webkit-transform: translate(0px, 0px); transform: translate(0px, 0px); -webkit-transition: all 0.2s 0.0s ease; transition: all 0.2s 0.0s ease }
.weddingListExampleImageLink:hover { position: relative; float: left; width: 280px; height: 234px; margin-left: 4px; margin-top: 4px; -webkit-transform: translate(-2px, -4px); transform: translate(-2px, -4px); -webkit-transition: all 0.2s 0.0s ease; transition: all 0.2s 0.0s ease }
.weddingListExampleTitle { position: relative; float: left; width: 280px; margin-left: 4px; margin-top: 34px; font: normal 30px merriweatherRegularItalic; color: #455A64 }
.weddingListExampleText { position: relative; float: left; width: 280px; margin-left: 4px; margin-top: 10px; font: normal 18px robotoLight; color: #4D5064; line-height: 30px }
.weddingListExampleLink:link, .weddingListExampleLink:active, .weddingListExampleLink:visited, .weddingListExampleLink:hover { position: relative; float: left; margin-left: 4px; margin-top: 17px; font: normal 16px montserratSemiBold; color: #E75D73 }

/********** Footer **********/
#wetiixLogo:link, #wetiixLogo:active, #wetiixLogo:visited, #wetiixLogo:hover { position: relative; float: left; height: 50px; margin-left: 364px; margin-top: 46px; padding-right: 142px; padding-top: 8px; font: normal 18px robotoSlabBold; color: #FFFFFF; background: url(../images/wetiixLogo.png) no-repeat right top; text-decoration: none }

/********** Footer **********/
#footerContactTitle { position: relative; float: left; width: 960px; margin-left: 10px; margin-top: 70px; font: normal 36px merriweatherRegularItalic; color: #FFFFFF; text-align: center }
#footerContactValues { position: relative; float: left; width: 94%; margin-left: 3%; margin-top: 15px; padding-bottom: 90px; font-size: 0px; text-align: center }
.footerContactValue { position: relative; display: inline-block; margin: 20px 25px 0px 25px; padding-left: 31px; font: normal 18px robotoLight; color: #FFFFFF; background-repeat: no-repeat; background-position: left center }

/********** Subfooter **********/
#subfooterMenuExternalWrapper { position: relative; float: left; width: 960px; margin-left: 10px; margin-top: 21px; font-size: 0px; text-align: center }
#subfooterMenuWrapper { position: relative; display: inline-block }
.subfooterMenuItem:link, .subfooterMenuItem:active, .subfooterMenuItem:visited { position: relative; float: left; font: normal 14px montserratLight; color: #90A4AE; text-decoration: none }
.subfooterMenuItem:hover { position: relative; float: left; font: normal 14px montserratLight; color: #90A4AE; text-decoration: underline }
.subfooterMenuItemSeparator { position: relative; float: left; margin-left: 5px; margin-right: 5px; font: normal 14px montserratLight; color: #90A4AE }

/********** Cookies **********/
#cookiesBannerExternalWrapper { position: fixed; width: 100%; height: 94px; left: 0px; bottom: 0px; background: url(../images/cookiesBannerBackground.gif) no-repeat center top }
#cookiesBannerWrapper { position: absolute; width: 980px; height: 94px; left: 50%; margin-left: -490px; background: url(../images/cookiesBannerBackground.gif) no-repeat center top }
#cookiesBannerText { position: relative; float: left; width: 875px; margin-left: 10px; margin-top: 16px; font: normal 14px robotoLight; color: #FFFFFF; line-height: 150% }
#cookiesBannerText a:link, #cookiesBannerText a:active, #cookiesBannerText a:visited, #cookiesBannerText a:hover { font: normal 14px robotoBold; color: #393A45 }
#cookiesBannerAcceptButton { position: relative; float: right; width: 50px; height: 41px; margin-right: 10px; margin-top: 18px; padding-top: 9px; font: normal 24px robotoLight; color: #4D5064; text-align: center; background: #FED2D9; border-radius: 25px; cursor: pointer; ; -webkit-transition: all 0.2s 0.0s ease; transition: all 0.2s 0.0s ease }
#cookiesBannerAcceptButton:hover { position: relative; float: right; width: 50px; height: 41px; margin-right: 10px; margin-top: 18px; padding-top: 9px; font: normal 24px robotoLight; color: #4D5064; text-align: center; background: #D6B2B8; border-radius: 25px; cursor: pointer; ; -webkit-transition: all 0.2s 0.0s ease; transition: all 0.2s 0.0s ease }

/********** Legal info **********/
#legalInfoTitle { position: relative; float: left; width: 960px; margin-left: 10px; margin-top: 60px; margin-bottom: 0px; font: normal 40px robotoBold; color: #212121 }
#legalInfoText { position: relative; float: left; width: 960px; margin-left: 10px; margin-top: 15px; font: normal 17px robotoLight; color: #212121; line-height: 150% }
#legalInfoText b { font-family: robotoMedium }
#legalInfoText h2 { margin-top: 0px; margin-bottom: 10px; font: normal 24px robotoMedium; color: #212121 }
#legalInfoText ul { margin-top: 0px; margin-bottom: 0px }
#legalInfoText li { margin-top: 10px; margin-bottom: 0px }
#legalInfoText a { font: normal 17px robotoRegular; color: #212121; text-decoration: underline }