/*
Theme Name: Freom
Theme URI: https://wordpress.org/themes/twentyseventeen/
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Twenty Seventeen brings your site to life with header video and immersive featured images. With a focus on business sites, it features multiple sections on the front page as well as widgets, navigation and social menus, a logo, and more. Personalize its asymmetrical grid with a custom color scheme and showcase your multimedia content with post formats. Our default theme for 2017 works great in many languages, for any abilities, and on any device.
Version: 1.6
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentyseventeen
Tags: one-column, two-columns, right-sidebar, flexible-header, accessibility-ready, custom-colors, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 Normalize
2.0 Accessibility
3.0 Alignments
4.0 Clearings
5.0 Typography
6.0 Forms
7.0 Formatting
8.0 Lists
9.0 Tables
10.0 Links
11.0 Featured Image Hover
12.0 Navigation
13.0 Layout
   13.1 Header
   13.2 Front Page
   13.3 Regular Content
   13.4 Posts
   13.5 Pages
   13.6 Footer
14.0 Comments
15.0 Widgets
16.0 Media
   16.1 Galleries
17.0 Customizer
18.0 SVGs Fallbacks
19.0 Media Queries
20.0 Print
--------------------------------------------------------------*/

/*--------------------------------------------------------------
1.0 Normalize
Styles based on Normalize v5.0.0 @link https://github.com/necolas/normalize.css
--------------------------------------------------------------*/

*{margin: 0; padding: 0;font-family: "Open Sans";}
li{list-style: none; outline: none;}
a{text-decoration: none; outline: none;}
body{font-size: 100%}
img{border: none;outline: none;}
@font-face {
        font-family: "Open Sansbold";
        src: url('fonts/OpenSans-Bold.eot');
        src: url('fonts/OpenSans-Bold.eot?#iefix') format('embedded-opentype'),
        url('fonts/OpenSans-Bold.svg#Open Sans') format('svg'),
        url('fonts/OpenSans-Bold.woff') format('woff'),
        url('fonts/OpenSans-Bold.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
}
@font-face {
        font-family: "Open Sans";
        src: url('fonts/OpenSans-Regular.eot');
        src: url('fonts/OpenSans-Regular.eot?#iefix') format('embedded-opentype'),
        url('fonts/OpenSans-Regular.svg#Open Sans') format('svg'),
        url('fonts/OpenSans-Regular.woff') format('woff'),
        url('fonts/OpenSans-Regular.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
    }
@font-face {
        font-family: "Open Sans Extrabold";
        src: url('fonts/OpenSans-ExtraBold.eot');
        src: url('fonts/OpenSans-ExtraBold.eot?#iefix') format('embedded-opentype'),
        url('fonts/OpenSans-ExtraBold.svg#Open Sans Extrabold') format('svg'),
        url('fonts/OpenSans-ExtraBold.woff') format('woff'),
        url('fonts/OpenSans-ExtraBold.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
    }
@font-face {
        font-family: "Open Sans Semibold";
        src: url('fonts/OpenSans-Semibold.eot');
        src: url('fonts/OpenSans-Semibold.eot?#iefix') format('embedded-opentype'),
        url('fonts/OpenSans-Semibold.svg#Open Sans Semibold') format('svg'),
        url('fonts/OpenSans-Semibold.woff') format('woff'),
        url('fonts/OpenSans-Semibold.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
    }
@font-face {
        font-family: "Open Sans Light";
        src: url('fonts/OpenSans-Light.eot');
        src: url('fonts/OpenSans-Light.eot?#iefix') format('embedded-opentype'),
        url('fonts/OpenSans-Light.svg#Open Sans Light') format('svg'),
        url('fonts/OpenSans-Light.woff') format('woff'),
        url('fonts/OpenSans-Light.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
    }
.wrapper{max-width: 1170px; margin:  0 auto; overflow: hidden;}
.clear{clear: both;}
.header{float: left;width: 100%; position: relative; height: 95px; background: url(assets/images/header-bg.png) no-repeat scroll 70% 0;}
.logo-area{float: left; position: absolute; top: 0; z-index: 99}
.header-content{float: left; margin: 40px 0 0 35%}
.header-content p{font-size: 14px; color: #343434;font-family: "Open Sans Light";}
.header-right{float: right;}
.header-right ul{float: left;width: 100%}
.header-right ul li{display: inline-block; background: url(assets/images/seperator.jpg) no-repeat scroll 100% 0; padding: 30px 5px 0;}
.header-right ul li:last-child{background: none; padding: 30px 0 0 5px}
.header-right ul li a{border-radius: 50%; width:30px; height: 30px; line-height: 30px; background: #000; color: #fff; display: block; text-align: center; font-size: 20px;}
.header-right ul li a:hover{background: #ff5d26}
.menu{width: 100%; background: #ff5d26;}
.menu ul{width: 100%; float: right;}
.menu ul li{display: inline-block; padding: 0 10px;}
.menu ul li a{font-family: "Open Sans Semibold";font-size: 12px; color: #fff; text-transform: uppercase; display: block; padding: 15px 0 10px 0; border-bottom: 7px solid #ff5d26}
.menu ul li:hover a,.menu ul li.active a{border-bottom:7px solid rgba(0,0,0,0.2)}
.banner{float: left;width: 100%; overflow: hidden;}
.service-btn {position: absolute;right: 15%;top: 65%;z-index: 99; background: #000; color: #fff;font-size: 20px; color: #fff;font-family: "Open Sans Light"; display: block; border-radius: 4px; padding:7px 70px;}
.service-btn:hover{background: #fff; color: #000}
.blacktrans-btn{position: absolute;right: 34%;top: 65%;z-index: 99; background:rgba(0,0,0,0.8); color: #fff;font-size: 20px; color: #fff;font-family: "Open Sans Light"; display: block; border-radius: 4px; padding:7px 70px;}
.blacktrans-btn:hover{background: #fff; color: #000}
.container{float: left;width: 100%}
.heading-border{float: left;width: 100%}
.heading-border span{border-bottom: 8px solid #727272; display: block; width: 8%; margin: 0 auto; text-align: center;}
.container-content{float: left;width: 100%; padding: 50px 0; text-align: center;}
h1{font-size: 48px;font-weight: normal; color: #ff5d26; margin-bottom: 10px; line-height: 48px;}
.container-content h1 span{color: #343434}
.container-content p{color: #7f7f7f;font-family: "Open Sans Light";font-size: 24px; line-height: 33px; width: 82%; margin: 0 auto}
.service-container{float: left;width: 100%; background: #ffeee9}
.service-area{float: left;width: 100%;padding: 50px 0; text-align: center;}
.service-title{float: left;width: 100%; margin-bottom: 20px;}
h2{font-family: "Open Sans Light";font-size: 49px; line-height: 50px; color: #343434; font-weight: normal; margin-bottom: 20px;}
.service-title p{color: #7f7f7f;font-family: "Open Sans Light";font-size: 24px; line-height: 33px;  margin: 0 auto}
.service-area p{color: #7f7f7f;font-family: "Open Sans Light";font-size: 24px; line-height: 33px;  margin: 0 auto}
.service-blockarea{float: left;width: 100%; margin: 20px 0}
.service-block{float: left;width: 100%}
.service-image{float: left;width: 207px; margin-right: 20px; background: #343434; padding: 35px 5px 10px; min-height: 300px; position: relative;}
.service-image:last-child{margin-right: 0}
.service-image .service-imagearea{background: #ff5d26; padding: 20px; border-radius: 50%; width:75px; height: 75px; line-height: 75px; margin: 0 auto 20px}
.service-imagearea img{vertical-align: middle; text-align: center; margin: 0 auto}
.service-image h3{font-size: 22px; color: #fff;font-family: "Open Sans Light"; font-weight: normal; margin-bottom: 10px;}
.service-image p{font-family: arial;font-size: 12px; color:  #fff; line-height: 14px; padding: 0 7px;}
.service-image a{ background: none repeat scroll 0 0 #fff;bottom: 10px;display: block;left: 0;padding: 5px 0;position: absolute;width: 100%; font-size: 11px; font-family: arial; color: #343434; text-transform: uppercase;}
.service-image:hover{background: #ff5d26}
.service-image:hover a{color: #ff5d26}
.service-image:hover .service-imagearea{background: #343434}
.about-container{float: left;width: 100%; padding: 30px 0}
.client-container{float: left;width: 100%; padding: 50px 0}
.about-area{float: left;width: 100%}
.about-area p{font-size: 16px; color: #5c5c5c; line-height: 28px;font-family: "Open Sans Light"; margin-bottom: 20px;}
.white-btn{float: left; display: inline-block; background: #fff; border:1px solid #dfdfdf; font-size: 15px; color: #5c5c5c;font-family: "Open Sans Light"; border-radius: 3px; padding: 12px 60px; text-transform: capitalize;}
.white-btn:hover{background: #5c5c5c; color: #fff; border: 1px solid #5c5c5c}
.footer{float: left;width: 100%; background: #000; padding: 30px 0}
.footer-container{float: left;width: 100%}
.footer-block{float: left; margin-right: 30px;}
.footer-block h4{text-transform: uppercase; font-size: 14px; color: #fff;font-weight: normal; font-family: "Open Sansbold"; margin-bottom:20px;}
.footer-block:last-child{margin-right: 0}
.footer-block ul{float: left;width: 100%}
.footer-block  ul li {display: block; width: 100%; margin-bottom: 5px;}
.footer-block  ul li a:before{content: "-"; margin-right: 5px;}
.footer-block ul li a{color: #7b7b7b;font-size: 14px; display: block;}
.footer-block ul li:hover a{color: #efefef}
.copyright{float: left;width: 100%; padding: 20px 0}
.copyright-content{float: left;}
.copyright-content p{ font-size: 14px; color: #7b7b7b;}
.footer-icons{float: right;}
.footer-icons h5{color: #7b7b7b;font-family: "Open Sansbold"; font-size: 14px; font-weight: normal; margin:5px 10px 0 0; float: left; text-transform: uppercase;}
.footer-icons ul{float: left;}
.footer-icons ul li{display: inline-block;}
.footer-icons ul li a{width: 25px; height: 25px; font-size: 16px; line-height: 25px; color: #fff; background: #ff5d26; border-radius: 50%; display: block; text-align: center; }
.footer-icons ul li a:hover{background: #000}
.innerheader{float: left;width: 100%; background: #372d29}
.innerheader-title{float: left;width: 100%}
.innerheader-title h1{font-size: 36px; color: #fff; text-transform: uppercase; line-height: 36px; padding:50px 0 0; font-weight: normal;font-family: "Open Sansbold"; margin: 0 0 20px;}
.breadcrumb{float: left;width: 100%; box-shadow: 0 2px 3px #ccc;}
.breadcrumb ul{float: left;width: 100%}
.breadcrumb ul li{display: inline-block; border-right: 1px solid #e3e2e2; color: #5f5b5a; padding: 0 8px; font-size: 11px;font-family: "Open Sans Light"; text-transform: uppercase;}
.breadcrumb ul li:first-child{padding-left: 0}
.breadcrumb ul li:last-child{border-right: none; padding-right: 0}
.breadcrumb ul li a{font-size: 11px;font-family: "Open Sans Light"; display: block; line-height: 12px; color: #c6bfbd; padding: 8px 0; text-transform: uppercase;}
.breadcrumb ul li.active a{color: #5f5b5a}
.innercontainer{float: left;width: 100%; padding: 30px 0}
.inner-content{float: left;width: 100%; border-bottom: 1px solid #e3e2e2}
.innercontainer h2{font-size: 24px;font-family: "Open Sansbold"; color: #7f7f7f; margin-bottom: 10px; font-weight: normal;}
.innercontainer p{font-size: 16px; color: #7f7f7f; line-height: 24px; margin-bottom: 20px;}
.inner-list{float: left;width: 100%; margin: 10px 0 30px 40px;}
.inner-list li{font-size: 16px; color: #7f7f7f; margin-bottom: 10px;font-family: "Open Sansbold"; list-style: disc;}
.inner-list li a{font-size: 16px; color: #7f7f7f;font-family: "Open Sansbold"; display: block;}
.service-listingblock{float: left;width: 100%; padding: 30px 0}
.service-listblock{float: left; width: 100%; padding: 20px 0;border-bottom: 1px solid #e3e2e2}
.service-heading{float: left;width: 100%; margin-bottom: 20px;}
.service-heading h3{ color: #ff5d26;font-size: 24px;font-family: "Open Sansbold"; font-weight: normal; margin-bottom: 5px; }
.service-heading span{display: block; width: 7%; border-bottom: 10px solid #ff5d26}
.service-listblock p{margin-bottom: 10px;}
.contact-container{float: left;width: 100%}
.contact-leftarea{float: left;width: 53%; margin-right: 7%}
.contact-rightarea{float: right;width: 40%}
.contact-container h4{font-size: 18px; color: #372d29; font-weight: normal;margin-bottom: 15px;font-family: "Open Sansbold"; }
.formfield {float: left;background: #fff; border: 2px solid #d5d3d2; border-radius: 5px; margin-bottom: 20px;}
.formfield input,.formfield textarea{border: none;}
.formfield.inputfield{margin-right: 16px; width: 29%; padding:10px 5px;}
.formfield.inputfield.last{margin-right: 0}
.formfield img{float: left; margin-right: 5px;}
.formfield input,.formfield textarea{float: left; width: 80%}
.formfield.textfield{width: 97%; padding: 10px 5px;}
textarea{resize:none; min-height: 200px;}
.formfield textarea{width: 95%}
.messagebtn{float: right;}
.submitbtn{ border:none; color: #fff; font-size: 16px;font-family: "Open Sansbold"; cursor: pointer; background: url(assets/images/left-arrow.png) no-repeat scroll 85% 50% #ff5d26; border-radius: 20px; padding: 8px 45px 8px 20px}
.submitbtn:hover{background: url(assets/images/left-arrow.png) no-repeat scroll 85% 50% #343434;}
.maparea{float: left;width: 100%; margin-bottom: 20px;}
.maparea img{max-width: 100%}
.contact-infoarea{float: left;width: 100%}
.contact-infoarea ul{float: left;width: 100%}
.contact-infoarea ul li{display: block; width: 100%; margin-bottom: 20px; clear: both; overflow: hidden;}
.contact-infoarea ul li img{float: left; margin: 3px 10px 0 0;}
.contact-infoarea ul li span{float: left; margin-right: 20px;}
.contact-infoarea ul li a{font-family: "Open Sans Light"; font-size: 16px; color: #898381; float: left;}
.contact-infoarea ul li p{margin-bottom: 0;font-family: "Open Sans Light"; font-size: 16px; color: #898381; float: left}
.contact-infoarea ul li a:hover{text-decoration: underline;}
.inner-contentleft{float: left;width: 60%; margin-right: 20px;}
.inner-contentimage{float: left; width: 38%}
.inner-contentimage img{max-width: 100%}

.header-center p {
   font-size: 14px;
   color: #343434;
   font-family: "Open Sans Light";
}
#cssmenu > ul > li > a {
   font-family: "Open Sans Semibold";
}