/*



Dear Buyer,



This file is created for the sake of easier customization. You don't have to search for colors 

and font-families in the forest of the main css file.



Table of Contents:



      1. Header / Homepage

      2. Portfolio

      3. Services

      4. About

      5. Contact



*/





/*-- 1. Header / Homepage --*/

#header { background: #FFF; } /* The background of the Homepage / First section */



/* Styles for the navigation bar */

div#navigation { background: #d32234; border-bottom: 1px solid #FFF; }

div#navigation div ul li a { color: #FFF; }

div#navigation div ul li:hover { background: #FFF; }

div#navigation div ul li:hover a, div#navigation div ul li a:hover { color: #000; }



/* Intro */

div#intro h1 { font-family: 'Oswald', sans-serif; font-weight: bold; color: #000; }
div#intro h2 { font-family: 'Oswald', sans-serif; font-weight: bold; color: #000; margin-bottom: 30px; line-height:40px;}

div#intro p { line-height: 28px; font-family: 'Open Sans', sans-serif; font-size: 18px; color: #666; }

div#intro p strong, div#intro p strong a { color: #000; }



/* Slider */

.flex-caption { background: #000; color: #FFF; font-size: 14px; font-family: 'Oswald', sans-serif; text-align: center; }

.flex-direction-nav li a { width: 56px; height: 120px; top: 130px; }

#slider:hover .flex-direction-nav li .next { right: 0px; background: url('images/slider_next.png') no-repeat; }

#slider:hover .flex-direction-nav li .prev { left: 0px; background: url('images/slider_prev.png') no-repeat; }





/*-- 2. Portfolio --*/

div#portfolio { background: #333; } /* The backrgound of the portfolio section */

div#portfolio_title h2 { color: #FFF; }



/* Styles for the hidden element that shows when you hover over a thumb */

div#portfolio_thumbs ul li div.item_info { background: #333; border-bottom: 2px solid #FF9900; }

div#portfolio_thumbs ul li div.item_info h3 { color: #FFF; font-family: 'Oswald', sans-serif; }

div#portfolio_thumbs ul li div.item_info h3 a { color: #FFF; }



/* Styles for the item page that loads via ajax */

#text_content { text-align: center; font-size: 12px; color: #CCC; }

#text_content h3 { font-size: 20px; color: #FFF; font-family: 'Oswald', sans-serif; }

#item_slider .flex-direction-nav li a { background: #666; font-size: 15px; }

#item_slider .flex-direction-nav li .next { color: #FFF; }

#item_slider .flex-direction-nav li .prev { color: #FFF; }

#item_slider .flex-direction-nav li .next:hover { background: #999; }

#item_slider .flex-direction-nav li .prev:hover { background: #999; }

#control_buttons a { background: #999; font-size: 15px; color: #FFF; }

#control_buttons a:hover { background: #CCC; }



/* Styles for the quote */

div#quote { text-align: center; color: #CCC; }

div#quote p { line-height: 32px; font-size: 24px; font-family: 'Quicksand', sans-serif; }





/*-- 3. Services --*/

div#services { background: #FFF; } /* The backrgound of the services section */

#services_title h2 { color: #333; }

div#services_intro { color: #666; }

div#service_elements ul li .icon {  background: #3aabe2; } /* The background of the icons */

div#service_elements ul li .service_content h3 { font-size: 19px; color: #333; font-family: 'Oswald', sans-serif; }

div#service_elements ul li .service_content a.read_more { font-size: 11px; font-weight: bold; font-style: italic; color: #333; }

div#service_elements ul li .service_content a.read_more:hover { color: #FF6600; }



/* Styles for the service page that loads via ajax */

div#service_content h3 { color: #333; font-family: 'Oswald', sans-serif; }

div#service_content a#close_service { font-size: 13px; color: #CCC; background: #333; }





/*-- 4. About --*/

div#about { background: #d32234; color: #FFF; } /* The backrgound of the about section */

#about_title h2 { color: #FFF; }

#about_content h3 { font-size: 22px; color: #FFF; font-family: 'Oswald', sans-serif; }

div#testimonails_contaier { background: #000; }

div.testimonial_content { color: #CCC; }



/*-- 5. Contact --*/

div#contact { background: #FFF; }

#contact_title h2 { color: #000; }

div#contact_form { font-family: 'Oswald', sans-serif; font-size: 16px; }

div#contact_form input[type="text"], div#contact_form textarea { color: #666; }

div#contact_form button { color: #FFF; background: #d32234; }