/******************* Background ********************/ html { background-color: #FCFCFC; } #Wrapper, #Content { background-color: #FCFCFC; } #Footer { background-image: url("http://www.elvirreyhotel.com/wp-content/uploads/2015/12/footer.jpg"); } /********************** Font | Family **********************/ body, button, span.date_label, .timeline_items li h3 span, input[type="submit"], input[type="reset"], input[type="button"], input[type="text"], input[type="password"], input[type="tel"], input[type="email"], textarea, select, .offer_li .title h3 { font-family: "Arial", Arial, Tahoma, sans-serif; font-weight: 400; } #menu > ul > li > a, .action_button, #overlay-menu ul li a { font-family: "Droid Sans", Arial, Tahoma, sans-serif; font-weight: 400; } #Subheader .title { font-family: "Merriweather", Arial, Tahoma, sans-serif; font-weight: 400; } h1, .text-logo #logo { font-family: "Merriweather", Arial, Tahoma, sans-serif; font-weight: 300; } h2 { font-family: "Merriweather", Arial, Tahoma, sans-serif; font-weight: 300; } h3 { font-family: "Merriweather", Arial, Tahoma, sans-serif; font-weight: 300; } h4 { font-family: "Merriweather", Arial, Tahoma, sans-serif; font-weight: 300; } h5 { font-family: "Merriweather", Arial, Tahoma, sans-serif; font-weight: 700; } h6 { font-family: "Merriweather", Arial, Tahoma, sans-serif; font-weight: 400; } blockquote { font-family: "Droid Sans", Arial, Tahoma, sans-serif; } /********************** Font | Size **********************/ /* Body */ body { font-size: 13px; line-height: 21px; } #menu > ul > li > a, .action_button { font-size: 14px; } /* Headings */ h1, #Subheader .title, .text-logo #logo { font-size: 40px; line-height: 40px; } h2 { font-size: 30px; line-height: 30px; } h3 { font-size: 25px; line-height: 27px; } h4 { font-size: 21px; line-height: 25px; } h5 { font-size: 15px; line-height: 20px; } h6 { font-size: 13px; line-height: 20px; } /* Responsive */ @media only screen and (min-width: 768px) and (max-width: 959px){ body { font-size: 13px; line-height: 20px; } #menu > ul > li > a { font-size: 13px; } h1, #Subheader .title, .text-logo #logo { font-size: 36px; line-height: 36px; } h2 { font-size: 27px; line-height: 27px; } h3 { font-size: 23px; line-height: 25px; } h4 { font-size: 19px; line-height: 23px; } h5 { font-size: 14px; line-height: 18px; } h6 { font-size: 13px; line-height: 19px; } blockquote { font-size: 15px;} .the_content_wrapper ul, .the_content_wrapper ol { font-size: 14px; line-height: 19px; } .faq .question .title { font-size: 14px; } .pricing-box .plan-header h2 { font-size: 27px; line-height: 27px; } .pricing-box .plan-header .price > span { font-size: 40px; line-height: 40px; } .pricing-box .plan-header .price sup.currency { font-size: 18px; line-height: 18px; } .pricing-box .plan-header .price sup.period { font-size: 14px; line-height: 14px;} .offer .offer_li .desc_wrapper .title h3 { font-size: 32px; line-height: 32px; } .offer_thumb_ul li.offer_thumb_li .desc_wrapper .title h3 { font-size: 32px; line-height: 32px; } .counter .desc_wrapper .number-wrapper { font-size: 45px; line-height: 45px;} .counter .desc_wrapper .title { font-size: 14px; line-height: 18px;} .chart_box .chart .num { font-size: 45px; line-height: 45px; } .trailer_box .desc h2 { font-size: 27px; line-height: 27px; } .quick_fact .number { font-size: 80px; line-height: 80px;} } @media only screen and (min-width: 480px) and (max-width: 767px){ body { font-size: 13px; line-height: 20px; } #menu > ul > li > a { font-size: 13px; } h1, #Subheader .title, .text-logo #logo { font-size: 32px; line-height: 32px; } h2 { font-size: 24px; line-height: 24px; } h3 { font-size: 20px; line-height: 22px; } h4 { font-size: 17px; line-height: 21px; } h5 { font-size: 13px; line-height: 17px; } h6 { font-size: 13px; line-height: 18px; } blockquote { font-size: 14px;} .the_content_wrapper ul, .the_content_wrapper ol { font-size: 13px; line-height: 16px; } .faq .question .title { font-size: 13px; } .pricing-box .plan-header h2 { font-size: 24px; line-height: 24px; } .pricing-box .plan-header .price > span { font-size: 34px; line-height: 34px; } .pricing-box .plan-header .price sup.currency { font-size: 16px; line-height: 16px; } .pricing-box .plan-header .price sup.period { font-size: 13px; line-height: 13px;} .offer .offer_li .desc_wrapper .title h3 { font-size: 28px; line-height: 28px; } .offer_thumb_ul li.offer_thumb_li .desc_wrapper .title h3 { font-size: 28px; line-height: 28px; } .counter .desc_wrapper .number-wrapper { font-size: 40px; line-height: 40px;} .counter .desc_wrapper .title { font-size: 13px; line-height: 16px;} .chart_box .chart .num { font-size: 40px; line-height: 40px; } .trailer_box .desc h2 { font-size: 24px; line-height: 24px; } .quick_fact .number { font-size: 70px; line-height: 70px;} } @media only screen and (max-width: 479px){ body { font-size: 13px; line-height: 20px; } #menu > ul > li > a { font-size: 13px; } h1, #Subheader .title, .text-logo #logo { font-size: 28px; line-height: 28px; } h2 { font-size: 21px; line-height: 21px; } h3 { font-size: 18px; line-height: 20px; } h4 { font-size: 15px; line-height: 18px; } h5 { font-size: 13px; line-height: 16px; } h6 { font-size: 13px; line-height: 17px; } blockquote { font-size: 13px;} .the_content_wrapper ul, .the_content_wrapper ol { font-size: 13px; line-height: 16px; } .faq .question .title { font-size: 13px; } .pricing-box .plan-header h2 { font-size: 21px; line-height: 21px; } .pricing-box .plan-header .price > span { font-size: 32px; line-height: 32px; } .pricing-box .plan-header .price sup.currency { font-size: 14px; line-height: 14px; } .pricing-box .plan-header .price sup.period { font-size: 13px; line-height: 13px;} .offer .offer_li .desc_wrapper .title h3 { font-size: 26px; line-height: 26px; } .offer_thumb_ul li.offer_thumb_li .desc_wrapper .title h3 { font-size: 26px; line-height: 26px; } .counter .desc_wrapper .number-wrapper { font-size: 35px; line-height: 35px;} .counter .desc_wrapper .title { font-size: 13px; line-height: 26px;} .chart_box .chart .num { font-size: 35px; line-height: 35px; } .trailer_box .desc h2 { font-size: 21px; line-height: 21px; } .quick_fact .number { font-size: 60px; line-height: 60px;} } /********************** Sidebar | Width **********************/ .with_aside .sidebar.columns { width: 23%; } .with_aside .sections_group { width: 75%; } .aside_both .sidebar.columns { width: 18%; } .aside_both .sidebar-1{ margin-left: -79%; } .aside_both .sections_group { width: 60%; margin-left: 20%; } /********************** Grid | Width **********************/ @media only screen and (min-width:1240px){ #Wrapper { max-width: 1240px; } .section_wrapper, .container, .with_aside .content_wrapper { max-width: 1220px; } }