/*
Theme Name: Toran Cabins
Theme URI: https://wordpress.org/themes/torancabins/
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Toran Cabins is a modernized take on an ever-popular WordPress layout — the horizontal masthead with an optional right sidebar that works perfectly for blogs and websites. It has custom color options with beautiful default color schemes, a harmonious fluid grid using a mobile-first approach, and impeccable polish in every detail. Toran Cabins will make your WordPress look beautiful everywhere.
Version: 2.0
Requires at least: 4.4
Requires PHP: 5.2.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: one-column, two-columns, right-sidebar, accessibility-ready, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, flexible-header, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready, blog
Text Domain: torancabins

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 - Genericons
 * 3.0 - Typography
 * 4.0 - Elements
 * 5.0 - Forms
 * 6.0 - Navigation
 *   6.1 - Links
 *   6.2 - Menus
 * 7.0 - Accessibility
 * 8.0 - Alignments
 * 9.0 - Clearings
 * 10.0 - Widgets
 * 11.0 - Content
 *    11.1 - Header
 *    11.2 - Posts and pages
 *    11.3 - Post Formats
 *    11.4 - Comments
 *    11.5 - Sidebar
 *    11.6 - Footer
 * 12.0 - Media
 *    12.1 - Captions
 *    12.2 - Galleries
 * 13.0 - Multisite
 * 14.0 - Media Queries
 *    14.1 - >= 710px
 *    14.2 - >= 783px
 *    14.3 - >= 910px
 *    14.4 - >= 985px
 *    14.5 - >= 1200px
 * 15.0 - Print
 */


/**
 * 1.0 - Normalize
 *
 * Normalizing styles have been helped along thanks to the fine work of
 * Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
 */

/* CSS Document */
body{ background:#fff; font:400 15px/22px 'Lato', sans-serif; color:#7c7c7c;}
#wpadminbar ul:after{ clear:inherit;}
a{ color:#7ac142;}
a:focus, button:focus, input:focus, textarea:focus { outline: none;}
ul li{ list-style-type:none;}
#navbtn{ display:none;}
.nav-menu{ }
.nav-menu li{ position:relative; float:left; }
.nav-menu li .menuarrow{ display:none;}
.nav-menu li > a{ font:400 15px/50px 'Lato', sans-serif; color:#fff;  white-space:nowrap; display:block; padding:0 40px;}
.nav-menu li:hover > a, .nav-menu li.active > a,.nav-menu li.current_page_item > a, .nav-menu li > a:focus{ color:#3bb76b;}
.nav-menu .sub-menu{ position:absolute; left:0; top:100%; background:#0089cf; min-width:220px; box-shadow:0 0 5px #02496d; transition: all 300ms ease-out 0s; display:none; z-index:999;}
.nav-menu .sub-menu .sub-menu{ left:100%; top:0;}
.nav-menu li:hover > .sub-menu{ display:block;}
.nav-menu .sub-menu li{ float:none;}
.nav-menu .sub-menu a{ font:normal 14px/40px Arial, Helvetica, sans-serif; padding:0 10px; white-space:nowrap;}
.nav-menu .sub-menu li+li{ border-top:1px solid #035e8d;}

header{ position:absolute; top:0; left:0; right:0; z-index:999;}
#navigation{ background:#111111;}
#logo{ position:absolute; left:50%; top:7px; transform:translate(-50% , 0);}

.left-top{ float:left; position:relative; padding:4px 0 0 40px;}
.left-top img{ position:absolute; left:0; top:0;}
.left-top a{ color:#333333; font:400 15px/22px 'Lato', sans-serif; padding:10px 0 0;}
.top-call{ float:left; position:relative; padding:4px 0 0 40px; margin-right:75px;}
.top-call img{ position:absolute; left:0; top:0;}
.top-call a{ color:#333333; font:400 15px/22px 'Lato', sans-serif; padding:10px 0 0;}
.top-social{}
.top-social ul li{ float:left;}
.top-social ul li a{ display:block; padding:0 6px;}

.right-top{ float:right;}
.top-social{ float:right; padding:5px 0 0;}
.top-header{ padding:30px 0;}



#banner{ margin:0 auto; text-align:center; position:relative;}
#banner:before{ width:100%; background:url(images/bg1.png) no-repeat 0 100%; height:110px; background-size:100% 100%; content:""; position:absolute; left:0; bottom:0;}
.banner-text{ position:absolute; left:50%; top:30%; transform:translate(-50%,-50%);}
.banner-text div{ width:700px; margin:0 auto;}
.banner-text h1{ font:400 italic 38px/40px 'Lato', sans-serif; padding:15px 0 0;}
.banner-text p{ font:400 15px/22px 'Lato', sans-serif; padding:15px 0 0}
#content{ padding:70px 0;}
#content h1{ font:400 italic 38px/42px 'Lato', sans-serif; padding:15px 0 0;}
#content h3{ font:400 italic 25px/28px 'Lato', sans-serif; padding:15px 0 0;}
#content h1 span{ display:block;}
#content p{ font:400 15px/22px 'Lato', sans-serif; padding:15px 0 0}
.img-box div{ background:#3bb76b; color:#fff; text-align:center; padding:0 0 15px}
.img-box img{ width:100%;}
.img-box{ box-shadow:0 0 10px #c1c1c1; margin:30px 0 0;}
footer{ background:#1a1a1a; padding:120px 0 0; position:relative;}
footer:before{ position:absolute; top:0; left:0; width:100%; height:110px; background:url(images/bg2.png) no-repeat 0 0; background-size:100% 100%; content:"";}
footer h2{ color:#ffffff; font:400 italic 22px/25px 'Lato', sans-serif; padding:15px 0 0;}
footer p{ font:400 15px/22px 'Lato', sans-serif; padding:15px 0 0; color:#7c7c7c;}
.ft-add{}
.ft-add ul li{ padding:10px 0 0 30px; position:relative; color:#7c7c7c; float:left; width:50%;}
.ft-add ul li a{ color:#7c7c7c;}
.ft-add ul li img{ position:absolute; top:10px; left:0;}
.ft-social{}
.ft-social ul{ padding:15px 0 0; margin:0 auto; display:table}
.ft-social ul li{ float:left; padding:0 11px;}
.ft-social ul li a{ display:block;}
.ft-logo{ text-align:center; padding:20px 0 0;}
.ft-copy{ padding:0 0 15px; border-top:solid 1px #636363; text-align:center;}
#content .img-box p{ padding:0;}
#address a{ color:#7c7c7c;}

.green-text{ color:#3bb76b;}
.brd-btm{ background:url(images/icon3.png) no-repeat 50% 100%; padding:15px 0 20px !important;}

.contact-form{ width:650px; max-width:100%; margin:0 auto;}
#address{    display: flex;   flex-wrap: wrap; justify-content: center;   align-items: center;}
#address > div{ position:relative; padding:0 20px 15px 70px; display:inline-block; min-height:72px;}
#address > div img{ position:absolute; left:0; top:50%; transform:translate(0,-50%);}

@media only screen and (max-width: 1198px) {
.top-call{ margin-right:40px;}
.nav-menu li > a{ padding:0 27px;}
.banner-text div{ background:rgba(255, 255, 255, 0.3)}
.banner-text{ top:37%;}
.banner-text p{ color:#000; padding:10px;}
}
@media only screen and (max-width: 990px) {
.ft-social ul li{ padding:0 7px;}
.ft-add ul li{ float:none; width:100%;}
.top-social ul li a{ padding:0 3px;}
.top-call img{ width:26px; top:3px;}
.top-call{ margin-right:10px; padding:4px 0 0 30px;}
.top-call a{ font-size:14px;}
.left-top img{ width:26px; top:3px;}
.left-top{ padding:4px 0 0 30px;}
.left-top a{ font-size:14px;}
#logo{ width:280px;}
.top-header{ padding:25px 0;}
.nav-menu li > a{ padding:0 16px; font-size:13px; line-height:44px;}
.banner-text p{ font-size:13px; line-height:16px;}
.banner-text h1{ font-size:28px; line-height:30px;}
.banner-text{ top:41%;}
#content h1{ font-size:28px; line-height:30px;}
#content h3{ font-size:20px; line-height:20px;}
#banner::before{ height:50px;}
footer::before{ height:50px;}
footer{ padding:60px 0 0;}
}
@media only screen and (max-width: 740px) {
#navigation{ position:relative; padding:7px; margin:0 0 10px;}
#navbtn{ display:block; background:url(images/navigation.png) no-repeat 100% 50%; width:100%;; height:27px; font-size:18px; line-height:27px; text-transform:uppercase; cursor:pointer;}
.nav-menu{ display:none; position:absolute; width:100%; top:100%; left:0; right:0; background:#000; box-shadow:0 0 7px #333; z-index:999;}
.nav-menu li{ float:none;}
.nav-menu li+li{ border-top:1px solid #303030;}
.nav-menu li > a{ font:normal 16px/40px Arial, Helvetica, sans-serif;}
.nav-menu li .menuarrow{ position:absolute; right:2px; top:2px; width:36px; height:36px; z-index:99; background:url(images/nav-arrow.png) no-repeat 50% 50%; display:block; cursor:pointer; border-radius:3px;}
.nav-menu li:hover > .menuarrow, .nav-menu li.active > .menuarrow,.nav-menu li.current_page_item > .menuarrow{ background:url(images/nav-arrow.png) no-repeat 50% 50% #0089cf;}
.nav-menu .sub-menu{ position:relative; margin:0 3px;}
.nav-menu .sub-menu .sub-menu{ left:0; margin:0 5px;}
.nav-menu .sub-menu li{ float:none;}
.nav-menu li:hover > .sub-menu{ display:none;}
.ftbox{ margin:0 auto; width:300px;}
.banner-text div{ width:100%;}
header{ position:inherit;}
#logo{ position:inherit; left:0; top:0; transform:none; margin:0 auto; text-align:center;}
.left-top{ float:none; display:table; margin:0 auto;}
.top-call{ float:none; display:table; margin:0 auto;}
.right-top{ float:none;}
.top-social{ float:none; display:table; margin:0 auto;}
.top-header{ padding:0 0 5px;}
.banner-text p{ padding:7px 0 0;}
.banner-text h1{ font-size:22px; line-height:22px;}
#banner::before{ height:25px;}
footer::before{ height:25px;}
#content{ padding:25px 0;}
footer{ padding:20px 0 0;}
.ft-logo{ width:300px; margin:0 auto;}
}
@media only screen and (min-width: 740px) {
.nav-menu{ display:block !important;}
}
@media only screen and (max-width: 450px) {
#address > div{ width:250px;}
}
