/*
	Cranston McEachern Lawyers Sitewide Styles
////////////////////////////////////////////////////////////////////////////////////

Site Colors: White: #FFFFFF;, Black: #000000;, Light Grey: #CCCCCC;

This document contains all the necessary styles for the <<SITENAME>> site.
The document is split into numerous style sections:

/// SS01: Override styles - styles that override base xhtml elements.
/// SS02: Unique Styles - styles for unique ID objects

	// ss02.1: Form Styles For Bigger sites, a list of the "subsections" in the stylesheet, to make it easier to find the styles you want in the stylesheet

/// SS03: Combination Styles - styles that combine to make reflexive classes
/// SS04: Anchor & Link Styles - styles that redesign links, anchors etc.


////////////////////////////////////////////////////////////////////////////////////
*/

/*
SS01: OVERRIDE STYLES
///////////////////////////////////////////
*/

body, html
{
    padding: 0px;
    margin: 0px;
    /*height: 100%;*/
    /*text-align: center;*/
    font-family: 'Oxygen', sans-serif;
    font-size: 14px;
    font-weight:300;
    line-height: 19px;
    /*width: 100%;*/
    /*max-width:100%;*/
    /*background-image: url(images/cranmac_bg.png);*/
    /*background-repeat: repeat-x;*/
    /*background-position: center top;*/
}

h1
{
    font-size: 31px;
    line-height: 35px;
    font-family: 'Oxygen', sans-serif;
    font-weight: 400;
    margin-top: 0;
    margin-right: 0;
    margin-bottom: 20px;
    margin-left: 0;
    color: #0599CF;
}

h2
{
    font-size: 21px;
    color: #007dab;
    font-weight: 400;
}

p
{
    margin:0 0 14px 0;
}

a
{
    color:#000;
}

ul
{
    margin:2px 0 12px 0; padding:0 0 0 20px;
}

/*
SS02: UNIQUE STYLES
///////////////////////////////////////////
*/

#CT_Body
{
    width: 1004px;max-width:100%;
    margin: auto;
    min-height: 100%;
    position: relative;
    overflow-x:hidden;
}

* html #CT_Body
{
    height:100%;
}

#CT_Header
{
    width: 1004px;max-width:100%;
    height: 154px;
    clear: both;
    z-index: 402;
    position: relative;
}

.headerImg {
    margin:0px 0;
}

#Menu
{
    width: 1004px;max-width:100%;
    height: 37px;
    float: left;
    z-index: 400;
    position: relative;
    margin-bottom: 5px;
}

#CT_Content
{
    width: 1003px;max-width:100%;
    clear: both;
    padding-bottom:/*51px*/ 10px;
    text-align: left;
    z-index: 1;
    position: relative;

}

#Banner
{
    width: 1002px;max-width:100%;
    height: 213px;
    margin: 0 0 25px -1px;
}

#sideMenu
{
    width:244px;  float:left; margin:0 26px 0 0; display:inline;max-width:100%;
}

.sideMenuTitle
{
    height:40px; width:244px;max-width:100%;
}

.sideMenuTitle h2
{
    font-size: 21px;
    margin: 0;
    line-height: 39px;
    text-align: left;
    padding: 0 0 0 17px;
    font-family: 'Oxygen', sans-serif;
    font-weight: 300;
    color:#585f65;
}

.sideMenuContent
{
    background-repeat: no-repeat;
    background-position: top left;
    min-height: 376px;
}

.sideMenuPadding
{
    padding:7px 10px 7px 15px; margin-top: 10px;
}

.sideMenuContent ul
{
    font-weight:700;  margin:0; padding:0; list-style-type:none;
}

.sideMenuContent ul a
{
    text-decoration:none; color:#616D7C;	margin-bottom: 13px;
    display: block; font-size: 14px; font-weight:700;
}
.sideMenuContent ul a:hover
{
    text-decoration: none;
    color: #000;
    background-color: #FFF;
}

.sideMenuContent span
{
    line-height:16px;
}

.sideMenuContent br
{
    line-height:9px;
}

.content
{
    /*float: left;*/
    /*width: 682px;*/
    /*max-width:100%;*/
    /*margin-left: 20px;*/
}

.fullContent
{
    width: 960px;max-width:100%;
    margin-left: auto;
    margin-right: auto;
}

#featureBox
{
    width: 700px;
    max-width:100%;
    background-repeat: no-repeat;
    background-position: top left;
    background-image: url(images/contentBoxMiddle.png);
    margin: 0 auto;
}
#featureBox2
{
    width: 700px;
    max-width:100%;
    background-repeat: no-repeat;
    background-position: top left;
    background-image: url(images/blankBoxMiddle.png);
    margin: 0 auto;
}

.featureBoxTitle
{
    height:40px; width:649px;max-width:100%;
}

.featureBoxTitle h2
{
    font-size:21px; margin:0; line-height:39px; text-align:left; padding: 23px 16px 0 77px; color:#585f65;
}

h2.featureBoxTitleOne, .featureBoxSectionOne
{
    width:380px; float:left;max-width:100%;
}

h2.featureBoxTitleTwo, .featureBoxSectionTwo
{
    width:400px; float:left;max-width:100%;
    font-family: 'Oxygen', sans-serif;
    font-weight: 300;
}

.featureBoxSectionTwo
{
    margin: 0 0 0 0px;
}

.featureBoxContent
{

}

.featureBoxPadding
{
    padding: 47px 15px 15px 45px;
}

.featureBoxContent p
{
    margin:0 0 6px 0;
}

#CT_Footer
{
    width: 1004px;max-width:100%;
    height: 50px;
    margin: auto;
    margin-top:/*-51px*/20px;
    line-height: 50px;
    clear: both;
    text-align: center;
    position: relative;
    border-top: 1px solid #4f4f4f;
    font-size: 12px;
}

.footerRight
{
    float:right;
}

.footerLeft
{
    float:left;
}

/*SS02.1: Form Styles*/

.LoginForm
{
    width:350px;max-width:100%;
}

.Search
{
    float: right;
    padding: 0 6px;
    color: #333333;
    height: 36px;
    line-height: 36px;
    vertical-align: middle;
}

.SearchForm
{
    padding:0; margin:0; height:36px; line-height:36px; vertical-align:middle; * padding-bottom:10px; * height:16px;
}

.searchButton
{
    width: 20px;max-width:100%;
    height: 34px;
    background: url(images/searchButton2.gif) no-repeat top left;
    border: none;
}

.searchBox
{
    width: 150px;max-width:100%;
    height: 16px;
    border: 0px solid #fff;
    margin: 10px 4px 3px 3px;
    line-height: 20px;
    font-size: 11px;
    background-image: none;
    background-color: transparent;
}

.FormCol, .FormCol2
{
    float:left; width:300px;max-width:100%;
}

.formlabel
{
    display:block; margin:0 0 3px 0; font-weight:bold;
}

.textInput
{
    margin:0 0 15px 0; width:260px;	padding:7px;max-width:100%;
}

.textInputBox
{
    width:300px; margin:0 0 13px 0; height:65px;max-width:100%;
}

#theImage
{
    margin:5px 0 0 0;  float:left;
}

.verificationInput
{
    width:140px; margin:9px 0 0 0;max-width:100%;
}

.CaptchaRefresh
{
    float:right; margin:13px 0 0 0;
}

.submitButton
{
    /*float: left;*/
    /*padding: 9px 19px 9px 19px;*/
}

/*
SS03: COMBINATION STYLES
///////////////////////////////////////////
*/

.Logout{
    padding: 0 12px;
    text-decoration: none;
    float: left;
}
.Logout a
{
    color: #000;
    text-decoration:none;
    display: block;
    height: 34px;
    line-height:36px;
}

.memberHeading
{
    font-size:13px; font-weight:bold;
}

.memberContent
{
    margin:7px 0 24px 0;
    line-height: 23px;
}

.positionName
{
    font-size:16px; display:block; margin:0 0 10px 0;color: #686868;
}

#currentDate
{
    float: right;
    line-height: 39px;
    font-size: 11px;
    color: #DBDBDB;
    margin-right: -10px;
    position: relative;
    top: -240px;
    z-index: 40;
}

.ourPeople
{
    line-height:16px;
}

.ourPeople li
{
    margin:0 0 20px 0;
}

.display-1, .display-hide0, .display-hide-1, .display-hide
{
    display:none;
}

.imageStyle1
{
    float:left; margin:0 10px 10px 0;
}

.imageStyle2
{
    float:right; margin:0 0 10px 10px;
}

.display-hide1
{
    display: block;
}

.spacer
{
    clear:both; height:1px; line-height:1px;
}

.clear
{
    clear:both; height:30px; line-height:30px;
}

.floatLeft
{
    float:left;
}

.floatLeftImg
{
    float:left; margin:0 30px 0 0;	border: 1px solid rgb(221, 221, 221);

}

.floatLeftContainer
{
    float:left;	padding:0 0 0 15px;
}

.ourPeoplecontactDetails .featureBoxPadding
{
    padding:15px 17px 10px 17px;
}

.featureBoxPadding2
{
    padding: 35px 17px 10px 37px;
}

.filesDivider
{
    line-height:1px; font-size:1px; height:1px; background:#9B9B9B; margin:0 0 14px 0;
}

.DownloadFileLink
{
    color:#3C3C3C; font-weight:bold;
}

/* News Styles */

.newsStoryDate
{
    font-weight:bold; font-style:italic; margin:0;
}

.newsPracticeArea, .newsContact
{
    font-weight: bold;
    margin: 0 0 20px 0;
    color: #06234F;
}

/* slider styles */

.slideshow {
    height: 213px;
    width: 1002px;max-width:100%;
    margin: auto;
    z-index: 0;
    overflow: hidden;
}

/*
SS04: ANCHOR AND LINK STYLES
///////////////////////////////////////////
*/

/* Menu Styles */
#CT_Nav li, #CT_Nav ul, a, a:link
{zoom:1}

li:hover > .DropdownMenu
{
    margin:0px; padding:0px; display:inline
}



/* Main Nav Items*/
ul.MN_List
{
    padding:0px; margin:0px; height:36px; float:left; z-index:302;
}

.MN_Main
{
    float: left;
    width: auto;max-width:100%;
    padding: 0;
    list-style: none;
    cursor: pointer;
    height: 37px;
    line-height: 37px;
    font-size: 16px;
}

.MN_Main:hover, a.MainItem:hover
{
    cursor: pointer;
    background-color: #ffe615;
}

.MN_Main span, .MN_Main a
{
    color: #fff;
}

a.MainItem
{
    text-decoration: none;
    color: #000000;
    padding: 0 12px;
    display: block;
    height: 34px;
    font-weight: 400;
}

.MenuTitle
{
    border:none
}

/* Drop Down Items*/
/*ss04.1:Drop Down Menu Styles*/

/*ss04.1:Drop Down Menu Styles*/
.DropdownMenu
{
    display:none; min-width:227px; padding:0 !important; margin:0 !important; border:none; z-index:300;max-width:100%;
}

/* Drop Down Items*/
.DropdownMenu li
{
    list-style:none; padding:6px 10px; line-height:16px; text-align:left; border:none; background:#2e2e2e; margin:0 !important; * padding-left:0; color:#Fff;
}

.DropdownMenu li a
{
    padding-bottom:0px; width:100%; line-height:16px; color:#FAD733; text-decoration:none; font-weight:normal; font-size: 12px;max-width:100%;
}

.DropdownMenu li a:hover
{
    color:#fff; display: block;
}

.dropDownLinkContainer,.dropDownLinkContainer:hover
{
    padding:5px 13px 5px 13px
}

.dropDownLink
{
    display:block; width:auto;max-width:100%;
}

* html .IE6Hover
{
    margin:0px; padding:0px; display:inline
}
#greywidefooter{
    width: 100%;max-width:100%;
    height: 82px;
    z-index: 1;
    background-image: url(images/footerbg.png);
    background-repeat: repeat-x;
    color: #FFF;
}
#greywidefooter a{
    color: #FFF;
}

.mobile-menu-trigger {
    list-style-type:none;
    display: none;
}


@media (max-width:991px){
    body{
        /*background-image: url('images/cranmac_bg_mobile.png');*/
    }

    .DropdownMenu{display:none!important;}

    .showme{display:block!important;}

    #CT_Header{
        height:auto;
    }

    #CT_Header img{
        width:100%;
    }

    .sideMenuContent{
        min-height:50px;
    }

    .Search{
        float:none;
        text-align:center;
        display:none;
    }

    .Search .searchBox{
        background:white;
        height:20px;
    }

    #Menu,
    #myNavbar {
        width:100%;
        background:#425563;
        height:auto!important;
        position:absolute!important;

    }

    .mobile-menu-trigger{
        display:block;
        font-size: 20px;
        font-weight: bold;
        line-height: 30px;
    }

    .MN_List, .MN_Main{
        display:none;
        width:100%;
        background:#f1c810;
        height:auto!important;
    }

    #Menu.hovered .MN_List,
    #Menu.hovered .MN_Main,
    #myNavbar.collapse.in ul.menu,
    #myNavbar.collapse.in ul.menu > li {
        display: block;
        width: 100%;
        float: left;
    }

    #myNavbar.collapse.in ul.menu > li {
        margin-top: 0 !important;
    }

    .lw_navigations {
        margin-top: 30px !important;
        opacity: 1 !important;
    }

    #Menu:hover::before,
    #myNavbar:hover::before {
        display:none;
    }

    .DropdownMenu{
        width: 100% !important;
    }

    .DropdownMenu li{
        padding-left:0;
        padding-right:0;
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    .MN_List{
        margin-top:30px!important;
    }
    .MN_List li, .MN_Main li{
        width:100%;
        text-align:center;
    }

    .MN_List li ul, .MN_Main li ul{
        width:100%;
        text-align:center;
    }


    .MN_List li ul li, .MN_Main li ul li{
        padding-left:0;
        padding-right:0;
    }

    .MN_List li span, .MN_Main li span{
        width:100%;
        float:left;
    }
    .MN_List li span a, .MN_Main li span a{
        padding:0;
        width:100%;
        float:left;
    }

    #CT_Content #sideMenu{
        width:100%;
    }

    #CT_Content #sideMenu .sideMenuContent ul{width:100%;}
    #CT_Content #sideMenu .sideMenuContent ul li{
        width:50%!important;
        float:left;
    }

    #CT_Content #Banner{
        margin:0;
    }

    #CT_Content .content{
        margin:0;
        padding:20px;
        width:90%;
    }

    #currentDate{
        display:none;
    }

    #CT_Header .headerImg{

    }

    #CT_Footer .footerLeft{width:100%;}
    #CT_Footer .footerRight{width:100%;}

    #greywidefooter{
        float:left;
        background-size:cover;
        height:auto;
    }
    #greywidefooter #CT_Footer{
        height:auto;
    }

    #featureBox{
        position:relative;
        right:-20px;
    }
}

@media(max-width:486px){
    #CT_Content #sideMenu .sideMenuContent ul li{
        width:100%!important;
        float:left;
    }
}