@charset "utf-8";
/* CSS Document */
/* =Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */

/*@font-face {
    font-family: 'helvetica';
    src: url('fonts/helvetica/helvetica.eot');
    src: local('☺'), url('fonts/helvetica/helvetica.woff') format('woff'), url('fonts/helvetica/helvetica.ttf') format('truetype'), url('fonts/helvetica/helvetica.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'Oswald';
    src: url('fonts/Oswald/Oswald.eot');
    src: local('☺'), url('fonts/Oswald/Oswald.woff') format('woff'), url('fonts/Oswald/Oswald.ttf') format('truetype'), url('fonts/Oswald/Oswald.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}*/



body{
    margin: auto;
    padding: 0px;
    background-repeat: repeat;
    background-color: #fcfcfc;
    border:0px;
}
a{
    cursor:pointer;
}

img {
    border:none;
}
h1, h2 { font-weight:normal}

/**************************  start containers Landin Page   *******************************/
#header{
    height:60px;
}

#container{
    width:auto;
    margin:auto;
    /*position:relative;*/

}
#container_left{
    width:596px;
    float:left;
    min-height:400px;
    padding:20px;

}
#container_right{
    width:304px;
    float:left;
    min-height:400px;
    padding:20px;
}

#more_info{
    text-align:center; 
    display:block; 
    margin:auto;
    color:#254061;
    font-size:20px;
    font-family: helvetica,serif;
    /*position: absolute;*/
}


/********************  container handicap calculator 	*********************++*/
#handicap_calculator{
    border:2px solid #069;
    padding: 15px 15px 15px 15px;
    margin-top:10px;
    width: 564px;
    margin-left: 24px;
}

#calculator_note{
    float:right;
    font-family:Arial, Helvetica, sans-serif;
    font-size:11px;
    display:inline-block;
    color:#303132;
    padding-bottom:10px;
}
#calculator_note .note{
    font-family:Oswald;
    font-size:11px;
    display:inline-block;	
    color:#1a3759;
}

#calculator_form{
    font-family:Oswald, serif;
    font-size:20px;

}



.table_calculator{
    border-collapse: separate;
    border-spacing: 5px;

    margin-left:60px;

}
.table_calculator tr td{
    width: 40px;
    height: 40px;

}

.calculator_sign {
    background-color: #254061;
    color: white;
    text-align: center;
    margin-left: 35px;
    line-height: 36px;
    border-radius: 5px 5px 5px 5px;	
    font-family: helvetica,serif;
    width: 291px;
    height: 75px;

}
.calculator_sign a {text-decoration:none;	}


.calculator_score{
    width: 40px;
    height:40px;
    border: 1px solid #ABADB3;
    text-align:center;
    vertical-align: middle;
}
/************************   start commons styles ****************************/
.title_grint{
    display:inline-block;
    background: url('../images/thegrint_title.jpg') no-repeat;
}	

.logo_grint {
    display:inline-block;	
    background:url('../images/grint_logo_mini_2.png') no-repeat;
}

.div_separate{
    clear:both;
    height:1px;
}	

.title_text{
    font-family: Oswald,serif;
    color: #1e5261;
    font-size: 27px;
    font-weight: normal;
}



.line_separate{
    background-color:#7eb035;
    display:block;
    height:3px;
    margin-top:10px;
    clear:both;
    width:593px;
}

.ball{
    display:inline-block;
    background:url('../images/green_circle_mini.jpg') no-repeat;
    height:49px;
    width:49px;
    text-align: center;
    vertical-align: -7px;
    padding-top: 6px;
    margin-right: 10px;
    font-family:Oswald, serif;
    font-size:27px;
}



.subtitle_normal{
    color:#1E5261;
    display:inline-block;
    font-family: helvetica,serif;
    font-size:12px;
    font-weight:normal;
    text-decoration:none;

}

.subtitle_bold{
    color:#1E5261;
    display:inline-block;
    font-family: helvetica,serif;
    font-size:14px;
    font-weight:bold;
    text-decoration:none;

}

.link_more{
    color:#069;
    text-decoration:none;
}

.more_hidden{
    display:none;
}
.more_hidden .p1{
    display:block;
    margin-bottom:4px;
    text-align:justify;
}

.more_hidden .p1_bold{
    display:block;
    margin-bottom:4px;
    text-align:justify;
    font-weight:bold;
}

.handicate_estimate_mini ,#handicate_estimate{
    background:url('../images/green_circle_handicap.png') no-repeat;
    height:78px;
    width:78px;
    font-family:Oswald, serif;
    font-size:30px;
    text-align: center;
    display:block;
    line-height: 70px;
}	


.play_video{
    display:block;
    position:absolute;
    height:88px;
    width:88px;	
    background:url('../images/play_video.png') no-repeat center;
    margin: 63px 0px 0px 145px;
}

/******************************************************************************************/
/******************************  Style for Golf Handicap Tracker **************************/
/******************************************************************************************/
.part_cointainer{
    background-color:#d9d9d9;
    border-top:2px dotted #ABADB3; 
    padding: 35px 35px 0px 35px;
}

#part_header{ 
    color: #FFF; 
    font-size: 18px; 
    font-family: Oswald,sans-serif; 
}
#part_header span { 
    display: inline-block; 
    padding: 10px; 
    text-align: center 
}

#part_left{ float: left; width: 225px; margin-top: 35px;}
#part_right{ float: left;padding-left: 10px;}


#part_body{
    padding-left: 33px;
    padding-right: 33px;
    background-color: #FFF;
    padding-top: 30px;
    min-height: 470px;
}

#part_videos{
    background-color:#d9d9d9;
}

.part_cointainer h2, h3,#title_l{
    color: #000;
    font-family: Oswald, sans-serif;
    font-size: 38px;
    display: block;
    margin-left: 25px;
    margin-bottom: 20px;
}

.under_development{
    background: url('../images/landing/back_trans.png') no-repeat;
    position: absolute;
    height: 111px;
    width: 910px;
    margin-left: -33px;
    margin-top: 144px;
    color:#FFFFFF;
    font-size: 74px;
    font-family: Oswald, sans-serif;
    font-weight: bold;
    text-align: center;
}



/********* explanation *****************/

#part_explanation{
    padding-right: 50px;
}


.part_exp_title, #part_exp_title{ 
    font-size:23px;
    font-family: Oswald, sans-serif;
    color:#193558;
    padding-bottom: 10px;
    margin-bottom: 20px;
    border-bottom: 5px solid #97b952;
    display: block;
    margin-left: 0px;
}


.part_exp_body{
    font-size: 14px;
    font-family: Arial, sans-serif;
    color: #6b6b6b;
}


/********** menu ****************/
.part_menu{
    height: 50px;
    background-color:#193558; 
    width: 100%;
}

.part_menu td{
    vertical-align: middle;
}
.part_menu td a{
    color:#FFF;
    text-decoration: none;
    padding: 5px;
    display: block;
    text-align: center;
    border-right:1px solid #FFF;  
}

.part_menu td:hover{
    background-color:#3b384e;
}
.part_menu a:hover{
    text-decoration: none;
}
.part_menu_active{
    background-color:#3b384e;  
}



/********* videos ********/
.part_videos_column{
    float: left;
    padding: 4px;
    width: 295px;
}
.part_videos_column a{
    text-align: center;
    display: block;
    margin-top: 10px;
}

.part_videos_title{
    font-family: Oswald, sans-serif;
    font-size: 43px;
    color: #3e3c3e;
    display: block;
}
.part_videos_sutitle{
    font-family: Arial, sans-serif;
    font-size: 17px;
    color: #6b6b6b;
    display: block;
}

.part_vote{
    background-color: #4f81bd;
    border-radius: 5px 5px 5px 5px;
    width: 220px;
    height: 67px;
    text-align: center;
    display: block;
    color: #fff;
    font-size: 21px;
    font-family: Oswald, sans-serif;
    text-align: center;
    margin: auto;
    line-height: 33px;
    margin-top: 10px;
    text-decoration: none;
}
.part_vote_none{
    background-color: #4f81bd;
    border-radius: 5px 5px 5px 5px;
    width: 220px;
    height: 67px;
    text-align: center;
    display: block;
    color: #fff;
    font-size: 21px;
    font-family: Oswald, sans-serif;
    text-align: center;
    margin: auto;
    line-height: 68px;
    margin-top: 10px;
    text-decoration: none;
}
.part_vote .part_visits{
    font-size: 18px; 
}

.part_vote a:hover{
    text-decoration: none !important;
}

/******************************************************************************************/
/******************************  Style for Golf Comparison Table **************************/
/******************************************************************************************/
.comparison_table{
    font-family: Oswald, sans-serif;
    font-size: 16px;
    margin-top: 10px;
}
.comparison_table td {
    text-align: center;
    vertical-align: middle;
    padding: 10px;
}

.comparison_table .gray{
    background-color: #efefef;
}
.comparison_table .line_green td{
    border-bottom: 4px solid #97b952;
}


.comparison_logo{
    display: block;
    margin-left: 25px;
}


.comparison_title{
    font-size: 26px;
    font-family: Oswald, sans-serif;
    color:#444444;
}
.comparison_green{
    font-size: 34px;
    font-family: Oswald, sans-serif;
    color:#77933c;
}


/**************************************************************************************************/
/******************************  Style for Scored Card Picture Services  **************************/
/**************************************************************************************************/

.scored_title{
    font-family: helvetica, sans-serif;
    font-size: 24px;
    color:#223d5f;
    display: block;
}

.scored_title_green{
    font-size: 25px;
    font-family: Oswald, sans-serif;
    color:#729036;
    display: block;
}

.scored_subtitle{
    font-size: 19px;
    font-family: Oswald, sans-serif;
    color:#74787b;
    display: block;
    padding-bottom: 10px;
}

.scored_text{
    font-size: 13px;
    font-family: Arial, sans-serif;
    color:#74787b;
    padding-bottom: 10px;
}

/**************************************************************************************************/
/******************************  Style for Golf Handicap Tracker APP  *****************************/
/**************************************************************************************************/
.app_text{
    font-size: 15px;
    font-family: Arial, sans-serif;
    color: #6b6b6b;
    padding-bottom: 5px;
}

.app_subtitle{
    font-family: helvetica, sans-serif;
    font-size: 21px;
    color:#193558;
    display: block;
}

.app_icon{
    margin-top: 41px;
    margin-left: 25px;
}

/**************************************************************************************************/
/******************************  Style for Testimonials  ******************************************/
/**************************************************************************************************/

.test_red_1{
    margin-left: -10px;
    position: absolute;
    width: 235px;
    height: 304px;
    background: url('../images/landing/test_red_v.png') no-repeat;
}


.test_red_2{
    margin-top: 322px;
    position: absolute;
    width: 313px;
    height: 164px;
    background: url('../images/landing/test_red_h.png') no-repeat;
}


.test_green_1{
    margin-left: 526px;
    margin-top: -19px;
    position: absolute;
    width: 275px;
    height: 197px;
    background: url('../images/landing/test_green_h.png') no-repeat;
}


.test_green_2{
    margin-left: 227px;
    margin-top: -20px;
    position: absolute;
    width: 275px;
    height: 197px;
    background: url('../images/landing/test_green_h1.png') no-repeat;
}

.test_blue_1{
    margin-left: 590px;
    margin-top: 191px;
    position: absolute;
    width: 279px;
    height: 201px;
    background: url('../images/landing/test_blue_h.png') no-repeat;
}

.test_blue_2{
    margin-left: 336px;
    margin-top: 255px;
    position: absolute;
    width: 290px;
    height: 236px;
    background: url('../images/landing/test_blue_v.png') no-repeat;
}


.test_text{
    display: block;
    margin-left: -36px;
    margin-top: 54px;
    color: #FFF;
    font-size: 18px;
    font-family: Arial, sans-serif;
    text-align: center;
}

.test_title{
    display: block;
    position: absolute;
    font-family: Oswald, sans-serif;
    font-size: 23px;
    color:#3c3b37;
}

/******************************************************************************************/
/******************************  Style for Golf Handicap **********************************/
/******************************************************************************************/
.handicap_text_green{
    color:#97b952;
    font-family: Oswald, sans-serif;
    font-size: 25px;
}

.handicap_text{
    color:#000000;
    font-family: Arial, sans-serif;
    font-size: 15px;
}

.handicap_text_bold{
    color:#000000;
    font-family: Arial, sans-serif;
    font-size: 15px;
    font-weight: bold;
}

.handicap_formula{
    background-color: #FFF;
    padding: 25px;
    margin-top: 15px;
}

/******************************************************************************************/
/******************************  Style for Mini Calculator ********************************/
/******************************************************************************************/

#calculator_mini{
    width: 580px;
    height: 420px;
    background: #FFFFFF;
    border: 1px solid #069;
    padding: 10px;

}

.mini_calculator_sing{
    margin-top: 100px;
    text-align: center;
    display: block;
    font-size: 18px;
    font-family: Arial, sans-serif;
    color:#069;
    text-decoration: underline !important;
}


/******************************************************************************************/
/******************************  Style for What is TheGrint *******************************/
/******************************************************************************************/

.what_is_text{
    font-family: Arial, sans-serif;
    font-size: 14px;
    color: #000000;
    padding-bottom: 10px;
}
.what_is_title{
    color:#595959;
    font-family: Oswald, sans-serif;
    font-size: 20px;
    margin-bottom: 10px;
    margin-left: 0px;
    display: inline-block;
}
.what_is_grint{
    color:#254061;
    font-family: helvetica, sans-serif;
    font-size: 20px;
    margin-left: 0px;
    display: inline-block;
    margin-left: 5px;
}

/******************************************************************************************/
/******************************  Style for Follow Us **************************************/
/******************************************************************************************/

.follow_title{
    color:#254061;
    font-family:helvetica, sans-serif;
    font-size: 38px;
}

.follow_subtitle{
    color: #454545;
    font-family: Oswald, sans-serif;
    font-size: 22px;
    margin-top: 20px;
    display: block;
}
.follow_title_article{
    font-size: 16px;
    font-family: Arial, sans-serif;
    color:#001aba;
    text-decoration: underline !important ; 
    display: block;
}

.follow_subtitle_article{
    font-size: 14px;
    font-family: Arial, sans-serif;
    color:#001aba;
}

.follow_body_article{
    font-size: 14px;
    font-family: Arial, sans-serif;
    color:#454545;
}
.follow_article{
    margin-top: 15px;
    text-align: justify;
    margin-bottom: 60px;
}


/********************************************************************************************/
/******************************  NEW STYLE **************************************************/
/********************************************************************************************/
    .square_main{
        width: 970px;
        margin: auto;
        position: relative;
        margin-left: 9px;
    }
    
    .square_body{
        border: 1px solid #CDCDCD;
        padding-top: 45px;
        padding-bottom: 45px;
        margin-right: 7px;
        box-shadow: -2px 4px 0pc #929292;
        margin-bottom: 10px; 
        background-color: #fff;
    }
    .square_body_mini{
        border: 1px solid #CDCDCD;
        padding: 5px;
        float: left;
        width: 302px;
        margin-right: 10px;
        box-shadow: -2px 4px 0pc #929292;
        background-color: #fff;        
    }
    .square_body_mini .title_square{
        font-family: helvetica;
        font-size: 15px;
        color: #215968;
        margin-bottom: 10px;
        display: block;
        text-align: left; 
        margin-left: 4px;       
    }

    .square_body_mini .text_square{
        font-family: Arial;
        font-size: 12px;
        color: #595959;
        text-align: left;
        margin-bottom: 10px;
        margin-left: 4px;         
    }


    .square_body .cloud_square{
        border: 1px solid #CDCDCD;
        padding: 10px;
        float: left;
        box-shadow: -2px 4px 0pc #EEE9E9;
        position: relative;    
    }


    .square_body .cloud_square .arrow{
        background: url('../images/arrow2.jpg') no-repeat;
        width: 25px;
        height: 48px;
        position: absolute;
        left: -25px;
        top: 110px;
    }